Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2024-11-10 07:04:31 +00:00
Code Issues Projects Releases Packages Wiki Activity

Added FullScreen API support and fixed numerous StageScaleMode issues.

Browse source
This commit is contained in:
Richard Davey 2013-05-14 03:37:38 +01:00
parent 8fc31ed83b
commit ce7bfd1fc2
37 changed files with 11227 additions and 2853 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Phaser/DynamicTexture.ts
View file

@ -55,11 +55,13 @@ module Phaser {
* @type {Rectangle}
*/
public bounds: Rectangle;
/**
* This class is actually a wrapper of canvas.
* @type {HTMLCanvasElement}
*/
public canvas: HTMLCanvasElement;
/**
* Canvas context of this object.
* @type {CanvasRenderingContext2D}

60
Phaser/Game.ts
View file

@ -22,6 +22,7 @@
/// <reference path="system/input/Input.ts" />
/// <reference path="system/input/Keyboard.ts" />
/// <reference path="system/input/Mouse.ts" />
/// <reference path="system/input/MSPointer.ts" />
/// <reference path="system/input/Touch.ts" />
/// <reference path="gameobjects/Emitter.ts" />
/// <reference path="gameobjects/GameObject.ts" />
@ -82,63 +83,73 @@ module Phaser {
/**
* Game loop trigger wrapper.
*/
private _raf: RequestAnimationFrame;
public _raf: RequestAnimationFrame;
/**
* Max allowable accumulation.
* @type {number}
*/
private _maxAccumulation: number = 32;
/**
* Total number of milliseconds elapsed since last update loop.
* @type {number}
*/
private _accumulator: number = 0;
/**
* Milliseconds of time per step of the game loop.
* @type {number}
*/
private _step: number = 0;
/**
* Whether loader complete loading or not.
* @type {boolean}
*/
private _loadComplete: bool = false;
/**
* Game is paused?
* @type {boolean}
*/
private _paused: bool = false;
/**
* The state to be switched to in the next frame.
* @type {State}
*/
private _pendingState = null;
// Event callbacks
/**
* Context for calling the callbacks.
*/
public callbackContext;
/**
* This will be called when init states. (loading assets...)
* @type {function}
*/
public onInitCallback = null;
/**
* This will be called when create states. (setup states...)
* @type {function}
*/
public onCreateCallback = null;
/**
* This will be called when update states.
* @type {function}
*/
public onUpdateCallback = null;
/**
* This will be called when render states.
* @type {function}
*/
public onRenderCallback = null;
/**
* This will be called when states paused.
* @type {function}
@ -150,61 +161,73 @@ module Phaser {
* @type {Cache}
*/
public cache: Cache;
/**
* Reference to the collision helper.
* @type {Collision}
*/
public collision: Collision;
/**
* Reference to the input manager
* @type {Input}
*/
public input: Input;
/**
* Reference to the assets loader.
* @type {Loader}
*/
public loader: Loader;
/**
* Reference to the math helper.
* @type {GameMath}
*/
public math: GameMath;
/**
* Reference to the motion helper.
* @type {Motion}
*/
public motion: Motion;
/**
* Reference to the sound manager.
* @type {SoundManager}
*/
public sound: SoundManager;
/**
* Reference to the stage.
* @type {Stage}
*/
public stage: Stage;
/**
* Reference to game clock.
* @type {Time}
*/
public time: Time;
/**
* Reference to the tween manager.
* @type {TweenManager}
*/
public tweens: TweenManager;
/**
* Reference to the world.
* @type {World}
*/
public world: World;
/**
* Instance of repeatable random data generator helper.
* @type {RandomDataGenerator}
*/
public rnd: RandomDataGenerator;
/**
* Device detector.
* @type {Device}
@ -216,6 +239,7 @@ module Phaser {
* @type {boolean}
*/
public isBooted: bool = false;
/**
* Is game running or paused?
* @type {boolean}
@ -261,14 +285,14 @@ module Phaser {
// Display the default game screen?
if (this.onInitCallback == null && this.onCreateCallback == null && this.onUpdateCallback == null && this.onRenderCallback == null && this._pendingState == null)
{
this._raf = new RequestAnimationFrame(this.bootLoop, this);
this._raf = new RequestAnimationFrame(this, this.bootLoop);
}
else
{
this.isRunning = true;
this._loadComplete = false;
this._raf = new RequestAnimationFrame(this.loop, this);
this._raf = new RequestAnimationFrame(this, this.loop);
if (this._pendingState)
{
@ -299,7 +323,6 @@ module Phaser {
*/
private bootLoop() {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
@ -311,7 +334,6 @@ module Phaser {
*/
private pausedLoop() {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
@ -328,7 +350,6 @@ module Phaser {
*/
private loop() {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
@ -521,20 +542,21 @@ module Phaser {
if (value == true && this._paused == false)
{
this._paused = true;
this._raf.setCallback(this.pausedLoop);
this._raf.callback = this.pausedLoop;
}
else if (value == false && this._paused == true)
{
this._paused = false;
this.time.time = Date.now();
//this.time.time = window.performance.now ? (performance.now() + performance.timing.navigationStart) : Date.now();
this.input.reset();
if (this.isRunning == false)
{
this._raf.setCallback(this.bootLoop);
this._raf.callback = this.bootLoop;
}
else
{
this._raf.setCallback(this.loop);
this._raf.callback = this.loop;
}
}
@ -586,7 +608,7 @@ module Phaser {
*
* @param x {number} X position of the new sprite.
* @param y {number} Y position of the new sprite.
* @param key {string} Optinal, key for the sprite sheet you want it to use.
* @param key {string} Optional, key for the sprite sheet you want it to use.
* @returns {Sprite} The newly created sprite object.
*/
public createSprite(x: number, y: number, key?: string = ''): Sprite {
@ -607,7 +629,7 @@ module Phaser {
/**
* Create a new object container.
*
* @param MaxSize {number} Optinal, capacity of this group.
* @param MaxSize {number} Optional, capacity of this group.
* @returns {Group} The newly created group.
*/
public createGroup(MaxSize?: number = 0): Group {
@ -626,9 +648,9 @@ module Phaser {
/**
* Create a new Emitter.
*
* @param x {number} Optinal, x position of the emitter.
* @param y {number} Optinal, y position of the emitter.
* @param size {number} Optinal, size of this emitter.
* @param x {number} Optional, x position of the emitter.
* @param y {number} Optional, y position of the emitter.
* @param size {number} Optional, size of this emitter.
* @return {Emitter} The newly created emitter object.
*/
public createEmitter(x?: number = 0, y?: number = 0, size?: number = 0): Emitter {
@ -642,7 +664,7 @@ module Phaser {
* @param x {number} X position of this object.
* @param y {number} Y position of this object.
* @param width number} Width of this object.
* @param height {number} Heigth of this object.
* @param height {number} Height of this object.
* @returns {ScrollZone} The newly created scroll zone object.
*/
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {
@ -675,8 +697,8 @@ module Phaser {
}
/**
* Call this method to see if one object collids another.
* @return {boolean} Whether the given objects or groups collids.
* Call this method to see if one object collides with another.
* @return {boolean} Whether the given objects or groups collides.
*/
public collide(objectOrGroup1: Basic = null, objectOrGroup2: Basic = null, notifyCallback = null): bool {
return this.collision.overlap(objectOrGroup1, objectOrGroup2, notifyCallback, Collision.separate);

4
Phaser/Phaser.csproj
View file

@ -133,6 +133,10 @@
</Content>
<TypeScriptCompile Include="system\screens\PauseScreen.ts" />
<TypeScriptCompile Include="system\screens\BootScreen.ts" />
<TypeScriptCompile Include="system\input\MSPointer.ts" />
<Content Include="system\input\MSPointer.js">
<DependentUpon>MSPointer.ts</DependentUpon>
</Content>
<Content Include="system\screens\BootScreen.js">
<DependentUpon>BootScreen.ts</DependentUpon>
</Content>

2
Phaser/SoundManager.ts
View file

@ -49,10 +49,12 @@ module Phaser {
* Reference to AudioContext instance.
*/
private _context = null;
/**
* Gain node created from audio context.
*/
private _gainNode;
/**
* Volume of sounds.
* @type {number}

48
Phaser/Stage.ts
View file

@ -29,6 +29,7 @@ module Phaser {
this._game = game;
this.canvas = <HTMLCanvasElement> document.createElement('canvas');
this.canvas.id = 'bob';
this.canvas.width = width;
this.canvas.height = height;
@ -45,6 +46,7 @@ module Phaser {
// Consume default actions on the canvas
this.canvas.style.msTouchAction = 'none';
this.canvas.style['touch-action'] = 'none';
this.canvas.style.backgroundColor = 'rgb(0,0,0)';
this.context = this.canvas.getContext('2d');
@ -70,10 +72,10 @@ module Phaser {
private _game: Game;
/**
* Background color of the stage.
* Background color of the stage (defaults to black)
* @type {string}
*/
private _bgColor: string;
private _bgColor: string = 'rgb(0,0,0)';
/**
* This will be displayed when Phaser is started without any default functions or State
@ -87,18 +89,6 @@ module Phaser {
*/
private _pauseScreen;
/**
* Screen orientation enum: Landscape.
* @type {number}
*/
public static ORIENTATION_LANDSCAPE: number = 0;
/**
* Screen orientation enum: Portrait.
* @type {number}
*/
public static ORIENTATION_PORTRAIT: number = 1;
/**
* Bound of this stage.
* @type {Rectangle}
@ -162,30 +152,6 @@ module Phaser {
*/
public scaleMode: number;
/**
* Minimal scale factor of x-axis.
* @type {number}
*/
public minScaleX: number = null;
/**
* Maximal scale factor of x-axis.
* @type {number}
*/
public maxScaleX: number = null;
/**
* Minimal scale factor of y-axis.
* @type {number}
*/
public minScaleY: number = null;
/**
* Maximal scale factor of y-axis.
* @type {number}
*/
public maxScaleY: number = null;
/**
* Update stage for rendering. This will handle scaling, clearing
* and PauseScreen/BootScreen updating and rendering.
@ -215,7 +181,7 @@ module Phaser {
}
/**
* This method will be called when canvas element's visibility changed.
* This method is called when the canvas elements visibility is changed.
*/
private visibilityChange(event) {
@ -224,7 +190,7 @@ module Phaser {
return;
}
if (event.type === 'blur' || document['hidden'] === true || document['webkitHidden'] === true)
if (event.type == 'blur' || document['hidden'] == true || document['webkitHidden'] == true)
{
if (this._game.paused == false)
{
@ -233,7 +199,7 @@ module Phaser {
this._game.paused = true;
}
}
else if (event.type == 'focus')
else
{
if (this._game.paused == true)
{

2
Phaser/State.ts
View file

@ -211,7 +211,7 @@ module Phaser {
* @param x {number} X position of this object.
* @param y {number} Y position of this object.
* @param width {number} Width of this object.
* @param height {number} Heigth of this object.
* @param height {number} Height of this object.
* @returns {ScrollZone} The newly created scroll zone object.
*/
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {

26
Phaser/Time.ts
View file

@ -18,9 +18,10 @@ module Phaser {
*/
constructor(game: Game) {
this._started = Date.now();
this._started = 0;
this._timeLastSecond = this._started;
this.time = this._started;
this._game = game;
}
@ -28,6 +29,7 @@ module Phaser {
* Local private reference to game.
*/
private _game: Game;
/**
* Time when this object created.
* @param {number}
@ -40,6 +42,7 @@ module Phaser {
* @type {number}
*/
public timeScale: number = 1.0;
/**
* Elapsed since last frame.
* @type {number}
@ -83,26 +86,31 @@ module Phaser {
* @type {number}
*/
public fps: number = 0;
/**
* Minimal fps.
* @type {number}
*/
public fpsMin: number = 1000;
/**
* Maximal fps.
* @type {number}
*/
public fpsMax: number = 0;
/**
* Mininal duration between 2 frames.
* @type {number}
*/
public msMin: number = 1000;
/**
* Maximal duration between 2 frames.
* @type {number}
*/
public msMax: number = 0;
/**
* How many frames in last second.
* @type {number}
@ -116,13 +124,15 @@ module Phaser {
private _timeLastSecond: number = 0;
/**
* Update clock and calc fps.
* Update clock and calculate the fps.
* This is called automatically by Game._raf
* @method update
* @param {number} raf The current timestamp, either performance.now or Date.now
*/
public update() {
public update(raf: number) {
// Can we use performance.now() ?
this.now = Date.now(); // mark
this.now = raf; // mark
//this.now = Date.now(); // mark
this.delta = this.now - this.time; // elapsedMS
this.msMin = Math.min(this.msMin, this.delta);
@ -142,12 +152,6 @@ module Phaser {
this.time = this.now; // _total
//// Lock the delta at 0.1 to minimise fps tunneling
//if (this.delta > 0.1)
//{
// this.delta = 0.1;
//}
}
/**

7
Phaser/World.ts
View file

@ -25,8 +25,6 @@ module Phaser {
this.cameras = new CameraManager(this._game, 0, 0, width, height);
this._game.camera = this.cameras.current;
this.group = new Group(this._game, 0);
this.bounds = new Rectangle(0, 0, width, height);
@ -45,16 +43,19 @@ module Phaser {
* @type {CameraManager}
*/
public cameras: CameraManager;
/**
* Object container stores every object created with `create*` methods.
* @type {Group}
*/
public group: Group;
/**
* Bound of this world that objects can not escape from.
* @type {Rectangle}
*/
public bounds: Rectangle;
/**
* @type {number}
*/
@ -235,7 +236,7 @@ module Phaser {
* @param x {number} X position of this object.
* @param y {number} Y position of this object.
* @param width {number} Width of this object.
* @param height {number} Heigth of this object.
* @param height {number} Height of this object.
* @returns {ScrollZone} The newly created scroll zone object.
*/
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {

65
Phaser/system/Camera.ts
View file

@ -58,16 +58,19 @@ module Phaser {
* @type {number}
*/
public static STYLE_LOCKON: number = 0;
/**
* Camera "follow" style preset: camera deadzone is narrow but tall.
* @type {number}
*/
public static STYLE_PLATFORMER: number = 1;
/**
* Camera "follow" style preset: camera deadzone is a medium-size square around the focus object.
* @type {number}
*/
public static STYLE_TOPDOWN: number = 2;
/**
* Camera "follow" style preset: camera deadzone is a small square around the focus object.
* @type {number}
@ -78,31 +81,37 @@ module Phaser {
* Identity of this camera.
*/
public ID: number;
/**
* Camera view rectangle in world coordinate.
* @type {Rectangle}
*/
public worldView: Rectangle;
/**
* How many sprites will be rendered by this camera.
* @type {number}
*/
public totalSpritesRendered: number;
/**
* Scale factor of the camera.
* @type {MicroPoint}
*/
public scale: MicroPoint = new MicroPoint(1, 1);
/**
* Scrolling factor.
* @type {MicroPoint}
*/
public scroll: MicroPoint = new MicroPoint(0, 0);
/**
* Camera bounds.
* @type {Rectangle}
*/
public bounds: Rectangle = null;
/**
* Sprite moving inside this rectangle will not cause camera moving.
* @type {Rectangle}
@ -111,32 +120,47 @@ module Phaser {
// Camera Border
public disableClipping: bool = false;
/**
* Whether render border of this camera or not. (default is false)
* @type {boolean}
*/
public showBorder: bool = false;
/**
* Color of border of this camera. (in css color string)
* @type {string}
*/
public borderColor: string = 'rgb(255,255,255)';
// Camera Background Color
/**
* Whethor camera background invisible or not.
* Whether the camera background is opaque or not. If set to true the Camera is filled with
* the value of Camera.backgroundColor every frame.
* @type {boolean}
*/
public opaque: bool = true;
public opaque: bool = false;
/**
* Clears the camera every frame using a canvas clearRect call (default to true).
* Note that this erases anything below the camera as well, so do not use it in conjuction with a camera
* that uses alpha or that needs to be able to manage opacity. Equally if Camera.opaque is set to true
* then set Camera.clear to false to save rendering time.
* By default the Stage will clear itself every frame, so be sure not to double-up clear calls.
* @type {boolean}
*/
public clear: bool = false;
/**
* Background color in css color string.
* @type {string}
*/
private _bgColor: string = 'rgb(0,0,0)';
/**
* Background texture to be rendered if background is visible.
*/
private _bgTexture;
/**
* Background texture repeat style. (default is 'repeat')
* @type {string}
@ -149,16 +173,19 @@ module Phaser {
* @type {boolean}
*/
public showShadow: bool = false;
/**
* Color of shadow, in css color string.
* @type {string}
*/
public shadowColor: string = 'rgb(0,0,0)';
/**
* Blur factor of shadow.
* @type {number}
*/
public shadowBlur: number = 10;
/**
* Offset of the shadow from camera's position.
* @type {MicroPoint}
@ -170,6 +197,7 @@ module Phaser {
* @type {boolean}
*/
public visible: bool = true;
/**
* Alpha of the camera. (everything rendered to this camera will be affected)
* @type {number}
@ -181,6 +209,7 @@ module Phaser {
* @type {number}
*/
public inputX: number = 0;
/**
* The y position of the current input event in world coordinates.
* @type {number}
@ -373,13 +402,13 @@ module Phaser {
return;
}
//if (this._rotation !== 0 || this._clip || this.scale.x !== 1 || this.scale.y !== 1)
//{
//this._game.stage.context.save();
//}
if (this._rotation !== 0 || this._clip || this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.save();
}
// It may be safer/quicker to just save the context every frame regardless (needs testing on mobile)
this._game.stage.context.save();
// It may be safer/quicker to just save the context every frame regardless (needs testing on mobile - sucked on Android 2.x)
//this._game.stage.context.save();
this.fx.preRender(this, this._stageX, this._stageY, this.worldView.width, this.worldView.height);
@ -392,7 +421,7 @@ module Phaser {
this._sy = this._stageY;
// Shadow
if (this.showShadow)
if (this.showShadow == true)
{
this._game.stage.context.shadowColor = this.shadowColor;
this._game.stage.context.shadowBlur = this.shadowBlur;
@ -418,6 +447,11 @@ module Phaser {
this._game.stage.context.translate(-(this._sx + this.worldView.halfWidth), -(this._sy + this.worldView.halfHeight));
}
if (this.clear == true)
{
this._game.stage.context.clearRect(this._sx, this._sy, this.worldView.width, this.worldView.height);
}
// Background
if (this.opaque == true)
{
@ -434,7 +468,7 @@ module Phaser {
}
// Shadow off
if (this.showShadow)
if (this.showShadow == true)
{
this._game.stage.context.shadowBlur = 0;
this._game.stage.context.shadowOffsetX = 0;
@ -444,7 +478,7 @@ module Phaser {
this.fx.render(this, this._stageX, this._stageY, this.worldView.width, this.worldView.height);
// Clip the camera so we don't get sprites appearing outside the edges
if (this._clip && this.disableClipping == false)
if (this._clip == true && this.disableClipping == false)
{
this._game.stage.context.beginPath();
this._game.stage.context.rect(this._sx, this._sy, this.worldView.width, this.worldView.height);
@ -454,7 +488,7 @@ module Phaser {
this._game.world.group.render(this, this._sx, this._sy);
if (this.showBorder)
if (this.showBorder == true)
{
this._game.stage.context.strokeStyle = this.borderColor;
this._game.stage.context.lineWidth = 1;
@ -475,7 +509,10 @@ module Phaser {
this._game.stage.context.translate(0, 0);
}
this._game.stage.context.restore();
if (this._rotation !== 0 || this._clip || this.scale.x !== 1 || this.scale.y !== 1)
{
this._game.stage.context.restore();
}
if (this.alpha !== 1)
{

96
Phaser/system/RequestAnimationFrame.ts
View file

@ -15,10 +15,10 @@ module Phaser {
* @param {Any} callback
* @return {RequestAnimationFrame} This object.
*/
constructor(callback, callbackContext) {
constructor(game: Game, callback) {
this._callback = callback;
this._callbackContext = callbackContext;
this._game = game;
this.callback = callback;
var vendors = ['ms', 'moz', 'webkit', 'o'];
@ -33,24 +33,16 @@ module Phaser {
}
/**
*
* @property _callback
* @type Any
* @private
**/
private _callback;
private _callbackContext;
* Local private reference to game.
*/
private _game: Game;
/**
*
* @method callback
* @param {Any} callback
* The function to be called each frame. Will be called in the context of _game
* @property callback
* @type Any
**/
public setCallback(callback) {
this._callback = callback;
}
public callback;
/**
*
@ -86,30 +78,10 @@ module Phaser {
**/
public isUsingRAF(): bool {
if (this._isSetTimeOut === true)
{
return false;
}
else
{
return true;
}
return this._isSetTimeOut === true;
}
/**
*
* @property lastTime
* @type Number
**/
public lastTime: number = 0;
/**
*
* @property currentTime
* @type Number
**/
public currentTime: number = 0;
/**
*
* @property isRunning
@ -118,7 +90,7 @@ module Phaser {
public isRunning: bool = false;
/**
*
* Starts the requestAnimatioFrame running or setTimeout if unavailable in browser
* @method start
* @param {Any} [callback]
**/
@ -126,7 +98,7 @@ module Phaser {
if (callback)
{
this._callback = callback;
this.callback = callback;
}
if (!window.requestAnimationFrame)
@ -137,7 +109,7 @@ module Phaser {
else
{
this._isSetTimeOut = false;
window.requestAnimationFrame(() => this.RAFUpdate());
window.requestAnimationFrame(() => this.RAFUpdate(0));
}
this.isRunning = true;
@ -145,7 +117,7 @@ module Phaser {
}
/**
*
* Stops the requestAnimationFrame from running
* @method stop
**/
public stop() {
@ -163,44 +135,38 @@ module Phaser {
}
public RAFUpdate() {
/**
* The update method for the requestAnimationFrame
* @method RAFUpdate
**/
public RAFUpdate(time: number) {
// Not in IE8 (but neither is RAF) also doesn't use a high performance timer (window.performance.now)
this.currentTime = Date.now();
this._game.time.update(time);
if (this._callback)
if (this.callback)
{
this._callback.call(this._callbackContext);
this.callback.call(this._game);
}
var timeToCall: number = Math.max(0, 16 - (this.currentTime - this.lastTime));
window.requestAnimationFrame(() => this.RAFUpdate());
this.lastTime = this.currentTime + timeToCall;
window.requestAnimationFrame((time) => this.RAFUpdate(time));
}
/**
*
* The update method for the setTimeout
* @method SetTimeoutUpdate
**/
public SetTimeoutUpdate() {
// Not in IE8
this.currentTime = Date.now();
this._game.time.update(Date.now());
if (this._callback)
this._timeOutID = window.setTimeout(() => this.SetTimeoutUpdate(), 16.7);
if (this.callback)
{
this._callback.call(this._callbackContext);
this.callback.call(this._game);
}
var timeToCall: number = Math.max(0, 16 - (this.currentTime - this.lastTime));
this._timeOutID = window.setTimeout(() => this.SetTimeoutUpdate(), timeToCall);
this.lastTime = this.currentTime + timeToCall;
}
}

193
Phaser/system/StageScaleMode.ts
View file

@ -5,7 +5,7 @@
*
* This class controls the scaling of your game. On mobile devices it will also remove the URL bar and allow
* you to maintain proportion and aspect ratio.
* It is based on a technique taken from Viewporter v2.0 by Zynga Inc. http://github.com/zynga/viewporter
* The resizing method is based on a technique taken from Viewporter v2.0 by Zynga Inc. http://github.com/zynga/viewporter
*/
module Phaser {
@ -19,9 +19,27 @@ module Phaser {
this._game = game;
this.orientation = window['orientation'];
this.enterLandscape = new Phaser.Signal();
this.enterPortrait = new Phaser.Signal();
if (window['orientation'])
{
this.orientation = window['orientation'];
}
else
{
if (window.outerWidth > window.outerHeight)
{
this.orientation = 90;
}
else
{
this.orientation = 0;
}
}
window.addEventListener('orientationchange', (event) => this.checkOrientation(event), false);
window.addEventListener('resize', (event) => this.checkResize(event), false);
}
@ -29,6 +47,7 @@ module Phaser {
* Local private reference to game.
*/
private _game: Game;
/**
* Stage height when start the game.
* @type {number}
@ -55,11 +74,38 @@ module Phaser {
*/
public static SHOW_ALL: number = 2;
/**
* Minimum width the canvas should be scaled to (in pixels)
* @type {number}
*/
public minWidth: number = null;
/**
* Maximum width the canvas should be scaled to (in pixels).
* If null it will scale to whatever width the browser can handle.
* @type {number}
*/
public maxWidth: number = null;
/**
* Minimum height the canvas should be scaled to (in pixels)
* @type {number}
*/
public minHeight: number = null;
/**
* Maximum height the canvas should be scaled to (in pixels).
* If null it will scale to whatever height the browser can handle.
* @type {number}
*/
public maxHeight: number = null;
/**
* Width of the stage after calculation.
* @type {number}
*/
public width: number = 0;
/**
* Height of the stage after calculation.
* @type {number}
@ -67,11 +113,78 @@ module Phaser {
public height: number = 0;
/**
* Game orientation angel.
* Window orientation angle (90 and -90 are landscape, 0 is portrait)
* @type {number}
*/
public orientation;
public orientation: number;
/**
* A Signal that is dispatched when the device enters landscape mode from portrait
* @type {Signal}
*/
public enterLandscape: Phaser.Signal;
/**
* A Signal that is dispatched when the device enters portrait mode from landscape
* @type {Signal}
*/
public enterPortrait: Phaser.Signal;
public get isFullScreen(): bool {
if (document['fullscreenElement'] === null|| document['mozFullScreenElement'] === null|| document['webkitFullscreenElement'] === null)
{
return false;
}
return true;
}
public startFullScreen() {
if (this.isFullScreen)
{
return;
}
var element = this._game.stage.canvas;
if (element['requestFullScreen'])
{
element['requestFullScreen']();
}
else if(element['mozRequestFullScreen'])
{
element['mozRequestFullScreen']();
}
else if (element['webkitRequestFullScreen'])
{
element['webkitRequestFullScreen']();
}
}
public stopFullScreen() {
if (document['cancelFullScreen'])
{
document['cancelFullScreen']();
}
else if (document['mozCancelFullScreen'])
{
document['mozCancelFullScreen']();
}
else if (document['webkitCancelFullScreen'])
{
document['webkitCancelFullScreen']();
}
}
/**
* The core update loop, called by Phaser.Stage
*/
public update() {
if (this._game.stage.scaleMode !== StageScaleMode.NO_SCALE && (window.innerWidth !== this.width || window.innerHeight !== this.height))
@ -81,19 +194,63 @@ module Phaser {
}
public get isPortrait(): bool {
return this.orientation == 0;
}
public get isLandscape(): bool {
return window['orientation'] === 90 || window['orientation'] === -90;
return this.orientation === 90 || this.orientation === -90;
}
/**
* Check whether game orientation the same as window's. Update orientation if not equal.
* Handle window.orientationchange events
*/
private checkOrientation(event) {
if (window['orientation'] !== this.orientation)
this.orientation = window['orientation'];
if (this.isLandscape)
{
this.enterLandscape.dispatch(this.orientation);
}
else
{
this.enterPortrait.dispatch(this.orientation);
}
if (this._game.stage.scaleMode !== StageScaleMode.NO_SCALE)
{
this.refresh();
}
}
/**
* Handle window.resize events
*/
private checkResize(event) {
if (window.outerWidth > window.outerHeight)
{
this.orientation = 90;
}
else
{
this.orientation = 0;
}
if (this.isLandscape)
{
this.enterLandscape.dispatch(this.orientation);
}
else
{
this.enterPortrait.dispatch(this.orientation);
}
if (this._game.stage.scaleMode !== StageScaleMode.NO_SCALE)
{
this.refresh();
this.orientation = window['orientation'];
}
}
@ -129,7 +286,7 @@ module Phaser {
}
/**
* Set screen size automatically based on stage's scaleMode.
* Set screen size automatically based on the scaleMode.
*/
private setScreenSize() {
@ -154,18 +311,18 @@ module Phaser {
if (this._game.stage.scaleMode == StageScaleMode.EXACT_FIT)
{
if (this._game.stage.maxScaleX && window.innerWidth > this._game.stage.maxScaleX)
if (this.maxWidth && window.innerWidth > this.maxWidth)
{
this.width = this._game.stage.maxScaleX;
this.width = this.maxWidth;
}
else
{
this.width = window.innerWidth;
}
if (this._game.stage.maxScaleY && window.innerHeight > this._game.stage.maxScaleY)
if (this.maxHeight && window.innerHeight > this.maxHeight)
{
this.height = this._game.stage.maxScaleY;
this.height = this.maxHeight;
}
else
{
@ -173,20 +330,20 @@ module Phaser {
}
}
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._game.stage.maxScaleX && this.width > this._game.stage.maxScaleX)
if (this.maxWidth && this.width > this.maxWidth)
{
this.width = this._game.stage.maxScaleX;
this.width = this.maxWidth;
}
if (this._game.stage.maxScaleY && this.height > this._game.stage.maxScaleY)
if (this.maxHeight && this.height > this.maxHeight)
{
this.height = this._game.stage.maxScaleY;
this.height = this.maxHeight;
}
}

8
Phaser/system/Tween.ts
View file

@ -48,11 +48,13 @@ module Phaser {
* Local private reference to game.
*/
private _game: Phaser.Game;
/**
* Manager of this tween.
* @type {Phaser.TweenManager}
*/
private _manager: Phaser.TweenManager;
/**
* Reference to the target object.
* @type {object}
@ -65,11 +67,13 @@ module Phaser {
* @type {object}
*/
private _valuesStart = {};
/**
* End values container.
* @type {object}
*/
private _valuesEnd = {};
/**
* How long this tween will perform.
* @type {number}
@ -77,12 +81,14 @@ module Phaser {
private _duration = 1000;
private _delayTime = 0;
private _startTime = null;
/**
* Easing function which actually updating this tween.
* @type {function}
*/
private _easingFunction;
private _interpolationFunction;
/**
* Contains chained tweens.
* @type {Tweens[]}
@ -94,11 +100,13 @@ module Phaser {
* @type {Phaser.Signal}
*/
public onStart: Phaser.Signal;
/**
* Signal to be dispatched when this tween updating.
* @type {Phaser.Signal}
*/
public onUpdate: Phaser.Signal;
/**
* Signal to be dispatched when this tween completed.
* @type {Phaser.Signal}

14
Phaser/system/input/Input.ts
View file

@ -1,5 +1,6 @@
/// <reference path="../../Game.ts" />
/// <reference path="../../Signal.ts" />
/// <reference path="MSPointer.ts" />
/**
* Phaser - Input
@ -18,6 +19,7 @@ module Phaser {
this.mouse = new Mouse(this._game);
this.keyboard = new Keyboard(this._game);
this.touch = new Touch(this._game);
this.mspointer = new MSPointer(this._game);
this.onDown = new Phaser.Signal();
this.onUp = new Phaser.Signal();
@ -31,22 +33,31 @@ module Phaser {
* @type {Mouse}
*/
public mouse: Mouse;
/**
*
* @type {Keyboard}
*/
public keyboard: Keyboard;
/**
*
* @type {Touch}
*/
public touch: Touch;
/**
*
* @type {MSPointer}
*/
public mspointer: MSPointer;
/**
*
* @type {Number}
*/
public x: number = 0;
/**
*
* @type {Number}
@ -58,6 +69,7 @@ module Phaser {
* @type {Number}
*/
public scaleX: number = 1;
/**
*
* @type {Number}
@ -69,6 +81,7 @@ module Phaser {
* @type {Number}
*/
public worldX: number = 0;
/**
*
* @type {Number}
@ -80,6 +93,7 @@ module Phaser {
* @type {Phaser.Signal}
*/
public onDown: Phaser.Signal;
/**
*
* @type {Phaser.Signal}

326
Phaser/system/input/MSPointer.ts Normal file
View file

@ -0,0 +1,326 @@
/// <reference path="../../Game.ts" />
/// <reference path="Finger.ts" />
/**
* Phaser - MSPointer
*
* The MSPointer class handles touch interactions with the game and the resulting Finger objects.
* It will work only in Internet Explorer 10 and Windows Store or Windows Phone 8 apps using JavaScript.
* http://msdn.microsoft.com/en-us/library/ie/hh673557(v=vs.85).aspx
*
*
* @todo Gestures (pinch, zoom, swipe)
*/
module Phaser {
export class MSPointer {
/**
* Constructor
* @param {Game} game.
* @return {MSPointer} This object.
*/
constructor(game: Game) {
this._game = game;
this.finger1 = new Finger(this._game);
this.finger2 = new Finger(this._game);
this.finger3 = new Finger(this._game);
this.finger4 = new Finger(this._game);
this.finger5 = new Finger(this._game);
this.finger6 = new Finger(this._game);
this.finger7 = new Finger(this._game);
this.finger8 = new Finger(this._game);
this.finger9 = new Finger(this._game);
this.finger10 = new Finger(this._game);
this._fingers = [this.finger1, this.finger2, this.finger3, this.finger4, this.finger5, this.finger6, this.finger7, this.finger8, this.finger9, this.finger10];
this.touchDown = new Signal();
this.touchUp = new Signal();
this.start();
}
/**
*
* @property _game
* @type Game
* @private
**/
private _game: Game;
/**
*
* @property x
* @type Number
**/
public x: number = 0;
/**
*
* @property y
* @type Number
**/
public y: number = 0;
/**
*
* @property _fingers
* @type Array
* @private
**/
private _fingers: Finger[];
/**
*
* @property finger1
* @type Finger
**/
public finger1: Finger;
/**
*
* @property finger2
* @type Finger
**/
public finger2: Finger;
/**
*
* @property finger3
* @type Finger
**/
public finger3: Finger;
/**
*
* @property finger4
* @type Finger
**/
public finger4: Finger;
/**
*
* @property finger5
* @type Finger
**/
public finger5: Finger;
/**
*
* @property finger6
* @type Finger
**/
public finger6: Finger;
/**
*
* @property finger7
* @type Finger
**/
public finger7: Finger;
/**
*
* @property finger8
* @type Finger
**/
public finger8: Finger;
/**
*
* @property finger9
* @type Finger
**/
public finger9: Finger;
/**
*
* @property finger10
* @type Finger
**/
public finger10: Finger;
/**
*
* @property latestFinger
* @type Finger
**/
public latestFinger: Finger;
/**
*
* @property isDown
* @type Boolean
**/
public isDown: bool = false;
/**
*
* @property isUp
* @type Boolean
**/
public isUp: bool = true;
public touchDown: Signal;
public touchUp: Signal;
/**
*
* @method start
*/
public start() {
if (navigator.msMaxTouchPoints)
{
this._game.stage.canvas.addEventListener('MSPointerDown', (event) => this.onPointerDown(event), false);
this._game.stage.canvas.addEventListener('MSPointerMove', (event) => this.onPointerMove(event), false);
this._game.stage.canvas.addEventListener('MSPointerUp', (event) => this.onPointerUp(event), false);
}
}
/**
*
* @method onPointerDown
* @param {Any} event
**/
private onPointerDown(event) {
event.preventDefault();
for (var f = 0; f < this._fingers.length; f++)
{
if (this._fingers[f].active === false)
{
event.identifier = event.pointerId;
this._fingers[f].start(event);
this.x = this._fingers[f].x;
this.y = this._fingers[f].y;
this._game.input.x = this.x * this._game.input.scaleX;
this._game.input.y = this.y * this._game.input.scaleY;
this.touchDown.dispatch(this._fingers[f].x, this._fingers[f].y, this._fingers[f].timeDown, this._fingers[f].timeUp, this._fingers[f].duration);
this._game.input.onDown.dispatch(this._game.input.x, this._game.input.y, this._fingers[f].timeDown);
this.isDown = true;
this.isUp = false;
break;
}
}
}
/**
*
* @method onPointerMove
* @param {Any} event
**/
private onPointerMove(event) {
event.preventDefault();
for (var f = 0; f < this._fingers.length; f++)
{
if (this._fingers[f].identifier === event.pointerId &&
this._fingers[f].active === true)
{
event.identifier = event.pointerId;
this._fingers[f].move(event);
this.x = this._fingers[f].x;
this.y = this._fingers[f].y;
this._game.input.x = this.x * this._game.input.scaleX;
this._game.input.y = this.y * this._game.input.scaleY;
break;
}
}
}
/**
*
* @method onPointerUp
* @param {Any} event
**/
private onPointerUp(event) {
event.preventDefault();
for (var f = 0; f < this._fingers.length; f++)
{
if (this._fingers[f].identifier === event.pointerId)
{
event.identifier = event.pointerId;
this._fingers[f].stop(event);
this.x = this._fingers[f].x;
this.y = this._fingers[f].y;
this._game.input.x = this.x * this._game.input.scaleX;
this._game.input.y = this.y * this._game.input.scaleY;
this.touchUp.dispatch(this._fingers[f].x, this._fingers[f].y, this._fingers[f].timeDown, this._fingers[f].timeUp, this._fingers[f].duration);
this._game.input.onUp.dispatch(this._game.input.x, this._game.input.y, this._fingers[f].timeUp);
this.isDown = false;
this.isUp = true;
break;
}
}
}
/**
*
* @method calculateDistance
* @param {Finger} finger1
* @param {Finger} finger2
**/
public calculateDistance(finger1: Finger, finger2: Finger) {
}
/**
*
* @method calculateAngle
* @param {Finger} finger1
* @param {Finger} finger2
**/
public calculateAngle(finger1: Finger, finger2: Finger) {
}
/**
*
* @method checkOverlap
* @param {Finger} finger1
* @param {Finger} finger2
**/
public checkOverlap(finger1: Finger, finger2: Finger) {
}
/**
*
* @method update
*/
public update() {
}
/**
*
* @method stop
*/
public stop() {
}
/**
*
* @method reset
**/
public reset() {
this.isDown = false;
this.isUp = false;
}
}
}

26
README.md
View file

@ -20,7 +20,29 @@ Latest Update
V0.9.6
*
* Documentation! Every class now has documentation for nearly every single function - if you spot a typo, please shout! (thanks pixelpicosean)
* Grunt file updated to produce the new Special FX JS file (thanks HackManiac)
* Fixed issue stopping Phaser working on iOS 5 (i.e. iPad 1)
* Created new mobile test folder, updated index.php to use mobile CSS and made some mobile specific tests
* Fixed a few speed issues on Android 2.x stock browser, but it's still tricky to get a fast game out of it
* Moved Camera context save/restore back inside parameter checks (sped-up Samsung S3 stock browser)
* Fixed bug with StageScaleMode.checkOrientation not respecting the NO_SCALE value
* Added MSPointer support (thanks Diego Bezerra)
* Added Camera.clear to perform a clearRect instead of a fillRect if needed (default is false)
* Swapped Camera.opaque default from true to false re: performance
* Updated Stage.visibilityChange to avoid pause screen locking in certain situations
* Added StageScaleMode.enterLandscape and enterPortrait signals for easier device orientation change checks
* Added StageScaleMode.isPortrait
* Updated StageScaleMode to check both window.orientationchange and window.resize events
* Updated RequestAnimationFrame to use performance.now for sub-millisecond precision and to drive the Game.time.update loop
* Updated RequestAnimationFrame setTimeout to use fixed timestep and re-ordered callback sequence. Android 2/iOS5 performance much better now
* Removed Stage.ORIENTATION_LANDSCAPE statics because the values should be taken from Stage.scale.isPortrait / isLandscape
* Removed Stage.maxScaleX/Y and moved them into StageScaleMode.minWidth, minHeight, maxWidth and maxHeight
* Fixed Stage.scale so that it resizes without needing an orientation change
* TODO: Check that tween pausing works with the new performance.now
* TODO: Game.Time should monitor pause duration
* Added StageScaleMode.startFullscreen(), stopFullScreen() and isFullScreen for making use of the FullScreen API on desktop browsers
Requirements
------------
@ -29,7 +51,7 @@ Games created with Phaser require a modern web browser that supports the canvas
For developing with Phaser you can use either a plain-vanilla JavaScript approach or [TypeScript](https://typescript.codeplex.com/). We made no assumptions about how you like to code your games, and were careful not to impose any form of class/inheritance/structure upon you.
If you are compiling via TypeScript from the command-line please use `--target ES5` and `--nolib`
If you are compiling via TypeScript from the command-line please use `--target ES5`
If you need it the included Grunt file will generate a RequireJS/CommonJS version of Phaser on build.

20
Tests/Tests.csproj
View file

@ -87,9 +87,7 @@
<TypeScriptCompile Include="sprites\velocity.ts" />
<TypeScriptCompile Include="tilemap\basic tilemap.ts" />
</ItemGroup>
<ItemGroup>
<Folder Include="mobile\" />
</ItemGroup>
<ItemGroup />
<ItemGroup>
<TypeScriptCompile Include="sprites\dynamic texture 1.ts" />
</ItemGroup>
@ -117,9 +115,25 @@
<Content Include="camera fx\shake.js">
<DependentUpon>shake.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="input\multitouch.ts" />
<Content Include="input\multitouch.js">
<DependentUpon>multitouch.ts</DependentUpon>
</Content>
<Content Include="misc\bootscreen.js">
<DependentUpon>bootscreen.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="mobile\sprite test 1.ts" />
<TypeScriptCompile Include="mobile\bunny mobile.ts" />
<TypeScriptCompile Include="misc\time.ts" />
<Content Include="misc\time.js">
<DependentUpon>time.ts</DependentUpon>
</Content>
<Content Include="mobile\bunny mobile.js">
<DependentUpon>bunny mobile.ts</DependentUpon>
</Content>
<Content Include="mobile\sprite test 1.js">
<DependentUpon>sprite test 1.ts</DependentUpon>
</Content>
<Content Include="scrollzones\ballscroller.js">
<DependentUpon>ballscroller.ts</DependentUpon>
</Content>

45
Tests/cameras/flash fx.js
View file

@ -1,45 +0,0 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
myGame.loader.addImageFile('background', 'assets/pics/large-color-wheel.png');
myGame.loader.addImageFile('car', 'assets/sprites/car90.png');
myGame.loader.load();
}
var car;
function create() {
myGame.createSprite(0, 0, 'background');
car = myGame.createSprite(400, 300, 'car');
}
function update() {
car.renderDebugInfo(32, 32);
car.velocity.x = 0;
car.velocity.y = 0;
car.angularVelocity = 0;
car.angularAcceleration = 0;
if(myGame.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
car.angularVelocity = -200;
} else if(myGame.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
car.angularVelocity = 200;
}
if(myGame.input.keyboard.isDown(Phaser.Keyboard.UP)) {
var motion = myGame.motion.velocityFromAngle(car.angle, 300);
car.velocity.copyFrom(motion);
}
// Flash when the car hits the edges, a different colour per edge
if(car.x < 0) {
myGame.camera.flash(0xffffff, 1);
car.x = 0;
} else if(car.x > myGame.world.width) {
myGame.camera.flash(0xff0000, 2);
car.x = myGame.world.width - car.width;
}
if(car.y < 0) {
myGame.camera.flash(0xffff00, 2);
car.y = 0;
} else if(car.y > myGame.world.height) {
myGame.camera.flash(0xff00ff, 3);
car.y = myGame.world.height - car.height;
}
}
})();

45
Tests/cameras/shake fx.js
View file

@ -1,45 +0,0 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
myGame.loader.addImageFile('background', 'assets/pics/remember-me.jpg');
myGame.loader.addImageFile('car', 'assets/sprites/car90.png');
myGame.loader.load();
}
var car;
function create() {
myGame.createSprite(0, 0, 'background');
car = myGame.createSprite(400, 300, 'car');
}
function update() {
myGame.camera.renderDebugInfo(32, 32);
car.velocity.x = 0;
car.velocity.y = 0;
car.angularVelocity = 0;
car.angularAcceleration = 0;
if(myGame.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {
car.angularVelocity = -200;
} else if(myGame.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {
car.angularVelocity = 200;
}
if(myGame.input.keyboard.isDown(Phaser.Keyboard.UP)) {
var motion = myGame.motion.velocityFromAngle(car.angle, 300);
car.velocity.copyFrom(motion);
}
// Shake the camera when the car hits the edges, a different intensity per edge
if(car.x < 0) {
myGame.camera.shake();
car.x = 0;
} else if(car.x > myGame.world.width) {
myGame.camera.shake(0.02);
car.x = myGame.world.width - car.width;
}
if(car.y < 0) {
myGame.camera.shake(0.07, 1);
car.y = 0;
} else if(car.y > myGame.world.height) {
myGame.camera.shake(0.1);
car.y = myGame.world.height - car.height;
}
}
})();

42
Tests/index.php
View file

@ -33,6 +33,13 @@ if (isset($_GET['f']))
$state = substr($_GET['f'], 0, -3);
}
$mobile = false;
if (isset($_GET['m']))
{
$mobile = true;
}
?>
<!DOCTYPE html>
@ -41,7 +48,20 @@ if (isset($_GET['f']))
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1 maximum-scale=1 user-scalable=0" />
<title>Phaser Test Runner: <?php echo $state?></title>
<?php
if ($mobile)
{
?>
<link rel="stylesheet" href="phaser-mobile.css" type="text/css" />
<?php
}
else
{
?>
<link rel="stylesheet" href="phaser.css" type="text/css" />
<?php
}
?>
<script src="phaser.js"></script>
<script src="phaser-fx.js"></script>
<?php
@ -56,8 +76,16 @@ if (isset($_GET['f']))
<body>
<?php
if ($mobile)
{
?>
if ($state)
<div id="game"></div>
<?php
}
if ($state && $mobile == false)
{
?>
@ -84,13 +112,21 @@ function printJSLinks($dir, $files) {
foreach ($files as $key => $value) {
$value2 = substr($value, 0, -3);
echo "<a href=\"index.php?f=$value&amp;d=$dir\" class=\"button\">$value2</a>";
if ($dir == 'mobile')
{
echo "<a href=\"index.php?f=$value&amp;d=$dir&amp;m=1\" class=\"button\">$value2</a>";
}
else
{
echo "<a href=\"index.php?f=$value&amp;d=$dir\" class=\"button\">$value2</a>";
}
}
}
if ($state == false)
if ($state == false && $mobile == false)
{
?>

4
Tests/input/mouse scale.js
View file

@ -4,8 +4,8 @@
var myGame = new Phaser.Game(this, 'game', 320, 240, init, create, update);
function init() {
// This sets a limit on the up-scale
myGame.stage.maxScaleX = 640;
myGame.stage.maxScaleY = 480;
myGame.stage.scale.maxWidth = 640;
myGame.stage.scale.maxHeight = 480;
// Then we tell Phaser that we want it to scale up to whatever the browser can handle, but to do it proportionally
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
myGame.loader.addImageFile('melon', 'assets/sprites/melon.png');

5
Tests/input/mouse scale.ts
View file

@ -8,8 +8,9 @@
function init() {
// This sets a limit on the up-scale
myGame.stage.maxScaleX = 640;
myGame.stage.maxScaleY = 480;
myGame.stage.scale.maxWidth = 640;
myGame.stage.scale.maxHeight = 480;
// Then we tell Phaser that we want it to scale up to whatever the browser can handle, but to do it proportionally
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;

16
Tests/input/multitouch.js Normal file
View file

@ -0,0 +1,16 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
// Here we create a quite tiny game (320x240 in size)
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
// Tell Phaser that we want it to scale up to whatever the browser can handle, but to do it proportionally
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
}
function create() {
myGame.onRenderCallback = render;
}
function update() {
}
function render() {
}
})();

31
Tests/input/multitouch.ts Normal file
View file

@ -0,0 +1,31 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
// Here we create a quite tiny game (320x240 in size)
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
// Tell Phaser that we want it to scale up to whatever the browser can handle, but to do it proportionally
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
}
function create() {
myGame.onRenderCallback = render;
}
function update() {
}
function render() {
}
})();

27
Tests/cameras/fade fx.js → Tests/misc/time.js
View file

@ -2,17 +2,17 @@
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
myGame.loader.addImageFile('background', 'assets/pics/large-color-wheel.png');
myGame.loader.addImageFile('car', 'assets/sprites/car90.png');
myGame.loader.addImageFile('car', 'assets/sprites/asteroids_ship.png');
myGame.loader.load();
}
var car;
function create() {
myGame.createSprite(0, 0, 'background');
car = myGame.createSprite(400, 300, 'car');
car = myGame.createSprite(200, 300, 'car');
myGame.onRenderCallback = render;
myGame.stage.context.font = '16px Arial';
myGame.stage.context.fillStyle = 'rgb(255,255,255)';
}
function update() {
car.renderDebugInfo(32, 32);
car.velocity.x = 0;
car.velocity.y = 0;
car.angularVelocity = 0;
@ -23,20 +23,11 @@
car.angularVelocity = 200;
}
if(myGame.input.keyboard.isDown(Phaser.Keyboard.UP)) {
var motion = myGame.motion.velocityFromAngle(car.angle, 300);
var motion = myGame.motion.velocityFromAngle(car.angle, 200);
car.velocity.copyFrom(motion);
}
// Fade when the car hits the edges, a different colour per edge
if(car.x < 0) {
myGame.camera.fade(0x330066, 3);
car.x = 0;
} else if(car.x > myGame.world.width) {
myGame.camera.fade(0x000066, 3);
car.x = myGame.world.width - car.width;
}
if(car.y > myGame.world.height) {
myGame.camera.fade(0x000000, 3);
car.y = myGame.world.height - car.height;
}
}
function render() {
myGame.stage.context.fillText(myGame.time.time.toString(), 32, 32);
}
})();

58
Tests/misc/time.ts Normal file
View file

@ -0,0 +1,58 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600, init, create, update);
function init() {
myGame.loader.addImageFile('car', 'assets/sprites/asteroids_ship.png');
myGame.loader.load();
}
var car: Phaser.Sprite;
function create() {
car = myGame.createSprite(200, 300, 'car');
myGame.onRenderCallback = render;
myGame.stage.context.font = '16px Arial';
myGame.stage.context.fillStyle = 'rgb(255,255,255)';
}
function update() {
car.velocity.x = 0;
car.velocity.y = 0;
car.angularVelocity = 0;
car.angularAcceleration = 0;
if (myGame.input.keyboard.isDown(Phaser.Keyboard.LEFT))
{
car.angularVelocity = -200;
}
else if (myGame.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
{
car.angularVelocity = 200;
}
if (myGame.input.keyboard.isDown(Phaser.Keyboard.UP))
{
var motion:Phaser.Point = myGame.motion.velocityFromAngle(car.angle, 200);
car.velocity.copyFrom(motion);
}
}
function render() {
myGame.stage.context.fillText(myGame.time.time.toString(), 32, 32);
}
})();

59
Tests/mobile/bunny mobile.js Normal file
View file

@ -0,0 +1,59 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 320, 460, init, create, update);
function init() {
myGame.loader.addImageFile('bunny', 'assets/sprites/wabbit.png');
myGame.loader.load();
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
}
var maxX;
var maxY;
var minX;
var minY;
function create() {
minX = 0;
minY = 0;
maxX = myGame.stage.width - 26;
maxY = myGame.stage.height - 37;
myGame.input.touch.touchDown.add(addBunnies, this);
// This will really help on slow Android phones
myGame.framerate = 30;
// Make sure the camera doesn't clip anything
myGame.camera.disableClipping = true;
myGame.onRenderCallback = render;
myGame.stage.context.fillStyle = 'rgb(255,0,0)';
myGame.stage.context.font = '20px Arial';
addBunnies();
}
function addBunnies() {
for(var i = 0; i < 10; i++) {
var tempSprite = myGame.createSprite(myGame.stage.randomX, 0, 'bunny');
tempSprite.velocity.x = -200 + (Math.random() * 400);
tempSprite.velocity.y = 100 + Math.random() * 200;
}
}
function update() {
myGame.world.group.forEach(checkWalls);
}
function render() {
// Note: Displaying canvas text causes a big performance hit on mobile
myGame.stage.context.fillText("fps: " + myGame.time.fps.toString(), 0, 32);
}
function checkWalls(bunny) {
if(bunny.x > maxX) {
bunny.velocity.x *= -1;
bunny.x = maxX;
} else if(bunny.x < minX) {
bunny.velocity.x *= -1;
bunny.x = minX;
}
if(bunny.y > maxY) {
bunny.velocity.y *= -0.8;
bunny.y = maxY;
} else if(bunny.y < minY) {
bunny.velocity.x = -200 + (Math.random() * 400);
bunny.velocity.y = 100 + Math.random() * 200;
bunny.y = minY;
}
}
})();

95
Tests/mobile/bunny mobile.ts Normal file
View file

@ -0,0 +1,95 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 320, 460, init, create, update);
function init() {
myGame.loader.addImageFile('bunny', 'assets/sprites/wabbit.png');
myGame.loader.load();
myGame.stage.scaleMode = Phaser.StageScaleMode.SHOW_ALL;
}
var maxX: number;
var maxY: number;
var minX: number;
var minY: number;
function create() {
minX = 0;
minY = 0;
maxX = myGame.stage.width - 26;
maxY = myGame.stage.height - 37;
myGame.input.touch.touchDown.add(addBunnies, this);
// This will really help on slow Android phones
myGame.framerate = 30;
// Make sure the camera doesn't clip anything
myGame.camera.disableClipping = true;
myGame.onRenderCallback = render;
myGame.stage.context.fillStyle = 'rgb(255,0,0)';
myGame.stage.context.font = '20px Arial';
addBunnies();
}
function addBunnies() {
for (var i = 0; i < 10; i++)
{
var tempSprite = myGame.createSprite(myGame.stage.randomX, 0, 'bunny');
tempSprite.velocity.x = -200 + (Math.random() * 400);
tempSprite.velocity.y = 100 + Math.random() * 200;
}
}
function update() {
myGame.world.group.forEach(checkWalls);
}
function render() {
// Note: Displaying canvas text causes a big performance hit on mobile
myGame.stage.context.fillText("fps: " + myGame.time.fps.toString(), 0, 32);
}
function checkWalls(bunny:Phaser.Sprite) {
if (bunny.x > maxX)
{
bunny.velocity.x *= -1;
bunny.x = maxX;
}
else if (bunny.x < minX)
{
bunny.velocity.x *= -1;
bunny.x = minX;
}
if (bunny.y > maxY)
{
bunny.velocity.y *= -0.8;
bunny.y = maxY;
}
else if (bunny.y < minY)
{
bunny.velocity.x = -200 + (Math.random() * 400);
bunny.velocity.y = 100 + Math.random() * 200;
bunny.y = minY;
}
}
})();

46
Tests/mobile/sprite test 1.js Normal file
View file

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

73
Tests/mobile/sprite test 1.ts Normal file
View file

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

10
Tests/phaser-fx.js
View file

@ -137,8 +137,8 @@ var Phaser;
/**
* Phaser - FX - Camera - Mirror
*
* A Template FX file you can use to create your own Camera FX.
* If you don't use any of the methods below (i.e. preUpdate, render, etc) then DELETE THEM to avoid un-necessary calls by the FXManager.
* Creates a mirror effect for a camera.
* Can mirror the camera image horizontally, vertically or both with an optional fill color overlay.
*/
(function (Camera) {
var Mirror = (function () {
@ -159,7 +159,7 @@ var Phaser;
* It is rendered to the Stage at Mirror.x/y (note the use of Stage coordinates, not World coordinates)
*/
function (x, y, region, fillColor) {
if (typeof fillColor === "undefined") { fillColor = 'rgba(0,0,100,0.5)'; }
if (typeof fillColor === "undefined") { fillColor = 'rgba(0, 0, 100, 0.5)'; }
this.x = x;
this.y = y;
this._mirrorX = region.x;
@ -199,7 +199,6 @@ var Phaser;
if(this._mirrorColor) {
this._context.fillRect(0, 0, this._mirrorWidth, this._mirrorHeight);
}
//this._game.stage.context.save();
if(this.flipX && this.flipY) {
this._game.stage.context.transform(-1, 0, 0, -1, this._mirrorWidth, this._mirrorHeight);
this._game.stage.context.drawImage(this._canvas, -this.x, -this.y);
@ -210,8 +209,7 @@ var Phaser;
this._game.stage.context.transform(1, 0, 0, -1, 0, this._mirrorHeight);
this._game.stage.context.drawImage(this._canvas, this.x, -this.y);
}
//this._game.stage.context.restore();
};
};
return Mirror;
})();
Camera.Mirror = Mirror;

22
Tests/phaser-mobile.css Normal file
View file

@ -0,0 +1,22 @@
body
{
background: #000000;
color: white;
font: 1em/2em Arial, Helvetica;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
padding: 0;
}
* {
user-select: none;
-webkit-tap-highlight-color: rgb(0, 0, 0, 0);
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}

5
Tests/phaser.css
View file

@ -25,6 +25,11 @@
padding: 16px;
}
:-webkit-full-screen {
width: 100%;
height: 100%;
}
h1 {
font-family: 'Arial', sans-serif;
font-size: 30pt;

4163
Tests/phaser.js
View file

File diff suppressed because it is too large Load diff

4
Tests/scrollzones/blasteroids.js
View file

@ -34,6 +34,10 @@
ship = myGame.createSprite(myGame.stage.centerX, myGame.stage.centerY, 'nashwan');
// We do this because the ship was drawn facing up, but 0 degrees is pointing to the right
ship.rotationOffset = 90;
myGame.input.onDown.add(test, this);
}
function test(event) {
myGame.stage.scale.startFullScreen();
}
function update() {
ship.angularVelocity = 0;

8
Tests/scrollzones/blasteroids.ts
View file

@ -51,6 +51,14 @@
// We do this because the ship was drawn facing up, but 0 degrees is pointing to the right
ship.rotationOffset = 90;
myGame.input.onDown.add(test, this);
}
function test(event) {
myGame.stage.scale.startFullScreen();
}
function update() {

4267
build/phaser.d.ts vendored
View file

File diff suppressed because it is too large Load diff

4156
build/phaser.js
View file

File diff suppressed because it is too large Load diff