Liranan Posted December 18, 2015 Share Posted December 18, 2015 Hello everyone, here's my issue. In the game you make lines in a tilemap by click (input.onDown) and moving the cursor over them. When you release the cursor (input.onUp) the lines disapear. The problem is: when I move the cursor out the screen, it doesn't detect the event as input.onUp, and I can release the button, come back to the screen and select a new line without destroying the previous one. What I want to know is: is there some way to launch a function when the cursor (in web or mobile) leaves the screen? I've tried some methods, but none of them worked. Thanks! Link to comment Share on other sites More sharing options...
drhayes Posted December 18, 2015 Share Posted December 18, 2015 Have you tried tracking the mouseout event on document? You'd have to assign it yourself, I can't think of a Phaser method or signal that covers this specifically. Liranan 1 Link to comment Share on other sites More sharing options...
Liranan Posted December 18, 2015 Author Share Posted December 18, 2015 Thanks for the answer drhayesI've tried doing this: document.addEventListener('mouseout', function(){ this.myFunction(); }); But didn't work. It said "myFunction" didn't exists (and it did). I'm guessing you can't launch a phaser game function inside a DOM listener Link to comment Share on other sites More sharing options...
Gob0 Posted December 18, 2015 Share Posted December 18, 2015 Thanks for the answer drhayesI've tried doing this: document.addEventListener('mouseout', function(){ this.myFunction(); }); But didn't work. It said "myFunction" didn't exists (and it did). I'm guessing you can't launch a phaser game function inside a DOM listenerHi, the error occurs because of the function's scope. You place "this.myFunction()" in a function, so "this" refers to "function()", not your class containing function called "myFunction". Instead, replace "this.myFunction" with "myClass.myFunction" and it will work. Liranan 1 Link to comment Share on other sites More sharing options...
Liranan Posted December 18, 2015 Author Share Posted December 18, 2015 Hello Gob0 and thanks for your answer. I'm sure the problem is about the reference "this" but I use it in all the functions of the game and it always works but this time, I assume for being inside the document listener.I've tried with 'myClass' but it doesn't work either. This is an example of how the code is set if it helps: var mainState = function(){};mainState.prototype = {create: function(){game.input.onUp.add(this.test, this); //this worksdocument.addEventListener('mouseout', function(){ this.test(); }); //this doesn't work},update: function(){ },test: function(){console.log("test correct");}}; I've also tried this solution update: function(){game.input.mouse.mouseOutCallback = this.test();} But it acts like the mouse always was outside the screen. If I launch the game, the console writes endless texts no matter if the mouse is on the screen or out I've also tried checking in the update function if the mouse coordinates were in or out the screen. At last, it was the method that worked better, but still sometimes miss the movement. Link to comment Share on other sites More sharing options...
Gob0 Posted December 18, 2015 Share Posted December 18, 2015 Try to replace document.addEventListener('mouseout', function(){ this.test(); });withdocument.addEventListener('mouseout', function(){ mainState.test(); });To detect "out of screen", i will use the "blur" event and attach it to the div (or whatever html tag) where phaser game is "running" Liranan 1 Link to comment Share on other sites More sharing options...
Liranan Posted December 18, 2015 Author Share Posted December 18, 2015 Mmm, it sounds good but I had the same answer for 'mainState.myFunction()' Uncaught TypeError: mainState.myFunction is not a function If I move the listener and the function out of the prototype it works, but it's useless to me because I've to refer the elements inside the prototype Link to comment Share on other sites More sharing options...
Gob0 Posted December 18, 2015 Share Posted December 18, 2015 My bad, i respond too fast and omit to read my answer. So, the right syntax for calling your function isdocument.addEventListener('mouseout', function(){ mainState.prototype.test(); });but be aware that this function will run on a different object instance that the one who add event. This is because you use "prototype" declaration and i'm not sure a phaser game state need a different object for each run.IMO, singleton is the good fit for this. Liranan 1 Link to comment Share on other sites More sharing options...
Liranan Posted December 18, 2015 Author Share Posted December 18, 2015 That's it! It works perfectly! Thank you very much Gob0! Link to comment Share on other sites More sharing options...
Recommended Posts