I'm building a game using canvas and EaselJS but there is an issue when doing anything inside an onclick that removes window focus, ie. prompt, alert, window.open.
It happens in FireFox and on some mobile Android devices from what i've seen.
I think I understand why it is but I don't know how to fix it ( I didn't know how to explain in one sentence, so the title of this Question is not entirely true )
If I have an alert within an onclick like so
_t.container.on('click', function(e) {
alert('test');
//end
e.preventDefault();
e.nativeEvent.preventDefault();
return false; //all of these added when trying to find a work around
});
//HOW TO REPRODUCE ISSUE
if you click the target, the alert fires, move your mouse to whereever (still over the canvas though) hit enter to close the alert, and then no matter where the mouse is positioned, until it is moved, clicking will fire the same event, and alert again....
This is only really a problem on mobile devices, as the 'mouse' cannot be moved / touch position updated so then next tap on screen always fires the second onclick, whereas on Desktops it only does that if the mouse is not moved since closing the alert.
I think this is an issue with the CreateJS Library itself as any examples on click events with and alert in have this issue.
I was thinking that there may be a way to force createjs to set mouseposition to 0,0
here is an example where the issue can be found..
http://www.ajohnstone.com/test/hackday/CreateJS-EaselJS-b262a85/tutorials/Mouse%20Interaction/
if(!_t.container.hitTest(e.nativeEvent.layerX-_t.container.x, e.nativeEvent.layerY-_t.container.y)) return;