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

Large refactoring of the pause and boot screens in Stage and various other small fixes

Browse source
This commit is contained in:
Richard Davey 2013-04-29 02:41:19 +01:00
parent 9f23c378a1
commit c5cccf3283
17 changed files with 12989 additions and 184 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
Docs/phaser_logo.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 809 B

51
Phaser/Game.ts
View file

@ -95,6 +95,7 @@ module Phaser {
public device: Device;
public isBooted: bool = false;
public isRunning: bool = false;
private boot(parent: string, width: number, height: number) {
@ -124,16 +125,16 @@ module Phaser {
this.rnd = new RandomDataGenerator([(Date.now() * Math.random()).toString()]);
this.framerate = 60;
this.isBooted = true;
// Display the default game screen?
if (this.onInitCallback == null && this.onCreateCallback == null && this.onUpdateCallback == null && this.onRenderCallback == null && this._pendingState == null)
{
this.isBooted = false;
this.stage.drawInitScreen();
this._raf = new RequestAnimationFrame(this.bootLoop, this);
}
else
{
this.isBooted = true;
this.isRunning = true;
this._loadComplete = false;
this._raf = new RequestAnimationFrame(this.loop, this);
@ -160,22 +161,33 @@ module Phaser {
}
private bootLoop() {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
}
private pausedLoop() {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
if (this.onPausedCallback !== null)
{
this.onPausedCallback.call(this.callbackContext);
}
}
private loop() {
this.time.update();
this.tweens.update();
if (this._paused == true)
{
if (this.onPausedCallback !== null)
{
this.onPausedCallback.call(this.callbackContext);
}
return;
}
this.input.update();
this.stage.update();
@ -349,12 +361,21 @@ module Phaser {
if (value == true && this._paused == false)
{
this._paused = true;
this._raf.setCallback(this.pausedLoop);
}
else if (value == false && this._paused == true)
{
this._paused = false;
this.time.time = Date.now();
this.input.reset();
if (this.isRunning == false)
{
this._raf.setCallback(this.bootLoop);
}
else
{
this._raf.setCallback(this.loop);
}
}
}

8
Phaser/Phaser.csproj
View file

@ -125,6 +125,14 @@
<Content Include="SoundManager.js">
<DependentUpon>SoundManager.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="system\screens\PauseScreen.ts" />
<TypeScriptCompile Include="system\screens\BootScreen.ts" />
<Content Include="system\screens\BootScreen.js">
<DependentUpon>BootScreen.ts</DependentUpon>
</Content>
<Content Include="system\screens\PauseScreen.js">
<DependentUpon>PauseScreen.ts</DependentUpon>
</Content>
<Content Include="system\Sound.js">
<DependentUpon>Sound.ts</DependentUpon>
</Content>

4
Phaser/Phaser.ts
View file

@ -1,7 +1,7 @@
/**
* Phaser
*
* v0.9.4 - April 28th 2013
* v0.9.5 - April 28th 2013
*
* A small and feature-packed 2D canvas game framework born from the firey pits of Flixel and Kiwi.
*
@ -16,6 +16,6 @@
module Phaser {
export var VERSION: string = 'Phaser version 0.9.4';
export var VERSION: string = 'Phaser version 0.9.5';
}

17
Phaser/Signal.ts
View file

@ -211,7 +211,7 @@ module Phaser {
if (i !== -1)
{
this._bindings[i]._destroy(); //no reason to a SignalBinding exist if it isn't attached to a signal
this._bindings[i]._destroy();
this._bindings.splice(i, 1);
}
@ -224,14 +224,17 @@ module Phaser {
*/
public removeAll() {
var n: number = this._bindings.length;
while (n--)
if (this._bindings)
{
this._bindings[n]._destroy();
}
var n: number = this._bindings.length;
this._bindings.length = 0;
while (n--)
{
this._bindings[n]._destroy();
}
this._bindings.length = 0;
}
}

100
Phaser/Stage.ts
View file

@ -1,6 +1,8 @@
/// <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" />
/**
* Phaser - Stage
@ -43,6 +45,9 @@ module Phaser {
this.scaleMode = StageScaleMode.NO_SCALE;
this.scale = new StageScaleMode(this._game);
this._bootScreen = new BootScreen(this._game);
this._pauseScreen = new PauseScreen(this._game, width, height);
document.addEventListener('visibilitychange', (event) => this.visibilityChange(event), false);
document.addEventListener('webkitvisibilitychange', (event) => this.visibilityChange(event), false);
window.onblur = (event) => this.visibilityChange(event);
@ -52,7 +57,8 @@ module Phaser {
private _game: Game;
private _bgColor: string;
private _bootScreen;
private _pauseScreen;
public static ORIENTATION_LANDSCAPE: number = 0;
public static ORIENTATION_PORTRAIT: number = 1;
@ -63,6 +69,7 @@ module Phaser {
public canvas: HTMLCanvasElement;
public context: CanvasRenderingContext2D;
public disablePauseScreen: bool = false;
public disableBootScreen: bool = false;
public offset: Point;
public scale: StageScaleMode;
public scaleMode: number;
@ -82,91 +89,48 @@ module Phaser {
this.context.clearRect(0, 0, this.width, this.height);
}
}
if (this._game.isRunning == false && this.disableBootScreen == false)
{
this._bootScreen.update();
this._bootScreen.render();
}
public renderDebugInfo() {
this.context.fillStyle = 'rgb(255,255,255)';
this.context.fillText(Phaser.VERSION, 10, 20);
this.context.fillText('Game Size: ' + this.width + ' x ' + this.height, 10, 40);
this.context.fillText('x: ' + this.x + ' y: ' + this.y, 10, 60);
if (this._game.paused == true && this.disablePauseScreen == false)
{
this._pauseScreen.update();
this._pauseScreen.render();
}
}
//if (document['hidden'] === true || document['webkitHidden'] === true)
private visibilityChange(event) {
//console.log(event);
if (this.disablePauseScreen)
{
return;
}
if (event.type == 'blur' && this._game.paused == false && this._game.isBooted == true)
if (event.type === 'blur' || document['hidden'] === true || document['webkitHidden'] === true)
{
this._game.paused = true;
this.drawPauseScreen();
if (this._game.paused == false)
{
this._pauseScreen.onPaused();
this.saveCanvasValues();
this._game.paused = true;
}
}
else if (event.type == 'focus')
{
this._game.paused = false;
if (this._game.paused == true)
{
this._pauseScreen.onResume();
this._game.paused = false;
this.restoreCanvasValues();
}
}
}
public drawInitScreen() {
this.context.fillStyle = 'rgb(40, 40, 40)';
this.context.fillRect(0, 0, this.width, this.height);
this.context.fillStyle = 'rgb(255,255,255)';
this.context.font = 'bold 18px Arial';
this.context.textBaseline = 'top';
this.context.fillText(Phaser.VERSION, 54, 32);
this.context.fillText('Game Size: ' + this.width + ' x ' + this.height, 32, 64);
this.context.fillText('www.photonstorm.com', 32, 96);
this.context.font = '16px Arial';
this.context.fillText('You are seeing this screen because you didn\'t specify any default', 32, 160);
this.context.fillText('functions in the Game constructor, or use Game.loadState()', 32, 184);
var image = new Image();
var that = this;
image.onload = function () {
that.context.drawImage(image, 32, 32);
};
image.src = this._logo;
}
private drawPauseScreen() {
this.saveCanvasValues();
this.context.fillStyle = 'rgba(0, 0, 0, 0.4)';
this.context.fillRect(0, 0, this.width, this.height);
// Draw a 'play' arrow
var arrowWidth = Math.round(this.width / 2);
var arrowHeight = Math.round(this.height / 2);
var sx = this.centerX - arrowWidth / 2;
var sy = this.centerY - arrowHeight / 2;
this.context.beginPath();
this.context.moveTo(sx, sy);
this.context.lineTo(sx, sy + arrowHeight);
this.context.lineTo(sx + arrowWidth, this.centerY);
this.context.fillStyle = 'rgba(255, 255, 255, 0.8)';
this.context.fill();
this.context.closePath();
this.restoreCanvasValues();
}
private getOffset(element): Point {
var box = element.getBoundingClientRect();
@ -240,8 +204,6 @@ module Phaser {
return Math.round(Math.random() * this.bounds.height);
}
private _logo: string = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNpi/P//PwM6YGRkxBQEAqBaRnQxFmwa10d6MAjrMqMofHv5L1we2SBGmAtAktg0ogOQQYHLd8ANYYFpPtTmzUAMAFmwnsEDrAdkCAvMZlIAsiFMMAEYsKvaSrQhIMCELkGsV2AAbIC8gCQYgwKIUABiNYBf9yoYH7n7n6CzN274g2IYEyFbsNmKLIaSkHpP7WSwUfbA0ASzFQRslBlxp0RcAF0TRhggA3zhAJIDpUKU5A9KyshpHDkjFZu5g2nJMFcwXVJSgqIGnBKx5bKenh4w/XzVbgbPtlIUcVgSxuoCUgHIIIAAAwArtXwJBABO6QAAAABJRU5ErkJggg==";
}
}

2
Phaser/gameobjects/GameObject.ts
View file

@ -323,7 +323,7 @@ module Phaser {
* Checks to see if a point in 2D world space overlaps this <code>GameObject</code>.
*
* @param Point The point in world space you want to check.
* @param InScreenSpace Whether to take scroll factors numbero account when checking for overlap.
* @param InScreenSpace Whether to take scroll factors into account when checking for overlap.
* @param Camera Specify which game camera you want. If null getScreenXY() will just grab the first global camera.
*
* @return Whether or not the point overlaps this object.

4
Phaser/phaser.js
View file

@ -1,7 +1,7 @@
/**
* Phaser
*
* v0.9.4 - April 28th 2013
* v0.9.5 - April 28th 2013
*
* A small and feature-packed 2D canvas game framework born from the firey pits of Flixel and Kiwi.
*
@ -15,5 +15,5 @@
*/
var Phaser;
(function (Phaser) {
Phaser.VERSION = 'Phaser version 0.9.4';
Phaser.VERSION = 'Phaser version 0.9.5';
})(Phaser || (Phaser = {}));

3
Phaser/system/Tween.ts
View file

@ -30,6 +30,7 @@ module Phaser {
this._interpolationFunction = this._game.math.linearInterpolation;
this._easingFunction = Phaser.Easing.Linear.None;
this._chainedTweens = [];
this.onStart = new Phaser.Signal();
this.onUpdate = new Phaser.Signal();
this.onComplete = new Phaser.Signal();
@ -126,6 +127,8 @@ module Phaser {
this._manager.remove(this);
}
this.onComplete.dispose();
return this;
}

91
Phaser/system/screens/BootScreen.ts Normal file
View file

@ -0,0 +1,91 @@
/// <reference path="../../Game.ts" />
/**
* Phaser - BootScreen
*
* The BootScreen is displayed when Phaser is started without any default functions or State
*/
module Phaser {
export class BootScreen {
constructor(game:Game) {
this._game = game;
this._logo = new Image();
this._logo.src = this._logoData;
}
private _game: Game;
private _logo;
private _logoData: string = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGgAAAAZCAYAAADdYmvFAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAstJREFUeNrsWlFuwjAMbavdZGcAcRm4AXzvCPuGG8BlEJxhZ+l4TJ48z3actGGthqUI1MaO/V6cmIT2/fW10eTt46NvKshtvDZlG31yfOL9a/ldU6x4IZ0GQs0gS217enMkJYr5ixXkYrFoVqtV1kDn8/n+KfXw/Hq9Nin7h8MhScB2u3Xtav2ivsNWrh7XLcWMYqA4eUZ1kj0MAifHJEeKFojWzyIH+rL/0Cwif2AX9nN1oQOgrTg8XcTFx+ScdEOJ4WBxXQ1EjRyrn0cOzzQLzFyQSQcgw/5Qkkr0JVEQpNIdhL4vm4DL5fLulNTHcy6Uxl4/6iMLiePx2KzX6/v30+n0aynUlrnSeNq2/VN9bgM4dFPdNPmsJnIg/PuQbJmLdFN3UNu0SzbyJ0GOWJVWZE/QMkY+owrqXxGEdZA37BVyX6lJTipT6J1lf7fbqc+xh8nYeIvikatP+PGW0nEJ4jOydHYOIcfKnmgWoZDQSIIeio4Sf1IthYWskCO4vqQ6lFYjl8tl9L1H67PZbMz3VO3t93uVXHofmUjReLyMwHi5eCb3ICwJj5ZU9nCg+SzUgPYyif+2epTk4pkkyDp+eXTlZu2BkUybEkklePZfK9lPuTnc07vbmt1bYulHBeNQgx18SsH4ni/cV2rSLtqNDNUH2JQ2SsXS57Y9PHlfumkwCdICt5rnkNdPjpMiIEWgRlAJSdF4SvCQMWj+VyfI0h8D/EgWSYKiJKXi8VrOhJUxaFiFCOKKUJAtR78k9eX4USLHXqLGXOIiWUT4Vj9JiP4W0io3VDz8AJXblNWQrOimLjIGy/9uLICH6mrVmFbxEFHauzmc0fGJJmPg/v+6D0oB7N2bj0FsNHtSWTQniWTR931QlHXvasDTHXLjqY0/1/8hSDxACD+lAGH8dKQbQk5N3TFtzDmLWutvV0+pL5FVoHvCNG35FGAAayS4KUoKC9QAAAAASUVORK5CYII=";
private _color1 = { r: 20, g: 20, b: 20 };
private _color2 = { r: 200, g: 200, b: 200 };
private _fade: Phaser.Tween = null;
public update() {
if (this._fade == null)
{
this.colorCycle();
}
this._color1.r = Math.round(this._color1.r);
this._color1.g = Math.round(this._color1.g);
this._color1.b = Math.round(this._color1.b);
this._color2.r = Math.round(this._color2.r);
this._color2.g = Math.round(this._color2.g);
this._color2.b = Math.round(this._color2.b);
}
public render() {
var grd = this._game.stage.context.createLinearGradient(0, 0, 0, this._game.stage.height);
grd.addColorStop(0, 'rgb(' + this._color1.r + ', ' + this._color1.g + ', ' + this._color1.b + ')');
grd.addColorStop(0.5, 'rgb(' + this._color2.r + ', ' + this._color2.g + ', ' + this._color2.b + ')');
grd.addColorStop(1, 'rgb(' + this._color1.r + ', ' + this._color1.g + ', ' + this._color1.b + ')');
this._game.stage.context.fillStyle = grd;
this._game.stage.context.fillRect(0, 0, this._game.stage.width, this._game.stage.height);
this._game.stage.context.shadowOffsetX = 0;
this._game.stage.context.shadowOffsetY = 0;
if (this._logo)
{
this._game.stage.context.drawImage(this._logo, 32, 32);
}
this._game.stage.context.shadowColor = 'rgb(0,0,0)';
this._game.stage.context.shadowOffsetX = 1;
this._game.stage.context.shadowOffsetY = 1;
this._game.stage.context.shadowBlur = 0;
this._game.stage.context.fillStyle = 'rgb(255,255,255)';
this._game.stage.context.font = 'bold 18px Arial';
this._game.stage.context.textBaseline = 'top';
this._game.stage.context.fillText(Phaser.VERSION, 32, 64+32);
this._game.stage.context.fillText('Game Size: ' + this._game.stage.width + ' x ' + this._game.stage.height, 32, 64+64);
this._game.stage.context.fillText('www.photonstorm.com', 32, 64+96);
this._game.stage.context.font = '16px Arial';
this._game.stage.context.fillText('You are seeing this screen because you didn\'t specify any default', 32, 64+160);
this._game.stage.context.fillText('functions in the Game constructor or use Game.switchState()', 32, 64+184);
}
private colorCycle() {
this._fade = this._game.createTween(this._color2);
this._fade.to({ r: Math.random() * 250, g: Math.random() * 250, b: Math.random() * 250 }, 3000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.colorCycle, this);
this._fade.start();
}
}
}

98
Phaser/system/screens/PauseScreen.ts Normal file
View file

@ -0,0 +1,98 @@
/// <reference path="../../Game.ts" />
/**
* Phaser - PauseScreen
*
* The PauseScreen is displayed whenever the game loses focus or the player switches to another browser tab.
*/
module Phaser {
export class PauseScreen {
constructor(game: Game, width: number, height: number) {
this._game = game;
this._canvas = <HTMLCanvasElement> document.createElement('canvas');
this._canvas.width = width;
this._canvas.height = height;
this._context = this._canvas.getContext('2d');
}
private _game: Game;
private _canvas: HTMLCanvasElement;
private _context: CanvasRenderingContext2D;
private _color;
private _fade: Phaser.Tween;
// Called when the game enters pause mode
public onPaused() {
// Take a grab of the current canvas to our temporary one
this._context.clearRect(0, 0, this._canvas.width, this._canvas.height);
this._context.drawImage(this._game.stage.canvas, 0, 0);
this._color = { r: 255, g: 255, b: 255 };
this.fadeOut();
}
public onResume() {
this._fade.stop();
this._game.tweens.remove(this._fade);
}
public update() {
this._color.r = Math.round(this._color.r);
this._color.g = Math.round(this._color.g);
this._color.b = Math.round(this._color.b);
}
public render() {
this._game.stage.context.drawImage(this._canvas, 0, 0);
this._game.stage.context.fillStyle = 'rgba(0, 0, 0, 0.4)';
this._game.stage.context.fillRect(0, 0, this._game.stage.width, this._game.stage.height);
// Draw a 'play' arrow
var arrowWidth = Math.round(this._game.stage.width / 2);
var arrowHeight = Math.round(this._game.stage.height / 2);
var sx = this._game.stage.centerX - arrowWidth / 2;
var sy = this._game.stage.centerY - arrowHeight / 2;
this._game.stage.context.beginPath();
this._game.stage.context.moveTo(sx, sy);
this._game.stage.context.lineTo(sx, sy + arrowHeight);
this._game.stage.context.lineTo(sx + arrowWidth, this._game.stage.centerY);
this._game.stage.context.fillStyle = 'rgba(' + this._color.r + ', ' + this._color.g + ', ' + this._color.b + ', 0.8)';
this._game.stage.context.fill();
this._game.stage.context.closePath();
}
private fadeOut() {
this._fade = this._game.createTween(this._color);
this._fade.to({ r: 50, g: 50, b: 50 }, 1000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.fadeIn, this);
this._fade.start();
}
private fadeIn() {
this._fade = this._game.createTween(this._color);
this._fade.to({ r: 255, g: 255, b: 255 }, 1000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.fadeOut, this);
this._fade.start();
}
}
}

52
README.md
View file

@ -1,15 +1,15 @@
Phaser
======
Version: 0.9.4 Released: 28th April 2013
Version: 0.9.5 - Released: XXX 2013
By Richard Davey, [Photon Storm](http://www.photonstorm.com)
Phaser is a 2D JavaScript/TypeScript HTML5 Game Framework based heavily on [Flixel](http://www.flixel.org).
Follow us on [twitter](https://twitter.com/photonstorm) and our [blog](http://www.photonstorm.com) for development updates.
For support post to the Phaser board on the [HTML5 Game Devs forum](http://www.html5gamedevs.com/forum/14-phaser/)
[Twitter](https://twitter.com/photonstorm)
[Development Blog](http://www.photonstorm.com)
[Support Forum](http://www.html5gamedevs.com/forum/14-phaser/)
Try out the [Phaser Test Suite](http://gametest.mobi/phaser/)
@ -18,17 +18,14 @@ Try out the [Phaser Test Suite](http://gametest.mobi/phaser/)
Latest Update
-------------
V0.9.4
V0.9.5
* Added Tilemap.getTile, getTileFromWorldXY, getTileFromInputXY
* Added Tilemap.setCollisionByIndex and setCollisionByRange
* Added GameObject.renderRotation boolean to control if the sprite will visually rotate or not (useful when angle needs to change but graphics don't)
* Added additional check to Camera.width/height so you cannot set them larger than the Stage size
* Added Collision.separateTile and Tilemap.collide
* Fixed Tilemap bounds check if map was smaller than game dimensions
* Fixed: Made World._cameras public, World.cameras and turned Game.camera into a getter for it (thanks Hackmaniac)
* Fixed: Circle.isEmpty properly checks diameter (thanks bapuna)
* Updated Gruntfile to export new version of phaser.js wrapped in a UMD block for require.js/commonJS (thanks Hackmaniac)
* Moved the BootScreen and PauseScreen out of Stage into their own classes (system/screens/BootScreen and PauseScreen)
* Updated the PauseScreen to show a subtle animation effect, making it easier to create your own interesting pause screens.
* Modified Game so it splits into 3 loops - bootLoop, pauseLoop and loop (the core loop)
* Updated the BootScreen with the new logo and new color cycle effect
* Added Game.isRunning - set to true once the Game.boot process is over IF you gave some functions to the constructor or a state
* Fixed small bug in Signal.removeAll where it could try to shorten the _bindings even if undefined
Requirements
------------
@ -37,7 +34,11 @@ 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.
Phaser is 147KB minified and just 30KB gzipped (sizes accurate as of version 0.7)
If you are compiling via TypeScript from the command-line please use `--target ES5` and `--nolib`
If you need it the included Grunt file will generate a RequireJS/CommonJS version of Phaser on build.
Phaser is just 45KB gzipped and minified.
Features
--------
@ -108,7 +109,7 @@ Phaser fully or partially supports the following features. This list is growing
* Tilemaps<br />
Support for CSV and Tiled JSON format tile maps is implemented but currently limited.
Support for CSV and Tiled JSON format tile maps. Supports Layered Tiled maps and layer based collision.
* Game Scaling<br />
@ -121,13 +122,12 @@ Work in Progress
We've a number of features that we know Phaser is lacking, here is our current priority list:
* Tilemap collision and layers
* Better sound controls
* MSPointer support
* Text Rendering
* Buttons
Beyond this there are lots of other things we plan to add such as WebGL support, Spline animation format support, sloped collision tiles, path finding and support for custom plugins. But the list above are more priority items and is by no means exhaustive either! However we do feel that the core structure of Phaser is now pretty locked down, so safe to use for small scale production games.
Beyond this there are lots of other things we plan to add such as WebGL support, Spline animation format support, sloped collision tiles, path finding and support for custom plugins. But the list above are priority items, and by no means exhaustive either! However we do feel that the core structure of Phaser is now tightly locked down, so safe to use for small scale production games.
Test Suite
----------
@ -142,6 +142,8 @@ Make sure you can browse to the Tests folder via your web server. If you've got
Right now the Test Suite requires PHP, but we will remove this requirement soon.
You can also browse the [Phaser Test Suite](http://gametest.mobi/phaser/) online.
Contributing
------------
@ -151,7 +153,7 @@ If you find a bug (highly likely!) then please report it on github.
If you have a feature request, or have written a small game or demo that shows Phaser in use, then please get in touch. We'd love to hear from you.
You can do this on the Phased board on the [HTML5 Game Devs forum](http://www.html5gamedevs.com/forum/14-phaser/) or email: rich@photonstorm.com
You can do this on the Phaser board that is part of the [HTML5 Game Devs forum](http://www.html5gamedevs.com/forum/14-phaser/) or email: rich@photonstorm.com
Bugs?
-----
@ -163,6 +165,18 @@ Please add them to the [Issue Tracker][1] with as much info as possible.
Change Log
----------
V0.9.4
* Added Tilemap.getTile, getTileFromWorldXY, getTileFromInputXY
* Added Tilemap.setCollisionByIndex and setCollisionByRange
* Added GameObject.renderRotation boolean to control if the sprite will visually rotate or not (useful when angle needs to change but graphics don't)
* Added additional check to Camera.width/height so you cannot set them larger than the Stage size
* Added Collision.separateTile and Tilemap.collide
* Fixed Tilemap bounds check if map was smaller than game dimensions
* Fixed: Made World._cameras public, World.cameras and turned Game.camera into a getter for it (thanks Hackmaniac)
* Fixed: Circle.isEmpty properly checks diameter (thanks bapuna)
* Updated Gruntfile to export new version of phaser.js wrapped in a UMD block for require.js/commonJS (thanks Hackmaniac)
V0.9.3
* Added the new ScrollZone game object. Endlessly useful but especially for scrolling backdrops. Created 6 example tests.

4
Tests/Tests.csproj
View file

@ -99,6 +99,10 @@
<TypeScriptCompile Include="sprites\align.ts" />
<TypeScriptCompile Include="scrollzones\simple scrollzone.ts" />
<TypeScriptCompile Include="scrollzones\ballscroller.ts" />
<TypeScriptCompile Include="misc\bootscreen.ts" />
<Content Include="misc\bootscreen.js">
<DependentUpon>bootscreen.ts</DependentUpon>
</Content>
<Content Include="scrollzones\ballscroller.js">
<DependentUpon>ballscroller.ts</DependentUpon>
</Content>

4
Tests/misc/bootscreen.js Normal file
View file

@ -0,0 +1,4 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600);
})();

7
Tests/misc/bootscreen.ts Normal file
View file

@ -0,0 +1,7 @@
/// <reference path="../../Phaser/Game.ts" />
(function () {
var myGame = new Phaser.Game(this, 'game', 800, 600);
})();

286
Tests/phaser.js
View file

@ -354,8 +354,7 @@ var Phaser;
this.validateListener(listener, 'remove');
var i = this._indexOfListener(listener, context);
if(i !== -1) {
this._bindings[i]._destroy()//no reason to a SignalBinding exist if it isn't attached to a signal
;
this._bindings[i]._destroy();
this._bindings.splice(i, 1);
}
return listener;
@ -364,11 +363,13 @@ var Phaser;
* Remove all listeners from the Signal.
*/
function () {
var n = this._bindings.length;
while(n--) {
this._bindings[n]._destroy();
if(this._bindings) {
var n = this._bindings.length;
while(n--) {
this._bindings[n]._destroy();
}
this._bindings.length = 0;
}
this._bindings.length = 0;
};
Signal.prototype.getNumListeners = /**
* @return {number} Number of listeners attached to the Signal.
@ -656,7 +657,7 @@ var Phaser;
* Checks to see if a point in 2D world space overlaps this <code>GameObject</code>.
*
* @param Point The point in world space you want to check.
* @param InScreenSpace Whether to take scroll factors numbero account when checking for overlap.
* @param InScreenSpace Whether to take scroll factors into account when checking for overlap.
* @param Camera Specify which game camera you want. If null getScreenXY() will just grab the first global camera.
*
* @return Whether or not the point overlaps this object.
@ -7619,7 +7620,7 @@ var Phaser;
/**
* Phaser
*
* v0.9.4 - April 28th 2013
* v0.9.5 - April 28th 2013
*
* A small and feature-packed 2D canvas game framework born from the firey pits of Flixel and Kiwi.
*
@ -7633,7 +7634,7 @@ var Phaser;
*/
var Phaser;
(function (Phaser) {
Phaser.VERSION = 'Phaser version 0.9.4';
Phaser.VERSION = 'Phaser version 0.9.5';
})(Phaser || (Phaser = {}));
/// <reference path="../Game.ts" />
/**
@ -7743,9 +7744,166 @@ var Phaser;
})();
Phaser.StageScaleMode = StageScaleMode;
})(Phaser || (Phaser = {}));
/// <reference path="../../Game.ts" />
/**
* Phaser - BootScreen
*
* The BootScreen is displayed when Phaser is started without any default functions or State
*/
var Phaser;
(function (Phaser) {
var BootScreen = (function () {
function BootScreen(game) {
this._logoData = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGgAAAAZCAYAAADdYmvFAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAstJREFUeNrsWlFuwjAMbavdZGcAcRm4AXzvCPuGG8BlEJxhZ+l4TJ48z3actGGthqUI1MaO/V6cmIT2/fW10eTt46NvKshtvDZlG31yfOL9a/ldU6x4IZ0GQs0gS217enMkJYr5ixXkYrFoVqtV1kDn8/n+KfXw/Hq9Nin7h8MhScB2u3Xtav2ivsNWrh7XLcWMYqA4eUZ1kj0MAifHJEeKFojWzyIH+rL/0Cwif2AX9nN1oQOgrTg8XcTFx+ScdEOJ4WBxXQ1EjRyrn0cOzzQLzFyQSQcgw/5Qkkr0JVEQpNIdhL4vm4DL5fLulNTHcy6Uxl4/6iMLiePx2KzX6/v30+n0aynUlrnSeNq2/VN9bgM4dFPdNPmsJnIg/PuQbJmLdFN3UNu0SzbyJ0GOWJVWZE/QMkY+owrqXxGEdZA37BVyX6lJTipT6J1lf7fbqc+xh8nYeIvikatP+PGW0nEJ4jOydHYOIcfKnmgWoZDQSIIeio4Sf1IthYWskCO4vqQ6lFYjl8tl9L1H67PZbMz3VO3t93uVXHofmUjReLyMwHi5eCb3ICwJj5ZU9nCg+SzUgPYyif+2epTk4pkkyDp+eXTlZu2BkUybEkklePZfK9lPuTnc07vbmt1bYulHBeNQgx18SsH4ni/cV2rSLtqNDNUH2JQ2SsXS57Y9PHlfumkwCdICt5rnkNdPjpMiIEWgRlAJSdF4SvCQMWj+VyfI0h8D/EgWSYKiJKXi8VrOhJUxaFiFCOKKUJAtR78k9eX4USLHXqLGXOIiWUT4Vj9JiP4W0io3VDz8AJXblNWQrOimLjIGy/9uLICH6mrVmFbxEFHauzmc0fGJJmPg/v+6D0oB7N2bj0FsNHtSWTQniWTR931QlHXvasDTHXLjqY0/1/8hSDxACD+lAGH8dKQbQk5N3TFtzDmLWutvV0+pL5FVoHvCNG35FGAAayS4KUoKC9QAAAAASUVORK5CYII=";
this._color1 = {
r: 20,
g: 20,
b: 20
};
this._color2 = {
r: 200,
g: 200,
b: 200
};
this._fade = null;
this._game = game;
this._logo = new Image();
this._logo.src = this._logoData;
}
BootScreen.prototype.update = function () {
if(this._fade == null) {
this.colorCycle();
}
this._color1.r = Math.round(this._color1.r);
this._color1.g = Math.round(this._color1.g);
this._color1.b = Math.round(this._color1.b);
this._color2.r = Math.round(this._color2.r);
this._color2.g = Math.round(this._color2.g);
this._color2.b = Math.round(this._color2.b);
};
BootScreen.prototype.render = function () {
var grd = this._game.stage.context.createLinearGradient(0, 0, 0, this._game.stage.height);
grd.addColorStop(0, 'rgb(' + this._color1.r + ', ' + this._color1.g + ', ' + this._color1.b + ')');
grd.addColorStop(0.5, 'rgb(' + this._color2.r + ', ' + this._color2.g + ', ' + this._color2.b + ')');
grd.addColorStop(1, 'rgb(' + this._color1.r + ', ' + this._color1.g + ', ' + this._color1.b + ')');
this._game.stage.context.fillStyle = grd;
this._game.stage.context.fillRect(0, 0, this._game.stage.width, this._game.stage.height);
this._game.stage.context.shadowOffsetX = 0;
this._game.stage.context.shadowOffsetY = 0;
if(this._logo) {
this._game.stage.context.drawImage(this._logo, 32, 32);
}
this._game.stage.context.shadowColor = 'rgb(0,0,0)';
this._game.stage.context.shadowOffsetX = 1;
this._game.stage.context.shadowOffsetY = 1;
this._game.stage.context.shadowBlur = 0;
this._game.stage.context.fillStyle = 'rgb(255,255,255)';
this._game.stage.context.font = 'bold 18px Arial';
this._game.stage.context.textBaseline = 'top';
this._game.stage.context.fillText(Phaser.VERSION, 32, 64 + 32);
this._game.stage.context.fillText('Game Size: ' + this._game.stage.width + ' x ' + this._game.stage.height, 32, 64 + 64);
this._game.stage.context.fillText('www.photonstorm.com', 32, 64 + 96);
this._game.stage.context.font = '16px Arial';
this._game.stage.context.fillText('You are seeing this screen because you didn\'t specify any default', 32, 64 + 160);
this._game.stage.context.fillText('functions in the Game constructor or use Game.switchState()', 32, 64 + 184);
};
BootScreen.prototype.colorCycle = function () {
this._fade = this._game.createTween(this._color2);
this._fade.to({
r: Math.random() * 250,
g: Math.random() * 250,
b: Math.random() * 250
}, 3000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.colorCycle, this);
this._fade.start();
};
return BootScreen;
})();
Phaser.BootScreen = BootScreen;
})(Phaser || (Phaser = {}));
/// <reference path="../../Game.ts" />
/**
* Phaser - PauseScreen
*
* The PauseScreen is displayed whenever the game loses focus or the player switches to another browser tab.
*/
var Phaser;
(function (Phaser) {
var PauseScreen = (function () {
function PauseScreen(game, width, height) {
this._game = game;
this._canvas = document.createElement('canvas');
this._canvas.width = width;
this._canvas.height = height;
this._context = this._canvas.getContext('2d');
}
PauseScreen.prototype.onPaused = // Called when the game enters pause mode
function () {
// Take a grab of the current canvas to our temporary one
this._context.clearRect(0, 0, this._canvas.width, this._canvas.height);
this._context.drawImage(this._game.stage.canvas, 0, 0);
this._color = {
r: 255,
g: 255,
b: 255
};
this.fadeOut();
};
PauseScreen.prototype.onResume = function () {
this._fade.stop();
this._game.tweens.remove(this._fade);
};
PauseScreen.prototype.update = function () {
this._color.r = Math.round(this._color.r);
this._color.g = Math.round(this._color.g);
this._color.b = Math.round(this._color.b);
};
PauseScreen.prototype.render = function () {
this._game.stage.context.drawImage(this._canvas, 0, 0);
this._game.stage.context.fillStyle = 'rgba(0, 0, 0, 0.4)';
this._game.stage.context.fillRect(0, 0, this._game.stage.width, this._game.stage.height);
// Draw a 'play' arrow
var arrowWidth = Math.round(this._game.stage.width / 2);
var arrowHeight = Math.round(this._game.stage.height / 2);
var sx = this._game.stage.centerX - arrowWidth / 2;
var sy = this._game.stage.centerY - arrowHeight / 2;
this._game.stage.context.beginPath();
this._game.stage.context.moveTo(sx, sy);
this._game.stage.context.lineTo(sx, sy + arrowHeight);
this._game.stage.context.lineTo(sx + arrowWidth, this._game.stage.centerY);
this._game.stage.context.fillStyle = 'rgba(' + this._color.r + ', ' + this._color.g + ', ' + this._color.b + ', 0.8)';
this._game.stage.context.fill();
this._game.stage.context.closePath();
};
PauseScreen.prototype.fadeOut = function () {
this._fade = this._game.createTween(this._color);
this._fade.to({
r: 50,
g: 50,
b: 50
}, 1000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.fadeIn, this);
this._fade.start();
};
PauseScreen.prototype.fadeIn = function () {
this._fade = this._game.createTween(this._color);
this._fade.to({
r: 255,
g: 255,
b: 255
}, 1000, Phaser.Easing.Linear.None);
this._fade.onComplete.add(this.fadeOut, this);
this._fade.start();
};
return PauseScreen;
})();
Phaser.PauseScreen = PauseScreen;
})(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" />
/**
* Phaser - Stage
*
@ -7759,11 +7917,11 @@ var Phaser;
var _this = this;
this.clear = true;
this.disablePauseScreen = false;
this.disableBootScreen = false;
this.minScaleX = null;
this.maxScaleX = null;
this.minScaleY = null;
this.maxScaleY = null;
this._logo = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNpi/P//PwM6YGRkxBQEAqBaRnQxFmwa10d6MAjrMqMofHv5L1we2SBGmAtAktg0ogOQQYHLd8ANYYFpPtTmzUAMAFmwnsEDrAdkCAvMZlIAsiFMMAEYsKvaSrQhIMCELkGsV2AAbIC8gCQYgwKIUABiNYBf9yoYH7n7n6CzN274g2IYEyFbsNmKLIaSkHpP7WSwUfbA0ASzFQRslBlxp0RcAF0TRhggA3zhAJIDpUKU5A9KyshpHDkjFZu5g2nJMFcwXVJSgqIGnBKx5bKenh4w/XzVbgbPtlIUcVgSxuoCUgHIIIAAAwArtXwJBABO6QAAAABJRU5ErkJggg==";
this._game = game;
this.canvas = document.createElement('canvas');
this.canvas.width = width;
@ -7783,6 +7941,8 @@ var Phaser;
this.aspectRatio = width / height;
this.scaleMode = Phaser.StageScaleMode.NO_SCALE;
this.scale = new Phaser.StageScaleMode(this._game);
this._bootScreen = new Phaser.BootScreen(this._game);
this._pauseScreen = new Phaser.PauseScreen(this._game, width, height);
document.addEventListener('visibilitychange', function (event) {
return _this.visibilityChange(event);
}, false);
@ -7804,63 +7964,33 @@ 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 == true && this.disablePauseScreen == false) {
this._pauseScreen.update();
this._pauseScreen.render();
}
};
Stage.prototype.renderDebugInfo = function () {
this.context.fillStyle = 'rgb(255,255,255)';
this.context.fillText(Phaser.VERSION, 10, 20);
this.context.fillText('Game Size: ' + this.width + ' x ' + this.height, 10, 40);
this.context.fillText('x: ' + this.x + ' y: ' + this.y, 10, 60);
};
Stage.prototype.visibilityChange = //if (document['hidden'] === true || document['webkitHidden'] === true)
function (event) {
//console.log(event);
Stage.prototype.visibilityChange = function (event) {
if(this.disablePauseScreen) {
return;
}
if(event.type == 'blur' && this._game.paused == false && this._game.isBooted == true) {
this._game.paused = true;
this.drawPauseScreen();
if(event.type === 'blur' || document['hidden'] === true || document['webkitHidden'] === true) {
if(this._game.paused == false) {
this._pauseScreen.onPaused();
this.saveCanvasValues();
this._game.paused = true;
}
} else if(event.type == 'focus') {
this._game.paused = false;
if(this._game.paused == true) {
this._pauseScreen.onResume();
this._game.paused = false;
this.restoreCanvasValues();
}
}
};
Stage.prototype.drawInitScreen = function () {
this.context.fillStyle = 'rgb(40, 40, 40)';
this.context.fillRect(0, 0, this.width, this.height);
this.context.fillStyle = 'rgb(255,255,255)';
this.context.font = 'bold 18px Arial';
this.context.textBaseline = 'top';
this.context.fillText(Phaser.VERSION, 54, 32);
this.context.fillText('Game Size: ' + this.width + ' x ' + this.height, 32, 64);
this.context.fillText('www.photonstorm.com', 32, 96);
this.context.font = '16px Arial';
this.context.fillText('You are seeing this screen because you didn\'t specify any default', 32, 160);
this.context.fillText('functions in the Game constructor, or use Game.loadState()', 32, 184);
var image = new Image();
var that = this;
image.onload = function () {
that.context.drawImage(image, 32, 32);
};
image.src = this._logo;
};
Stage.prototype.drawPauseScreen = function () {
this.saveCanvasValues();
this.context.fillStyle = 'rgba(0, 0, 0, 0.4)';
this.context.fillRect(0, 0, this.width, this.height);
// Draw a 'play' arrow
var arrowWidth = Math.round(this.width / 2);
var arrowHeight = Math.round(this.height / 2);
var sx = this.centerX - arrowWidth / 2;
var sy = this.centerY - arrowHeight / 2;
this.context.beginPath();
this.context.moveTo(sx, sy);
this.context.lineTo(sx, sy + arrowHeight);
this.context.lineTo(sx + arrowWidth, this.centerY);
this.context.fillStyle = 'rgba(255, 255, 255, 0.8)';
this.context.fill();
this.context.closePath();
this.restoreCanvasValues();
};
Stage.prototype.getOffset = function (element) {
var box = element.getBoundingClientRect();
var clientTop = element.clientTop || document.body.clientTop || 0;
@ -8458,6 +8588,7 @@ var Phaser;
this._manager = this._game.tweens;
this._interpolationFunction = this._game.math.linearInterpolation;
this._easingFunction = Phaser.Easing.Linear.None;
this._chainedTweens = [];
this.onStart = new Phaser.Signal();
this.onUpdate = new Phaser.Signal();
this.onComplete = new Phaser.Signal();
@ -8509,6 +8640,7 @@ var Phaser;
if(this._manager !== null) {
this._manager.remove(this);
}
this.onComplete.dispose();
return this;
};
Object.defineProperty(Tween.prototype, "parent", {
@ -11682,6 +11814,7 @@ var Phaser;
this.onRenderCallback = null;
this.onPausedCallback = null;
this.isBooted = false;
this.isRunning = false;
this.callbackContext = callbackContext;
this.onInitCallback = initCallback;
this.onCreateCallback = createCallback;
@ -11726,12 +11859,12 @@ var Phaser;
(Date.now() * Math.random()).toString()
]);
this.framerate = 60;
this.isBooted = true;
// Display the default game screen?
if(this.onInitCallback == null && this.onCreateCallback == null && this.onUpdateCallback == null && this.onRenderCallback == null && this._pendingState == null) {
this.isBooted = false;
this.stage.drawInitScreen();
this._raf = new Phaser.RequestAnimationFrame(this.bootLoop, this);
} else {
this.isBooted = true;
this.isRunning = true;
this._loadComplete = false;
this._raf = new Phaser.RequestAnimationFrame(this.loop, this);
if(this._pendingState) {
@ -11746,15 +11879,24 @@ var Phaser;
// Called when the loader has finished after init was run
this._loadComplete = true;
};
Game.prototype.bootLoop = function () {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
};
Game.prototype.pausedLoop = function () {
this.time.update();
this.tweens.update();
this.input.update();
this.stage.update();
if(this.onPausedCallback !== null) {
this.onPausedCallback.call(this.callbackContext);
}
};
Game.prototype.loop = function () {
this.time.update();
this.tweens.update();
if(this._paused == true) {
if(this.onPausedCallback !== null) {
this.onPausedCallback.call(this.callbackContext);
}
return;
}
this.input.update();
this.stage.update();
this._accumulator += this.time.delta;
@ -11874,10 +12016,16 @@ var Phaser;
set: function (value) {
if(value == true && this._paused == false) {
this._paused = true;
this._raf.setCallback(this.pausedLoop);
} else if(value == false && this._paused == true) {
this._paused = false;
this.time.time = Date.now();
this.input.reset();
if(this.isRunning == false) {
this._raf.setCallback(this.bootLoop);
} else {
this._raf.setCallback(this.loop);
}
}
},
enumerable: true,

12442
build/phaser.js Normal file
View file

File diff suppressed because it is too large Load diff