Set the default camera to direct itself to the Stage.

This commit is contained in:
Richard Davey
2013-08-09 18:44:45 +01:00
parent f9776f30fc
commit 0b1bcaf270
19 changed files with 376 additions and 172 deletions
+4
View File
@@ -126,6 +126,10 @@
<DependentUpon>world sprite.ts</DependentUpon>
</Content>
<TypeScriptCompile Include="groups\bring to top 1.ts" />
<TypeScriptCompile Include="display\render crisp.ts" />
<Content Include="display\render crisp.js">
<DependentUpon>render crisp.ts</DependentUpon>
</Content>
<Content Include="groups\add to group 1.ts" />
<Content Include="groups\add to group 2.ts" />
<Content Include="groups\bring to top 1.js">
+2
View File
@@ -31,8 +31,10 @@
function clickedIt() {
if (this.image.visible == true) {
game.stage.backgroundColor = '';
this.image.visible = false;
} else {
game.stage.backgroundColor = 'rgb(0,0,0)';
this.image.visible = true;
}
}
+28
View File
@@ -0,0 +1,28 @@
/// <reference path="../../Phaser/_definitions.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, preload, create);
function preload() {
game.load.image('boss', 'assets/misc/boss1.png');
game.load.spritesheet('button', 'assets/buttons/button_sprite_sheet.png', 193, 71);
}
var boss;
var button;
function create() {
// For browsers that support it, this keeps our pixel art looking crisp
Phaser.CanvasUtils.setSmoothingEnabled(game.stage.context, false);
boss = game.add.sprite(game.stage.centerX, game.stage.centerY, 'boss');
boss.origin.setTo(0.5, 0.5);
// Zoom in each time we press it
button = game.add.button(32, 32, 'button', clickedIt, this, 2, 1, 0);
}
function clickedIt() {
boss.scale.x += 0.5;
boss.scale.y += 0.5;
}
})();
+37
View File
@@ -0,0 +1,37 @@
/// <reference path="../../Phaser/_definitions.ts" />
(function () {
var game = new Phaser.Game(this, 'game', 800, 600, preload, create);
function preload() {
game.load.image('boss', 'assets/misc/boss1.png');
game.load.spritesheet('button', 'assets/buttons/button_sprite_sheet.png', 193, 71);
}
var boss: Phaser.Sprite;
var button: Phaser.UI.Button;
function create() {
// For browsers that support it, this keeps our pixel art looking crisp
Phaser.CanvasUtils.setSmoothingEnabled(game.stage.context, false);
boss = game.add.sprite(game.stage.centerX, game.stage.centerY, 'boss');
boss.origin.setTo(0.5, 0.5);
// Zoom in each time we press it
button = game.add.button(32, 32, 'button', clickedIt, this, 2, 1, 0);
}
function clickedIt() {
boss.scale.x += 0.5;
boss.scale.y += 0.5;
}
})();
+126 -42
View File
@@ -1,5 +1,29 @@
/// <reference path="_definitions.ts" />
/**
* Phaser - http://www.phaser.io
*
* v1.0.0 - August 12th 2013
*
* A feature-packed 2D canvas game framework born from the firey pits of Flixel and
* constructed via plenty of blood, sweat, tears and coffee by Richard Davey (@photonstorm).
*
* Many thanks to Adam Saltsman (@ADAMATOMIC) for releasing Flixel, from both which Phaser
* and my love of game development originate.
*
* Follow Phaser progress at http://www.photonstorm.com
*
* "If you want your children to be intelligent, read them fairy tales."
* "If you want them to be more intelligent, read them more fairy tales."
* -- Albert Einstein
*/
var Phaser;
(function (Phaser) {
Phaser.VERSION = 'Phaser version 1.0.0';
Phaser.GAMES = [];
})(Phaser || (Phaser = {}));
/// <reference path="_definitions.ts" />
/**
* Types
*
* This file contains all constants used through-out Phaser.
@@ -5320,10 +5344,13 @@ var Phaser;
this.texture = new Phaser.Display.Texture(this);
// We create a hidden canvas for our camera the size of the game (we use the screenView to clip the render to the camera size)
this.texture.canvas = document.createElement('canvas');
this.texture.canvas.width = width;
this.texture.canvas.height = height;
this._canvas = document.createElement('canvas');
this._canvas.width = width;
this._canvas.height = height;
this._renderLocal = true;
this.texture.canvas = this._canvas;
this.texture.context = this.texture.canvas.getContext('2d');
this.texture.backgroundColor = this.game.stage.backgroundColor;
// Handy proxies
this.scale = this.transform.scale;
@@ -5349,6 +5376,24 @@ var Phaser;
configurable: true
});
Object.defineProperty(Camera.prototype, "directToStage", {
set: function (value) {
if (value) {
this._renderLocal = false;
this.texture.canvas = this.game.stage.canvas;
Phaser.CanvasUtils.setBackgroundColor(this.texture.canvas, this.game.stage.backgroundColor);
} else {
this._renderLocal = true;
this.texture.canvas = this._canvas;
Phaser.CanvasUtils.setBackgroundColor(this.texture.canvas, this.texture.backgroundColor);
}
this.texture.context = this.texture.canvas.getContext('2d');
},
enumerable: true,
configurable: true
});
/**
* Hides an object from this Camera. Hidden objects are not rendered.
* The object must implement a public cameraBlacklist property.
@@ -5697,6 +5742,8 @@ var Phaser;
this.defaultCamera = this.addCamera(x, y, width, height);
this.defaultCamera.directToStage = true;
this.current = this.defaultCamera;
}
/**
@@ -19162,25 +19209,15 @@ var Phaser;
this.canvas = document.createElement('canvas');
this.canvas.width = width;
this.canvas.height = height;
this.context = this.canvas.getContext('2d');
if ((parent !== '' || parent !== null) && document.getElementById(parent)) {
document.getElementById(parent).appendChild(this.canvas);
document.getElementById(parent).style.overflow = 'hidden';
} else {
document.body.appendChild(this.canvas);
}
Phaser.CanvasUtils.addToDOM(this.canvas, parent, true);
Phaser.CanvasUtils.setTouchAction(this.canvas);
// Consume default actions on the canvas
this.canvas.style.msTouchAction = 'none';
this.canvas.style['ms-touch-action'] = 'none';
this.canvas.style['touch-action'] = 'none';
this.canvas.style.backgroundColor = 'rgb(0,0,0)';
this.canvas.oncontextmenu = function (event) {
event.preventDefault();
};
this.context = this.canvas.getContext('2d');
this.css3 = new Phaser.Display.CSS3Filters(this.canvas);
this.scaleMode = Phaser.StageScaleMode.NO_SCALE;
@@ -19231,7 +19268,7 @@ var Phaser;
if (this.clear || (this.game.paused && this.disablePauseScreen == false)) {
if (this.game.device.patchAndroidClearRectBug) {
this.context.fillStyle = 'rgb(0,0,0)';
this.context.fillStyle = this._backgroundColor;
this.context.fillRect(0, 0, this.width, this.height);
} else {
this.context.clearRect(0, 0, this.width, this.height);
@@ -19291,13 +19328,6 @@ var Phaser;
}
};
Stage.prototype.setImageRenderingCrisp = function () {
this.canvas.style['image-rendering'] = 'crisp-edges';
this.canvas.style['image-rendering'] = '-moz-crisp-edges';
this.canvas.style['image-rendering'] = '-webkit-optimize-contrast';
this.canvas.style['-ms-interpolation-mode'] = 'nearest-neighbor';
};
Stage.prototype.pauseGame = function () {
this.game.paused = true;
@@ -19356,7 +19386,7 @@ var Phaser;
this.context.fillStyle = this.fillStyle;
if (this.game.device.patchAndroidClearRectBug) {
this.context.fillStyle = 'rgb(0,0,0)';
this.context.fillStyle = this._backgroundColor;
this.context.fillRect(0, 0, this.width, this.height);
} else {
this.context.clearRect(0, 0, this.width, this.height);
@@ -20019,27 +20049,81 @@ var Phaser;
})();
Phaser.Game = Game;
})(Phaser || (Phaser = {}));
/// <reference path="_definitions.ts" />
/// <reference path="../_definitions.ts" />
/**
* Phaser - http://www.phaser.io
* Phaser - CanvasUtils
*
* v1.0.0 - August 12th 2013
*
* A feature-packed 2D canvas game framework born from the firey pits of Flixel and
* constructed via plenty of blood, sweat, tears and coffee by Richard Davey (@photonstorm).
*
* Many thanks to Adam Saltsman (@ADAMATOMIC) for releasing Flixel, from both which Phaser
* and my love of game development originate.
*
* Follow Phaser progress at http://www.photonstorm.com
*
* "If you want your children to be intelligent, read them fairy tales."
* "If you want them to be more intelligent, read them more fairy tales."
* -- Albert Einstein
* A collection of methods useful for manipulating canvas objects.
*/
var Phaser;
(function (Phaser) {
Phaser.VERSION = 'Phaser version 1.0.0';
var CanvasUtils = (function () {
function CanvasUtils() {
}
CanvasUtils.getAspectRatio = function (canvas) {
return canvas.width / canvas.height;
};
Phaser.GAMES = [];
CanvasUtils.setBackgroundColor = function (canvas, color) {
if (typeof color === "undefined") { color = 'rgb(0,0,0)'; }
canvas.style.backgroundColor = color;
return canvas;
};
CanvasUtils.setTouchAction = function (canvas, value) {
if (typeof value === "undefined") { value = 'none'; }
canvas.style.msTouchAction = value;
canvas.style['ms-touch-action'] = value;
canvas.style['touch-action'] = value;
return canvas;
};
CanvasUtils.addToDOM = function (canvas, parent, overflowHidden) {
if (typeof parent === "undefined") { parent = ''; }
if (typeof overflowHidden === "undefined") { overflowHidden = true; }
if ((parent !== '' || parent !== null) && document.getElementById(parent)) {
document.getElementById(parent).appendChild(canvas);
if (overflowHidden) {
document.getElementById(parent).style.overflow = 'hidden';
}
} else {
document.body.appendChild(canvas);
}
return canvas;
};
CanvasUtils.setTransform = function (context, translateX, translateY, scaleX, scaleY, skewX, skewY) {
context.setTransform(scaleX, skewX, skewY, scaleY, translateX, translateY);
return context;
};
CanvasUtils.setSmoothingEnabled = function (context, value) {
context['imageSmoothingEnabled'] = value;
context['mozImageSmoothingEnabled'] = value;
context['oImageSmoothingEnabled'] = value;
context['webkitImageSmoothingEnabled'] = value;
context['msImageSmoothingEnabled'] = value;
return context;
};
CanvasUtils.setImageRenderingCrisp = function (canvas) {
canvas.style['image-rendering'] = 'crisp-edges';
canvas.style['image-rendering'] = '-moz-crisp-edges';
canvas.style['image-rendering'] = '-webkit-optimize-contrast';
canvas.style.msInterpolationMode = 'nearest-neighbor';
return canvas;
};
CanvasUtils.setImageRenderingBicubic = function (canvas) {
canvas.style['image-rendering'] = 'auto';
canvas.style.msInterpolationMode = 'bicubic';
return canvas;
};
return CanvasUtils;
})();
Phaser.CanvasUtils = CanvasUtils;
})(Phaser || (Phaser = {}));