Input Handler updates, orientation screen and World visibility

This commit is contained in:
photonstorm
2013-11-04 20:43:59 +00:00
parent 19ddad8095
commit 2e576fa9a7
8 changed files with 236 additions and 64 deletions
+118 -44
View File
@@ -17,45 +17,19 @@
Phaser.StageScaleMode = function (game, width, height) {
/**
* @property {number} _startHeight - Stage height when starting the game.
* @default
* @private
* @property {Phaser.Game} game - A reference to the currently running game.
*/
this._startHeight = 0;
this.game = game;
/**
* @property {boolean} forceLandscape - If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @default
* @property {number} width - Width of the stage after calculation.
*/
this.forceLandscape = false;
this.width = width;
/**
* @property {boolean} forcePortrait - If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @default
* @property {number} height - Height of the stage after calculation.
*/
this.forcePortrait = false;
/**
* @property {boolean} incorrectOrientation - If the game should be forced to use a specific orientation and the device currently isn't in that orientation this is set to true.
* @default
*/
this.incorrectOrientation = false;
/**
* @property {boolean} pageAlignHorizontally - If you wish to align your game in the middle of the page then you can set this value to true.
<ul><li>It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.</li>
<li>It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.</li></ul>
* @default
*/
this.pageAlignHorizontally = false;
/**
* @property {boolean} pageAlignVertically - If you wish to align your game in the middle of the page then you can set this value to true.
<ul><li>It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.
<li>It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.</li></ul>
* @default
*/
this.pageAlignVertically = false;
this.height = height;
/**
* @property {number} minWidth - Minimum width the canvas should be scaled to (in pixels).
@@ -84,14 +58,45 @@ Phaser.StageScaleMode = function (game, width, height) {
this.maxHeight = null;
/**
* @property {number} width - Width of the stage after calculation.
* @property {number} _startHeight - Stage height when starting the game.
* @default
* @private
*/
this.width = width;
this._startHeight = 0;
/**
* @property {number} height - Height of the stage after calculation.
* @property {boolean} forceLandscape - If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @default
*/
this.height = height;
this.forceLandscape = false;
/**
* @property {boolean} forcePortrait - If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @default
*/
this.forcePortrait = false;
/**
* @property {boolean} incorrectOrientation - If the game should be forced to use a specific orientation and the device currently isn't in that orientation this is set to true.
* @default
*/
this.incorrectOrientation = false;
/**
* @property {boolean} pageAlignHorizontally - If you wish to align your game in the middle of the page then you can set this value to true.
* It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.
* It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.
* @default
*/
this.pageAlignHorizontally = false;
/**
* @property {boolean} pageAlignVertically - If you wish to align your game in the middle of the page then you can set this value to true.
* It will place a re-calculated margin-left pixel value onto the canvas element which is updated on orientation/resizing.
* It doesn't care about any other DOM element that may be on the page, it literally just sets the margin.
* @default
*/
this.pageAlignVertically = false;
/**
* @property {number} _width - Cached stage width for full screen mode.
@@ -113,18 +118,20 @@ Phaser.StageScaleMode = function (game, width, height) {
*/
this.maxIterations = 5;
/**
* @property {Phaser.Game} game - A reference to the currently running game.
*/
this.game = game;
/**
* @property {Description} enterLandscape - Description.
* @property {PIXI.Sprite} orientationSprite - The Sprite that is optionally displayed if the browser enters an unsupported orientation.
* @default
*/
this.orientationSprite = null;
/**
* @property {Phaser.Signal} enterLandscape - The event that is dispatched when the browser enters landscape orientation.
*/
this.enterLandscape = new Phaser.Signal();
/**
* @property {Description} enterPortrait - Description.
* @property {Phaser.Signal} enterPortrait - The event that is dispatched when the browser enters horizontal orientation.
*/
this.enterPortrait = new Phaser.Signal();
@@ -145,7 +152,7 @@ Phaser.StageScaleMode = function (game, width, height) {
}
/**
* @property {Description} scaleFactor - Description.
* @property {Phaser.Point} scaleFactor - The scale factor based on the game dimensions vs. the scaled dimensions.
*/
this.scaleFactor = new Phaser.Point(1, 1);
@@ -298,6 +305,54 @@ Phaser.StageScaleMode.prototype = {
},
/**
* If you need your game to run in only one orientation you can force that to happen.
* The optional orientationImage is displayed when the game is in the incorrect orientation.
* @method Phaser.StageScaleMode#forceOrientation
* @param {boolean} forceLandscape - true if the game should run in landscape mode only.
* @param {boolean} forcePortrait - true if the game should run in portrait mode only.
* @param {string} [forcePortrait=''] - The string of an image in the Phaser.Cache to display when this game is in the incorrect orientation.
*/
forceOrientation: function (forceLandscape, forcePortrait, orientationImage) {
this.forceLandscape = forceLandscape;
if (typeof forcePortrait === 'undefined')
{
this.forcePortrait = false;
}
if (typeof orientationImage !== 'undefined')
{
if (orientationImage == null || this.game.cache.checkImageKey(orientationImage) == false)
{
orientationImage = '__default';
}
this.orientationSprite = new PIXI.Sprite(PIXI.TextureCache[orientationImage]);
this.orientationSprite.anchor.x = 0.5;
this.orientationSprite.anchor.y = 0.5;
this.orientationSprite.position.x = this.game.width / 2;
this.orientationSprite.position.y = this.game.height / 2;
this.checkOrientationState();
if (this.incorrectOrientation)
{
this.orientationSprite.visible = true;
this.game.world.visible = false;
}
else
{
this.orientationSprite.visible = false;
this.game.world.visible = true;
}
this.game.stage._stage.addChild(this.orientationSprite);
}
},
/**
* Checks if the browser is in the correct orientation for your game (if forceLandscape or forcePortrait have been set)
* @method Phaser.StageScaleMode#checkOrientationState
@@ -312,6 +367,13 @@ Phaser.StageScaleMode.prototype = {
// Back to normal
this.game.paused = false;
this.incorrectOrientation = false;
if (this.orientationSprite)
{
this.orientationSprite.visible = false;
this.game.world.visible = true;
}
this.refresh();
}
}
@@ -322,6 +384,13 @@ Phaser.StageScaleMode.prototype = {
// Show orientation screen
this.game.paused = true;
this.incorrectOrientation = true;
if (this.orientationSprite && this.orientationSprite.visible == false)
{
this.orientationSprite.visible = true;
this.game.world.visible = false;
}
this.refresh();
}
}
@@ -381,6 +450,9 @@ Phaser.StageScaleMode.prototype = {
{
this.refresh();
}
this.checkOrientationState();
},
/**
@@ -420,7 +492,7 @@ Phaser.StageScaleMode.prototype = {
/**
* Set screen size automatically based on the scaleMode.
* @param {Description} force - If force is true it will try to resize the game regardless of the document dimensions.
* @param {boolean} force - If force is true it will try to resize the game regardless of the document dimensions.
*/
setScreenSize: function (force) {
@@ -533,6 +605,8 @@ Phaser.StageScaleMode.prototype = {
this.scaleFactor.x = this.game.width / this.width;
this.scaleFactor.y = this.game.height / this.height;
this.checkOrientationState();
},
/**