More state swapping features and optimised Game.loop.

This commit is contained in:
Richard Davey 2013-08-29 15:14:56 +01:00
parent 3d4783980e
commit 16749edf20
4 changed files with 208 additions and 314 deletions

View file

@ -12,35 +12,42 @@
(function () {
var state = {
var mainMenu = {
preload: function() {
console.log('state preload called');
game.load.image('rememberMe', 'assets/pics/remember-me.jpg');
game.load.text('copyright', 'assets/warning - copyright.txt');
console.log('mainMenu preload');
game.load.image('nocooper', 'assets/pics/1984-nocooper-space.png');
},
create: function() {
console.log('state create called');
// Let's try adding an image to the DOM
document.body.appendChild(game.cache.getImage('rememberMe'));
// And some text
var para = document.createElement('pre');
para.innerHTML = game.cache.getText('copyright');
document.body.appendChild(para);
console.log('mainMenu create');
document.body.appendChild(game.cache.getImage('nocooper'));
}
}
var game = new Phaser.Game(800, 600, Phaser.RENDERER_AUTO, '');
var levelSelect = {
// In this instance we'll change to the state ourselves rather than pass it in the game constructor
preload: function() {
console.log('levelSelect preload');
game.load.image('touhou', 'assets/pics/aya_touhou_teng_soldier.png');
},
create: function() {
console.log('levelSelect create');
document.body.appendChild(game.cache.getImage('touhou'));
}
}
// No parameters given, which means no default state is created or started
var game = new Phaser.Game();
// In this example we've created 2 states above (mainMenu and levelSelect)
// We'll add them both to the game
game.state.add('menu', mainMenu);
game.state.add('select', levelSelect);
// Now we can either start the state we want directly, or we could have passed 'true' as the 3rd parameter in state.add
game.state.start('select');
})();

59
examples/flow6.php Normal file
View file

@ -0,0 +1,59 @@
<!DOCTYPE HTML>
<html>
<head>
<title>phaser.js - a new beginning</title>
<?php
require('js.php');
?>
</head>
<body>
<input type="button" id="menu" value="Main Menu" />
<input type="button" id="select" value="Level Select" />
<script type="text/javascript">
(function () {
var preloader = {
preload: function() {
console.log('preloader.preload');
game.load.image('nocooper', 'assets/pics/1984-nocooper-space.png');
game.load.image('touhou', 'assets/pics/aya_touhou_teng_soldier.png');
}
}
var mainMenu = {
create: function() {
console.log('mainMenu create');
document.body.appendChild(game.cache.getImage('nocooper'));
}
}
var levelSelect = {
create: function() {
console.log('levelSelect create');
document.body.appendChild(game.cache.getImage('touhou'));
}
}
// No parameters given, which means no default state is created or started
var game = new Phaser.Game();
game.state.add('preloader', preloader, true);
game.state.add('menu', mainMenu);
game.state.add('select', levelSelect);
var b1 = document.getElementById('menu').onclick = function() { game.state.start('menu') };
var b2 = document.getElementById('select').onclick = function() { game.state.start('select') };
})();
</script>
</body>
</html>

View file

@ -30,7 +30,7 @@ Phaser.Game = function (width, height, renderer, parent, state) {
if (typeof height === "undefined") { height = 600; }
if (typeof renderer === "undefined") { renderer = Phaser.RENDERER_AUTO; }
if (typeof parent === "undefined") { parent = ''; }
if (typeof state === "undefined") { state = {}; }
if (typeof state === "undefined") { state = null; }
this.id = Phaser.GAMES.push(this) - 1;
this.parent = parent;
@ -43,9 +43,7 @@ Phaser.Game = function (width, height, renderer, parent, state) {
console.log('Phaser.Game', width, height, renderer, parent);
// Pass 'state' to the StateManager?
this.state = new Phaser.StateManager(this, state);
// this._tempState = state;
var _this = this;
@ -237,12 +235,8 @@ Phaser.Game.prototype = {
console.log('Phaser.Game boot');
// Probably not needed any more
// var _this = this;
if (!document.body) {
window.setTimeout(this._onBoot, 20);
// setTimeout(Phaser.GAMES[_this.id].boot(parent, width, height), 13);
}
else
{
@ -252,6 +246,8 @@ Phaser.Game.prototype = {
this.onPause = new Phaser.Signal();
this.onResume = new Phaser.Signal();
this.isBooted = true;
this.device = new Phaser.Device();
this.net = new Phaser.Net(this);
this.math = Phaser.Math;
@ -267,7 +263,6 @@ Phaser.Game.prototype = {
this.rnd = new Phaser.RandomDataGenerator([(Date.now() * Math.random()).toString()]);
// this.physics = new Phaser.Physics.PhysicsManager(this);
this.plugins = new Phaser.PluginManager(this, this);
// this.state = new Phaser.StateManager(this, this._tempState);
this.load.onLoadComplete.add(this.loadComplete, this);
@ -278,68 +273,16 @@ Phaser.Game.prototype = {
console.log('Phaser', Phaser.VERSION, 'initialized');
this.isBooted = true;
this.isRunning = true;
this._loadComplete = false;
// this.raf = new Phaser.RequestAnimationFrame(this);
// this.raf.start();
// boot sm
this.raf = new Phaser.RequestAnimationFrame(this);
this.raf.start();
}
},
/**
* Launch the game
* @param callbackContext Which context will the callbacks be called with.
* @param preloadCallback {function} Preload callback invoked when init default screen.
* @param createCallback {function} Create callback invoked when create default screen.
* @param updateCallback {function} Update callback invoked when update default screen.
* @param renderCallback {function} Render callback invoked when render default screen.
*/
launch: function (context, preload, create, update, render) {
/*
this.callbackContext = context;
this.onPreloadCallback = preload || null;
this.onCreateCallback = create || null;
this.onUpdateCallback = update || null;
this.onRenderCallback = render || null;
if (this.onPreloadCallback == null && this.onCreateCallback == null && this.onUpdateCallback == null && this.onRenderCallback == null && this._pendingState == null)
{
console.warn("Phaser cannot start: No preload, create, update or render functions given and no pending State found");
}
else
{
if (this.isBooted)
{
console.log('launch has set the callbacks and dom is booted so lets rock');
this.startState();
// if (this._pendingState)
// {
// this.switchState(this._pendingState, false, false);
// }
// else
// {
// this.startState();
// }
}
else
{
console.log('launch has set the callbacks but cant start because the DOM isnt booted yet');
}
}
*/
},
/**
* Called when the load has finished, after preload was run.
*/
@ -351,12 +294,8 @@ Phaser.Game.prototype = {
this.state.loadComplete();
this.load.onLoadComplete.remove(this.loadComplete, this);
// if (this.onCreateCallback) {
// this.onCreateCallback.call(this.callbackContext);
// // this.onCreateCallback.call(this);
// }
// ?
// this.load.onLoadComplete.remove(this.loadComplete, this);
},
@ -377,49 +316,33 @@ Phaser.Game.prototype = {
if (this._loadComplete)
{
if (this.onUpdateCallback)
{
this.onUpdateCallback.call(this.callbackContext);
}
this.state.update();
// this.world.postUpdate();
this.plugins.postUpdate();
this.plugins.preRender();
if (this.onPreRenderCallback)
{
this.onPreRenderCallback.call(this.callbackContext);
}
this.state.preRender();
// this.renderer.render();
this.plugins.render();
if (this.onRenderCallback)
{
this.onRenderCallback.call(this.callbackContext);
}
this.state.render();
this.plugins.postRender();
}
else
{
// Still loading assets
if (this.onLoadUpdateCallback)
{
this.onLoadUpdateCallback.call(this.callbackContext);
}
this.state.loadUpdate();
// this.world.postUpdate();
this.plugins.postUpdate();
this.plugins.preRender();
// this.renderer.render();
this.plugins.render();
if (this.onLoadRenderCallback)
{
this.onLoadRenderCallback.call(this.callbackContext);
}
this.state.loadRender();
this.plugins.postRender();
}
@ -430,15 +353,9 @@ Phaser.Game.prototype = {
*/
destroy: function () {
this.callbackContext = null;
this.onPreloadCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
this.onPausedCallback = null;
this.onDestroyCallback = null;
this.state.destroy();
this.state = null;
this.cache = null;
this.input = null;
this.load = null;

View file

@ -4,7 +4,11 @@ Phaser.StateManager = function (game, pendingState) {
this.states = {};
this._pendingState = pendingState;
if (pendingState !== null)
{
console.log('StartManager constructor', pendingState);
this._pendingState = pendingState;
}
};
@ -96,9 +100,23 @@ Phaser.StateManager.prototype = {
boot: function () {
console.log('Phaser.StateManager.boot');
console.log(typeof this._pendingState);
this.add('default', this._pendingState, true);
if (this._pendingState !== null)
{
console.log('_pendingState found');
console.log(typeof this._pendingState);
if (typeof this._pendingState === 'string')
{
// State was already added, so just start it
this.start(this._pendingState, false, false);
}
else
{
this.add('default', this._pendingState, true);
}
}
},
@ -110,10 +128,11 @@ Phaser.StateManager.prototype = {
*/
add: function (key, state, autoStart) {
if (typeof autoStart === "undefined") { autoStart = true; }
if (typeof autoStart === "undefined") { autoStart = false; }
console.log('Phaser.StateManager.addState', key);
console.log(typeof state);
console.log('autoStart?', autoStart);
var newState;
@ -138,7 +157,16 @@ Phaser.StateManager.prototype = {
if (autoStart)
{
this.start(key);
if (this.game.isBooted)
{
console.log('Game is booted, so we can start the state now');
this.start(key);
}
else
{
console.log('Game is NOT booted, so set the current state as pending');
this._pendingState = key;
}
}
return newState;
@ -147,6 +175,25 @@ Phaser.StateManager.prototype = {
remove: function (key) {
if (this.current == key)
{
this.callbackContext = null;
this.onInitCallback = null;
this.onShutDownCallback = null;
this.onPreloadCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
this.onCreateCallback = null;
this.onUpdateCallback = null;
this.onRenderCallback = null;
this.onPausedCallback = null;
this.onDestroyCallback = null;
}
delete this.states[key];
},
/**
@ -164,6 +211,13 @@ Phaser.StateManager.prototype = {
if (typeof clearWorld === "undefined") { clearWorld = true; }
if (typeof clearCache === "undefined") { clearCache = false; }
if (this.game.isBooted == false)
{
console.log('Game is NOT booted, so set the requested state as pending');
this._pendingState = key;
return;
}
if (this.checkState(key) == false)
{
return;
@ -288,120 +342,6 @@ Phaser.StateManager.prototype = {
},
/**
* Switch to a new State.
* @param state {State} The state you want to switch to. If a string will be treated as a reference to an already stored state.
* @param [clearWorld] {bool} clear everything in the world? (Default to true)
* @param [clearCache] {bool} clear asset cache? (Default to false and ONLY available when clearWorld=true)
*/
OLDswitchState: function (state, clearWorld, clearCache) {
if (typeof clearWorld === "undefined") { clearWorld = true; }
if (typeof clearCache === "undefined") { clearCache = false; }
console.log('Phaser.StateManager.switchState');
console.log(typeof state);
var result = false;
var newState;
// Check the pendingState object to see if it contains anything we can use
if (typeof state === 'string')
{
console.log('Phaser.StateManager.boot: string given');
}
else if (state instanceof Phaser.State)
{
console.log('Phaser.StateManager.boot: Phaser.State given');
newState = state;
newState.link(this.game);
result = this.setCallbacks();
}
else if (typeof state === 'object')
{
console.log('Phaser.StateManager.boot: Object given');
newState = state;
result = this.setCallbacks();
}
else if (typeof state === 'function')
{
console.log('Phaser.StateManager.boot: function reference given');
newState = new state(this.game);
result = this.setCallbacks();
}
if (result)
{
console.log("We've been given and successfully parsed a valid state");
var idx = this.states.push(newState);
// We've been given and successfully parsed a valid state
this.startState();
}
return result;
},
/**
* Start the current state
*/
OLDstartState: function () {
result = this.setCallbacks();
console.log('Phaser.StateManager.startState');
// console.log(this);
// console.log(this.callbackContext);
if (this.onPreloadCallback !== null)
{
console.log('Preload Callback found');
this.game.load.reset();
this.onPreloadCallback.call(this.callbackContext);
// this.onPreloadCallback.call(this.onPreloadCallback);
// Is the loader empty?
if (this.game.load.queueSize == 0)
{
console.log('Loader queue empty');
// this.game._loadComplete = true;
this.game.loadComplete();
if (this.onCreateCallback !== null)
{
this.onCreateCallback.call(this.callbackContext);
// this.onCreateCallback.call(this.onCreateCallback);
}
}
else
{
console.log('Loader started');
// Start the loader going as we have something in the queue
this.game.load.start();
}
}
else
{
console.log('Preload callback not found');
// No init? Then there was nothing to load either
if (this.onCreateCallback) {
console.log('Create callback found');
this.onCreateCallback.call(this.callbackContext);
// this.onCreateCallback.call(this.onCreateCallback);
}
// this.game._loadComplete = true;
this.game.loadComplete();
}
},
loadComplete: function () {
console.log('Phaser.StateManager.loadComplete');
@ -414,87 +354,50 @@ Phaser.StateManager.prototype = {
},
/**
* Switch to a new State.
* @param state {State} The state you want to switch to.
* @param [clearWorld] {bool} clear everything in the world? (Default to true)
* @param [clearCache] {bool} clear asset cache? (Default to false and ONLY available when clearWorld=true)
*/
loadUpdate: function () {
/*
switchState: function (state, clearWorld, clearCache) {
if (this.onLoadUpdateCallback)
{
this.onLoadUpdateCallback.call(this.callbackContext);
}
// console.log('switchState', state, this.isBooted);
// console.log(typeof state);
// console.log(state instanceof Phaser.State);
if (typeof clearWorld === "undefined") { clearWorld = true; }
if (typeof clearCache === "undefined") { clearCache = false; }
if (state instanceof Phaser.State) {
state.link(this);
}
if (this.isBooted == false) {
this._pendingState = state;
return;
}
// Destroy current state?
if (this.onDestroyCallback !== null) {
this.onDestroyCallback.call(this.callbackContext);
}
if (this.input) {
this.input.reset(true);
}
// Prototype?
if (typeof state === 'function')
{
this.state = new state(this);
}
else
{
this.state = state;
}
// Ok, have we got at least a create or update function?
if (this.state['create'] || this.state['update']) {
this.callbackContext = this.state;
// Bingo, let's set them up
this.onPreloadCallback = this.state['preload'] || null;
this.onLoadRenderCallback = this.state['loadRender'] || null;
this.onLoadUpdateCallback = this.state['loadUpdate'] || null;
this.onCreateCallback = this.state['create'] || null;
this.onUpdateCallback = this.state['update'] || null;
this.onPreRenderCallback = this.state['preRender'] || null;
this.onRenderCallback = this.state['render'] || null;
this.onPausedCallback = this.state['paused'] || null;
this.onDestroyCallback = this.state['destroy'] || null;
if (clearWorld) {
//this.world.destroy();
if (clearCache == true) {
this.cache.destroy();
}
}
this._loadComplete = false;
this.startState();
}
else
{
console.warn("Invalid Phaser State object given. Must contain at least a create or update function.");
}
},
*/
loadRender: function () {
if (this.onLoadRenderCallback)
{
this.onLoadRenderCallback.call(this.callbackContext);
}
},
update: function () {
if (this.onUpdateCallback)
{
this.onUpdateCallback.call(this.callbackContext);
}
},
preRender: function () {
if (this.onPreRenderCallback)
{
this.onPreRenderCallback.call(this.callbackContext);
}
},
render: function () {
if (this.onRenderCallback)
{
this.onRenderCallback.call(this.callbackContext);
}
},
/**
* Nuke the entire game from orbit
@ -502,6 +405,10 @@ Phaser.StateManager.prototype = {
destroy: function () {
this.callbackContext = null;
this.onInitCallback = null;
this.onShutDownCallback = null;
this.onPreloadCallback = null;
this.onLoadRenderCallback = null;
this.onLoadUpdateCallback = null;
@ -511,6 +418,10 @@ Phaser.StateManager.prototype = {
this.onPausedCallback = null;
this.onDestroyCallback = null;
this.game = null;
this.states = {};
this._pendingState = null;
}
};