2013-08-31 13:54:59 +01:00
|
|
|
/**
|
2013-09-19 13:17:49 +02:00
|
|
|
* @author Richard Davey <rich@photonstorm.com>
|
|
|
|
* @copyright 2013 Photon Storm Ltd.
|
|
|
|
* @license https://github.com/photonstorm/phaser/blob/master/license.txt MIT License
|
|
|
|
* @module Phaser.Camera
|
|
|
|
*/
|
|
|
|
|
|
|
|
/**
|
2013-08-31 13:54:59 +01:00
|
|
|
*
|
|
|
|
* A Camera is your view into the game world. It has a position and size and renders only those objects within its field of view.
|
|
|
|
* The game automatically creates a single Stage sized camera on boot. Move the camera around the world with Phaser.Camera.x/y
|
2013-09-16 16:37:30 +02:00
|
|
|
*
|
2013-09-19 13:17:49 +02:00
|
|
|
* @class Camera
|
2013-09-16 16:37:30 +02:00
|
|
|
* @constructor
|
2013-09-19 10:36:15 +02:00
|
|
|
* @param {Phaser.Game} game game reference to the currently running game.
|
|
|
|
* @param {number} id not being used at the moment, will be when Phaser supports multiple camera
|
|
|
|
* @param {number} x position of the camera on the X axis
|
|
|
|
* @param {number} y position of the camera on the Y axis
|
|
|
|
* @param {number} width the width of the view rectangle
|
|
|
|
* @param {number} height the height of the view rectangle
|
2013-08-31 13:54:59 +01:00
|
|
|
*/
|
|
|
|
|
|
|
|
Phaser.Camera = function (game, id, x, y, width, height) {
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* A reference to the currently running Game.
|
|
|
|
* @property game
|
|
|
|
* @public
|
|
|
|
* @type {Phaser.Game}
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
this.game = game;
|
2013-09-19 13:17:49 +02:00
|
|
|
|
|
|
|
/**
|
|
|
|
* A reference to the game world
|
|
|
|
* @property world
|
|
|
|
* @public
|
|
|
|
* @type {Phaser.World}
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
this.world = game.world;
|
2013-09-19 13:17:49 +02:00
|
|
|
|
|
|
|
/**
|
|
|
|
* reserved for future multiple camera set-ups
|
|
|
|
* @property id
|
|
|
|
* @public
|
|
|
|
* @type {number}
|
|
|
|
*/
|
|
|
|
this.id = 0;
|
2013-09-10 20:40:34 +01:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Camera view.
|
2013-09-19 13:17:49 +02:00
|
|
|
* The view into the world we wish to render (by default the game dimensions)
|
|
|
|
* The x/y values are in world coordinates, not screen coordinates, the width/height is how many pixels to render
|
|
|
|
* Objects outside of this view are not rendered (unless set to ignore the Camera, i.e. UI?)
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property view
|
2013-09-19 13:17:49 +02:00
|
|
|
* @public
|
|
|
|
* @type {Phaser.Rectangle}
|
2013-09-10 20:40:34 +01:00
|
|
|
*/
|
2013-09-01 19:52:50 +01:00
|
|
|
this.view = new Phaser.Rectangle(x, y, width, height);
|
2013-09-10 20:40:34 +01:00
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
/**
|
|
|
|
* Used by Sprites to work out Camera culling.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property screenView
|
2013-09-19 13:17:49 +02:00
|
|
|
* @public
|
|
|
|
* @type {Phaser.Rectangle}
|
2013-09-11 16:25:46 +01:00
|
|
|
*/
|
2013-09-01 19:52:50 +01:00
|
|
|
this.screenView = new Phaser.Rectangle(x, y, width, height);
|
|
|
|
|
2013-09-10 20:40:34 +01:00
|
|
|
/**
|
|
|
|
* Sprite moving inside this Rectangle will not cause camera moving.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property deadzone
|
2013-09-19 13:17:49 +02:00
|
|
|
* @type {Phaser.Rectangle}
|
2013-09-10 20:40:34 +01:00
|
|
|
*/
|
|
|
|
this.deadzone = null;
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Whether this camera is visible or not. (default is true)
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property visible
|
2013-09-19 13:17:49 +02:00
|
|
|
* @public
|
2013-09-19 10:36:15 +02:00
|
|
|
* @default true
|
2013-09-10 20:40:34 +01:00
|
|
|
* @type {bool}
|
|
|
|
*/
|
|
|
|
this.visible = true;
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
/**
|
|
|
|
* Whether this camera is flush with the World Bounds or not.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property atLimit
|
2013-09-11 16:25:46 +01:00
|
|
|
* @type {bool}
|
|
|
|
*/
|
|
|
|
this.atLimit = { x: false, y: false };
|
|
|
|
|
2013-09-10 20:40:34 +01:00
|
|
|
/**
|
|
|
|
* If the camera is tracking a Sprite, this is a reference to it, otherwise null
|
2013-09-19 10:36:15 +02:00
|
|
|
* @property target
|
2013-09-19 13:17:49 +02:00
|
|
|
* @public
|
|
|
|
* @type {Phaser.Sprite}
|
2013-09-10 20:40:34 +01:00
|
|
|
*/
|
|
|
|
this.target = null;
|
2013-09-11 16:25:46 +01:00
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* Edge property
|
|
|
|
* @property edge
|
|
|
|
* @private
|
|
|
|
* @type {number}
|
|
|
|
*/
|
2013-09-11 16:25:46 +01:00
|
|
|
this._edge = 0;
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
// Consts
|
|
|
|
Phaser.Camera.FOLLOW_LOCKON = 0;
|
|
|
|
Phaser.Camera.FOLLOW_PLATFORMER = 1;
|
|
|
|
Phaser.Camera.FOLLOW_TOPDOWN = 2;
|
|
|
|
Phaser.Camera.FOLLOW_TOPDOWN_TIGHT = 3;
|
|
|
|
|
|
|
|
Phaser.Camera.prototype = {
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Tells this camera which sprite to follow.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @method follow
|
2013-09-19 13:17:49 +02:00
|
|
|
* @param target {Phaser.Sprite} The object you want the camera to track. Set to null to not follow anything.
|
2013-08-31 13:54:59 +01:00
|
|
|
* @param [style] {number} Leverage one of the existing "deadzone" presets. If you use a custom deadzone, ignore this parameter and manually specify the deadzone after calling follow().
|
|
|
|
*/
|
|
|
|
follow: function (target, style) {
|
|
|
|
|
|
|
|
if (typeof style === "undefined") { style = Phaser.Camera.FOLLOW_LOCKON; }
|
|
|
|
|
|
|
|
this.target = target;
|
|
|
|
|
|
|
|
var helper;
|
|
|
|
|
|
|
|
switch (style) {
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
case Phaser.Camera.FOLLOW_PLATFORMER:
|
2013-08-31 13:54:59 +01:00
|
|
|
var w = this.width / 8;
|
|
|
|
var h = this.height / 3;
|
|
|
|
this.deadzone = new Phaser.Rectangle((this.width - w) / 2, (this.height - h) / 2 - h * 0.25, w, h);
|
|
|
|
break;
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
case Phaser.Camera.FOLLOW_TOPDOWN:
|
2013-08-31 13:54:59 +01:00
|
|
|
helper = Math.max(this.width, this.height) / 4;
|
|
|
|
this.deadzone = new Phaser.Rectangle((this.width - helper) / 2, (this.height - helper) / 2, helper, helper);
|
|
|
|
break;
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
case Phaser.Camera.FOLLOW_TOPDOWN_TIGHT:
|
2013-08-31 13:54:59 +01:00
|
|
|
helper = Math.max(this.width, this.height) / 8;
|
|
|
|
this.deadzone = new Phaser.Rectangle((this.width - helper) / 2, (this.height - helper) / 2, helper, helper);
|
|
|
|
break;
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
case Phaser.Camera.FOLLOW_LOCKON:
|
2013-08-31 13:54:59 +01:00
|
|
|
default:
|
|
|
|
this.deadzone = null;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
2013-09-19 13:17:49 +02:00
|
|
|
* Move the camera focus to a location instantly.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @method focusOnXY
|
2013-08-31 13:54:59 +01:00
|
|
|
* @param x {number} X position.
|
|
|
|
* @param y {number} Y position.
|
|
|
|
*/
|
|
|
|
focusOnXY: function (x, y) {
|
|
|
|
|
|
|
|
this.view.x = Math.round(x - this.view.halfWidth);
|
|
|
|
this.view.y = Math.round(y - this.view.halfHeight);
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Update focusing and scrolling.
|
2013-09-19 10:36:15 +02:00
|
|
|
* @method update
|
2013-08-31 13:54:59 +01:00
|
|
|
*/
|
|
|
|
update: function () {
|
|
|
|
|
2013-09-01 19:52:50 +01:00
|
|
|
// Add dirty flag
|
|
|
|
|
2013-08-31 13:54:59 +01:00
|
|
|
if (this.target !== null)
|
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
if (this.deadzone)
|
2013-08-31 13:54:59 +01:00
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this._edge = this.target.x - this.deadzone.x;
|
2013-08-31 13:54:59 +01:00
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
if (this.view.x > this._edge)
|
2013-08-31 13:54:59 +01:00
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.view.x = this._edge;
|
2013-08-31 13:54:59 +01:00
|
|
|
}
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
this._edge = this.target.x + this.target.width - this.deadzone.x - this.deadzone.width;
|
2013-08-31 13:54:59 +01:00
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
if (this.view.x < this._edge)
|
2013-08-31 13:54:59 +01:00
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.view.x = this._edge;
|
2013-08-31 13:54:59 +01:00
|
|
|
}
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
this._edge = this.target.y - this.deadzone.y;
|
2013-08-31 13:54:59 +01:00
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
if (this.view.y > this._edge)
|
2013-08-31 13:54:59 +01:00
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.view.y = this._edge;
|
2013-08-31 13:54:59 +01:00
|
|
|
}
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
this._edge = this.target.y + this.target.height - this.deadzone.y - this.deadzone.height;
|
2013-08-31 13:54:59 +01:00
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
if (this.view.y < this._edge)
|
2013-08-31 13:54:59 +01:00
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.view.y = this._edge;
|
2013-08-31 13:54:59 +01:00
|
|
|
}
|
|
|
|
}
|
2013-09-11 16:25:46 +01:00
|
|
|
else
|
|
|
|
{
|
|
|
|
this.focusOnXY(this.target.x, this.target.y);
|
|
|
|
}
|
2013-08-31 13:54:59 +01:00
|
|
|
}
|
|
|
|
|
2013-09-11 16:25:46 +01:00
|
|
|
this.checkWorldBounds();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
2013-09-19 10:36:15 +02:00
|
|
|
/**
|
|
|
|
* Method called to ensure the camera doesn't venture outside of the game world
|
|
|
|
* @method checkWorldBounds
|
|
|
|
*/
|
2013-09-11 16:25:46 +01:00
|
|
|
checkWorldBounds: function () {
|
|
|
|
|
|
|
|
this.atLimit.x = false;
|
|
|
|
this.atLimit.y = false;
|
|
|
|
|
2013-08-31 13:54:59 +01:00
|
|
|
// Make sure we didn't go outside the cameras worldBounds
|
|
|
|
if (this.view.x < this.world.bounds.left)
|
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.atLimit.x = true;
|
2013-08-31 13:54:59 +01:00
|
|
|
this.view.x = this.world.bounds.left;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.view.x > this.world.bounds.right - this.width)
|
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.atLimit.x = true;
|
2013-08-31 13:54:59 +01:00
|
|
|
this.view.x = (this.world.bounds.right - this.width) + 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.view.y < this.world.bounds.top)
|
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.atLimit.y = true;
|
2013-08-31 13:54:59 +01:00
|
|
|
this.view.y = this.world.bounds.top;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.view.y > this.world.bounds.bottom - this.height)
|
|
|
|
{
|
2013-09-11 16:25:46 +01:00
|
|
|
this.atLimit.y = true;
|
2013-08-31 13:54:59 +01:00
|
|
|
this.view.y = (this.world.bounds.bottom - this.height) + 1;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.view.floor();
|
|
|
|
|
|
|
|
},
|
|
|
|
|
2013-09-19 10:36:15 +02:00
|
|
|
/**
|
|
|
|
* A helper function to set both the X and Y properties of the camera at once
|
|
|
|
* without having to use game.camera.x and game.camera.y
|
|
|
|
*
|
|
|
|
* @method setPosition
|
|
|
|
* @param x {number} X position.
|
|
|
|
* @param y {number} Y position.
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
setPosition: function (x, y) {
|
|
|
|
|
|
|
|
this.view.x = x;
|
|
|
|
this.view.y = y;
|
2013-09-11 16:25:46 +01:00
|
|
|
this.checkWorldBounds();
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
},
|
|
|
|
|
2013-09-19 10:36:15 +02:00
|
|
|
/**
|
2013-09-19 13:17:49 +02:00
|
|
|
* Sets the size of the view rectangle given the width and height in parameters
|
2013-09-19 10:36:15 +02:00
|
|
|
*
|
|
|
|
* @method setSize
|
2013-09-19 13:17:49 +02:00
|
|
|
* @param width {number} the desired width.
|
|
|
|
* @param height {number} the desired height.
|
2013-09-19 10:36:15 +02:00
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
setSize: function (width, height) {
|
|
|
|
|
|
|
|
this.view.width = width;
|
|
|
|
this.view.height = height;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
Object.defineProperty(Phaser.Camera.prototype, "x", {
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method x
|
|
|
|
* @return {Number} The x position
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
get: function () {
|
|
|
|
return this.view.x;
|
|
|
|
},
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method x
|
|
|
|
* @return {Number} Sets the camera's x position and clamp it if it's outside the world bounds
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
set: function (value) {
|
|
|
|
this.view.x = value;
|
2013-09-11 16:25:46 +01:00
|
|
|
this.checkWorldBounds();
|
2013-09-11 13:21:07 +01:00
|
|
|
}
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
Object.defineProperty(Phaser.Camera.prototype, "y", {
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method y
|
|
|
|
* @return {Number} The y position
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
get: function () {
|
|
|
|
return this.view.y;
|
|
|
|
},
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method y
|
|
|
|
* @return {Number} Sets the camera's y position and clamp it if it's outside the world bounds
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
set: function (value) {
|
|
|
|
this.view.y = value;
|
2013-09-11 16:25:46 +01:00
|
|
|
this.checkWorldBounds();
|
2013-09-11 13:21:07 +01:00
|
|
|
}
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
Object.defineProperty(Phaser.Camera.prototype, "width", {
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method width
|
|
|
|
* @return {Number} The width of the view rectangle, in pixels
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
get: function () {
|
|
|
|
return this.view.width;
|
|
|
|
},
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method width
|
|
|
|
* @return {Number} Sets the width of the view rectangle
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
set: function (value) {
|
|
|
|
this.view.width = value;
|
2013-09-11 13:21:07 +01:00
|
|
|
}
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
Object.defineProperty(Phaser.Camera.prototype, "height", {
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method height
|
|
|
|
* @return {Number} The height of the view rectangle, in pixels
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
get: function () {
|
|
|
|
return this.view.height;
|
|
|
|
},
|
|
|
|
|
2013-09-19 13:17:49 +02:00
|
|
|
/**
|
|
|
|
* @method height
|
|
|
|
* @return {Number} Sets the height of the view rectangle
|
|
|
|
*/
|
2013-08-31 13:54:59 +01:00
|
|
|
set: function (value) {
|
|
|
|
this.view.height = value;
|
2013-09-11 13:21:07 +01:00
|
|
|
}
|
2013-08-31 13:54:59 +01:00
|
|
|
|
|
|
|
});
|