TweenLite.ticker time / frames reset or pause

[summon 0 Likes (Newbie)]

Hi everyone,

 

I am using 

TweenLite.ticker.addEventListener("tick", updateGameState);

to update the state of my game. The updateGameState function is called as it should be but when I leave the game screen and remove the listener using

TweenLite.ticker.removeEventListener("tick", updateGameState); 

the ticker continues to tick and the time / frames continue to count. When I re-register my updateGameState function to the ticker then the current time is not zero. I would like to stop or pause the ticker while I leave / enter the game screen, in order to keep track of the game state.

 

Is there a way to do this? Or am I to the wrong path?

 

[Jonathan 5,176 Likes (Superhero)]

try this to check when the browser window or tab loses focus:

 

the below uses jQuery .. for Firefox and Chrome.. and some native JS fro IE

///////////////////////////////////////////////////////
// check if browser tab has focus

var focused = true;

// check if not IE for Firefox and Chrome		
if(document.documentMode === undefined){
					
    $(window).bind("focusin",function() {
	if(isLoaded === true){
		// ticker add listener goes here
                TweenLite.ticker.addEventListener("tick", updateGameState);
			
                focused = false;
	}
    });
    $(window).bind("focusout",function() {
	if(isLoaded === true){						
		// ticker remove listener goes here
                TweenLite.ticker.removeEventListener("tick", updateGameState); 

		focused = true;
	}
    });
					
} else { // check if IE all versions
		
	if(window.addEventListener){
		window.addEventListener("focus", function(event) { 
			if(isLoaded === true){
				// ticker add listener goes here
                                TweenLite.ticker.addEventListener("tick", updateGameState);
				
                                focused = false;
			}
		}, false);
		window.addEventListener("blur", function(event) { 
			 if(isLoaded === true){						
				// ticker remove listener goes here
                                TweenLite.ticker.removeEventListener("tick", updateGameState); 

				focused = true;
			}
		}, false);

	} else {
		window.attachEvent("focus", function(event) { 
			if(isLoaded === true){
				// ticker add listener goes here
                                TweenLite.ticker.addEventListener("tick", updateGameState);
				
                                focused = false;
			}
		});
		window.attachEvent("blur", function(event) { 
			if(isLoaded === true){						
				// ticker remove listener goes here
                                TweenLite.ticker.removeEventListener("tick", updateGameState); 

				focused = true;
			}
		});
	}
    }
}

the above event handlers will listen when you focus in and out of the tab or window in Chrome, Firefox and in IE

 

so when the animation gains focus it will start the ticker and when you focusout it will remove the listener

 

notice for IE i have to use attachEvent instead of using jQuery bind() due to IE's inconsistency with multiple versions and rendering modes

 

hope this helps

[summon 0 Likes (Newbie)]

Jonathan,

 

thanks for your reply! Issue solved