///
///
///
/**
* Phaser - Components - Texture
*
* The Texture being used to render the object (Sprite, Group background, etc). Either Image based on a DynamicTexture.
*/
module Phaser.Components {
export class Texture {
/**
* Creates a new Texture component
* @param parent The object using this Texture to render.
* @param key An optional Game.Cache key to load an image from
*/
constructor(parent) {
this.game = parent.game;
this.parent = parent;
this.canvas = parent.game.stage.canvas;
this.context = parent.game.stage.context;
this.alpha = 1;
this.flippedX = false;
this.flippedY = false;
this._width = 16;
this._height = 16;
this.cameraBlacklist = [];
}
/**
* Private _width - use the width getter/setter instead
*/
private _width: number;
/**
* Private _height - use the height getter/setter instead
*/
private _height: number;
/**
* Reference to Phaser.Game
*/
public game: Game;
/**
* Reference to the parent object (Sprite, Group, etc)
*/
public parent;
/**
* Reference to the Image stored in the Game.Cache that is used as the texture for the Sprite.
*/
public imageTexture = null;
/**
* Reference to the DynamicTexture that is used as the texture for the Sprite.
* @type {DynamicTexture}
*/
public dynamicTexture: DynamicTexture = null;
/**
* The load status of the texture image.
* @type {boolean}
*/
public loaded: bool = false;
/**
* An Array of Cameras to which this texture won't render
* @type {Array}
*/
public cameraBlacklist: number[];
/**
* Whether the Sprite background is opaque or not. If set to true the Sprite is filled with
* the value of Texture.backgroundColor every frame. Normally you wouldn't enable this but
* for some effects it can be handy.
* @type {boolean}
*/
public opaque: bool = false;
/**
* Opacity of the Sprite texture where 1 is opaque (default) and 0 is fully transparent.
* @type {number}
*/
public alpha: number;
/**
* The Background Color of the Sprite if Texture.opaque is set to true.
* Given in css color string format, i.e. 'rgb(0,0,0)' or '#ff0000'.
* @type {string}
*/
public backgroundColor: string = 'rgb(255,255,255)';
/**
* You can set a globalCompositeOperation that will be applied before the render method is called on this Sprite.
* This is useful if you wish to apply an effect like 'lighten'.
* If this value is set it will call a canvas context save and restore before and after the render pass, so use it sparingly.
* Set to null to disable.
*/
public globalCompositeOperation: string = null;
/**
* A reference to the Canvas this Sprite renders to.
* @type {HTMLCanvasElement}
*/
public canvas: HTMLCanvasElement;
/**
* A reference to the Canvas Context2D this Sprite renders to.
* @type {CanvasRenderingContext2D}
*/
public context: CanvasRenderingContext2D;
/**
* The Cache key used for the Image Texture.
*/
public cacheKey: string;
/**
* The Texture being used to render the Sprite. Either an Image Texture from the Cache or a DynamicTexture.
*/
public texture;
/**
* Controls if the Sprite is rendered rotated or not.
* If renderRotation is false then the object can still rotate but it will never be rendered rotated.
* @type {boolean}
*/
public renderRotation: bool = true;
/**
* Flip the graphic horizontally (defaults to false)
* @type {boolean}
*/
public flippedX: bool = false;
/**
* Flip the graphic vertically (defaults to false)
* @type {boolean}
*/
public flippedY: bool = false;
/**
* Is the texture a DynamicTexture?
* @type {boolean}
*/
public isDynamic: bool = false;
/**
* Updates the texture being used to render the Sprite.
* Called automatically by SpriteUtils.loadTexture and SpriteUtils.loadDynamicTexture.
*/
public setTo(image = null, dynamic?: DynamicTexture = null) {
if (dynamic)
{
this.isDynamic = true;
this.dynamicTexture = dynamic;
this.texture = this.dynamicTexture.canvas;
}
else
{
this.isDynamic = false;
this.imageTexture = image;
this.texture = this.imageTexture;
this._width = image.width;
this._height = image.height;
}
this.loaded = true;
return this.parent;
}
/**
* Sets a new graphic from the game cache to use as the texture for this Sprite.
* The graphic can be SpriteSheet or Texture Atlas. If you need to use a DynamicTexture see loadDynamicTexture.
* @param key {string} Key of the graphic you want to load for this sprite.
* @param clearAnimations {boolean} If this Sprite has a set of animation data already loaded you can choose to keep or clear it with this boolean
* @param updateBody {boolean} Update the physics body dimensions to match the newly loaded texture/frame?
*/
public loadImage(key: string, clearAnimations?: bool = true, updateBody?: bool = true) {
if (clearAnimations && this.parent['animations'] && this.parent['animations'].frameData !== null)
{
this.parent.animations.destroy();
}
if (this.game.cache.getImage(key) !== null)
{
this.setTo(this.game.cache.getImage(key), null);
this.cacheKey = key;
if (this.game.cache.isSpriteSheet(key) && this.parent['animations'])
{
this.parent.animations.loadFrameData(this.parent.game.cache.getFrameData(key));
}
else
{
if (updateBody && this.parent['body'])
{
this.parent.body.bounds.width = this.width;
this.parent.body.bounds.height = this.height;
}
}
}
}
/**
* Load a DynamicTexture as its texture.
* @param texture {DynamicTexture} The texture object to be used by this sprite.
*/
public loadDynamicTexture(texture: DynamicTexture) {
if (this.parent.animations.frameData !== null)
{
this.parent.animations.destroy();
}
this.setTo(null, texture);
this.parent.texture.width = this.width;
this.parent.texture.height = this.height;
}
public set width(value: number) {
this._width = value;
}
public set height(value: number) {
this._height = value;
}
/**
* The width of the texture. If an animation it will be the frame width, not the width of the sprite sheet.
* If using a DynamicTexture it will be the width of the dynamic texture itself.
* @type {number}
*/
public get width(): number {
if (this.isDynamic)
{
return this.dynamicTexture.width;
}
else
{
return this._width;
}
}
/**
* The height of the texture. If an animation it will be the frame height, not the height of the sprite sheet.
* If using a DynamicTexture it will be the height of the dynamic texture itself.
* @type {number}
*/
public get height(): number {
if (this.isDynamic)
{
return this.dynamicTexture.height;
}
else
{
return this._height;
}
}
}
}