Lots of tweaks and fixes to the orientation and fullscreen classes

This commit is contained in:
Richard Davey 2013-06-05 01:49:08 +01:00
parent 82d4ba4538
commit d42f396ba0
21 changed files with 1666 additions and 322 deletions

BIN
Docs/box-01.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
Docs/box-02.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View file

@ -170,6 +170,10 @@
<Content Include="renderers\CanvasRenderer.js">
<DependentUpon>CanvasRenderer.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="system\screens\OrientationScreen.ts" />
<Content Include="system\screens\OrientationScreen.js">
<DependentUpon>OrientationScreen.ts</DependentUpon>
</Content>
<Content Include="utils\CircleUtils.js">
<DependentUpon>CircleUtils.ts</DependentUpon>
</Content>

View file

@ -3,6 +3,7 @@
/// <reference path="system/StageScaleMode.ts" />
/// <reference path="system/screens/BootScreen.ts" />
/// <reference path="system/screens/PauseScreen.ts" />
/// <reference path="system/screens/OrientationScreen.ts" />
/**
* Phaser - Stage
@ -32,7 +33,7 @@ module Phaser {
this.canvas.width = width;
this.canvas.height = height;
if (document.getElementById(parent))
if ((parent !== '' || parent !== null) && document.getElementById(parent))
{
document.getElementById(parent).appendChild(this.canvas);
document.getElementById(parent).style.overflow = 'hidden';
@ -51,12 +52,13 @@ module Phaser {
this.context = this.canvas.getContext('2d');
this.offset = this.getOffset(this.canvas);
this.bounds = new Rectangle(this.offset.x, this.offset.y, width, height);
this.aspectRatio = width / height;
this.scaleMode = StageScaleMode.NO_SCALE;
this.scale = new StageScaleMode(this._game);
this.getOffset(this.canvas);
this.bounds = new Rectangle(this.offset.x, this.offset.y, width, height);
this.aspectRatio = width / height;
document.addEventListener('visibilitychange', (event) => this.visibilityChange(event), false);
document.addEventListener('webkitvisibilitychange', (event) => this.visibilityChange(event), false);
window.onblur = (event) => this.visibilityChange(event);
@ -70,22 +72,28 @@ module Phaser {
private _game: Game;
/**
* Background color of the stage (defaults to black)
* Background color of the stage (defaults to black). Set via the public backgroundColor property.
* @type {string}
*/
private _bgColor: string = 'rgb(0,0,0)';
private _backgroundColor: string = 'rgb(0,0,0)';
/**
* This will be displayed when Phaser is started without any default functions or State
* @type {BootScreen}
*/
private _bootScreen;
public bootScreen;
/**
* This will be displayed whenever the game loses focus or the player switches to another browser tab.
* @type {PauseScreen}
*/
private _pauseScreen;
public pauseScreen;
/**
* This will be displayed whenever the device is turned to an unsupported orientation.
* @type {OrientationScreen}
*/
public orientationScreen;
/**
* Bound of this stage.
@ -155,8 +163,9 @@ module Phaser {
*/
public boot() {
this._bootScreen = new BootScreen(this._game);
this._pauseScreen = new PauseScreen(this._game, this.width, this.height);
this.bootScreen = new BootScreen(this._game);
this.pauseScreen = new PauseScreen(this._game, this.width, this.height);
this.orientationScreen = new OrientationScreen(this._game);
}
@ -174,16 +183,23 @@ module Phaser {
this.context.clearRect(0, 0, this.width, this.height);
}
if (this._game.isRunning == false && this.disableBootScreen == false)
if (this._game.paused && this.scale.incorrectOrientation)
{
this._bootScreen.update();
this._bootScreen.render();
this.orientationScreen.update();
this.orientationScreen.render();
return;
}
if (this._game.paused == true && this.disablePauseScreen == false)
if (this._game.isRunning == false && this.disableBootScreen == false)
{
this._pauseScreen.update();
this._pauseScreen.render();
this.bootScreen.update();
this.bootScreen.render();
}
if (this._game.paused && this.disablePauseScreen == false)
{
this.pauseScreen.update();
this.pauseScreen.render();
}
}
@ -215,9 +231,35 @@ module Phaser {
}
public enableOrientationCheck(forceLandscape: bool, forcePortrait: bool, imageKey?: string = '') {
this.scale.forceLandscape = forceLandscape;
this.scale.forcePortrait = forcePortrait;
this.orientationScreen.enable(forceLandscape, forcePortrait, imageKey);
if (forceLandscape || forcePortrait)
{
if ((this.scale.isLandscape && forcePortrait) || (this.scale.isPortrait && forceLandscape))
{
// They are in the wrong orientation right now
this._game.paused = true;
this.scale.incorrectOrientation = true;
}
else
{
this.scale.incorrectOrientation = false;
}
}
}
public pauseGame() {
this._pauseScreen.onPaused();
if (this.disablePauseScreen == false)
{
this.pauseScreen.onPaused();
}
this.saveCanvasValues();
this._game.paused = true;
@ -225,7 +267,11 @@ module Phaser {
public resumeGame() {
this._pauseScreen.onResume();
if (this.disablePauseScreen == false)
{
this.pauseScreen.onResume();
}
this.restoreCanvasValues();
this._game.paused = false;
@ -234,7 +280,7 @@ module Phaser {
/**
* Get the DOM offset values of the given element
*/
private getOffset(element): Point {
public getOffset(element, populateOffset: bool = true): Point {
var box = element.getBoundingClientRect();
@ -243,7 +289,15 @@ module Phaser {
var scrollTop = window.pageYOffset || element.scrollTop || document.body.scrollTop;
var scrollLeft = window.pageXOffset || element.scrollLeft || document.body.scrollLeft;
return new Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
if (populateOffset)
{
this.offset = new Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
return this.offset;
}
else
{
return new Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
}
}
@ -289,10 +343,11 @@ module Phaser {
public set backgroundColor(color: string) {
this.canvas.style.backgroundColor = color;
this._backgroundColor = color;
}
public get backgroundColor(): string {
return this._bgColor;
return this._backgroundColor;
}
public get x(): number {

View file

@ -22,7 +22,7 @@ module Phaser {
*/
constructor(x: number, y: number, width: number, height: number, name: string) {
console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
//console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
this.x = x;
this.y = y;

View file

@ -258,7 +258,7 @@ module Phaser.Components {
}
else
{
return RectangleUtils.contains(this._sprite.frameBounds, pointer.x, pointer.y);
return RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY);
}
}
@ -279,10 +279,10 @@ module Phaser.Components {
}
else if (this._pointerData[pointer.id].isOver == true)
{
if (RectangleUtils.contains(this._sprite.frameBounds, pointer.x, pointer.y))
if (RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY))
{
this._pointerData[pointer.id].x = pointer.x - this._sprite.x;
this._pointerData[pointer.id].y = pointer.y - this._sprite.y;
this._pointerData[pointer.id].x = pointer.scaledX - this._sprite.x;
this._pointerData[pointer.id].y = pointer.scaledY - this._sprite.y;
return true;
}
else
@ -335,9 +335,11 @@ module Phaser.Components {
public _touchedHandler(pointer: Pointer): bool {
console.log('touched handler', this._pointerData[pointer.id]);
if (this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true)
{
console.log('touchDown on', this._sprite.texture.cacheKey,this._sprite.frameName, this._sprite.frameBounds.width,this._sprite.frameBounds.height);
//console.log('touchDown on', this._sprite.texture.cacheKey,this._sprite.frameName, this._sprite.frameBounds.width,this._sprite.frameBounds.height);
this._pointerData[pointer.id].isDown = true;
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
@ -360,6 +362,8 @@ module Phaser.Components {
public _releasedHandler(pointer: Pointer) {
console.log('release handler');
// If was previously touched by this Pointer, check if still is
if (this._pointerData[pointer.id].isDown && pointer.isUp)
{
@ -674,13 +678,13 @@ module Phaser.Components {
*/
public renderDebugInfo(x: number, y: number, color?: string = 'rgb(255,255,255)') {
this._sprite.texture.context.font = '14px Courier';
this._sprite.texture.context.font = '16px Courier';
this._sprite.texture.context.fillStyle = color;
this._sprite.texture.context.fillText('Sprite Input: (' + this._sprite.frameBounds.width + ' x ' + this._sprite.frameBounds.height + ')', x, y);
this._sprite.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
this._sprite.texture.context.fillText('x: ' + this.pointerX(1).toFixed(1) + ' y: ' + this.pointerY(1).toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver(1) + ' duration: ' + this.overDuration(1).toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown(1) + ' duration: ' + this.downDuration(1).toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver(1) + ' just out: ' + this.justOut(1), x, y + 56);
}

View file

@ -513,17 +513,9 @@ module Phaser {
if (this.pointer10) { this.pointer10.reset(); }
this.currentPointers = 0;
for (var i = 0; i < this.totalTrackedObjects; i++)
{
this.inputObjects[i].input.reset();
}
this._game.stage.canvas.style.cursor = "default";
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
if (hard == true)
{
this.onDown.dispose();
@ -535,6 +527,14 @@ module Phaser {
this.onUp = new Phaser.Signal();
this.onTap = new Phaser.Signal();
this.onHold = new Phaser.Signal();
for (var i = 0; i < this.totalTrackedObjects; i++)
{
this.inputObjects[i].input.reset();
}
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
}
}
@ -904,7 +904,7 @@ module Phaser {
*/
public renderDebugInfo(x: number, y: number, color?: string = 'rgb(255,255,255)') {
this._game.stage.context.font = '14px Courier';
this._game.stage.context.font = '24px Courier';
this._game.stage.context.fillStyle = color;
this._game.stage.context.fillText('Input', x, y);
this._game.stage.context.fillText('Screen X: ' + this.x + ' Screen Y: ' + this.y, x, y + 14);

View file

@ -13,6 +13,7 @@ module Phaser {
constructor(game: Game) {
this._game = game;
this.callbackContext = this._game;
}
@ -34,6 +35,15 @@ module Phaser {
*/
public disabled: bool = false;
/**
* Custom callback useful for hooking into a 3rd party library. Will be passed the mouse event as the only parameter.
* Callbacks are fired even if this component is disabled and before the event propagation is disabled.
*/
public callbackContext;
public mouseDownCallback = null;
public mouseMoveCallback = null;
public mouseUpCallback = null;
/**
* Starts the event listeners running
* @method start
@ -51,6 +61,11 @@ module Phaser {
*/
public onMouseDown(event: MouseEvent) {
if (this.mouseDownCallback)
{
this.mouseDownCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;
@ -67,6 +82,11 @@ module Phaser {
*/
public onMouseMove(event: MouseEvent) {
if (this.mouseMoveCallback)
{
this.mouseMoveCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;
@ -83,6 +103,11 @@ module Phaser {
*/
public onMouseUp(event: MouseEvent) {
if (this.mouseUpCallback)
{
this.mouseUpCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;

View file

@ -282,6 +282,22 @@ module Phaser {
}
/**
* Gets the X value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
public get scaledX():number {
return Math.floor(this.x * this.game.input.scaleX);
}
/**
* Gets the Y value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
public get scaledY():number {
return Math.floor(this.y * this.game.input.scaleY);
}
/**
* Called when the Pointer is pressed onto the touchscreen
* @method start
@ -298,7 +314,7 @@ module Phaser {
}
// Fix to stop rogue browser plugins from blocking the visibility state event
if (this.game.paused == true)
if (this.game.paused == true && this.game.stage.scale.incorrectOrientation == false)
{
this.game.stage.resumeGame();
return this;
@ -495,11 +511,9 @@ module Phaser {
}
}
//console.log('pointer move', _highestRenderID);
if (_highestRenderObject !== -1)
{
console.log('setting target');
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
@ -650,6 +664,12 @@ module Phaser {
this._holdSent = false;
this._history.length = 0;
this._stateReset = true;
if (this.targetObject)
{
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
}

View file

@ -23,6 +23,7 @@ module Phaser {
constructor(game: Game) {
this._game = game;
this.callbackContext = this._game;
}
@ -40,6 +41,18 @@ module Phaser {
*/
public disabled: bool = false;
/**
* Custom callback useful for hooking into a 3rd party library. Will be passed the touch event as the only parameter.
* Callbacks are fired even if this component is disabled and before the event propogation is disabled.
*/
public callbackContext;
public touchStartCallback = null;
public touchMoveCallback = null;
public touchEndCallback = null;
public touchEnterCallback = null;
public touchLeaveCallback = null;
public touchCancelCallback = null;
/**
* Starts the event listeners running
* @method start
@ -78,6 +91,11 @@ module Phaser {
**/
private onTouchStart(event) {
if (this.touchStartCallback)
{
this.touchStartCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;
@ -103,6 +121,11 @@ module Phaser {
**/
private onTouchCancel(event) {
if (this.touchCancelCallback)
{
this.touchCancelCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;
@ -127,6 +150,11 @@ module Phaser {
**/
private onTouchEnter(event) {
if (this.touchEnterCallback)
{
this.touchEnterCallback.call(this.callbackContext, event);
}
if (this._game.input.disabled || this.disabled)
{
return;
@ -136,7 +164,7 @@ module Phaser {
for (var i = 0; i < event.changedTouches.length; i++)
{
console.log('touch enter');
//console.log('touch enter');
}
}
@ -149,11 +177,16 @@ module Phaser {
**/
private onTouchLeave(event) {
if (this.touchLeaveCallback)
{
this.touchLeaveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for (var i = 0; i < event.changedTouches.length; i++)
{
console.log('touch leave');
//console.log('touch leave');
}
}
@ -165,6 +198,11 @@ module Phaser {
**/
private onTouchMove(event) {
if (this.touchMoveCallback)
{
this.touchMoveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for (var i = 0; i < event.changedTouches.length; i++)
@ -181,6 +219,11 @@ module Phaser {
**/
private onTouchEnd(event) {
if (this.touchEndCallback)
{
this.touchEndCallback.call(this.callbackContext, event);
}
event.preventDefault();
// For touch end its a list of the touch points that have been removed from the surface

View file

@ -38,6 +38,9 @@ module Phaser {
}
}
this.scaleFactor = new Vec2(1, 1);
this.aspectRatio = 0;
window.addEventListener('orientationchange', (event) => this.checkOrientation(event), false);
window.addEventListener('resize', (event) => this.checkResize(event), false);
@ -74,6 +77,24 @@ module Phaser {
*/
public static SHOW_ALL: number = 2;
/**
* If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @type {Boolean}
*/
public forceLandscape: bool = false;
/**
* If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @type {Boolean}
*/
public forcePortrait: bool = false;
/**
* 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.
* @type {Boolean}
*/
public incorrectOrientation: bool = false;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
@ -113,23 +134,36 @@ module Phaser {
public height: number = 0;
/**
* Window orientation angle (90 and -90 are landscape, 0 is portrait)
* Asperct ratio of the scaled game size (width / height)
* @type {number}
*/
public aspectRatio: number;
/**
* The scale factor of the scaled game width
* @type {Vec2}
*/
public scaleFactor: Vec2;
/**
* Window orientation angle (90 and -90 are landscape, 0 and 80 are portrait)
* @type {number}
*/
public orientation: number;
/**
* A Signal that is dispatched when the device enters landscape mode from portrait
* A Signal that is dispatched when the device enters landscape orientation from portrait
* @type {Signal}
*/
public enterLandscape: Phaser.Signal;
/**
* A Signal that is dispatched when the device enters portrait mode from landscape
* A Signal that is dispatched when the device enters portrait orientation from landscape
* @type {Signal}
*/
public enterPortrait: Phaser.Signal;
// Full Screen API calls
public get isFullScreen(): bool {
if (document['fullscreenElement'] === null|| document['mozFullScreenElement'] === null|| document['webkitFullscreenElement'] === null)
@ -192,10 +226,41 @@ module Phaser {
this.refresh();
}
if (this.forceLandscape || this.forcePortrait)
{
this.checkOrientationState();
}
}
private checkOrientationState() {
// 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.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.refresh();
}
}
}
public get isPortrait(): bool {
return this.orientation == 0;
return this.orientation == 0 || this.orientation == 180;
}
public get isLandscape(): bool {
@ -211,11 +276,11 @@ module Phaser {
if (this.isLandscape)
{
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
}
else
{
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if (this._game.stage.scaleMode !== StageScaleMode.NO_SCALE)
@ -241,11 +306,11 @@ module Phaser {
if (this.isLandscape)
{
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
}
else
{
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if (this._game.stage.scaleMode !== StageScaleMode.NO_SCALE)
@ -281,6 +346,7 @@ module Phaser {
{
this._iterations = 40;
this._check = window.setInterval(() => this.setScreenSize(), 10);
this.setScreenSize();
}
}
@ -309,49 +375,20 @@ module Phaser {
// Set minimum height of content to new window height
document.documentElement.style.minHeight = window.innerHeight + 'px';
if (this._game.stage.scaleMode == StageScaleMode.EXACT_FIT)
if (this.incorrectOrientation == true)
{
if (this.maxWidth && window.innerWidth > this.maxWidth)
{
this.width = this.maxWidth;
}
else
{
this.width = window.innerWidth;
}
if (this.maxHeight && window.innerHeight > this.maxHeight)
{
this.height = this.maxHeight;
}
else
{
this.height = window.innerHeight;
}
this.setMaximum();
}
else if (this._game.stage.scaleMode == StageScaleMode.EXACT_FIT)
{
this.setExactFit();
}
else if (this._game.stage.scaleMode == StageScaleMode.SHOW_ALL)
{
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
if (this.maxWidth && this.width > this.maxWidth)
{
this.width = this.maxWidth;
}
if (this.maxHeight && this.height > this.maxHeight)
{
this.height = this.maxHeight;
}
this.setShowAll();
}
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
this.setSize();
clearInterval(this._check);
@ -361,6 +398,82 @@ module Phaser {
}
private setSize() {
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.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
this._game.stage.getOffset(this._game.stage.canvas);
this.aspectRatio = this.width / this.height;
this.scaleFactor.x = this._game.stage.width / this.width;
this.scaleFactor.y = this._game.stage.height / this.height;
//this.scaleFactor.x = this.width / this._game.stage.width;
//this.scaleFactor.y = this.height / this._game.stage.height;
}
private setMaximum() {
this.width = window.innerWidth;
this.height = window.innerHeight;
}
private setShowAll() {
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
}
private setExactFit() {
if (this.maxWidth && window.innerWidth > this.maxWidth)
{
this.width = this.maxWidth;
}
else
{
this.width = window.innerWidth;
}
if (this.maxHeight && window.innerHeight > this.maxHeight)
{
this.height = this.maxHeight;
}
else
{
this.height = window.innerHeight;
}
}
}
}

View file

@ -0,0 +1,79 @@
/// <reference path="../../Game.ts" />
/**
* Phaser - OrientationScreen
*
* The Orientation Screen is displayed whenever the device is turned to an unsupported orientation.
*/
module Phaser {
export class OrientationScreen {
/**
* OrientationScreen constructor
* Create a new <code>OrientationScreen</code> with specific width and height.
*
* @param width {number} Screen canvas width.
* @param height {number} Screen canvas height.
*/
constructor(game: Game) {
this.game = game;
}
/**
* Local reference to game.
*/
public game: Game;
private _showOnLandscape: bool = false;
private _showOnPortrait: bool = false;
/**
* Landscape Image. If you only want your game to work in Portrait mode, and display an image when in Landscape,
* then set this to be the key of an image previously loaded into the Game.Cache.
* @type {Cache Reference}
*/
public landscapeImage;
/**
* Portrait Image. If you only want your game to work in Landscape mode, and display an image when in Portrait,
* then set this to be the key of an image previously loaded into the Game.Cache.
* @type {Cache Reference}
*/
public portraitImage;
public enable(onLandscape: bool, onPortrait: bool, imageKey: string) {
this._showOnLandscape = onLandscape;
this._showOnPortrait = onPortrait;
this.landscapeImage = this.game.cache.getImage(imageKey);
this.portraitImage = this.game.cache.getImage(imageKey);
}
/**
* Update
*/
public update() {
}
/**
* Render
*/
public render() {
if (this._showOnLandscape)
{
this.game.stage.context.drawImage(this.landscapeImage, 0, 0, this.landscapeImage.width, this.landscapeImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
}
else if (this._showOnPortrait)
{
this.game.stage.context.drawImage(this.portraitImage, 0, 0, this.portraitImage.width, this.portraitImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
}
}
}
}

View file

@ -44,7 +44,7 @@ TODO:
* Added JSON Texture Atlas object support.
* Bug in AnimationManager set frame/frameName - the width/height are trimmed and wrong
* RenderOrderID won't work across cameras - but then neither do Pointers yet anyway
* Swap to using time based motion (like the tweens) rather than delta timer - it just doesn't work well on slow phones
V1.0.0
@ -82,6 +82,15 @@ V1.0.0
* Fixed issue in Camera.inCamera check where it wouldn't take into consideration the Sprites scrollFactor.
* Fixed issue with JSON Atlas loader incorrectly parsing the frames array.
* Fixed bug in FrameData.getFrameByName where the first frame of the array would always be skipped.
* Fixed bug where the Stage.backgroundColor property wasn't being saved correctly.
* Made Stage.bootScreen and Stage.pauseScreen public so you can override them with your own States now.
* Added the new OrientationScreen and Stage.enableOrientationCheck to allow for easy 'portrait/landscape only' game handling.
* Added fix to StageScaleMode for 180 degree portrait orientation on iPad.
* Added fix to orientation check so that it updates the input offsets correctly on rotation.
* Added support for minWidth and minHeight to game scale size, so it can never go below those values when scaling.
* Vastly improved orientation detection and response speed.
* Added custom callback support for all Touch and Mouse Events so you can easily hook events to custom APIs.

View file

@ -115,6 +115,10 @@
<Content Include="input\world drag.js">
<DependentUpon>world drag.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="mobile\sprite test 1.ts" />
<Content Include="mobile\sprite test 1.js">
<DependentUpon>sprite test 1.ts</DependentUpon>
</Content>
<Content Include="particles\graphic emitter.js">
<DependentUpon>graphic emitter.ts</DependentUpon>
</Content>

View file

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1 maximum-scale=1 user-scalable=0" />
<title>Phaser Mobile Fullscreen Test</title>
<style>
body {
padding: 0;
margin: 0;
}
</style>
<script src="../phaser.js"></script>
</head>
<body>
<div id="game"></div>
<script type="text/javascript">
var myGame = new Game(this, 'game', 320, 200, init, create, update);
function init() {
myGame.stage.fullscreen.go();
myGame.loader.addImageFile('backdrop1', '../assets/pics/atari_fujilogo.png');
myGame.loader.addImageFile('backdrop2', '../assets/pics/acryl_bladerunner.png');
myGame.loader.load();
}
var pic1;
var pic2;
function create() {
pic1 = myGame.createSprite(0, 0, 'backdrop1');
pic2 = myGame.createSprite(0, 0, 'backdrop2');
}
function update() {
if (myGame.stage.fullscreen.isLandscape == true)
{
pic1.visible = true;
pic2.visible = false;
}
else
{
pic2.visible = true;
pic1.visible = false;
}
}
</script>
</body>
</html>

View file

@ -0,0 +1,48 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 320, 400, init, create);
var emitter;
function init() {
game.loader.addImageFile('backdrop1', 'assets/pics/atari_fujilogo.png');
game.loader.addImageFile('backdrop2', 'assets/pics/acryl_bladerunner.png');
game.loader.addImageFile('jet', 'assets/sprites/carrot.png');
game.loader.load();
// This can help a lot on crappy old Android phones :)
//game.framerate = 30;
game.stage.backgroundColor = 'rgb(0,0,0)';
//game.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
game.stage.scaleMode = Phaser.StageScaleMode.EXACT_FIT;
//game.stage.scaleMode = Phaser.StageScaleMode.NO_SCALE;
}
var pic1;
var pic2;
function create() {
console.log('created now');
game.stage.enableOrientationCheck(false, true, 'backdrop2');
pic1 = game.add.sprite(0, 0, 'backdrop1');
pic2 = game.add.sprite(0, 0, 'backdrop2');
// Creates a basic emitter, bursting out 50 default sprites (i.e. 16x16 white boxes)
emitter = game.add.emitter(game.stage.centerX, game.stage.centerY);
emitter.makeParticles('jet', 50, false, 0);
emitter.setRotation(0, 0);
emitter.start(false, 10, 0.1);
// Make sure the camera doesn't clip anything
game.camera.disableClipping = true;
game.stage.scale.enterLandscape.add(goneLandscape, this);
game.stage.scale.enterPortrait.add(gonePortrait, this);
game.onRenderCallback = render;
}
function goneLandscape() {
pic1.visible = true;
pic2.visible = false;
}
function gonePortrait() {
pic1.visible = false;
pic2.visible = true;
}
function render() {
game.stage.context.fillStyle = 'rgb(255,0,0)';
game.stage.context.font = '20px Arial';
//game.stage.context.fillText("ttc: " + game._raf.timeToCall.toString(), 0, 64);
}
})();

View file

@ -0,0 +1,77 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 320, 400, init, create);
var emitter: Phaser.Emitter;
function init() {
game.loader.addImageFile('backdrop1', 'assets/pics/atari_fujilogo.png');
game.loader.addImageFile('backdrop2', 'assets/pics/acryl_bladerunner.png');
game.loader.addImageFile('jet', 'assets/sprites/carrot.png');
game.loader.load();
// This can help a lot on crappy old Android phones :)
//game.framerate = 30;
game.stage.backgroundColor = 'rgb(0,0,0)';
//game.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
game.stage.scaleMode = Phaser.StageScaleMode.EXACT_FIT;
//game.stage.scaleMode = Phaser.StageScaleMode.NO_SCALE;
}
var pic1;
var pic2;
function create() {
console.log('created now');
game.stage.enableOrientationCheck(false, true, 'backdrop2');
pic1 = game.add.sprite(0, 0, 'backdrop1');
pic2 = game.add.sprite(0, 0, 'backdrop2');
// Creates a basic emitter, bursting out 50 default sprites (i.e. 16x16 white boxes)
emitter = game.add.emitter(game.stage.centerX, game.stage.centerY);
emitter.makeParticles('jet', 50, false, 0);
emitter.setRotation(0, 0);
emitter.start(false, 10, 0.1);
// Make sure the camera doesn't clip anything
game.camera.disableClipping = true;
game.stage.scale.enterLandscape.add(goneLandscape, this);
game.stage.scale.enterPortrait.add(gonePortrait, this);
game.onRenderCallback = render;
}
function goneLandscape() {
pic1.visible = true;
pic2.visible = false;
}
function gonePortrait() {
pic1.visible = false;
pic2.visible = true;
}
function render() {
game.stage.context.fillStyle = 'rgb(255,0,0)';
game.stage.context.font = '20px Arial';
//game.stage.context.fillText("ttc: " + game._raf.timeToCall.toString(), 0, 64);
}
})();

62
Tests/mobile/test1.html Normal file
View file

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1 maximum-scale=1 user-scalable=0" />
<title>Phaser Mobile Fullscreen Test</title>
<style>
body {
padding: 0;
margin: 0;
}
</style>
<script src="../phaser.js"></script>
</head>
<body>
<div id="game"></div>
<script type="text/javascript">
var myGame = new Phaser.Game(this, 'game', 320, 200, init, create, update);
function init() {
myGame.loader.addImageFile('backdrop1', '../assets/pics/atari_fujilogo.png');
myGame.loader.addImageFile('backdrop2', '../assets/pics/acryl_bladerunner.png');
myGame.loader.load();
}
var pic1;
var pic2;
function create() {
console.log('create ttt');
pic1 = myGame.add.sprite(0, 0, 'backdrop1');
//pic2 = myGame.add.sprite(0, 0, 'backdrop2');
}
function update() {
// if (myGame.stage.fullscreen.isLandscape == true)
// {
// pic1.visible = true;
// pic2.visible = false;
// }
// else
// {
// pic2.visible = true;
// pic1.visible = false;
// }
}
</script>
</body>
</html>

View file

@ -4357,7 +4357,7 @@ var Phaser;
* Either cw or ccw, rotation is always 90 degrees.
*/
this.rotationDirection = 'cw';
console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
//console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
this.x = x;
this.y = y;
this.width = width;
@ -6267,6 +6267,13 @@ var Phaser;
this.game.input.removeGameObject(this._sprite);
}
};
Input.prototype.checkPointerOver = function (pointer) {
if(this.enabled == false || this._sprite.visible == false) {
return false;
} else {
return Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY);
}
};
Input.prototype.update = /**
* Update
*/
@ -6275,44 +6282,51 @@ var Phaser;
return false;
}
if(this.draggable && this._draggedPointerID == pointer.id) {
this.updateDrag(pointer);
return this.updateDrag(pointer);
} else if(this._pointerData[pointer.id].isOver == true) {
if(Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY)) {
this._pointerData[pointer.id].x = pointer.scaledX - this._sprite.x;
this._pointerData[pointer.id].y = pointer.scaledY - this._sprite.y;
return true;
} else {
this._pointOutHandler(pointer);
return false;
}
}
if(Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.x, pointer.y)) {
// { id: i, x: 0, y: 0, isDown: false, isUp: false, isOver: false, isOut: false, timeOver: 0, timeOut: 0, isDragged: false }
};
Input.prototype._pointerOverHandler = function (pointer) {
// { id: i, x: 0, y: 0, isDown: false, isUp: false, isOver: false, isOut: false, timeOver: 0, timeOut: 0, isDragged: false }
if(this._pointerData[pointer.id].isOver == false) {
this._pointerData[pointer.id].isOver = true;
this._pointerData[pointer.id].isOut = false;
this._pointerData[pointer.id].timeOver = this.game.time.now;
this._pointerData[pointer.id].x = pointer.x - this._sprite.x;
this._pointerData[pointer.id].y = pointer.y - this._sprite.y;
if(this._pointerData[pointer.id].isOver == false) {
this._pointerData[pointer.id].isOver = true;
this._pointerData[pointer.id].isOut = false;
this._pointerData[pointer.id].timeOver = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "pointer";
}
this._sprite.events.onInputOver.dispatch(this._sprite, pointer);
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "pointer";
}
return true;
} else {
if(this._pointerData[pointer.id].isOver) {
this._pointerData[pointer.id].isOver = false;
this._pointerData[pointer.id].isOut = true;
this._pointerData[pointer.id].timeOut = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this._sprite.events.onInputOut.dispatch(this._sprite, pointer);
}
return false;
this._sprite.events.onInputOver.dispatch(this._sprite, pointer);
}
};
Input.prototype._pointOutHandler = function (pointer) {
this._pointerData[pointer.id].isOver = false;
this._pointerData[pointer.id].isOut = true;
this._pointerData[pointer.id].timeOut = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this._sprite.events.onInputOut.dispatch(this._sprite, pointer);
};
Input.prototype._touchedHandler = function (pointer) {
if(this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true) {
console.log('touchDown on', this._sprite.texture.cacheKey, this._sprite.frameBounds.width, this._sprite.frameBounds.height);
//console.log('touchDown on', this._sprite.texture.cacheKey,this._sprite.frameName, this._sprite.frameBounds.width,this._sprite.frameBounds.height);
this._pointerData[pointer.id].isDown = true;
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this._sprite.events.onInputDown.dispatch(this._sprite, pointer);
// Start drag
if(this.draggable && this.isDragged == false && pointer.draggedObject == null) {
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
if(this.draggable && this.isDragged == false) {
this.startDrag(pointer);
}
}
@ -6342,7 +6356,7 @@ var Phaser;
function (pointer) {
if(pointer.isUp) {
this.stopDrag(pointer);
return;
return false;
}
if(this.allowHorizontalDrag) {
this._sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
@ -6360,6 +6374,7 @@ var Phaser;
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
}
return true;
};
Input.prototype.justOver = /**
* Returns true if the pointer has entered the Sprite within the specified delay time (defaults to 500ms, half a second)
@ -6477,8 +6492,8 @@ var Phaser;
} else {
this._dragPoint.setTo(this._sprite.x - pointer.x, this._sprite.y - pointer.y);
}
pointer.draggedObject = this._sprite;
};
//pointer.draggedObject = this._sprite;
};
Input.prototype.stopDrag = /**
* Called by Pointer when drag is stopped on this Sprite. Should not usually be called directly.
*/
@ -6490,8 +6505,8 @@ var Phaser;
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
}
pointer.draggedObject = null;
};
//pointer.draggedObject = null;
};
Input.prototype.setDragLock = /**
* Restricts this sprite to drag movement only on the given axis. Note: If both are set to false the sprite will never move!
*
@ -6569,10 +6584,10 @@ var Phaser;
this._sprite.texture.context.font = '14px Courier';
this._sprite.texture.context.fillStyle = color;
this._sprite.texture.context.fillText('Sprite Input: (' + this._sprite.frameBounds.width + ' x ' + this._sprite.frameBounds.height + ')', x, y);
this._sprite.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
this._sprite.texture.context.fillText('x: ' + this.pointerX(1).toFixed(1) + ' y: ' + this.pointerY(1).toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver(1) + ' duration: ' + this.overDuration(1).toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown(1) + ' duration: ' + this.downDuration(1).toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver(1) + ' just out: ' + this.justOut(1), x, y + 56);
};
return Input;
})();
@ -7148,6 +7163,10 @@ var Phaser;
*/
this.z = 0;
/**
* Render iteration
*/
this.renderOrderID = 0;
/**
* This value is added to the angle of the Sprite.
* For example if you had a sprite graphic drawn facing straight up then you could set
* angleOffset to 90 and it would correspond correctly with Phasers right-handed coordinate system.
@ -10663,6 +10682,21 @@ var Phaser;
*/
this._startHeight = 0;
/**
* If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @type {Boolean}
*/
this.forceLandscape = false;
/**
* If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @type {Boolean}
*/
this.forcePortrait = false;
/**
* 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.
* @type {Boolean}
*/
this.incorrectOrientation = false;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
*/
@ -10717,7 +10751,8 @@ var Phaser;
StageScaleMode.NO_SCALE = 1;
StageScaleMode.SHOW_ALL = 2;
Object.defineProperty(StageScaleMode.prototype, "isFullScreen", {
get: function () {
get: // Full Screen API calls
function () {
if(document['fullscreenElement'] === null || document['mozFullScreenElement'] === null || document['webkitFullscreenElement'] === null) {
return false;
}
@ -10755,10 +10790,33 @@ var Phaser;
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE && (window.innerWidth !== this.width || window.innerHeight !== this.height)) {
this.refresh();
}
if(this.forceLandscape || this.forcePortrait) {
this.checkOrientationState();
}
};
StageScaleMode.prototype.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._game.input.reset();
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._game.input.reset();
this.refresh();
}
}
};
Object.defineProperty(StageScaleMode.prototype, "isPortrait", {
get: function () {
return this.orientation == 0;
return this.orientation == 0 || this.orientation == 180;
},
enumerable: true,
configurable: true
@ -10776,9 +10834,9 @@ var Phaser;
function (event) {
this.orientation = window['orientation'];
if(this.isLandscape) {
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
} else {
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE) {
this.refresh();
@ -10794,9 +10852,9 @@ var Phaser;
this.orientation = 0;
}
if(this.isLandscape) {
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
} else {
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE) {
this.refresh();
@ -10822,6 +10880,7 @@ var Phaser;
this._check = window.setInterval(function () {
return _this.setScreenSize();
}, 10);
this.setScreenSize();
}
};
StageScaleMode.prototype.setScreenSize = /**
@ -10839,36 +10898,56 @@ var Phaser;
if(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._game.stage.scaleMode == StageScaleMode.EXACT_FIT) {
if(this.maxWidth && window.innerWidth > this.maxWidth) {
this.width = this.maxWidth;
} else {
this.width = window.innerWidth;
}
if(this.maxHeight && window.innerHeight > this.maxHeight) {
this.height = this.maxHeight;
} else {
this.height = window.innerHeight;
}
if(this.incorrectOrientation == true) {
this.setMaximum();
} else if(this._game.stage.scaleMode == StageScaleMode.EXACT_FIT) {
this.setExactFit();
} else if(this._game.stage.scaleMode == StageScaleMode.SHOW_ALL) {
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
if(this.maxWidth && this.width > this.maxWidth) {
this.width = this.maxWidth;
}
if(this.maxHeight && this.height > this.maxHeight) {
this.height = this.maxHeight;
}
this.setShowAll();
}
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
clearInterval(this._check);
this._check = null;
}
};
StageScaleMode.prototype.setMaximum = function () {
this.width = window.innerWidth;
this.height = window.innerHeight;
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
};
StageScaleMode.prototype.setShowAll = function () {
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
if(this.maxWidth && this.width > this.maxWidth) {
this.width = this.maxWidth;
}
if(this.maxHeight && this.height > this.maxHeight) {
this.height = this.maxHeight;
}
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
};
StageScaleMode.prototype.setExactFit = function () {
if(this.maxWidth && window.innerWidth > this.maxWidth) {
this.width = this.maxWidth;
} else {
this.width = window.innerWidth;
}
if(this.maxHeight && window.innerHeight > this.maxHeight) {
this.height = this.maxHeight;
} else {
this.height = window.innerHeight;
}
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
};
return StageScaleMode;
})();
Phaser.StageScaleMode = StageScaleMode;
@ -11081,11 +11160,60 @@ var Phaser;
})();
Phaser.PauseScreen = PauseScreen;
})(Phaser || (Phaser = {}));
/// <reference path="../../Game.ts" />
/**
* Phaser - OrientationScreen
*
* The Orientation Screen is displayed whenever the device is turned to an unsupported orientation.
*/
var Phaser;
(function (Phaser) {
var OrientationScreen = (function () {
/**
* OrientationScreen constructor
* Create a new <code>OrientationScreen</code> with specific width and height.
*
* @param width {number} Screen canvas width.
* @param height {number} Screen canvas height.
*/
function OrientationScreen(game) {
this._showOnLandscape = false;
this._showOnPortrait = false;
this.game = game;
}
OrientationScreen.prototype.enable = function (onLandscape, onPortrait, imageKey) {
this._showOnLandscape = onLandscape;
this._showOnPortrait = onPortrait;
this.landscapeImage = this.game.cache.getImage(imageKey);
this.portraitImage = this.game.cache.getImage(imageKey);
};
OrientationScreen.prototype.update = /**
* Update
*/
function () {
};
OrientationScreen.prototype.render = /**
* Render
*/
function () {
if(this._showOnLandscape) {
this.game.stage.context.drawImage(this.landscapeImage, 0, 0, this.landscapeImage.width, this.landscapeImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
} else if(this._showOnPortrait) {
this.game.stage.context.drawImage(this.portraitImage, 0, 0, this.portraitImage.width, this.portraitImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
}
//this.game.stage.context.font = '32px Arial';
//this.game.stage.context.fillText('w: ' + this.game.stage.width + ' h: ' + this.game.stage.height, 32, 32);
};
return OrientationScreen;
})();
Phaser.OrientationScreen = OrientationScreen;
})(Phaser || (Phaser = {}));
/// <reference path="Phaser.ts" />
/// <reference path="Game.ts" />
/// <reference path="system/StageScaleMode.ts" />
/// <reference path="system/screens/BootScreen.ts" />
/// <reference path="system/screens/PauseScreen.ts" />
/// <reference path="system/screens/OrientationScreen.ts" />
/**
* Phaser - Stage
*
@ -11107,10 +11235,10 @@ var Phaser;
function Stage(game, parent, width, height) {
var _this = this;
/**
* Background color of the stage (defaults to black)
* Background color of the stage (defaults to black). Set via the public backgroundColor property.
* @type {string}
*/
this._bgColor = 'rgb(0,0,0)';
this._backgroundColor = 'rgb(0,0,0)';
/**
* Clear the whole stage every frame? (Default to true)
* @type {boolean}
@ -11169,9 +11297,12 @@ var Phaser;
* Stage boot
*/
function () {
this._bootScreen = new Phaser.BootScreen(this._game);
this._pauseScreen = new Phaser.PauseScreen(this._game, this.width, this.height);
};
this.bootScreen = new Phaser.BootScreen(this._game);
this.pauseScreen = new Phaser.PauseScreen(this._game, this.width, this.height);
this.orientationScreen = new Phaser.OrientationScreen(this._game);
//this.scale.enterLandscape.add(this.orientationChange, this);
//this.scale.enterPortrait.add(this.orientationChange, this);
};
Stage.prototype.update = /**
* Update stage for rendering. This will handle scaling, clearing
* and PauseScreen/BootScreen updating and rendering.
@ -11182,13 +11313,18 @@ var Phaser;
// implement dirty rect? could take up more cpu time than it saves. needs benching.
this.context.clearRect(0, 0, this.width, this.height);
}
if(this._game.isRunning == false && this.disableBootScreen == false) {
this._bootScreen.update();
this._bootScreen.render();
if(this._game.paused && this.scale.incorrectOrientation) {
this.orientationScreen.update();
this.orientationScreen.render();
return;
}
if(this._game.paused == true && this.disablePauseScreen == false) {
this._pauseScreen.update();
this._pauseScreen.render();
if(this._game.isRunning == false && this.disableBootScreen == false) {
this.bootScreen.update();
this.bootScreen.render();
}
if(this._game.paused && this.disablePauseScreen == false) {
this.pauseScreen.update();
this.pauseScreen.render();
}
};
Stage.prototype.visibilityChange = /**
@ -11208,13 +11344,52 @@ var Phaser;
}
}
};
Stage.prototype.enableOrientationCheck = /**
* This method is called when the device orientation changes.
*/
/*
private orientationChange(format: number, landscape: bool, portrait: bool) {
if (this.scale.forceLandscape && portrait)
{
this._game.paused = true;
this.scale.incorrectOrientation = true;
}
else if (this.scale.forcePortrait && landscape)
{
this._game.paused = true;
this.scale.incorrectOrientation = true;
}
else if ((this.scale.forceLandscape && landscape) || (this.scale.forcePortrait && portrait))
{
this._game.paused = false;
this.scale.incorrectOrientation = false;
}
}
*/
function (forceLandscape, forcePortrait, imageKey) {
if (typeof imageKey === "undefined") { imageKey = ''; }
this.scale.forceLandscape = forceLandscape;
this.scale.forcePortrait = forcePortrait;
this.orientationScreen.enable(forceLandscape, forcePortrait, imageKey);
if(forceLandscape || forcePortrait) {
if((this.scale.isLandscape && forcePortrait) || (this.scale.isPortrait && forceLandscape)) {
// They are in the wrong orientation right now
this._game.paused = true;
this.scale.incorrectOrientation = true;
} else {
this.scale.incorrectOrientation = false;
}
}
};
Stage.prototype.pauseGame = function () {
this._pauseScreen.onPaused();
this.pauseScreen.onPaused();
this.saveCanvasValues();
this._game.paused = true;
};
Stage.prototype.resumeGame = function () {
this._pauseScreen.onResume();
this.pauseScreen.onResume();
this.restoreCanvasValues();
this._game.paused = false;
};
@ -11247,10 +11422,11 @@ var Phaser;
};
Object.defineProperty(Stage.prototype, "backgroundColor", {
get: function () {
return this._bgColor;
return this._backgroundColor;
},
set: function (color) {
this.canvas.style.backgroundColor = color;
this._backgroundColor = color;
},
enumerable: true,
configurable: true
@ -13963,6 +14139,12 @@ var Phaser;
* @type {Number}
**/
this.totalTouches = 0;
/**
* The Game Object this Pointer is currently over / touching / dragging.
* @property targetObject
* @type {Any}
**/
this.targetObject = null;
this.game = game;
this.id = id;
this.active = false;
@ -14004,6 +14186,28 @@ var Phaser;
if (typeof camera === "undefined") { camera = this.game.camera; }
return camera.worldView.y + this.y;
};
Object.defineProperty(Pointer.prototype, "scaledX", {
get: /**
* Gets the X value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
function () {
return Math.floor(this.x * this.game.input.scaleX);
},
enumerable: true,
configurable: true
});
Object.defineProperty(Pointer.prototype, "scaledY", {
get: /**
* Gets the Y value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
function () {
return Math.floor(this.y * this.game.input.scaleY);
},
enumerable: true,
configurable: true
});
Pointer.prototype.start = /**
* Called when the Pointer is pressed onto the touchscreen
* @method start
@ -14021,14 +14225,14 @@ var Phaser;
return this;
}
this._history.length = 0;
this.move(event);
this.positionDown.setTo(this.x, this.y);
this.active = true;
this.withinGame = true;
this.isDown = true;
this.isUp = false;
this.timeDown = this.game.time.now;
this._holdSent = false;
this.positionDown.setTo(this.x, this.y);
this.move(event);
if(this.game.input.multiInputOverride == Phaser.Input.MOUSE_OVERRIDES_TOUCH || this.game.input.multiInputOverride == Phaser.Input.MOUSE_TOUCH_COMBINE || (this.game.input.multiInputOverride == Phaser.Input.TOUCH_OVERRIDES_MOUSE && this.game.input.currentPointers == 0)) {
this.game.input.x = this.x * this.game.input.scaleX;
this.game.input.y = this.y * this.game.input.scaleY;
@ -14039,6 +14243,31 @@ var Phaser;
if(this.isMouse == false) {
this.game.input.currentPointers++;
}
// Build our temporary click stack
/*
var _highestPriority = 0;
var _highestRenderID = 0;
var _highestRenderObject: number = -1;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID)
{
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
}
}
if (_highestRenderObject !== -1 && this._stateReset == false)
{
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
this.targetObject.input._touchedHandler(this);
//_highestRenderObject.input._touchedHandler(this);
}
*/
if(this.targetObject !== null) {
this.targetObject.input._touchedHandler(this);
}
return this;
};
Pointer.prototype.update = function () {
@ -14062,25 +14291,47 @@ var Phaser;
}
// Iterate through the tracked objects
// Build our temporary click stack
/*
var _highestPriority = 0;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.enabled) {
if(this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].input.priorityID > _highestPriority) {
_highestPriority = this.game.input.inputObjects[i].input.priorityID;
}
}
var _highestRenderID = 0;
var _highestRenderObject = null;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i].input.enabled)
{
//if (this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].input.priorityID > _highestPriority)
if (this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID)
{
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = this.game.input.inputObjects[i];
}
if(this.isDown && this._stateReset == false) {
// Now update all objects with the highest priority ID (can be more than 1)
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.priorityID == _highestPriority) {
if(this.game.input.inputObjects[i].input._touchedHandler(this) == false) {
return;
}
}
if (_highestRenderObject !== null)
{
_highestRenderObject.input._pointerOverHandler(this);
if (this.isDown && this._stateReset == false)
{
_highestRenderObject.input._touchedHandler(this);
}
// Now update all objects with the highest priority ID (can be more than 1)
//for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
//{
// if (this.game.input.inputObjects[i].input.priorityID == _highestPriority)
// {
// if (this.game.input.inputObjects[i].input._touchedHandler(this) == false)
// {
// return;
// }
// }
//}
}
*/
}
}
}
}
}
};
Pointer.prototype.move = /**
* Called when the Pointer is moved on the touchscreen
@ -14109,6 +14360,27 @@ var Phaser;
this.game.input.circle.x = this.game.input.x;
this.game.input.circle.y = this.game.input.y;
}
if(this.targetObject !== null) {
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// Build our temporary click stack
var _highestRenderID = 0;
var _highestRenderObject = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID) {
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
}
}
//console.log('pointer move', _highestRenderID);
if(_highestRenderObject !== -1) {
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
}
return this;
};
Pointer.prototype.leave = /**
@ -14161,7 +14433,10 @@ var Phaser;
this.game.input.inputObjects[i].input._releasedHandler(this);
}
}
this.draggedObject = null;
if(this.targetObject) {
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
return this;
};
Pointer.prototype.justPressed = /**
@ -14207,6 +14482,7 @@ var Phaser;
this._holdSent = false;
this._history.length = 0;
this._stateReset = true;
this.targetObject = null;
};
Pointer.prototype.renderDebug = /**
* Renders the Pointer.circle object onto the stage in green if down or red if up.
@ -14402,7 +14678,11 @@ var Phaser;
* @type {Boolean}
*/
this.disabled = false;
this.mouseDownCallback = null;
this.mouseMoveCallback = null;
this.mouseUpCallback = null;
this._game = game;
this.callbackContext = this._game;
}
Mouse.LEFT_BUTTON = 0;
Mouse.MIDDLE_BUTTON = 1;
@ -14427,6 +14707,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseDownCallback) {
this.mouseDownCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14437,6 +14720,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseMoveCallback) {
this.mouseMoveCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14447,6 +14733,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseUpCallback) {
this.mouseUpCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14735,7 +15024,14 @@ var Phaser;
* @type {Boolean}
*/
this.disabled = false;
this.touchStartCallback = null;
this.touchMoveCallback = null;
this.touchEndCallback = null;
this.touchEnterCallback = null;
this.touchLeaveCallback = null;
this.touchCancelCallback = null;
this._game = game;
this.callbackContext = this._game;
}
Touch.prototype.start = /**
* Starts the event listeners running
@ -14781,6 +15077,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchStartCallback) {
this.touchStartCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14799,6 +15098,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchCancelCallback) {
this.touchCancelCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14816,6 +15118,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchEnterCallback) {
this.touchEnterCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14831,6 +15136,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchLeaveCallback) {
this.touchLeaveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for(var i = 0; i < event.changedTouches.length; i++) {
console.log('touch leave');
@ -14842,6 +15150,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchMoveCallback) {
this.touchMoveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for(var i = 0; i < event.changedTouches.length; i++) {
this._game.input.updatePointer(event.changedTouches[i]);
@ -14853,6 +15164,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchEndCallback) {
this.touchEndCallback.call(this.callbackContext, event);
}
event.preventDefault();
// For touch end its a list of the touch points that have been removed from the surface
// https://developer.mozilla.org/en-US/docs/DOM/TouchList
@ -15463,7 +15777,7 @@ var Phaser;
*/
function (x, y, color) {
if (typeof color === "undefined") { color = 'rgb(255,255,255)'; }
this._game.stage.context.font = '14px Courier';
this._game.stage.context.font = '24px Courier';
this._game.stage.context.fillStyle = color;
this._game.stage.context.fillText('Input', x, y);
this._game.stage.context.fillText('Screen X: ' + this.x + ' Screen Y: ' + this.y, x, y + 14);
@ -15639,6 +15953,7 @@ var Phaser;
if(sprite.scale.x == 0 || sprite.scale.y == 0 || sprite.texture.alpha < 0.1 || this.inCamera(camera, sprite) == false) {
return false;
}
sprite.renderOrderID = this._count;
this._count++;
// Reset our temp vars
this._ga = -1;

138
build/phaser.d.ts vendored
View file

@ -3619,10 +3619,13 @@ module Phaser.Components {
public start(priority?: number, checkBody?: bool, useHandCursor?: bool): Sprite;
public reset(): void;
public stop(): void;
public checkPointerOver(pointer: Pointer): bool;
/**
* Update
*/
public update(pointer: Pointer): bool;
public _pointerOverHandler(pointer: Pointer): void;
public _pointOutHandler(pointer: Pointer): void;
public consumePointerEvent: bool;
public _touchedHandler(pointer: Pointer): bool;
public _releasedHandler(pointer: Pointer): void;
@ -4139,6 +4142,10 @@ module Phaser {
*/
public z: number;
/**
* Render iteration
*/
public renderOrderID: number;
/**
* This value is added to the angle of the Sprite.
* For example if you had a sprite graphic drawn facing straight up then you could set
* angleOffset to 90 and it would correspond correctly with Phasers right-handed coordinate system.
@ -6077,6 +6084,21 @@ module Phaser {
*/
static SHOW_ALL: number;
/**
* If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @type {Boolean}
*/
public forceLandscape: bool;
/**
* If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @type {Boolean}
*/
public forcePortrait: bool;
/**
* 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.
* @type {Boolean}
*/
public incorrectOrientation: bool;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
*/
@ -6109,17 +6131,27 @@ module Phaser {
*/
public height: number;
/**
* Window orientation angle (90 and -90 are landscape, 0 is portrait)
* Asperct ratio of the scaled game size (width / height)
* @type {number}
*/
public aspectRatio: number;
/**
* The scale factor of the scaled game width
* @type {Vec2}
*/
public scaleFactor: Vec2;
/**
* Window orientation angle (90 and -90 are landscape, 0 and 80 are portrait)
* @type {number}
*/
public orientation: number;
/**
* A Signal that is dispatched when the device enters landscape mode from portrait
* A Signal that is dispatched when the device enters landscape orientation from portrait
* @type {Signal}
*/
public enterLandscape: Signal;
/**
* A Signal that is dispatched when the device enters portrait mode from landscape
* A Signal that is dispatched when the device enters portrait orientation from landscape
* @type {Signal}
*/
public enterPortrait: Signal;
@ -6130,6 +6162,7 @@ module Phaser {
* The core update loop, called by Phaser.Stage
*/
public update(): void;
private checkOrientationState();
public isPortrait : bool;
public isLandscape : bool;
/**
@ -6148,6 +6181,10 @@ module Phaser {
* Set screen size automatically based on the scaleMode.
*/
private setScreenSize();
private setSize();
private setMaximum();
private setShowAll();
private setExactFit();
}
}
/**
@ -6269,6 +6306,50 @@ module Phaser {
}
}
/**
* Phaser - OrientationScreen
*
* The Orientation Screen is displayed whenever the device is turned to an unsupported orientation.
*/
module Phaser {
class OrientationScreen {
/**
* OrientationScreen constructor
* Create a new <code>OrientationScreen</code> with specific width and height.
*
* @param width {number} Screen canvas width.
* @param height {number} Screen canvas height.
*/
constructor(game: Game);
/**
* Local reference to game.
*/
public game: Game;
private _showOnLandscape;
private _showOnPortrait;
/**
* Landscape Image. If you only want your game to work in Portrait mode, and display an image when in Landscape,
* then set this to be the key of an image previously loaded into the Game.Cache.
* @type {Cache Reference}
*/
public landscapeImage;
/**
* Portrait Image. If you only want your game to work in Landscape mode, and display an image when in Portrait,
* then set this to be the key of an image previously loaded into the Game.Cache.
* @type {Cache Reference}
*/
public portraitImage;
public enable(onLandscape: bool, onPortrait: bool, imageKey: string): void;
/**
* Update
*/
public update(): void;
/**
* Render
*/
public render(): void;
}
}
/**
* Phaser - Stage
*
* The Stage is the canvas on which everything is displayed. This class handles display within the web browser, focus handling,
@ -6291,20 +6372,25 @@ module Phaser {
*/
private _game;
/**
* Background color of the stage (defaults to black)
* Background color of the stage (defaults to black). Set via the public backgroundColor property.
* @type {string}
*/
private _bgColor;
private _backgroundColor;
/**
* This will be displayed when Phaser is started without any default functions or State
* @type {BootScreen}
*/
private _bootScreen;
public bootScreen;
/**
* This will be displayed whenever the game loses focus or the player switches to another browser tab.
* @type {PauseScreen}
*/
private _pauseScreen;
public pauseScreen;
/**
* This will be displayed whenever the device is turned to an unsupported orientation.
* @type {OrientationScreen}
*/
public orientationScreen;
/**
* Bound of this stage.
* @type {Rectangle}
@ -6371,12 +6457,13 @@ module Phaser {
* This method is called when the canvas elements visibility is changed.
*/
private visibilityChange(event);
public enableOrientationCheck(forceLandscape: bool, forcePortrait: bool, imageKey?: string): void;
public pauseGame(): void;
public resumeGame(): void;
/**
* Get the DOM offset values of the given element
*/
private getOffset(element);
public getOffset(element, populateOffset?: bool): Point;
/**
* Canvas strokeStyle.
* @type {string}
@ -7536,11 +7623,11 @@ module Phaser {
**/
public duration : number;
/**
* The Game Object this Pointer is currently dragging.
* @property draggedObject
* The Game Object this Pointer is currently over / touching / dragging.
* @property targetObject
* @type {Any}
**/
public draggedObject;
public targetObject;
/**
* Gets the X value of this Pointer in world coordinate space
* @param {Camera} [camera]
@ -7552,6 +7639,16 @@ module Phaser {
*/
public getWorldY(camera?: Camera): number;
/**
* Gets the X value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
public scaledX : number;
/**
* Gets the Y value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
public scaledY : number;
/**
* Called when the Pointer is pressed onto the touchscreen
* @method start
* @param {Any} event
@ -7723,6 +7820,14 @@ module Phaser {
*/
public disabled: bool;
/**
* Custom callback useful for hooking into a 3rd party library. Will be passed the mouse event as the only parameter.
* Callbacks are fired even if this component is disabled and before the event propagation is disabled.
*/
public callbackContext;
public mouseDownCallback;
public mouseMoveCallback;
public mouseUpCallback;
/**
* Starts the event listeners running
* @method start
*/
@ -7934,6 +8039,17 @@ module Phaser {
*/
public disabled: bool;
/**
* Custom callback useful for hooking into a 3rd party library. Will be passed the touch event as the only parameter.
* Callbacks are fired even if this component is disabled and before the event propogation is disabled.
*/
public callbackContext;
public touchStartCallback;
public touchMoveCallback;
public touchEndCallback;
public touchEnterCallback;
public touchLeaveCallback;
public touchCancelCallback;
/**
* Starts the event listeners running
* @method start
*/

View file

@ -4357,7 +4357,7 @@ var Phaser;
* Either cw or ccw, rotation is always 90 degrees.
*/
this.rotationDirection = 'cw';
console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
//console.log('Creating Frame', name, 'x', x, 'y', y, 'width', width, 'height', height);
this.x = x;
this.y = y;
this.width = width;
@ -6267,6 +6267,13 @@ var Phaser;
this.game.input.removeGameObject(this._sprite);
}
};
Input.prototype.checkPointerOver = function (pointer) {
if(this.enabled == false || this._sprite.visible == false) {
return false;
} else {
return Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY);
}
};
Input.prototype.update = /**
* Update
*/
@ -6275,44 +6282,52 @@ var Phaser;
return false;
}
if(this.draggable && this._draggedPointerID == pointer.id) {
this.updateDrag(pointer);
}
if(Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.x, pointer.y)) {
// { id: i, x: 0, y: 0, isDown: false, isUp: false, isOver: false, isOut: false, timeOver: 0, timeOut: 0, isDragged: false }
this._pointerData[pointer.id].x = pointer.x - this._sprite.x;
this._pointerData[pointer.id].y = pointer.y - this._sprite.y;
if(this._pointerData[pointer.id].isOver == false) {
this._pointerData[pointer.id].isOver = true;
this._pointerData[pointer.id].isOut = false;
this._pointerData[pointer.id].timeOver = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "pointer";
}
this._sprite.events.onInputOver.dispatch(this._sprite, pointer);
return this.updateDrag(pointer);
} else if(this._pointerData[pointer.id].isOver == true) {
if(Phaser.RectangleUtils.contains(this._sprite.frameBounds, pointer.scaledX, pointer.scaledY)) {
this._pointerData[pointer.id].x = pointer.scaledX - this._sprite.x;
this._pointerData[pointer.id].y = pointer.scaledY - this._sprite.y;
return true;
} else {
this._pointOutHandler(pointer);
return false;
}
return true;
} else {
if(this._pointerData[pointer.id].isOver) {
this._pointerData[pointer.id].isOver = false;
this._pointerData[pointer.id].isOut = true;
this._pointerData[pointer.id].timeOut = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this._sprite.events.onInputOut.dispatch(this._sprite, pointer);
}
return false;
}
};
Input.prototype._pointerOverHandler = function (pointer) {
// { id: i, x: 0, y: 0, isDown: false, isUp: false, isOver: false, isOut: false, timeOver: 0, timeOut: 0, isDragged: false }
if(this._pointerData[pointer.id].isOver == false) {
this._pointerData[pointer.id].isOver = true;
this._pointerData[pointer.id].isOut = false;
this._pointerData[pointer.id].timeOver = this.game.time.now;
this._pointerData[pointer.id].x = pointer.x - this._sprite.x;
this._pointerData[pointer.id].y = pointer.y - this._sprite.y;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "pointer";
}
this._sprite.events.onInputOver.dispatch(this._sprite, pointer);
}
};
Input.prototype._pointOutHandler = function (pointer) {
this._pointerData[pointer.id].isOver = false;
this._pointerData[pointer.id].isOut = true;
this._pointerData[pointer.id].timeOut = this.game.time.now;
if(this.useHandCursor && this._pointerData[pointer.id].isDragged == false) {
this.game.stage.canvas.style.cursor = "default";
}
this._sprite.events.onInputOut.dispatch(this._sprite, pointer);
};
Input.prototype._touchedHandler = function (pointer) {
console.log('touched handler', this._pointerData[pointer.id]);
if(this._pointerData[pointer.id].isDown == false && this._pointerData[pointer.id].isOver == true) {
console.log('touchDown on', this._sprite.texture.cacheKey, this._sprite.frameBounds.width, this._sprite.frameBounds.height);
//console.log('touchDown on', this._sprite.texture.cacheKey,this._sprite.frameName, this._sprite.frameBounds.width,this._sprite.frameBounds.height);
this._pointerData[pointer.id].isDown = true;
this._pointerData[pointer.id].isUp = false;
this._pointerData[pointer.id].timeDown = this.game.time.now;
this._sprite.events.onInputDown.dispatch(this._sprite, pointer);
// Start drag
if(this.draggable && this.isDragged == false && pointer.draggedObject == null) {
//if (this.draggable && this.isDragged == false && pointer.targetObject == null)
if(this.draggable && this.isDragged == false) {
this.startDrag(pointer);
}
}
@ -6320,6 +6335,7 @@ var Phaser;
return this.consumePointerEvent;
};
Input.prototype._releasedHandler = function (pointer) {
console.log('release handler');
// If was previously touched by this Pointer, check if still is
if(this._pointerData[pointer.id].isDown && pointer.isUp) {
this._pointerData[pointer.id].isDown = false;
@ -6342,7 +6358,7 @@ var Phaser;
function (pointer) {
if(pointer.isUp) {
this.stopDrag(pointer);
return;
return false;
}
if(this.allowHorizontalDrag) {
this._sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
@ -6360,6 +6376,7 @@ var Phaser;
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
}
return true;
};
Input.prototype.justOver = /**
* Returns true if the pointer has entered the Sprite within the specified delay time (defaults to 500ms, half a second)
@ -6477,8 +6494,8 @@ var Phaser;
} else {
this._dragPoint.setTo(this._sprite.x - pointer.x, this._sprite.y - pointer.y);
}
pointer.draggedObject = this._sprite;
};
//pointer.draggedObject = this._sprite;
};
Input.prototype.stopDrag = /**
* Called by Pointer when drag is stopped on this Sprite. Should not usually be called directly.
*/
@ -6490,8 +6507,8 @@ var Phaser;
this._sprite.x = Math.floor(this._sprite.x / this.snapX) * this.snapX;
this._sprite.y = Math.floor(this._sprite.y / this.snapY) * this.snapY;
}
pointer.draggedObject = null;
};
//pointer.draggedObject = null;
};
Input.prototype.setDragLock = /**
* Restricts this sprite to drag movement only on the given axis. Note: If both are set to false the sprite will never move!
*
@ -6566,13 +6583,13 @@ var Phaser;
*/
function (x, y, color) {
if (typeof color === "undefined") { color = 'rgb(255,255,255)'; }
this._sprite.texture.context.font = '14px Courier';
this._sprite.texture.context.font = '16px Courier';
this._sprite.texture.context.fillStyle = color;
this._sprite.texture.context.fillText('Sprite Input: (' + this._sprite.frameBounds.width + ' x ' + this._sprite.frameBounds.height + ')', x, y);
this._sprite.texture.context.fillText('x: ' + this.pointerX().toFixed(1) + ' y: ' + this.pointerY().toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver() + ' duration: ' + this.overDuration().toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown() + ' duration: ' + this.downDuration().toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver() + ' just out: ' + this.justOut(), x, y + 56);
this._sprite.texture.context.fillText('x: ' + this.pointerX(1).toFixed(1) + ' y: ' + this.pointerY(1).toFixed(1), x, y + 14);
this._sprite.texture.context.fillText('over: ' + this.pointerOver(1) + ' duration: ' + this.overDuration(1).toFixed(0), x, y + 28);
this._sprite.texture.context.fillText('down: ' + this.pointerDown(1) + ' duration: ' + this.downDuration(1).toFixed(0), x, y + 42);
this._sprite.texture.context.fillText('just over: ' + this.justOver(1) + ' just out: ' + this.justOut(1), x, y + 56);
};
return Input;
})();
@ -7148,6 +7165,10 @@ var Phaser;
*/
this.z = 0;
/**
* Render iteration
*/
this.renderOrderID = 0;
/**
* This value is added to the angle of the Sprite.
* For example if you had a sprite graphic drawn facing straight up then you could set
* angleOffset to 90 and it would correspond correctly with Phasers right-handed coordinate system.
@ -10663,6 +10684,21 @@ var Phaser;
*/
this._startHeight = 0;
/**
* If the game should be forced to use Landscape mode, this is set to true by Game.Stage
* @type {Boolean}
*/
this.forceLandscape = false;
/**
* If the game should be forced to use Portrait mode, this is set to true by Game.Stage
* @type {Boolean}
*/
this.forcePortrait = false;
/**
* 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.
* @type {Boolean}
*/
this.incorrectOrientation = false;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
*/
@ -10706,6 +10742,8 @@ var Phaser;
this.orientation = 0;
}
}
this.scaleFactor = new Phaser.Vec2(1, 1);
this.aspectRatio = 0;
window.addEventListener('orientationchange', function (event) {
return _this.checkOrientation(event);
}, false);
@ -10717,7 +10755,8 @@ var Phaser;
StageScaleMode.NO_SCALE = 1;
StageScaleMode.SHOW_ALL = 2;
Object.defineProperty(StageScaleMode.prototype, "isFullScreen", {
get: function () {
get: // Full Screen API calls
function () {
if(document['fullscreenElement'] === null || document['mozFullScreenElement'] === null || document['webkitFullscreenElement'] === null) {
return false;
}
@ -10755,10 +10794,31 @@ var Phaser;
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE && (window.innerWidth !== this.width || window.innerHeight !== this.height)) {
this.refresh();
}
if(this.forceLandscape || this.forcePortrait) {
this.checkOrientationState();
}
};
StageScaleMode.prototype.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.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.refresh();
}
}
};
Object.defineProperty(StageScaleMode.prototype, "isPortrait", {
get: function () {
return this.orientation == 0;
return this.orientation == 0 || this.orientation == 180;
},
enumerable: true,
configurable: true
@ -10776,9 +10836,9 @@ var Phaser;
function (event) {
this.orientation = window['orientation'];
if(this.isLandscape) {
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
} else {
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE) {
this.refresh();
@ -10794,9 +10854,9 @@ var Phaser;
this.orientation = 0;
}
if(this.isLandscape) {
this.enterLandscape.dispatch(this.orientation);
this.enterLandscape.dispatch(this.orientation, true, false);
} else {
this.enterPortrait.dispatch(this.orientation);
this.enterPortrait.dispatch(this.orientation, false, true);
}
if(this._game.stage.scaleMode !== StageScaleMode.NO_SCALE) {
this.refresh();
@ -10822,6 +10882,7 @@ var Phaser;
this._check = window.setInterval(function () {
return _this.setScreenSize();
}, 10);
this.setScreenSize();
}
};
StageScaleMode.prototype.setScreenSize = /**
@ -10839,36 +10900,63 @@ var Phaser;
if(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._game.stage.scaleMode == StageScaleMode.EXACT_FIT) {
if(this.maxWidth && window.innerWidth > this.maxWidth) {
this.width = this.maxWidth;
} else {
this.width = window.innerWidth;
}
if(this.maxHeight && window.innerHeight > this.maxHeight) {
this.height = this.maxHeight;
} else {
this.height = window.innerHeight;
}
if(this.incorrectOrientation == true) {
this.setMaximum();
} else if(this._game.stage.scaleMode == StageScaleMode.EXACT_FIT) {
this.setExactFit();
} else if(this._game.stage.scaleMode == StageScaleMode.SHOW_ALL) {
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
if(this.maxWidth && this.width > this.maxWidth) {
this.width = this.maxWidth;
}
if(this.maxHeight && this.height > this.maxHeight) {
this.height = this.maxHeight;
}
this.setShowAll();
}
this._game.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
this.setSize();
clearInterval(this._check);
this._check = null;
}
};
StageScaleMode.prototype.setSize = function () {
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.stage.canvas.style.width = this.width + 'px';
this._game.stage.canvas.style.height = this.height + 'px';
this._game.input.scaleX = this._game.stage.width / this.width;
this._game.input.scaleY = this._game.stage.height / this.height;
this._game.stage.getOffset(this._game.stage.canvas);
this.aspectRatio = this.width / this.height;
this.scaleFactor.x = this._game.stage.width / this.width;
this.scaleFactor.y = this._game.stage.height / this.height;
//this.scaleFactor.x = this.width / this._game.stage.width;
//this.scaleFactor.y = this.height / this._game.stage.height;
};
StageScaleMode.prototype.setMaximum = function () {
this.width = window.innerWidth;
this.height = window.innerHeight;
};
StageScaleMode.prototype.setShowAll = function () {
var multiplier = Math.min((window.innerHeight / this._game.stage.height), (window.innerWidth / this._game.stage.width));
this.width = Math.round(this._game.stage.width * multiplier);
this.height = Math.round(this._game.stage.height * multiplier);
};
StageScaleMode.prototype.setExactFit = function () {
if(this.maxWidth && window.innerWidth > this.maxWidth) {
this.width = this.maxWidth;
} else {
this.width = window.innerWidth;
}
if(this.maxHeight && window.innerHeight > this.maxHeight) {
this.height = this.maxHeight;
} else {
this.height = window.innerHeight;
}
};
return StageScaleMode;
})();
Phaser.StageScaleMode = StageScaleMode;
@ -11081,11 +11169,58 @@ var Phaser;
})();
Phaser.PauseScreen = PauseScreen;
})(Phaser || (Phaser = {}));
/// <reference path="../../Game.ts" />
/**
* Phaser - OrientationScreen
*
* The Orientation Screen is displayed whenever the device is turned to an unsupported orientation.
*/
var Phaser;
(function (Phaser) {
var OrientationScreen = (function () {
/**
* OrientationScreen constructor
* Create a new <code>OrientationScreen</code> with specific width and height.
*
* @param width {number} Screen canvas width.
* @param height {number} Screen canvas height.
*/
function OrientationScreen(game) {
this._showOnLandscape = false;
this._showOnPortrait = false;
this.game = game;
}
OrientationScreen.prototype.enable = function (onLandscape, onPortrait, imageKey) {
this._showOnLandscape = onLandscape;
this._showOnPortrait = onPortrait;
this.landscapeImage = this.game.cache.getImage(imageKey);
this.portraitImage = this.game.cache.getImage(imageKey);
};
OrientationScreen.prototype.update = /**
* Update
*/
function () {
};
OrientationScreen.prototype.render = /**
* Render
*/
function () {
if(this._showOnLandscape) {
this.game.stage.context.drawImage(this.landscapeImage, 0, 0, this.landscapeImage.width, this.landscapeImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
} else if(this._showOnPortrait) {
this.game.stage.context.drawImage(this.portraitImage, 0, 0, this.portraitImage.width, this.portraitImage.height, 0, 0, this.game.stage.width, this.game.stage.height);
}
};
return OrientationScreen;
})();
Phaser.OrientationScreen = OrientationScreen;
})(Phaser || (Phaser = {}));
/// <reference path="Phaser.ts" />
/// <reference path="Game.ts" />
/// <reference path="system/StageScaleMode.ts" />
/// <reference path="system/screens/BootScreen.ts" />
/// <reference path="system/screens/PauseScreen.ts" />
/// <reference path="system/screens/OrientationScreen.ts" />
/**
* Phaser - Stage
*
@ -11107,10 +11242,10 @@ var Phaser;
function Stage(game, parent, width, height) {
var _this = this;
/**
* Background color of the stage (defaults to black)
* Background color of the stage (defaults to black). Set via the public backgroundColor property.
* @type {string}
*/
this._bgColor = 'rgb(0,0,0)';
this._backgroundColor = 'rgb(0,0,0)';
/**
* Clear the whole stage every frame? (Default to true)
* @type {boolean}
@ -11132,7 +11267,7 @@ var Phaser;
this.canvas = document.createElement('canvas');
this.canvas.width = width;
this.canvas.height = height;
if(document.getElementById(parent)) {
if((parent !== '' || parent !== null) && document.getElementById(parent)) {
document.getElementById(parent).appendChild(this.canvas);
document.getElementById(parent).style.overflow = 'hidden';
} else {
@ -11147,11 +11282,11 @@ var Phaser;
event.preventDefault();
};
this.context = this.canvas.getContext('2d');
this.offset = this.getOffset(this.canvas);
this.bounds = new Phaser.Rectangle(this.offset.x, this.offset.y, width, height);
this.aspectRatio = width / height;
this.scaleMode = Phaser.StageScaleMode.NO_SCALE;
this.scale = new Phaser.StageScaleMode(this._game);
this.getOffset(this.canvas);
this.bounds = new Phaser.Rectangle(this.offset.x, this.offset.y, width, height);
this.aspectRatio = width / height;
document.addEventListener('visibilitychange', function (event) {
return _this.visibilityChange(event);
}, false);
@ -11169,8 +11304,9 @@ var Phaser;
* Stage boot
*/
function () {
this._bootScreen = new Phaser.BootScreen(this._game);
this._pauseScreen = new Phaser.PauseScreen(this._game, this.width, this.height);
this.bootScreen = new Phaser.BootScreen(this._game);
this.pauseScreen = new Phaser.PauseScreen(this._game, this.width, this.height);
this.orientationScreen = new Phaser.OrientationScreen(this._game);
};
Stage.prototype.update = /**
* Update stage for rendering. This will handle scaling, clearing
@ -11182,13 +11318,18 @@ var Phaser;
// implement dirty rect? could take up more cpu time than it saves. needs benching.
this.context.clearRect(0, 0, this.width, this.height);
}
if(this._game.isRunning == false && this.disableBootScreen == false) {
this._bootScreen.update();
this._bootScreen.render();
if(this._game.paused && this.scale.incorrectOrientation) {
this.orientationScreen.update();
this.orientationScreen.render();
return;
}
if(this._game.paused == true && this.disablePauseScreen == false) {
this._pauseScreen.update();
this._pauseScreen.render();
if(this._game.isRunning == false && this.disableBootScreen == false) {
this.bootScreen.update();
this.bootScreen.render();
}
if(this._game.paused && this.disablePauseScreen == false) {
this.pauseScreen.update();
this.pauseScreen.render();
}
};
Stage.prototype.visibilityChange = /**
@ -11208,26 +11349,51 @@ var Phaser;
}
}
};
Stage.prototype.enableOrientationCheck = function (forceLandscape, forcePortrait, imageKey) {
if (typeof imageKey === "undefined") { imageKey = ''; }
this.scale.forceLandscape = forceLandscape;
this.scale.forcePortrait = forcePortrait;
this.orientationScreen.enable(forceLandscape, forcePortrait, imageKey);
if(forceLandscape || forcePortrait) {
if((this.scale.isLandscape && forcePortrait) || (this.scale.isPortrait && forceLandscape)) {
// They are in the wrong orientation right now
this._game.paused = true;
this.scale.incorrectOrientation = true;
} else {
this.scale.incorrectOrientation = false;
}
}
};
Stage.prototype.pauseGame = function () {
this._pauseScreen.onPaused();
if(this.disablePauseScreen == false) {
this.pauseScreen.onPaused();
}
this.saveCanvasValues();
this._game.paused = true;
};
Stage.prototype.resumeGame = function () {
this._pauseScreen.onResume();
if(this.disablePauseScreen == false) {
this.pauseScreen.onResume();
}
this.restoreCanvasValues();
this._game.paused = false;
};
Stage.prototype.getOffset = /**
* Get the DOM offset values of the given element
*/
function (element) {
function (element, populateOffset) {
if (typeof populateOffset === "undefined") { populateOffset = true; }
var box = element.getBoundingClientRect();
var clientTop = element.clientTop || document.body.clientTop || 0;
var clientLeft = element.clientLeft || document.body.clientLeft || 0;
var scrollTop = window.pageYOffset || element.scrollTop || document.body.scrollTop;
var scrollLeft = window.pageXOffset || element.scrollLeft || document.body.scrollLeft;
return new Phaser.Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
if(populateOffset) {
this.offset = new Phaser.Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
return this.offset;
} else {
return new Phaser.Point(box.left + scrollLeft - clientLeft, box.top + scrollTop - clientTop);
}
};
Stage.prototype.saveCanvasValues = /**
* Save current canvas properties (strokeStyle, lineWidth and fillStyle) for later using.
@ -11247,10 +11413,11 @@ var Phaser;
};
Object.defineProperty(Stage.prototype, "backgroundColor", {
get: function () {
return this._bgColor;
return this._backgroundColor;
},
set: function (color) {
this.canvas.style.backgroundColor = color;
this._backgroundColor = color;
},
enumerable: true,
configurable: true
@ -13963,6 +14130,12 @@ var Phaser;
* @type {Number}
**/
this.totalTouches = 0;
/**
* The Game Object this Pointer is currently over / touching / dragging.
* @property targetObject
* @type {Any}
**/
this.targetObject = null;
this.game = game;
this.id = id;
this.active = false;
@ -14004,6 +14177,28 @@ var Phaser;
if (typeof camera === "undefined") { camera = this.game.camera; }
return camera.worldView.y + this.y;
};
Object.defineProperty(Pointer.prototype, "scaledX", {
get: /**
* Gets the X value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
function () {
return Math.floor(this.x * this.game.input.scaleX);
},
enumerable: true,
configurable: true
});
Object.defineProperty(Pointer.prototype, "scaledY", {
get: /**
* Gets the Y value of this Pointer in world coordinate space
* @param {Camera} [camera]
*/
function () {
return Math.floor(this.y * this.game.input.scaleY);
},
enumerable: true,
configurable: true
});
Pointer.prototype.start = /**
* Called when the Pointer is pressed onto the touchscreen
* @method start
@ -14016,19 +14211,19 @@ var Phaser;
this.button = event.button;
}
// Fix to stop rogue browser plugins from blocking the visibility state event
if(this.game.paused == true) {
if(this.game.paused == true && this.game.stage.scale.incorrectOrientation == false) {
this.game.stage.resumeGame();
return this;
}
this._history.length = 0;
this.move(event);
this.positionDown.setTo(this.x, this.y);
this.active = true;
this.withinGame = true;
this.isDown = true;
this.isUp = false;
this.timeDown = this.game.time.now;
this._holdSent = false;
this.positionDown.setTo(this.x, this.y);
this.move(event);
if(this.game.input.multiInputOverride == Phaser.Input.MOUSE_OVERRIDES_TOUCH || this.game.input.multiInputOverride == Phaser.Input.MOUSE_TOUCH_COMBINE || (this.game.input.multiInputOverride == Phaser.Input.TOUCH_OVERRIDES_MOUSE && this.game.input.currentPointers == 0)) {
this.game.input.x = this.x * this.game.input.scaleX;
this.game.input.y = this.y * this.game.input.scaleY;
@ -14039,6 +14234,31 @@ var Phaser;
if(this.isMouse == false) {
this.game.input.currentPointers++;
}
// Build our temporary click stack
/*
var _highestPriority = 0;
var _highestRenderID = 0;
var _highestRenderObject: number = -1;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID)
{
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
}
}
if (_highestRenderObject !== -1 && this._stateReset == false)
{
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
this.targetObject.input._touchedHandler(this);
//_highestRenderObject.input._touchedHandler(this);
}
*/
if(this.targetObject !== null) {
this.targetObject.input._touchedHandler(this);
}
return this;
};
Pointer.prototype.update = function () {
@ -14062,25 +14282,47 @@ var Phaser;
}
// Iterate through the tracked objects
// Build our temporary click stack
/*
var _highestPriority = 0;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.enabled) {
if(this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].input.priorityID > _highestPriority) {
_highestPriority = this.game.input.inputObjects[i].input.priorityID;
}
}
var _highestRenderID = 0;
var _highestRenderObject = null;
for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
{
if (this.game.input.inputObjects[i].input.enabled)
{
//if (this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].input.priorityID > _highestPriority)
if (this.game.input.inputObjects[i].input.update(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID)
{
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = this.game.input.inputObjects[i];
}
if(this.isDown && this._stateReset == false) {
// Now update all objects with the highest priority ID (can be more than 1)
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.priorityID == _highestPriority) {
if(this.game.input.inputObjects[i].input._touchedHandler(this) == false) {
return;
}
}
if (_highestRenderObject !== null)
{
_highestRenderObject.input._pointerOverHandler(this);
if (this.isDown && this._stateReset == false)
{
_highestRenderObject.input._touchedHandler(this);
}
// Now update all objects with the highest priority ID (can be more than 1)
//for (var i = 0; i < this.game.input.totalTrackedObjects; i++)
//{
// if (this.game.input.inputObjects[i].input.priorityID == _highestPriority)
// {
// if (this.game.input.inputObjects[i].input._touchedHandler(this) == false)
// {
// return;
// }
// }
//}
}
*/
}
}
}
}
}
};
Pointer.prototype.move = /**
* Called when the Pointer is moved on the touchscreen
@ -14109,6 +14351,26 @@ var Phaser;
this.game.input.circle.x = this.game.input.x;
this.game.input.circle.y = this.game.input.y;
}
if(this.targetObject !== null) {
if(this.targetObject.input.update(this) == false) {
this.targetObject = null;
}
} else {
// Build our temporary click stack
var _highestRenderID = 0;
var _highestRenderObject = -1;
for(var i = 0; i < this.game.input.totalTrackedObjects; i++) {
if(this.game.input.inputObjects[i].input.checkPointerOver(this) && this.game.input.inputObjects[i].renderOrderID > _highestRenderID) {
_highestRenderID = this.game.input.inputObjects[i].renderOrderID;
_highestRenderObject = i;
}
}
if(_highestRenderObject !== -1) {
//console.log('setting target');
this.targetObject = this.game.input.inputObjects[_highestRenderObject];
this.targetObject.input._pointerOverHandler(this);
}
}
return this;
};
Pointer.prototype.leave = /**
@ -14161,7 +14423,10 @@ var Phaser;
this.game.input.inputObjects[i].input._releasedHandler(this);
}
}
this.draggedObject = null;
if(this.targetObject) {
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
return this;
};
Pointer.prototype.justPressed = /**
@ -14207,6 +14472,10 @@ var Phaser;
this._holdSent = false;
this._history.length = 0;
this._stateReset = true;
if(this.targetObject) {
this.targetObject.input._releasedHandler(this);
}
this.targetObject = null;
};
Pointer.prototype.renderDebug = /**
* Renders the Pointer.circle object onto the stage in green if down or red if up.
@ -14402,7 +14671,11 @@ var Phaser;
* @type {Boolean}
*/
this.disabled = false;
this.mouseDownCallback = null;
this.mouseMoveCallback = null;
this.mouseUpCallback = null;
this._game = game;
this.callbackContext = this._game;
}
Mouse.LEFT_BUTTON = 0;
Mouse.MIDDLE_BUTTON = 1;
@ -14427,6 +14700,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseDownCallback) {
this.mouseDownCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14437,6 +14713,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseMoveCallback) {
this.mouseMoveCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14447,6 +14726,9 @@ var Phaser;
* @param {MouseEvent} event
*/
function (event) {
if(this.mouseUpCallback) {
this.mouseUpCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14735,7 +15017,14 @@ var Phaser;
* @type {Boolean}
*/
this.disabled = false;
this.touchStartCallback = null;
this.touchMoveCallback = null;
this.touchEndCallback = null;
this.touchEnterCallback = null;
this.touchLeaveCallback = null;
this.touchCancelCallback = null;
this._game = game;
this.callbackContext = this._game;
}
Touch.prototype.start = /**
* Starts the event listeners running
@ -14781,6 +15070,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchStartCallback) {
this.touchStartCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14799,6 +15091,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchCancelCallback) {
this.touchCancelCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
@ -14816,13 +15111,16 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchEnterCallback) {
this.touchEnterCallback.call(this.callbackContext, event);
}
if(this._game.input.disabled || this.disabled) {
return;
}
event.preventDefault();
for(var i = 0; i < event.changedTouches.length; i++) {
console.log('touch enter');
}
//console.log('touch enter');
}
};
Touch.prototype.onTouchLeave = /**
* For touch enter and leave its a list of the touch points that have entered or left the target
@ -14831,10 +15129,13 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchLeaveCallback) {
this.touchLeaveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for(var i = 0; i < event.changedTouches.length; i++) {
console.log('touch leave');
}
//console.log('touch leave');
}
};
Touch.prototype.onTouchMove = /**
*
@ -14842,6 +15143,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchMoveCallback) {
this.touchMoveCallback.call(this.callbackContext, event);
}
event.preventDefault();
for(var i = 0; i < event.changedTouches.length; i++) {
this._game.input.updatePointer(event.changedTouches[i]);
@ -14853,6 +15157,9 @@ var Phaser;
* @param {Any} event
**/
function (event) {
if(this.touchEndCallback) {
this.touchEndCallback.call(this.callbackContext, event);
}
event.preventDefault();
// For touch end its a list of the touch points that have been removed from the surface
// https://developer.mozilla.org/en-US/docs/DOM/TouchList
@ -15220,12 +15527,7 @@ var Phaser;
this.pointer10.reset();
}
this.currentPointers = 0;
for(var i = 0; i < this.totalTrackedObjects; i++) {
this.inputObjects[i].input.reset();
}
this._game.stage.canvas.style.cursor = "default";
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
if(hard == true) {
this.onDown.dispose();
this.onUp.dispose();
@ -15235,6 +15537,11 @@ var Phaser;
this.onUp = new Phaser.Signal();
this.onTap = new Phaser.Signal();
this.onHold = new Phaser.Signal();
for(var i = 0; i < this.totalTrackedObjects; i++) {
this.inputObjects[i].input.reset();
}
this.inputObjects.length = 0;
this.totalTrackedObjects = 0;
}
};
Object.defineProperty(Input.prototype, "totalInactivePointers", {
@ -15463,7 +15770,7 @@ var Phaser;
*/
function (x, y, color) {
if (typeof color === "undefined") { color = 'rgb(255,255,255)'; }
this._game.stage.context.font = '14px Courier';
this._game.stage.context.font = '24px Courier';
this._game.stage.context.fillStyle = color;
this._game.stage.context.fillText('Input', x, y);
this._game.stage.context.fillText('Screen X: ' + this.x + ' Screen Y: ' + this.y, x, y + 14);
@ -15639,6 +15946,7 @@ var Phaser;
if(sprite.scale.x == 0 || sprite.scale.y == 0 || sprite.texture.alpha < 0.1 || this.inCamera(camera, sprite) == false) {
return false;
}
sprite.renderOrderID = this._count;
this._count++;
// Reset our temp vars
this._ga = -1;