Jump to content

Detect when the game change visibility


Jody Thai
 Share

Recommended Posts

Hi,

 

When the browser tab is out of focus, the game will pause, we all know that default setting. But is there a way to detect whenever it happen? I have my own countdown timer and when the game is paused this way, my timer still works so I need to detect it's status to pause my timer as well.

 

Thanks,

Jody

Link to comment
Share on other sites

Just to copy the example I posted on github for this. You should use game.time.now for a true elapsed value. Here's an example:

var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { create: create, render: render });function create() {	game.onPause.add(onGamePause, this);	game.onResume.add(onGameResume, this);}function onGamePause() {	console.log('game paused at ' + this.time.now);}function onGameResume() {	console.log('game un-paused at ' + this.time.now);	console.log('was paused for ' + game.time.pauseDuration);}function render() {	game.debug.renderText('now: ' + game.time.now, 32, 32);	game.debug.renderText('paused: ' + game.paused, 32, 64);}
Link to comment
Share on other sites

Hi,

 

I've been "playing" with this time value for a bit now, because I need it for my GuitarHero-like game.

 

From what I've read above, the game.time.now should be frozen during the pause?

 

I have this kind of behaviour :

 

update before pause : time = 3000

pause : time = 3000

resume : time = 3000

I wait 5 seconds

update just after : time = 8000 

 

The time seems right when I read it in the function called by the resume process, but in the update just after, it goes back to the "real" time.

 

Is there something I could be doing wrong? Or do I expect a behaviour that is not supposed to happen?

 

Thanks for your help.

 

PS: That's kind of my first post on the forum, so I'll take this chance to thank you for your great work. This has changed my opinion about web gaming :)

Link to comment
Share on other sites

Okay I don't know what happened in the night, but this seems to be working now. I changed my phaser version yesterday, so maybe it was still in the cache and not reloaded. ( just a guess )

 

I thought the time was frozen but it's not, but I have the delta so I can deal with that.

 

Sorry for the inconvenience. 

Link to comment
Share on other sites

  • 1 month later...
  • 3 months later...

Hi Rich,

 

I cant get this to work in Phaser 2.0.5. Where does the code go? I put it inside my Boot.js create function and it didnt work...I also tried to put it inside my Preloader.js create function and in the Main.js file right after I created the game. But that didnt work either.

 

I get no console log when I change to another tab or window away from the game. I need to pause the music that is playing in my game when a user leaves the screen to another window but cant figure it out.

 

Thanks!

Link to comment
Share on other sites

  • 2 months later...

Hi Rich,

 

I cant get this to work in Phaser 2.0.5. Where does the code go? I put it inside my Boot.js create function and it didnt work...I also tried to put it inside my Preloader.js create function and in the Main.js file right after I created the game. But that didnt work either.

 

I get no console log when I change to another tab or window away from the game. I need to pause the music that is playing in my game when a user leaves the screen to another window but cant figure it out.

 

Thanks!

 

Did you manage to fix this? I have the same problem.

Link to comment
Share on other sites

  • 2 years later...

there is a difference between detecting when the game is paused and detecting when the tab is no longer active (i.e. out of focus). Why is this distinction important? Suppose I pause/resume the game in many different ways. So auto pausing on visibility change is just 1 way. Therefore, there should be a way to detect visibility change without it being tied to game.paused. 

Link to comment
Share on other sites

Here's what I do to detect the actual visibility change (as the title of this thread asks):

var vis = (function(){
    var stateKey, eventKey, keys = {
        hidden: "visibilitychange",
        webkitHidden: "webkitvisibilitychange",
        mozHidden: "mozvisibilitychange",
        msHidden: "msvisibilitychange"
    };
    for (stateKey in keys) {
        if (stateKey in document) {
            eventKey = keys[stateKey];
            break;
        }
    }
    return function(c) {
        if (c) document.addEventListener(eventKey, c);
        return !document[stateKey];
    }
})();

vis() returns true if the tab is in focus. This is a much more reliable way than setting a boolean on pause/resume, as you might be pausing/resuming your game state in other code. 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...