mirror of
https://github.com/photonstorm/phaser
synced 2024-11-27 07:01:20 +00:00
5d5c64d22f
After defining tiles that collide on a Tilemap, you need to call Tilemap.generateCollisionData(layer) to populate the physics world with the data required. Debug.renderPhysicsBody updated to take camera location and body rotation into account. Body movement functions put back to velocity :) Updated to latest dev version of pixi and latest p2.js Updated docs
1304 lines
34 KiB
HTML
1304 lines
34 KiB
HTML
<!DOCTYPE html>
|
|
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Phaser Source: system/StageScaleMode.js</title>
|
|
|
|
<!--[if lt IE 9]>
|
|
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
|
|
<![endif]-->
|
|
<link type="text/css" rel="stylesheet" href="styles/sunlight.default.css">
|
|
|
|
|
|
<link type="text/css" rel="stylesheet" href="styles/site.cerulean.css">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container-fluid">
|
|
<div class="navbar navbar-fixed-top navbar-inverse">
|
|
<div class="navbar-inner">
|
|
<a class="brand" href="index.html">Phaser</a>
|
|
<ul class="nav">
|
|
|
|
<li class="dropdown">
|
|
<a href="namespaces.list.html" class="dropdown-toggle" data-toggle="dropdown">Namespaces<b
|
|
class="caret"></b></a>
|
|
|
|
<ul class="dropdown-menu ">
|
|
|
|
<li>
|
|
<a href="Phaser.html">Phaser</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="dropdown">
|
|
<a href="classes.list.html" class="dropdown-toggle" data-toggle="dropdown">Classes<b
|
|
class="caret"></b></a>
|
|
|
|
<ul class="dropdown-menu ">
|
|
|
|
<li>
|
|
<a href="Phaser.Animation.html">Animation</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.AnimationManager.html">AnimationManager</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.AnimationParser.html">AnimationParser</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.BitmapData.html">BitmapData</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.BitmapFont.html">BitmapFont</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.BitmapText.html">BitmapText</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Button.html">Button</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Cache.html">Cache</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Camera.html">Camera</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Canvas.html">Canvas</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Circle.html">Circle</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Color.html">Color</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Device.html">Device</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.html">Easing</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Back.html">Back</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Bounce.html">Bounce</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Circular.html">Circular</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Cubic.html">Cubic</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Elastic.html">Elastic</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Exponential.html">Exponential</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Linear.html">Linear</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Quadratic.html">Quadratic</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Quartic.html">Quartic</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Quintic.html">Quintic</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Easing.Sinusoidal.html">Sinusoidal</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Ellipse.html">Ellipse</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Events.html">Events</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Filter.html">Filter</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Frame.html">Frame</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.FrameData.html">FrameData</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Game.html">Game</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.GameObjectFactory.html">GameObjectFactory</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Gamepad.html">Gamepad</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.GamepadButton.html">GamepadButton</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Graphics.html">Graphics</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Group.html">Group</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Image.html">Image</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Input.html">Input</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.InputHandler.html">InputHandler</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Key.html">Key</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Keyboard.html">Keyboard</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Line.html">Line</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.LinkedList.html">LinkedList</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Loader.html">Loader</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.LoaderParser.html">LoaderParser</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Math.html">Math</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Mouse.html">Mouse</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.MSPointer.html">MSPointer</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Net.html">Net</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Particles.html">Particles</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Particles.Arcade.Emitter.html">Emitter</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Physics.html">Physics</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Physics.Arcade.html">Arcade</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Plugin.html">Plugin</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.PluginManager.html">PluginManager</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Point.html">Point</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Pointer.html">Pointer</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Polygon.html">Polygon</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.QuadTree.html">QuadTree</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.RandomDataGenerator.html">RandomDataGenerator</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Rectangle.html">Rectangle</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.RenderTexture.html">RenderTexture</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.RequestAnimationFrame.html">RequestAnimationFrame</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Signal.html">Signal</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.SinglePad.html">SinglePad</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Sound.html">Sound</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.SoundManager.html">SoundManager</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Sprite.html">Sprite</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.SpriteBatch.html">SpriteBatch</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Stage.html">Stage</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.StageScaleMode.html">StageScaleMode</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.State.html">State</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.StateManager.html">StateManager</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Text.html">Text</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Tile.html">Tile</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Tilemap.html">Tilemap</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.TilemapLayer.html">TilemapLayer</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.TilemapParser.html">TilemapParser</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Tileset.html">Tileset</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.TileSprite.html">TileSprite</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Time.html">Time</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Timer.html">Timer</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.TimerEvent.html">TimerEvent</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Touch.html">Touch</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Tween.html">Tween</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.TweenManager.html">TweenManager</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Utils.html">Utils</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.Utils.Debug.html">Debug</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="Phaser.World.html">World</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="SignalBinding.html">SignalBinding</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
</li>
|
|
|
|
<li class="dropdown">
|
|
<a href="global.html" class="dropdown-toggle" data-toggle="dropdown">Global<b
|
|
class="caret"></b></a>
|
|
|
|
<ul class="dropdown-menu ">
|
|
|
|
<li>
|
|
<a href="global.html#canUseNewCanvasBlendModes">canUseNewCanvasBlendModes</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="global.html#getBounds">getBounds</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="global.html#getNextPowerOfTwo">getNextPowerOfTwo</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="global.html#hex2rgb">hex2rgb</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="global.html#hitTest">hitTest</a>
|
|
</li>
|
|
|
|
<li>
|
|
<a href="global.html#rgb2hex">rgb2hex</a>
|
|
</li>
|
|
|
|
|
|
</ul>
|
|
</li>
|
|
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row-fluid">
|
|
|
|
|
|
<div class="span12">
|
|
|
|
<div id="main">
|
|
|
|
|
|
|
|
<h1 class="page-title">Source: system/StageScaleMode.js</h1>
|
|
|
|
<section>
|
|
<article>
|
|
<pre class="sunlight-highlight-javascript linenums">/**
|
|
* @author Richard Davey <rich@photonstorm.com>
|
|
* @copyright 2014 Photon Storm Ltd.
|
|
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
|
|
*/
|
|
|
|
/**
|
|
* The StageScaleMode object is responsible for helping you manage the scaling, resizing and alignment of your game within the browser.
|
|
*
|
|
* @class Phaser.StageScaleMode
|
|
* @constructor
|
|
* @param {Phaser.Game} game - A reference to the currently running game.
|
|
* @param {number} width - The native width of the game.
|
|
* @param {number} height - The native height of the game.
|
|
*/
|
|
Phaser.StageScaleMode = function (game, width, height) {
|
|
|
|
/**
|
|
* @property {Phaser.Game} game - A reference to the currently running game.
|
|
*/
|
|
this.game = game;
|
|
|
|
/**
|
|
* @property {number} width - Width of the stage after calculation.
|
|
*/
|
|
this.width = width;
|
|
|
|
/**
|
|
* @property {number} height - Height of the stage after calculation.
|
|
*/
|
|
this.height = height;
|
|
|
|
/**
|
|
* @property {number} minWidth - Minimum width the canvas should be scaled to (in pixels).
|
|
*/
|
|
this.minWidth = null;
|
|
|
|
/**
|
|
* @property {number} maxWidth - Maximum width the canvas should be scaled to (in pixels). If null it will scale to whatever width the browser can handle.
|
|
*/
|
|
this.maxWidth = null;
|
|
|
|
/**
|
|
* @property {number} minHeight - Minimum height the canvas should be scaled to (in pixels).
|
|
*/
|
|
this.minHeight = null;
|
|
|
|
/**
|
|
* @property {number} maxHeight - Maximum height the canvas should be scaled to (in pixels). If null it will scale to whatever height the browser can handle.
|
|
*/
|
|
this.maxHeight = null;
|
|
|
|
/**
|
|
* @property {boolean} forceLandscape - If the game should be forced to use Landscape mode, this is set to true by Game.Stage
|
|
* @default
|
|
*/
|
|
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} maxIterations - The maximum number of times it will try to resize the canvas to fill the browser.
|
|
* @default
|
|
*/
|
|
this.maxIterations = 5;
|
|
|
|
/**
|
|
* @property {PIXI.Sprite} orientationSprite - The Sprite that is optionally displayed if the browser enters an unsupported orientation.
|
|
*/
|
|
this.orientationSprite = null;
|
|
|
|
/**
|
|
* @property {Phaser.Signal} enterLandscape - The event that is dispatched when the browser enters landscape orientation.
|
|
*/
|
|
this.enterLandscape = new Phaser.Signal();
|
|
|
|
/**
|
|
* @property {Phaser.Signal} enterPortrait - The event that is dispatched when the browser enters horizontal orientation.
|
|
*/
|
|
this.enterPortrait = new Phaser.Signal();
|
|
|
|
/**
|
|
* @property {Phaser.Signal} enterIncorrectOrientation - The event that is dispatched when the browser enters an incorrect orientation, as defined by forceOrientation.
|
|
*/
|
|
this.enterIncorrectOrientation = new Phaser.Signal();
|
|
|
|
/**
|
|
* @property {Phaser.Signal} leaveIncorrectOrientation - The event that is dispatched when the browser leaves an incorrect orientation, as defined by forceOrientation.
|
|
*/
|
|
this.leaveIncorrectOrientation = new Phaser.Signal();
|
|
|
|
/**
|
|
* @property {Phaser.Signal} hasResized - The event that is dispatched when the game scale changes.
|
|
*/
|
|
this.hasResized = new Phaser.Signal();
|
|
|
|
/**
|
|
* @property {number} orientation - The orientation value of the game (as defined by window.orientation if set). 90 = landscape. 0 = portrait.
|
|
*/
|
|
this.orientation = 0;
|
|
|
|
if (window['orientation'])
|
|
{
|
|
this.orientation = window['orientation'];
|
|
}
|
|
else
|
|
{
|
|
if (window.outerWidth > window.outerHeight)
|
|
{
|
|
this.orientation = 90;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @property {Phaser.Point} scaleFactor - The scale factor based on the game dimensions vs. the scaled dimensions.
|
|
* @readonly
|
|
*/
|
|
this.scaleFactor = new Phaser.Point(1, 1);
|
|
|
|
/**
|
|
* @property {Phaser.Point} scaleFactorInversed - The inversed scale factor. The displayed dimensions divided by the game dimensions.
|
|
* @readonly
|
|
*/
|
|
this.scaleFactorInversed = new Phaser.Point(1, 1);
|
|
|
|
/**
|
|
* @property {Phaser.Point} margin - If the game canvas is seto to align by adjusting the margin, the margin calculation values are stored in this Point.
|
|
* @readonly
|
|
*/
|
|
this.margin = new Phaser.Point(0, 0);
|
|
|
|
/**
|
|
* @property {number} aspectRatio - The aspect ratio of the scaled game.
|
|
* @readonly
|
|
*/
|
|
this.aspectRatio = 0;
|
|
|
|
/**
|
|
* @property {number} sourceAspectRatio - The aspect ratio (width / height) of the original game dimensions.
|
|
* @readonly
|
|
*/
|
|
this.sourceAspectRatio = width / height;
|
|
|
|
/**
|
|
* @property {any} event- The native browser events from full screen API changes.
|
|
*/
|
|
this.event = null;
|
|
|
|
/**
|
|
* @property {number} scaleMode - The current scaleMode.
|
|
*/
|
|
this.scaleMode = Phaser.StageScaleMode.NO_SCALE;
|
|
|
|
/*
|
|
* @property {number} fullScreenScaleMode - Scale mode to be used in fullScreen
|
|
*/
|
|
this.fullScreenScaleMode = Phaser.StageScaleMode.NO_SCALE;
|
|
|
|
/**
|
|
* @property {number} _startHeight - Internal cache var. Stage height when starting the game.
|
|
* @private
|
|
*/
|
|
this._startHeight = 0;
|
|
|
|
/**
|
|
* @property {number} _width - Cached stage width for full screen mode.
|
|
* @private
|
|
*/
|
|
this._width = 0;
|
|
|
|
/**
|
|
* @property {number} _height - Cached stage height for full screen mode.
|
|
* @private
|
|
*/
|
|
this._height = 0;
|
|
|
|
var _this = this;
|
|
|
|
window.addEventListener('orientationchange', function (event) {
|
|
return _this.checkOrientation(event);
|
|
}, false);
|
|
|
|
window.addEventListener('resize', function (event) {
|
|
return _this.checkResize(event);
|
|
}, false);
|
|
|
|
document.addEventListener('webkitfullscreenchange', function (event) {
|
|
return _this.fullScreenChange(event);
|
|
}, false);
|
|
|
|
document.addEventListener('mozfullscreenchange', function (event) {
|
|
return _this.fullScreenChange(event);
|
|
}, false);
|
|
|
|
document.addEventListener('fullscreenchange', function (event) {
|
|
return _this.fullScreenChange(event);
|
|
}, false);
|
|
|
|
};
|
|
|
|
/**
|
|
* @constant
|
|
* @type {number}
|
|
*/
|
|
Phaser.StageScaleMode.EXACT_FIT = 0;
|
|
|
|
/**
|
|
* @constant
|
|
* @type {number}
|
|
*/
|
|
Phaser.StageScaleMode.NO_SCALE = 1;
|
|
|
|
/**
|
|
* @constant
|
|
* @type {number}
|
|
*/
|
|
Phaser.StageScaleMode.SHOW_ALL = 2;
|
|
|
|
Phaser.StageScaleMode.prototype = {
|
|
|
|
/**
|
|
* Tries to enter the browser into full screen mode.
|
|
* Please note that this needs to be supported by the web browser and isn't the same thing as setting your game to fill the browser.
|
|
* @method Phaser.StageScaleMode#startFullScreen
|
|
* @param {boolean} antialias - You can toggle the anti-alias feature of the canvas before jumping in to full screen (false = retain pixel art, true = smooth art)
|
|
*/
|
|
startFullScreen: function (antialias) {
|
|
|
|
if (this.isFullScreen)
|
|
{
|
|
return;
|
|
}
|
|
|
|
if (typeof antialias !== 'undefined')
|
|
{
|
|
Phaser.Canvas.setSmoothingEnabled(this.game.context, antialias);
|
|
}
|
|
|
|
var element = this.game.canvas;
|
|
|
|
this._width = this.width;
|
|
this._height = this.height;
|
|
|
|
// This needs updating to match the final spec:
|
|
// http://generatedcontent.org/post/70347573294/is-your-fullscreen-api-code-up-to-date-find-out-how-to
|
|
|
|
if (element['requestFullScreen'])
|
|
{
|
|
element['requestFullScreen']();
|
|
}
|
|
else if (element['mozRequestFullScreen'])
|
|
{
|
|
element.parentNode['mozRequestFullScreen']();
|
|
}
|
|
else if (element['webkitRequestFullScreen'])
|
|
{
|
|
element['webkitRequestFullScreen'](Element.ALLOW_KEYBOARD_INPUT);
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* Stops full screen mode if the browser is in it.
|
|
* @method Phaser.StageScaleMode#stopFullScreen
|
|
*/
|
|
stopFullScreen: function () {
|
|
|
|
if (document['cancelFullScreen'])
|
|
{
|
|
document['cancelFullScreen']();
|
|
}
|
|
else if (document['mozCancelFullScreen'])
|
|
{
|
|
document['mozCancelFullScreen']();
|
|
}
|
|
else if (document['webkitCancelFullScreen'])
|
|
{
|
|
document['webkitCancelFullScreen']();
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* Called automatically when the browser enters of leaves full screen mode.
|
|
* @method Phaser.StageScaleMode#fullScreenChange
|
|
* @param {Event} event - The fullscreenchange event
|
|
* @protected
|
|
*/
|
|
fullScreenChange: function (event) {
|
|
|
|
this.event = event;
|
|
|
|
if (this.isFullScreen)
|
|
{
|
|
if (this.fullScreenScaleMode === Phaser.StageScaleMode.EXACT_FIT)
|
|
{
|
|
this.game.canvas.style['width'] = '100%';
|
|
this.game.canvas.style['height'] = '100%';
|
|
|
|
this.setMaximum();
|
|
|
|
this.game.input.scale.setTo(this.game.width / this.width, this.game.height / this.height);
|
|
|
|
this.aspectRatio = this.width / this.height;
|
|
this.scaleFactor.x = this.game.width / this.width;
|
|
this.scaleFactor.y = this.game.height / this.height;
|
|
}
|
|
else if (this.fullScreenScaleMode === Phaser.StageScaleMode.SHOW_ALL)
|
|
{
|
|
this.setShowAll();
|
|
this.refresh();
|
|
}
|
|
}
|
|
else
|
|
{
|
|
this.game.canvas.style['width'] = this.game.width + 'px';
|
|
this.game.canvas.style['height'] = this.game.height + 'px';
|
|
|
|
this.width = this._width;
|
|
this.height = this._height;
|
|
|
|
this.game.input.scale.setTo(this.game.width / this.width, this.game.height / this.height);
|
|
|
|
this.aspectRatio = this.width / this.height;
|
|
this.scaleFactor.x = this.game.width / this.width;
|
|
this.scaleFactor.y = this.game.height / this.height;
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* 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=false] - true if the game should run in portrait mode only.
|
|
* @param {string} [orientationImage=''] - The string of an image in the Phaser.Cache to display when this game is in the incorrect orientation.
|
|
*/
|
|
forceOrientation: function (forceLandscape, forcePortrait, orientationImage) {
|
|
|
|
if (typeof forcePortrait === 'undefined') { forcePortrait = false; }
|
|
|
|
this.forceLandscape = forceLandscape;
|
|
this.forcePortrait = forcePortrait;
|
|
|
|
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.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
|
|
*/
|
|
checkOrientationState: function () {
|
|
|
|
// They are in the wrong orientation
|
|
if (this.incorrectOrientation)
|
|
{
|
|
if ((this.forceLandscape && window.innerWidth > window.innerHeight) || (this.forcePortrait && window.innerHeight > window.innerWidth))
|
|
{
|
|
// Back to normal
|
|
this.game.paused = false;
|
|
this.incorrectOrientation = false;
|
|
this.leaveIncorrectOrientation.dispatch();
|
|
|
|
if (this.orientationSprite)
|
|
{
|
|
this.orientationSprite.visible = false;
|
|
this.game.world.visible = true;
|
|
}
|
|
|
|
this.refresh();
|
|
}
|
|
}
|
|
else
|
|
{
|
|
if ((this.forceLandscape && window.innerWidth < window.innerHeight) || (this.forcePortrait && window.innerHeight < window.innerWidth))
|
|
{
|
|
// Show orientation screen
|
|
this.game.paused = true;
|
|
this.incorrectOrientation = true;
|
|
this.enterIncorrectOrientation.dispatch();
|
|
|
|
if (this.orientationSprite && this.orientationSprite.visible === false)
|
|
{
|
|
this.orientationSprite.visible = true;
|
|
this.game.world.visible = false;
|
|
}
|
|
|
|
this.refresh();
|
|
}
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Handle window.orientationchange events
|
|
* @method Phaser.StageScaleMode#checkOrientation
|
|
* @param {Event} event - The orientationchange event data.
|
|
*/
|
|
checkOrientation: function (event) {
|
|
|
|
this.event = event;
|
|
|
|
this.orientation = window['orientation'];
|
|
|
|
if (this.isLandscape)
|
|
{
|
|
this.enterLandscape.dispatch(this.orientation, true, false);
|
|
}
|
|
else
|
|
{
|
|
this.enterPortrait.dispatch(this.orientation, false, true);
|
|
}
|
|
|
|
if (this.scaleMode !== Phaser.StageScaleMode.NO_SCALE)
|
|
{
|
|
this.refresh();
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* Handle window.resize events
|
|
* @method Phaser.StageScaleMode#checkResize
|
|
* @param {Event} event - The resize event data.
|
|
*/
|
|
checkResize: function (event) {
|
|
|
|
this.event = event;
|
|
|
|
if (window.outerWidth > window.outerHeight)
|
|
{
|
|
this.orientation = 90;
|
|
}
|
|
else
|
|
{
|
|
this.orientation = 0;
|
|
}
|
|
|
|
if (this.isLandscape)
|
|
{
|
|
this.enterLandscape.dispatch(this.orientation, true, false);
|
|
}
|
|
else
|
|
{
|
|
this.enterPortrait.dispatch(this.orientation, false, true);
|
|
}
|
|
|
|
if (this.scaleMode !== Phaser.StageScaleMode.NO_SCALE)
|
|
{
|
|
this.refresh();
|
|
}
|
|
|
|
this.checkOrientationState();
|
|
|
|
},
|
|
|
|
/**
|
|
* Re-calculate scale mode and update screen size.
|
|
* @method Phaser.StageScaleMode#refresh
|
|
*/
|
|
refresh: function () {
|
|
|
|
// We can't do anything about the status bars in iPads, web apps or desktops
|
|
if (this.game.device.iPad === false && this.game.device.webApp === false && this.game.device.desktop === false)
|
|
{
|
|
if (this.game.device.android && this.game.device.chrome === false)
|
|
{
|
|
window.scrollTo(0, 1);
|
|
}
|
|
else
|
|
{
|
|
window.scrollTo(0, 0);
|
|
}
|
|
}
|
|
|
|
if (this._check == null && this.maxIterations > 0)
|
|
{
|
|
this._iterations = this.maxIterations;
|
|
|
|
var _this = this;
|
|
|
|
this._check = window.setInterval(function () {
|
|
return _this.setScreenSize();
|
|
}, 10);
|
|
|
|
this.setScreenSize();
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* Set screen size automatically based on the scaleMode.
|
|
* @param {boolean} force - If force is true it will try to resize the game regardless of the document dimensions.
|
|
*/
|
|
setScreenSize: function (force) {
|
|
|
|
if (typeof force == 'undefined')
|
|
{
|
|
force = false;
|
|
}
|
|
|
|
if (this.game.device.iPad === false && this.game.device.webApp === false && this.game.device.desktop === false)
|
|
{
|
|
if (this.game.device.android && this.game.device.chrome === false)
|
|
{
|
|
window.scrollTo(0, 1);
|
|
}
|
|
else
|
|
{
|
|
window.scrollTo(0, 0);
|
|
}
|
|
}
|
|
|
|
this._iterations--;
|
|
|
|
if (force || window.innerHeight > this._startHeight || this._iterations < 0)
|
|
{
|
|
// Set minimum height of content to new window height
|
|
document.documentElement['style'].minHeight = window.innerHeight + 'px';
|
|
|
|
if (this.incorrectOrientation === true)
|
|
{
|
|
this.setMaximum();
|
|
}
|
|
else if (!this.isFullScreen)
|
|
{
|
|
if (this.scaleMode == Phaser.StageScaleMode.EXACT_FIT)
|
|
{
|
|
this.setExactFit();
|
|
}
|
|
else if (this.scaleMode == Phaser.StageScaleMode.SHOW_ALL)
|
|
{
|
|
this.setShowAll();
|
|
}
|
|
}
|
|
else
|
|
{
|
|
if (this.fullScreenScaleMode == Phaser.StageScaleMode.EXACT_FIT)
|
|
{
|
|
this.setExactFit();
|
|
}
|
|
else if (this.fullScreenScaleMode == Phaser.StageScaleMode.SHOW_ALL)
|
|
{
|
|
this.setShowAll();
|
|
}
|
|
}
|
|
|
|
this.setSize();
|
|
clearInterval(this._check);
|
|
this._check = null;
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* Sets the canvas style width and height values based on minWidth/Height and maxWidth/Height.
|
|
* @method Phaser.StageScaleMode#setSize
|
|
*/
|
|
setSize: function () {
|
|
|
|
if (this.incorrectOrientation === false)
|
|
{
|
|
if (this.maxWidth && this.width > this.maxWidth)
|
|
{
|
|
this.width = this.maxWidth;
|
|
}
|
|
|
|
if (this.maxHeight && this.height > this.maxHeight)
|
|
{
|
|
this.height = this.maxHeight;
|
|
}
|
|
|
|
if (this.minWidth && this.width < this.minWidth)
|
|
{
|
|
this.width = this.minWidth;
|
|
}
|
|
|
|
if (this.minHeight && this.height < this.minHeight)
|
|
{
|
|
this.height = this.minHeight;
|
|
}
|
|
}
|
|
|
|
this.game.canvas.style.width = this.width + 'px';
|
|
this.game.canvas.style.height = this.height + 'px';
|
|
|
|
this.game.input.scale.setTo(this.game.width / this.width, this.game.height / this.height);
|
|
|
|
if (this.pageAlignHorizontally)
|
|
{
|
|
if (this.width < window.innerWidth && this.incorrectOrientation === false)
|
|
{
|
|
this.margin.x = Math.round((window.innerWidth - this.width) / 2);
|
|
this.game.canvas.style.marginLeft = this.margin.x + 'px';
|
|
}
|
|
else
|
|
{
|
|
this.margin.x = 0;
|
|
this.game.canvas.style.marginLeft = '0px';
|
|
}
|
|
}
|
|
|
|
if (this.pageAlignVertically)
|
|
{
|
|
if (this.height < window.innerHeight && this.incorrectOrientation === false)
|
|
{
|
|
this.margin.y = Math.round((window.innerHeight - this.height) / 2);
|
|
this.game.canvas.style.marginTop = this.margin.y + 'px';
|
|
}
|
|
else
|
|
{
|
|
this.margin.y = 0;
|
|
this.game.canvas.style.marginTop = '0px';
|
|
}
|
|
}
|
|
|
|
Phaser.Canvas.getOffset(this.game.canvas, this.game.stage.offset);
|
|
|
|
this.aspectRatio = this.width / this.height;
|
|
|
|
this.scaleFactor.x = this.game.width / this.width;
|
|
this.scaleFactor.y = this.game.height / this.height;
|
|
|
|
this.scaleFactorInversed.x = this.width / this.game.width;
|
|
this.scaleFactorInversed.y = this.height / this.game.height;
|
|
|
|
this.hasResized.dispatch(this.width, this.height);
|
|
|
|
this.checkOrientationState();
|
|
|
|
},
|
|
|
|
/**
|
|
* Sets this.width equal to window.innerWidth and this.height equal to window.innerHeight
|
|
* @method Phaser.StageScaleMode#setMaximum
|
|
*/
|
|
setMaximum: function () {
|
|
|
|
this.width = window.innerWidth;
|
|
this.height = window.innerHeight;
|
|
|
|
},
|
|
|
|
/**
|
|
* Calculates the multiplier needed to scale the game proportionally.
|
|
* @method Phaser.StageScaleMode#setShowAll
|
|
*/
|
|
setShowAll: function () {
|
|
|
|
var multiplier = Math.min((window.innerHeight / this.game.height), (window.innerWidth / this.game.width));
|
|
|
|
this.width = Math.round(this.game.width * multiplier);
|
|
this.height = Math.round(this.game.height * multiplier);
|
|
|
|
},
|
|
|
|
/**
|
|
* Sets the width and height values of the canvas, no larger than the maxWidth/Height.
|
|
* @method Phaser.StageScaleMode#setExactFit
|
|
*/
|
|
setExactFit: function () {
|
|
|
|
var availableWidth = window.innerWidth;
|
|
var availableHeight = window.innerHeight;
|
|
|
|
if (this.maxWidth && availableWidth > this.maxWidth)
|
|
{
|
|
this.width = this.maxWidth;
|
|
}
|
|
else
|
|
{
|
|
this.width = availableWidth;
|
|
}
|
|
|
|
if (this.maxHeight && availableHeight > this.maxHeight)
|
|
{
|
|
this.height = this.maxHeight;
|
|
}
|
|
else
|
|
{
|
|
this.height = availableHeight;
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
Phaser.StageScaleMode.prototype.constructor = Phaser.StageScaleMode;
|
|
|
|
/**
|
|
* @name Phaser.StageScaleMode#isFullScreen
|
|
* @property {boolean} isFullScreen - Returns true if the browser is in full screen mode, otherwise false.
|
|
* @readonly
|
|
*/
|
|
Object.defineProperty(Phaser.StageScaleMode.prototype, "isFullScreen", {
|
|
|
|
get: function () {
|
|
|
|
return (document['fullscreenElement'] || document['mozFullScreenElement'] || document['webkitFullscreenElement'])
|
|
|
|
}
|
|
|
|
});
|
|
|
|
/**
|
|
* @name Phaser.StageScaleMode#isPortrait
|
|
* @property {boolean} isPortrait - Returns true if the browser dimensions match a portrait display.
|
|
* @readonly
|
|
*/
|
|
Object.defineProperty(Phaser.StageScaleMode.prototype, "isPortrait", {
|
|
|
|
get: function () {
|
|
return this.orientation === 0 || this.orientation == 180;
|
|
}
|
|
|
|
});
|
|
|
|
/**
|
|
* @name Phaser.StageScaleMode#isLandscape
|
|
* @property {boolean} isLandscape - Returns true if the browser dimensions match a landscape display.
|
|
* @readonly
|
|
*/
|
|
Object.defineProperty(Phaser.StageScaleMode.prototype, "isLandscape", {
|
|
|
|
get: function () {
|
|
return this.orientation === 90 || this.orientation === -90;
|
|
}
|
|
|
|
});
|
|
</pre>
|
|
</article>
|
|
</section>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<div class="clearfix"></div>
|
|
<footer>
|
|
|
|
|
|
<span class="copyright">
|
|
Phaser Copyright © 2012-2014 Photon Storm Ltd.
|
|
</span>
|
|
<br />
|
|
|
|
<span class="jsdoc-message">
|
|
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.3.0-dev</a>
|
|
on Tue Feb 18 2014 03:01:17 GMT-0000 (GMT) using the <a href="https://github.com/terryweiss/docstrap">DocStrap template</a>.
|
|
</span>
|
|
</footer>
|
|
</div>
|
|
|
|
|
|
<br clear="both">
|
|
</div>
|
|
|
|
</div>
|
|
<script src="scripts/sunlight.js"></script>
|
|
<script src="scripts/sunlight.javascript.js"></script>
|
|
<script src="scripts/sunlight-plugin.doclinks.js"></script>
|
|
<script src="scripts/sunlight-plugin.linenumbers.js"></script>
|
|
<script src="scripts/sunlight-plugin.menu.js"></script>
|
|
<script src="scripts/jquery.min.js"></script>
|
|
<script src="scripts/jquery.scrollTo.js"></script>
|
|
<script src="scripts/jquery.localScroll.js"></script>
|
|
<script src="scripts/bootstrap-dropdown.js"></script>
|
|
<script src="scripts/toc.js"></script>
|
|
|
|
|
|
<script> Sunlight.highlightAll({lineNumbers:true, showMenu: true, enableDoclinks :true}); </script>
|
|
|
|
<script>
|
|
$( function () {
|
|
$( "#toc" ).toc( {
|
|
selectors : "h1,h2,h3,h4",
|
|
showAndHide : false,
|
|
scrollTo : 60
|
|
} );
|
|
$( "#toc>ul" ).addClass( "nav nav-pills nav-stacked" );
|
|
$( "#main span[id^='toc']" ).addClass( "toc-shim" );
|
|
|
|
} );
|
|
</script>
|
|
|
|
|
|
|
|
</body>
|
|
</html>
|