mirror of
https://github.com/photonstorm/phaser
synced 2024-11-26 14:40:38 +00:00
PIXI.TilingSprite has been removed, and all functionality merged in to Phaser.TileSprite, to cut down on the number of internal classes and inheritance going on.
This commit is contained in:
photonstorm
parent
2005c9d86d
commit
508e5ae723
7 changed files with 531 additions and 582 deletions
|
|
@ -335,6 +335,7 @@ You can read all about the philosophy behind Lazer [here](http://phaser.io/news/
|
|||
* Camera.flash has a new argument `alpha` to control the alpha level of the effect (thanks @rgk #2493)
|
||||
* Phaser.SpriteBatch was incorrectly applying the prototypes, causing the Sprite Batch render methods to be replaced by the normal DisplayObjectContainer ones, meaning nothing was really batched at all. This has now been fixed, and PIXI.SpriteBatch removed, as it's no longer required.
|
||||
* PIXI.RenderTexture has been removed, and all functionality merged in to Phaser.RenderTexture, to cut down on the number of internal classes and inheritance going on.
|
||||
* PIXI.TilingSprite has been removed, and all functionality merged in to Phaser.TileSprite, to cut down on the number of internal classes and inheritance going on.
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
|
|
@ -355,6 +356,7 @@ Please note that Phaser uses a custom build of Pixi and always has done. The fol
|
|||
* WebGL support for compressed texture formats added.
|
||||
* PIXI.SpriteBatch has been removed as it's no longer used internally.
|
||||
* PIXI.RenderTexture has been removed as it's no longer used internally.
|
||||
* PIXI.TileSprite has been removed as it's no longer used internally.
|
||||
|
||||
For changes in previous releases please see the extensive [Version History](https://github.com/photonstorm/phaser/blob/master/CHANGELOG.md).
|
||||
|
||||
|
|
|
|||
|
|
@ -90,11 +90,6 @@ EOL;
|
|||
echo " <script src=\"$path/src/pixi/extras/Rope.js\"></script>";
|
||||
}
|
||||
|
||||
if ($modules['tilesprite'])
|
||||
{
|
||||
echo " <script src=\"$path/src/pixi/extras/TilingSprite.js\"></script>";
|
||||
}
|
||||
|
||||
// PIXI Outro + Phaser Global
|
||||
echo <<<EOL
|
||||
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
*
|
||||
* @class Phaser.TileSprite
|
||||
* @constructor
|
||||
* @extends PIXI.TilingSprite
|
||||
* @extends PIXI.Sprite
|
||||
* @extends Phaser.Component.Core
|
||||
* @extends Phaser.Component.Angle
|
||||
* @extends Phaser.Component.Animation
|
||||
|
|
@ -49,10 +49,10 @@
|
|||
* @extends Phaser.Component.Reset
|
||||
* @extends Phaser.Component.Smoothed
|
||||
* @param {Phaser.Game} game - A reference to the currently running game.
|
||||
* @param {number} x - The x coordinate (in world space) to position the TileSprite at.
|
||||
* @param {number} y - The y coordinate (in world space) to position the TileSprite at.
|
||||
* @param {number} width - The width of the TileSprite.
|
||||
* @param {number} height - The height of the TileSprite.
|
||||
* @param {number} [x=0] - The x coordinate (in world space) to position the TileSprite at.
|
||||
* @param {number} [y=0] - The y coordinate (in world space) to position the TileSprite at.
|
||||
* @param {number} [width=256] - The width of the TileSprite.
|
||||
* @param {number} [height=256] - The height of the TileSprite.
|
||||
* @param {string|Phaser.BitmapData|PIXI.Texture} key - This is the image or texture used by the TileSprite during rendering. It can be a string which is a reference to the Phaser Image Cache entry, or an instance of a PIXI.Texture or BitmapData.
|
||||
* @param {string|number} frame - If this TileSprite is using part of a sprite sheet or texture atlas you can specify the exact frame to use by giving a string or numeric index.
|
||||
*/
|
||||
|
|
@ -65,6 +65,10 @@ Phaser.TileSprite = function (game, x, y, width, height, key, frame) {
|
|||
key = key || null;
|
||||
frame = frame || null;
|
||||
|
||||
var def = game.cache.getImage('__default', true);
|
||||
|
||||
PIXI.Sprite.call(this, new PIXI.Texture(def.base), width, height);
|
||||
|
||||
/**
|
||||
* @property {number} type - The const type of this object.
|
||||
* @readonly
|
||||
|
|
@ -83,15 +87,69 @@ Phaser.TileSprite = function (game, x, y, width, height, key, frame) {
|
|||
*/
|
||||
this._scroll = new Phaser.Point();
|
||||
|
||||
var def = game.cache.getImage('__default', true);
|
||||
/**
|
||||
* @property {Phaser.Point} tileScale - The scale applied to the image being tiled.
|
||||
*/
|
||||
this.tileScale = new Phaser.Point(1, 1);
|
||||
|
||||
PIXI.TilingSprite.call(this, new PIXI.Texture(def.base), width, height);
|
||||
/**
|
||||
* @property {Phaser.Point} tileScaleOffset - The scale offset applied to the image being tiled.
|
||||
*/
|
||||
this.tileScaleOffset = new Phaser.Point(1, 1);
|
||||
|
||||
/**
|
||||
* @property {Phaser.Point} tilePosition - The offset position of the image being tiled.
|
||||
*/
|
||||
this.tilePosition = new Phaser.Point();
|
||||
|
||||
/**
|
||||
* If enabled a green rectangle will be drawn behind the generated tiling texture,
|
||||
* allowing you to visually debug the texture being used.
|
||||
*
|
||||
* @property {boolean} textureDebug
|
||||
*/
|
||||
this.textureDebug = false;
|
||||
|
||||
/**
|
||||
* The CanvasBuffer object that the tiled texture is drawn to.
|
||||
*
|
||||
* @property {PIXI.CanvasBuffer} canvasBuffer
|
||||
*/
|
||||
this.canvasBuffer = null;
|
||||
|
||||
/**
|
||||
* An internal Texture object that holds the tiling texture that was generated from TilingSprite.texture.
|
||||
*
|
||||
* @property {PIXI.Texture} tilingTexture
|
||||
*/
|
||||
this.tilingTexture = null;
|
||||
|
||||
/**
|
||||
* The Context fill pattern that is used to draw the TilingSprite in Canvas mode only (will be null in WebGL).
|
||||
*
|
||||
* @property {object} tilePattern
|
||||
*/
|
||||
this.tilePattern = null;
|
||||
|
||||
/**
|
||||
* If true the TileSprite will run `generateTexture` on its **next** render pass.
|
||||
* This is set by the likes of Phaser.LoadTexture.setFrame.
|
||||
*
|
||||
* @property {boolean} refreshTexture
|
||||
*/
|
||||
this.refreshTexture = true;
|
||||
|
||||
this.frameWidth = 0;
|
||||
this.frameHeight = 0;
|
||||
|
||||
this._width = width;
|
||||
this._height = height;
|
||||
|
||||
Phaser.Component.Core.init.call(this, game, x, y, key, frame);
|
||||
|
||||
};
|
||||
|
||||
Phaser.TileSprite.prototype = Object.create(PIXI.TilingSprite.prototype);
|
||||
Phaser.TileSprite.prototype = Object.create(PIXI.Sprite.prototype);
|
||||
Phaser.TileSprite.prototype.constructor = Phaser.TileSprite;
|
||||
|
||||
Phaser.Component.Core.install.call(Phaser.TileSprite.prototype, [
|
||||
|
|
@ -124,6 +182,7 @@ Phaser.TileSprite.prototype.preUpdateCore = Phaser.Component.Core.preUpdate;
|
|||
*
|
||||
* @method Phaser.TileSprite#preUpdate
|
||||
* @memberof Phaser.TileSprite
|
||||
* @return {boolean}
|
||||
*/
|
||||
Phaser.TileSprite.prototype.preUpdate = function () {
|
||||
|
||||
|
|
@ -156,11 +215,14 @@ Phaser.TileSprite.prototype.preUpdate = function() {
|
|||
* @memberof Phaser.TileSprite
|
||||
* @param {number} x - Horizontal scroll speed in pixels per second.
|
||||
* @param {number} y - Vertical scroll speed in pixels per second.
|
||||
* @return {Phaser.TileSprite} This instance.
|
||||
*/
|
||||
Phaser.TileSprite.prototype.autoScroll = function (x, y) {
|
||||
|
||||
this._scroll.set(x, y);
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -168,11 +230,14 @@ Phaser.TileSprite.prototype.autoScroll = function(x, y) {
|
|||
*
|
||||
* @method Phaser.TileSprite#stopScroll
|
||||
* @memberof Phaser.TileSprite
|
||||
* @return {Phaser.TileSprite} This instance.
|
||||
*/
|
||||
Phaser.TileSprite.prototype.stopScroll = function () {
|
||||
|
||||
this._scroll.set(0, 0);
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -187,7 +252,23 @@ Phaser.TileSprite.prototype.destroy = function(destroyChildren) {
|
|||
|
||||
Phaser.Component.Destroy.prototype.destroy.call(this, destroyChildren);
|
||||
|
||||
PIXI.TilingSprite.prototype.destroy.call(this);
|
||||
PIXI.Sprite.prototype.destroy.call(this);
|
||||
|
||||
if (this.canvasBuffer)
|
||||
{
|
||||
this.canvasBuffer.destroy();
|
||||
this.canvasBuffer = null;
|
||||
}
|
||||
|
||||
this.tileScale = null;
|
||||
this.tileScaleOffset = null;
|
||||
this.tilePosition = null;
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
this.tilingTexture.destroy(true);
|
||||
this.tilingTexture = null;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
|
@ -212,3 +293,436 @@ Phaser.TileSprite.prototype.reset = function(x, y) {
|
|||
return this;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Changes the texture being rendered by this TileSprite.
|
||||
* Causes a texture refresh to take place on the next render.
|
||||
*
|
||||
* @method Phaser.TileSprite#setTexture
|
||||
* @memberof Phaser.TileSprite
|
||||
* @param {PIXI.Texture} texture - The texture to apply to this TileSprite.
|
||||
* @return {Phaser.TileSprite} This instance.
|
||||
*/
|
||||
Phaser.TileSprite.prototype.setTexture = function (texture) {
|
||||
|
||||
if (this.texture !== texture)
|
||||
{
|
||||
this.texture = texture;
|
||||
this.refreshTexture = true;
|
||||
this.cachedTint = 0xFFFFFF;
|
||||
}
|
||||
|
||||
return this;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the TileSprite using the WebGL Renderer.
|
||||
*
|
||||
* @private
|
||||
* @method Phaser.TileSprite#_renderWebGL
|
||||
* @memberof Phaser.TileSprite
|
||||
* @param {object} renderSession
|
||||
*/
|
||||
Phaser.TileSprite.prototype._renderWebGL = function (renderSession) {
|
||||
|
||||
if (!this.visible || !this.renderable || this.alpha === 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.spriteBatch.stop();
|
||||
renderSession.maskManager.pushMask(this.mask, renderSession);
|
||||
renderSession.spriteBatch.start();
|
||||
}
|
||||
|
||||
if (this._filters)
|
||||
{
|
||||
renderSession.spriteBatch.flush();
|
||||
renderSession.filterManager.pushFilter(this._filterBlock);
|
||||
}
|
||||
|
||||
if (this.refreshTexture)
|
||||
{
|
||||
this.generateTilingTexture(true, renderSession);
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
if (this.tilingTexture.needsUpdate)
|
||||
{
|
||||
this.tilingTexture.baseTexture.textureIndex = this.texture.baseTexture.textureIndex;
|
||||
renderSession.renderer.updateTexture(this.tilingTexture.baseTexture);
|
||||
this.tilingTexture.needsUpdate = false;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
renderSession.spriteBatch.renderTilingSprite(this);
|
||||
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
this.children[i]._renderWebGL(renderSession);
|
||||
}
|
||||
|
||||
var restartBatch = false;
|
||||
|
||||
if (this._filters)
|
||||
{
|
||||
restartBatch = true;
|
||||
renderSession.spriteBatch.stop();
|
||||
renderSession.filterManager.popFilter();
|
||||
}
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
if (!restartBatch)
|
||||
{
|
||||
renderSession.spriteBatch.stop();
|
||||
}
|
||||
|
||||
renderSession.maskManager.popMask(this._mask, renderSession);
|
||||
}
|
||||
|
||||
if (restartBatch)
|
||||
{
|
||||
renderSession.spriteBatch.start();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the TileSprite using the Canvas Renderer.
|
||||
*
|
||||
* @private
|
||||
* @method Phaser.TileSprite#_renderCanvas
|
||||
* @memberof Phaser.TileSprite
|
||||
* @param {object} renderSession
|
||||
*/
|
||||
Phaser.TileSprite.prototype._renderCanvas = function (renderSession) {
|
||||
|
||||
if (!this.visible || !this.renderable || this.alpha === 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var context = renderSession.context;
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.maskManager.pushMask(this._mask, renderSession);
|
||||
}
|
||||
|
||||
context.globalAlpha = this.worldAlpha;
|
||||
|
||||
var wt = this.worldTransform;
|
||||
var resolution = renderSession.resolution;
|
||||
var tx = (wt.tx * resolution) + renderSession.shakeX;
|
||||
var ty = (wt.ty * resolution) + renderSession.shakeY;
|
||||
|
||||
context.setTransform(wt.a * resolution, wt.b * resolution, wt.c * resolution, wt.d * resolution, tx, ty);
|
||||
|
||||
if (this.refreshTexture)
|
||||
{
|
||||
this.generateTilingTexture(false, renderSession);
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
this.tilePattern = context.createPattern(this.tilingTexture.baseTexture.source, 'repeat');
|
||||
}
|
||||
else
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
var sessionBlendMode = renderSession.currentBlendMode;
|
||||
|
||||
// Check blend mode
|
||||
if (this.blendMode !== renderSession.currentBlendMode)
|
||||
{
|
||||
renderSession.currentBlendMode = this.blendMode;
|
||||
context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode];
|
||||
}
|
||||
|
||||
var tilePosition = this.tilePosition;
|
||||
var tileScale = this.tileScale;
|
||||
|
||||
tilePosition.x %= this.tilingTexture.baseTexture.width;
|
||||
tilePosition.y %= this.tilingTexture.baseTexture.height;
|
||||
|
||||
// Translate
|
||||
context.scale(tileScale.x, tileScale.y);
|
||||
context.translate(tilePosition.x + (this.anchor.x * -this._width), tilePosition.y + (this.anchor.y * -this._height));
|
||||
|
||||
context.fillStyle = this.tilePattern;
|
||||
|
||||
tx = -tilePosition.x;
|
||||
ty = -tilePosition.y;
|
||||
|
||||
var tw = this._width / tileScale.x;
|
||||
var th = this._height / tileScale.y;
|
||||
|
||||
// Allow for pixel rounding
|
||||
if (renderSession.roundPixels)
|
||||
{
|
||||
tx |= 0;
|
||||
ty |= 0;
|
||||
tw |= 0;
|
||||
th |= 0;
|
||||
}
|
||||
|
||||
context.fillRect(tx, ty, tw, th);
|
||||
|
||||
// Translate back again
|
||||
context.scale(1 / tileScale.x, 1 / tileScale.y);
|
||||
context.translate(-tilePosition.x + (this.anchor.x * this._width), -tilePosition.y + (this.anchor.y * this._height));
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.maskManager.popMask(renderSession);
|
||||
}
|
||||
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
this.children[i]._renderCanvas(renderSession);
|
||||
}
|
||||
|
||||
// Reset blend mode
|
||||
if (sessionBlendMode !== this.blendMode)
|
||||
{
|
||||
renderSession.currentBlendMode = sessionBlendMode;
|
||||
context.globalCompositeOperation = PIXI.blendModesCanvas[sessionBlendMode];
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Override the Sprite method.
|
||||
*
|
||||
* @private
|
||||
* @method Phaser.TileSprite#onTextureUpdate
|
||||
* @memberof Phaser.TileSprite
|
||||
*/
|
||||
Phaser.TileSprite.prototype.onTextureUpdate = function () {
|
||||
|
||||
// overriding the sprite version of this!
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Internal method that generates a new tiling texture.
|
||||
*
|
||||
* @method Phaser.TileSprite#generateTilingTexture
|
||||
* @memberof Phaser.TileSprite
|
||||
* @param {boolean} forcePowerOfTwo - Whether we want to force the texture to be a power of two
|
||||
*/
|
||||
Phaser.TileSprite.prototype.generateTilingTexture = function (forcePowerOfTwo) {
|
||||
|
||||
if (!this.texture.baseTexture.hasLoaded)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var texture = this.texture;
|
||||
var frame = texture.frame;
|
||||
|
||||
var targetWidth = this._frame.sourceSizeW || this._frame.width;
|
||||
var targetHeight = this._frame.sourceSizeH || this._frame.height;
|
||||
|
||||
var dx = 0;
|
||||
var dy = 0;
|
||||
|
||||
if (this._frame.trimmed)
|
||||
{
|
||||
dx = this._frame.spriteSourceSizeX;
|
||||
dy = this._frame.spriteSourceSizeY;
|
||||
}
|
||||
|
||||
if (forcePowerOfTwo)
|
||||
{
|
||||
targetWidth = PIXI.getNextPowerOfTwo(targetWidth);
|
||||
targetHeight = PIXI.getNextPowerOfTwo(targetHeight);
|
||||
}
|
||||
|
||||
if (this.canvasBuffer)
|
||||
{
|
||||
this.canvasBuffer.resize(targetWidth, targetHeight);
|
||||
this.tilingTexture.baseTexture.width = targetWidth;
|
||||
this.tilingTexture.baseTexture.height = targetHeight;
|
||||
this.tilingTexture.needsUpdate = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.canvasBuffer = new PIXI.CanvasBuffer(targetWidth, targetHeight);
|
||||
this.tilingTexture = PIXI.Texture.fromCanvas(this.canvasBuffer.canvas);
|
||||
this.tilingTexture.isTiling = true;
|
||||
this.tilingTexture.needsUpdate = true;
|
||||
}
|
||||
|
||||
if (this.textureDebug)
|
||||
{
|
||||
this.canvasBuffer.context.strokeStyle = '#00ff00';
|
||||
this.canvasBuffer.context.strokeRect(0, 0, targetWidth, targetHeight);
|
||||
}
|
||||
|
||||
// If a sprite sheet we need this:
|
||||
var w = texture.crop.width;
|
||||
var h = texture.crop.height;
|
||||
|
||||
if (w !== targetWidth || h !== targetHeight)
|
||||
{
|
||||
w = targetWidth;
|
||||
h = targetHeight;
|
||||
}
|
||||
|
||||
this.canvasBuffer.context.drawImage(
|
||||
texture.baseTexture.source,
|
||||
texture.crop.x,
|
||||
texture.crop.y,
|
||||
texture.crop.width,
|
||||
texture.crop.height,
|
||||
dx,
|
||||
dy,
|
||||
w,
|
||||
h
|
||||
);
|
||||
|
||||
this.tileScaleOffset.x = frame.width / targetWidth;
|
||||
this.tileScaleOffset.y = frame.height / targetHeight;
|
||||
|
||||
this.refreshTexture = false;
|
||||
|
||||
this.tilingTexture.baseTexture._powerOf2 = true;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Returns the framing rectangle of the Tile Sprite.
|
||||
*
|
||||
* @method Phaser.TileSprite#getBounds
|
||||
* @memberof Phaser.TileSprite
|
||||
* @return {Phaser.Rectangle} The bounds of the Tile Sprite.
|
||||
*/
|
||||
Phaser.TileSprite.prototype.getBounds = function () {
|
||||
|
||||
var width = this._width;
|
||||
var height = this._height;
|
||||
|
||||
var w0 = width * (1 - this.anchor.x);
|
||||
var w1 = width * -this.anchor.x;
|
||||
|
||||
var h0 = height * (1 - this.anchor.y);
|
||||
var h1 = height * -this.anchor.y;
|
||||
|
||||
var worldTransform = this.worldTransform;
|
||||
|
||||
var a = worldTransform.a;
|
||||
var b = worldTransform.b;
|
||||
var c = worldTransform.c;
|
||||
var d = worldTransform.d;
|
||||
var tx = worldTransform.tx;
|
||||
var ty = worldTransform.ty;
|
||||
|
||||
var x1 = (a * w1) + (c * h1) + tx;
|
||||
var y1 = (d * h1) + (b * w1) + ty;
|
||||
|
||||
var x2 = (a * w0) + (c * h1) + tx;
|
||||
var y2 = (d * h1) + (b * w0) + ty;
|
||||
|
||||
var x3 = (a * w0) + (c * h0) + tx;
|
||||
var y3 = (d * h0) + (b * w0) + ty;
|
||||
|
||||
var x4 = a * w1 + c * h0 + tx;
|
||||
var y4 = d * h0 + b * w1 + ty;
|
||||
|
||||
var maxX = -Infinity;
|
||||
var maxY = -Infinity;
|
||||
|
||||
var minX = Infinity;
|
||||
var minY = Infinity;
|
||||
|
||||
minX = x1 < minX ? x1 : minX;
|
||||
minX = x2 < minX ? x2 : minX;
|
||||
minX = x3 < minX ? x3 : minX;
|
||||
minX = x4 < minX ? x4 : minX;
|
||||
|
||||
minY = y1 < minY ? y1 : minY;
|
||||
minY = y2 < minY ? y2 : minY;
|
||||
minY = y3 < minY ? y3 : minY;
|
||||
minY = y4 < minY ? y4 : minY;
|
||||
|
||||
maxX = x1 > maxX ? x1 : maxX;
|
||||
maxX = x2 > maxX ? x2 : maxX;
|
||||
maxX = x3 > maxX ? x3 : maxX;
|
||||
maxX = x4 > maxX ? x4 : maxX;
|
||||
|
||||
maxY = y1 > maxY ? y1 : maxY;
|
||||
maxY = y2 > maxY ? y2 : maxY;
|
||||
maxY = y3 > maxY ? y3 : maxY;
|
||||
maxY = y4 > maxY ? y4 : maxY;
|
||||
|
||||
// TODO: This is surely always undefined? As it's not set anywhere in the parent objects
|
||||
var bounds = this._bounds;
|
||||
|
||||
bounds.x = minX;
|
||||
bounds.width = maxX - minX;
|
||||
|
||||
bounds.y = minY;
|
||||
bounds.height = maxY - minY;
|
||||
|
||||
// store a reference so that if this function gets called again in the render cycle we do not have to recalculate
|
||||
this._currentBounds = bounds;
|
||||
|
||||
return bounds;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* The width of the sprite, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(Phaser.TileSprite.prototype, 'width', {
|
||||
|
||||
get: function () {
|
||||
|
||||
return this._width;
|
||||
|
||||
},
|
||||
|
||||
set: function (value) {
|
||||
|
||||
this._width = value;
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* The height of the TilingSprite, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(Phaser.TileSprite.prototype, 'height', {
|
||||
|
||||
get: function () {
|
||||
|
||||
return this._height;
|
||||
|
||||
},
|
||||
|
||||
set: function (value) {
|
||||
|
||||
this._height = value;
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,554 +0,0 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/
|
||||
*/
|
||||
|
||||
/**
|
||||
* A tiling sprite is a fast way of rendering a tiling image
|
||||
*
|
||||
* @class TilingSprite
|
||||
* @extends Sprite
|
||||
* @constructor
|
||||
* @param texture {Texture} the texture of the tiling sprite
|
||||
* @param width {Number} the width of the tiling sprite
|
||||
* @param height {Number} the height of the tiling sprite
|
||||
*/
|
||||
PIXI.TilingSprite = function(texture, width, height)
|
||||
{
|
||||
PIXI.Sprite.call(this, texture);
|
||||
|
||||
/**
|
||||
* The width of the tiling sprite
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
*/
|
||||
this._width = width || 128;
|
||||
|
||||
/**
|
||||
* The height of the tiling sprite
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
*/
|
||||
this._height = height || 128;
|
||||
|
||||
/**
|
||||
* The scaling of the image that is being tiled
|
||||
*
|
||||
* @property tileScale
|
||||
* @type Point
|
||||
*/
|
||||
this.tileScale = new PIXI.Point(1, 1);
|
||||
|
||||
/**
|
||||
* A point that represents the scale of the texture object
|
||||
*
|
||||
* @property tileScaleOffset
|
||||
* @type Point
|
||||
*/
|
||||
this.tileScaleOffset = new PIXI.Point(1, 1);
|
||||
|
||||
/**
|
||||
* The offset position of the image that is being tiled
|
||||
*
|
||||
* @property tilePosition
|
||||
* @type Point
|
||||
*/
|
||||
this.tilePosition = new PIXI.Point();
|
||||
|
||||
/**
|
||||
* Whether this sprite is renderable or not
|
||||
*
|
||||
* @property renderable
|
||||
* @type Boolean
|
||||
* @default true
|
||||
*/
|
||||
this.renderable = true;
|
||||
|
||||
/**
|
||||
* The tint applied to the sprite. This is a hex value
|
||||
*
|
||||
* @property tint
|
||||
* @type Number
|
||||
* @default 0xFFFFFF
|
||||
*/
|
||||
this.tint = 0xFFFFFF;
|
||||
|
||||
/**
|
||||
* If enabled a green rectangle will be drawn behind the generated tiling texture, allowing you to visually
|
||||
* debug the texture being used.
|
||||
*
|
||||
* @property textureDebug
|
||||
* @type Boolean
|
||||
*/
|
||||
this.textureDebug = false;
|
||||
|
||||
/**
|
||||
* The blend mode to be applied to the sprite
|
||||
*
|
||||
* @property blendMode
|
||||
* @type Number
|
||||
* @default PIXI.blendModes.NORMAL;
|
||||
*/
|
||||
this.blendMode = PIXI.blendModes.NORMAL;
|
||||
|
||||
/**
|
||||
* The CanvasBuffer object that the tiled texture is drawn to.
|
||||
*
|
||||
* @property canvasBuffer
|
||||
* @type PIXI.CanvasBuffer
|
||||
*/
|
||||
this.canvasBuffer = null;
|
||||
|
||||
/**
|
||||
* An internal Texture object that holds the tiling texture that was generated from TilingSprite.texture.
|
||||
*
|
||||
* @property tilingTexture
|
||||
* @type PIXI.Texture
|
||||
*/
|
||||
this.tilingTexture = null;
|
||||
|
||||
/**
|
||||
* The Context fill pattern that is used to draw the TilingSprite in Canvas mode only (will be null in WebGL).
|
||||
*
|
||||
* @property tilePattern
|
||||
* @type PIXI.Texture
|
||||
*/
|
||||
this.tilePattern = null;
|
||||
|
||||
/**
|
||||
* If true the TilingSprite will run generateTexture on its **next** render pass.
|
||||
* This is set by the likes of Phaser.LoadTexture.setFrame.
|
||||
*
|
||||
* @property refreshTexture
|
||||
* @type Boolean
|
||||
* @default true
|
||||
*/
|
||||
this.refreshTexture = true;
|
||||
|
||||
this.frameWidth = 0;
|
||||
this.frameHeight = 0;
|
||||
|
||||
};
|
||||
|
||||
PIXI.TilingSprite.prototype = Object.create(PIXI.Sprite.prototype);
|
||||
PIXI.TilingSprite.prototype.constructor = PIXI.TilingSprite;
|
||||
|
||||
PIXI.TilingSprite.prototype.setTexture = function(texture)
|
||||
{
|
||||
if (this.texture !== texture)
|
||||
{
|
||||
this.texture = texture;
|
||||
this.refreshTexture = true;
|
||||
this.cachedTint = 0xFFFFFF;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the WebGL renderer
|
||||
*
|
||||
* @method _renderWebGL
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
*/
|
||||
PIXI.TilingSprite.prototype._renderWebGL = function(renderSession)
|
||||
{
|
||||
if (!this.visible || !this.renderable || this.alpha === 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.spriteBatch.stop();
|
||||
renderSession.maskManager.pushMask(this.mask, renderSession);
|
||||
renderSession.spriteBatch.start();
|
||||
}
|
||||
|
||||
if (this._filters)
|
||||
{
|
||||
renderSession.spriteBatch.flush();
|
||||
renderSession.filterManager.pushFilter(this._filterBlock);
|
||||
}
|
||||
|
||||
if (this.refreshTexture)
|
||||
{
|
||||
this.generateTilingTexture(true, renderSession);
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
if (this.tilingTexture.needsUpdate)
|
||||
{
|
||||
this.tilingTexture.baseTexture.textureIndex = this.texture.baseTexture.textureIndex;
|
||||
renderSession.renderer.updateTexture(this.tilingTexture.baseTexture);
|
||||
this.tilingTexture.needsUpdate = false;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
renderSession.spriteBatch.renderTilingSprite(this);
|
||||
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
this.children[i]._renderWebGL(renderSession);
|
||||
}
|
||||
var restartBatch = false;
|
||||
if (this._filters)
|
||||
{
|
||||
restartBatch = true;
|
||||
renderSession.spriteBatch.stop();
|
||||
renderSession.filterManager.popFilter();
|
||||
}
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
if (!restartBatch)
|
||||
renderSession.spriteBatch.stop();
|
||||
renderSession.maskManager.popMask(this._mask, renderSession);
|
||||
}
|
||||
if (restartBatch)
|
||||
renderSession.spriteBatch.start();
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the object using the Canvas renderer
|
||||
*
|
||||
* @method _renderCanvas
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
*/
|
||||
PIXI.TilingSprite.prototype._renderCanvas = function(renderSession)
|
||||
{
|
||||
if (!this.visible || !this.renderable || this.alpha === 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var context = renderSession.context;
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.maskManager.pushMask(this._mask, renderSession);
|
||||
}
|
||||
|
||||
context.globalAlpha = this.worldAlpha;
|
||||
|
||||
var wt = this.worldTransform;
|
||||
var resolution = renderSession.resolution;
|
||||
var tx = (wt.tx * resolution) + renderSession.shakeX;
|
||||
var ty = (wt.ty * resolution) + renderSession.shakeY;
|
||||
|
||||
context.setTransform(wt.a * resolution, wt.b * resolution, wt.c * resolution, wt.d * resolution, tx, ty);
|
||||
|
||||
if (this.refreshTexture)
|
||||
{
|
||||
this.generateTilingTexture(false, renderSession);
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
this.tilePattern = context.createPattern(this.tilingTexture.baseTexture.source, 'repeat');
|
||||
}
|
||||
else
|
||||
{
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
var sessionBlendMode = renderSession.currentBlendMode;
|
||||
|
||||
// Check blend mode
|
||||
if (this.blendMode !== renderSession.currentBlendMode)
|
||||
{
|
||||
renderSession.currentBlendMode = this.blendMode;
|
||||
context.globalCompositeOperation = PIXI.blendModesCanvas[renderSession.currentBlendMode];
|
||||
}
|
||||
|
||||
var tilePosition = this.tilePosition;
|
||||
var tileScale = this.tileScale;
|
||||
|
||||
tilePosition.x %= this.tilingTexture.baseTexture.width;
|
||||
tilePosition.y %= this.tilingTexture.baseTexture.height;
|
||||
|
||||
// Translate
|
||||
context.scale(tileScale.x, tileScale.y);
|
||||
context.translate(tilePosition.x + (this.anchor.x * -this._width), tilePosition.y + (this.anchor.y * -this._height));
|
||||
|
||||
context.fillStyle = this.tilePattern;
|
||||
|
||||
var tx = -tilePosition.x;
|
||||
var ty = -tilePosition.y;
|
||||
var tw = this._width / tileScale.x;
|
||||
var th = this._height / tileScale.y;
|
||||
|
||||
// Allow for pixel rounding
|
||||
if (renderSession.roundPixels)
|
||||
{
|
||||
tx |= 0;
|
||||
ty |= 0;
|
||||
tw |= 0;
|
||||
th |= 0;
|
||||
}
|
||||
|
||||
context.fillRect(tx, ty, tw, th);
|
||||
|
||||
// Translate back again
|
||||
context.scale(1 / tileScale.x, 1 / tileScale.y);
|
||||
context.translate(-tilePosition.x + (this.anchor.x * this._width), -tilePosition.y + (this.anchor.y * this._height));
|
||||
|
||||
if (this._mask)
|
||||
{
|
||||
renderSession.maskManager.popMask(renderSession);
|
||||
}
|
||||
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
this.children[i]._renderCanvas(renderSession);
|
||||
}
|
||||
|
||||
// Reset blend mode
|
||||
if (sessionBlendMode !== this.blendMode)
|
||||
{
|
||||
renderSession.currentBlendMode = sessionBlendMode;
|
||||
context.globalCompositeOperation = PIXI.blendModesCanvas[sessionBlendMode];
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* When the texture is updated, this event will fire to update the scale and frame
|
||||
*
|
||||
* @method onTextureUpdate
|
||||
* @param event
|
||||
* @private
|
||||
*/
|
||||
PIXI.TilingSprite.prototype.onTextureUpdate = function()
|
||||
{
|
||||
// overriding the sprite version of this!
|
||||
};
|
||||
|
||||
/**
|
||||
*
|
||||
* @method generateTilingTexture
|
||||
*
|
||||
* @param forcePowerOfTwo {Boolean} Whether we want to force the texture to be a power of two
|
||||
* @param renderSession {RenderSession}
|
||||
*/
|
||||
PIXI.TilingSprite.prototype.generateTilingTexture = function(forcePowerOfTwo, renderSession)
|
||||
{
|
||||
if (!this.texture.baseTexture.hasLoaded)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var texture = this.texture;
|
||||
var frame = texture.frame;
|
||||
|
||||
var targetWidth = this._frame.sourceSizeW || this._frame.width;
|
||||
var targetHeight = this._frame.sourceSizeH || this._frame.height;
|
||||
|
||||
var dx = 0;
|
||||
var dy = 0;
|
||||
|
||||
if (this._frame.trimmed)
|
||||
{
|
||||
dx = this._frame.spriteSourceSizeX;
|
||||
dy = this._frame.spriteSourceSizeY;
|
||||
}
|
||||
|
||||
if (forcePowerOfTwo)
|
||||
{
|
||||
targetWidth = PIXI.getNextPowerOfTwo(targetWidth);
|
||||
targetHeight = PIXI.getNextPowerOfTwo(targetHeight);
|
||||
}
|
||||
|
||||
if (this.canvasBuffer)
|
||||
{
|
||||
this.canvasBuffer.resize(targetWidth, targetHeight);
|
||||
this.tilingTexture.baseTexture.width = targetWidth;
|
||||
this.tilingTexture.baseTexture.height = targetHeight;
|
||||
this.tilingTexture.needsUpdate = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.canvasBuffer = new PIXI.CanvasBuffer(targetWidth, targetHeight);
|
||||
this.tilingTexture = PIXI.Texture.fromCanvas(this.canvasBuffer.canvas);
|
||||
this.tilingTexture.isTiling = true;
|
||||
this.tilingTexture.needsUpdate = true;
|
||||
}
|
||||
|
||||
if (this.textureDebug)
|
||||
{
|
||||
this.canvasBuffer.context.strokeStyle = '#00ff00';
|
||||
this.canvasBuffer.context.strokeRect(0, 0, targetWidth, targetHeight);
|
||||
}
|
||||
|
||||
// If a sprite sheet we need this:
|
||||
var w = texture.crop.width;
|
||||
var h = texture.crop.height;
|
||||
|
||||
if (w !== targetWidth || h !== targetHeight)
|
||||
{
|
||||
w = targetWidth;
|
||||
h = targetHeight;
|
||||
}
|
||||
|
||||
this.canvasBuffer.context.drawImage(texture.baseTexture.source,
|
||||
texture.crop.x,
|
||||
texture.crop.y,
|
||||
texture.crop.width,
|
||||
texture.crop.height,
|
||||
dx,
|
||||
dy,
|
||||
w,
|
||||
h);
|
||||
|
||||
this.tileScaleOffset.x = frame.width / targetWidth;
|
||||
this.tileScaleOffset.y = frame.height / targetHeight;
|
||||
|
||||
this.refreshTexture = false;
|
||||
|
||||
this.tilingTexture.baseTexture._powerOf2 = true;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Returns the framing rectangle of the sprite as a PIXI.Rectangle object
|
||||
*
|
||||
* @method getBounds
|
||||
* @return {Rectangle} the framing rectangle
|
||||
*/
|
||||
PIXI.TilingSprite.prototype.getBounds = function()
|
||||
{
|
||||
var width = this._width;
|
||||
var height = this._height;
|
||||
|
||||
var w0 = width * (1-this.anchor.x);
|
||||
var w1 = width * -this.anchor.x;
|
||||
|
||||
var h0 = height * (1-this.anchor.y);
|
||||
var h1 = height * -this.anchor.y;
|
||||
|
||||
var worldTransform = this.worldTransform;
|
||||
|
||||
var a = worldTransform.a;
|
||||
var b = worldTransform.b;
|
||||
var c = worldTransform.c;
|
||||
var d = worldTransform.d;
|
||||
var tx = worldTransform.tx;
|
||||
var ty = worldTransform.ty;
|
||||
|
||||
var x1 = a * w1 + c * h1 + tx;
|
||||
var y1 = d * h1 + b * w1 + ty;
|
||||
|
||||
var x2 = a * w0 + c * h1 + tx;
|
||||
var y2 = d * h1 + b * w0 + ty;
|
||||
|
||||
var x3 = a * w0 + c * h0 + tx;
|
||||
var y3 = d * h0 + b * w0 + ty;
|
||||
|
||||
var x4 = a * w1 + c * h0 + tx;
|
||||
var y4 = d * h0 + b * w1 + ty;
|
||||
|
||||
var maxX = -Infinity;
|
||||
var maxY = -Infinity;
|
||||
|
||||
var minX = Infinity;
|
||||
var minY = Infinity;
|
||||
|
||||
minX = x1 < minX ? x1 : minX;
|
||||
minX = x2 < minX ? x2 : minX;
|
||||
minX = x3 < minX ? x3 : minX;
|
||||
minX = x4 < minX ? x4 : minX;
|
||||
|
||||
minY = y1 < minY ? y1 : minY;
|
||||
minY = y2 < minY ? y2 : minY;
|
||||
minY = y3 < minY ? y3 : minY;
|
||||
minY = y4 < minY ? y4 : minY;
|
||||
|
||||
maxX = x1 > maxX ? x1 : maxX;
|
||||
maxX = x2 > maxX ? x2 : maxX;
|
||||
maxX = x3 > maxX ? x3 : maxX;
|
||||
maxX = x4 > maxX ? x4 : maxX;
|
||||
|
||||
maxY = y1 > maxY ? y1 : maxY;
|
||||
maxY = y2 > maxY ? y2 : maxY;
|
||||
maxY = y3 > maxY ? y3 : maxY;
|
||||
maxY = y4 > maxY ? y4 : maxY;
|
||||
|
||||
var bounds = this._bounds;
|
||||
|
||||
bounds.x = minX;
|
||||
bounds.width = maxX - minX;
|
||||
|
||||
bounds.y = minY;
|
||||
bounds.height = maxY - minY;
|
||||
|
||||
// store a reference so that if this function gets called again in the render cycle we do not have to recalculate
|
||||
this._currentBounds = bounds;
|
||||
|
||||
return bounds;
|
||||
};
|
||||
|
||||
PIXI.TilingSprite.prototype.destroy = function () {
|
||||
|
||||
PIXI.Sprite.prototype.destroy.call(this);
|
||||
|
||||
if (this.canvasBuffer)
|
||||
{
|
||||
this.canvasBuffer.destroy();
|
||||
this.canvasBuffer = null;
|
||||
}
|
||||
|
||||
this.tileScale = null;
|
||||
this.tileScaleOffset = null;
|
||||
this.tilePosition = null;
|
||||
|
||||
if (this.tilingTexture)
|
||||
{
|
||||
this.tilingTexture.destroy(true);
|
||||
this.tilingTexture = null;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* The width of the sprite, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(PIXI.TilingSprite.prototype, 'width', {
|
||||
|
||||
get: function() {
|
||||
return this._width;
|
||||
},
|
||||
|
||||
set: function(value) {
|
||||
this._width = value;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* The height of the TilingSprite, setting this will actually modify the scale to achieve the value set
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
*/
|
||||
Object.defineProperty(PIXI.TilingSprite.prototype, 'height', {
|
||||
|
||||
get: function() {
|
||||
return this._height;
|
||||
},
|
||||
|
||||
set: function(value) {
|
||||
this._height = value;
|
||||
}
|
||||
|
||||
});
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
[
|
||||
"src/pixi/extras/TilingSprite.js"
|
||||
]
|
||||
|
|
@ -40,11 +40,6 @@ module.exports = {
|
|||
dest: '<%= modules_dir %>/pixi-rope.js'
|
||||
},
|
||||
|
||||
pixiTileSprite: {
|
||||
src: require('../manifests/pixi-tilesprite'),
|
||||
dest: '<%= modules_dir %>/pixi-tilesprite.js'
|
||||
},
|
||||
|
||||
pixiOutro: {
|
||||
src: require('../manifests/pixi-outro'),
|
||||
dest: '<%= modules_dir %>/pixi-outro.js'
|
||||
|
|
|
|||
Loading…
Reference in a new issue