mirror of
https://github.com/photonstorm/phaser
synced 2025-02-16 14:08:28 +00:00
Updated Game Object renderer blocks to use 'this'.
Split out the Graphics renderer to avoid being a giant if/else loop.
This commit is contained in:
Richard Davey
parent
7b40711418
commit
40bef9543a
5 changed files with 255 additions and 231 deletions
|
|
@ -40,7 +40,7 @@
|
|||
"consistent-this": [ "error", "_this" ],
|
||||
"eol-last": [ "error" ],
|
||||
"func-call-spacing": [ "error", "never" ],
|
||||
"indent": [ "error", 4, { "SwitchCase": 4 } ],
|
||||
"indent": [ "error", 4, { "SwitchCase": 1 } ],
|
||||
"key-spacing": [ "error", { "beforeColon": false, "afterColon": true }],
|
||||
"linebreak-style": [ "off" ],
|
||||
"lines-around-comment": [ "error", { "beforeBlockComment": true }],
|
||||
|
|
|
|||
|
|
@ -181,7 +181,6 @@ Phaser.Renderer.Canvas.prototype = {
|
|||
|
||||
// Add Pre-render hook
|
||||
|
||||
// this.renderSession.currentBlendMode = 0;
|
||||
// this.renderSession.shakeX = this.game.camera._shake.x;
|
||||
// this.renderSession.shakeY = this.game.camera._shake.y;
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,30 @@
|
|||
/**
|
||||
* Renders the object using the Canvas renderer
|
||||
*
|
||||
* @method _renderCanvas
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
* Note that 'this' in all functions here refer to the owning object.
|
||||
* For example the Group, Stage, Sprite, etc. because the render function
|
||||
* here is mapped to the prototype for the game object.
|
||||
*/
|
||||
Phaser.Renderer.Canvas.GameObjects.Container = {
|
||||
|
||||
render: function (renderer, source)
|
||||
render: function (renderer)
|
||||
{
|
||||
if (source.visible === false || source.alpha === 0)
|
||||
if (this.visible === false || this.alpha === 0)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// if (this._cacheAsBitmap)
|
||||
// {
|
||||
// this._renderCachedSprite(renderSession);
|
||||
// return;
|
||||
// }
|
||||
|
||||
if (source._mask)
|
||||
if (this._cacheAsBitmap)
|
||||
{
|
||||
renderer.pushMask(source._mask);
|
||||
return this.renderCachedSprite(renderer);
|
||||
}
|
||||
|
||||
for (var i = 0; i < source.children.length; i++)
|
||||
if (this._mask)
|
||||
{
|
||||
var child = source.children[i];
|
||||
renderer.pushMask(this._mask);
|
||||
}
|
||||
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
var child = this.children[i];
|
||||
|
||||
child.render(renderer, child);
|
||||
}
|
||||
|
|
@ -39,11 +36,10 @@ Phaser.Renderer.Canvas.GameObjects.Container = {
|
|||
|
||||
},
|
||||
|
||||
renderCache: function (renderer, source)
|
||||
renderCachedSprite: function (renderer)
|
||||
{
|
||||
// Do something
|
||||
|
||||
return source;
|
||||
// TODO
|
||||
return renderer;
|
||||
}
|
||||
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,212 +1,245 @@
|
|||
/**
|
||||
* Renders the object using the Canvas renderer
|
||||
*
|
||||
* @method _renderCanvas
|
||||
* @param renderSession {RenderSession}
|
||||
* @private
|
||||
* Note that 'this' in all functions here refer to the owning object.
|
||||
* For example the Group, Stage, Sprite, etc. because the render function
|
||||
* here is mapped to the prototype for the game object.
|
||||
*/
|
||||
Phaser.Renderer.Canvas.GameObjects.Graphics = {
|
||||
|
||||
render: function (renderer, graphics)
|
||||
render: function (renderer)
|
||||
{
|
||||
var worldAlpha = graphics.worldAlpha;
|
||||
var context = renderer.context;
|
||||
|
||||
if (graphics.dirty)
|
||||
if (this.dirty)
|
||||
{
|
||||
this.updateGraphicsTint(graphics);
|
||||
graphics.dirty = false;
|
||||
this.updateGraphicsTint();
|
||||
this.dirty = false;
|
||||
}
|
||||
|
||||
for (var i = 0; i < graphics.graphicsData.length; i++)
|
||||
for (var i = 0; i < this.graphicsData.length; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
var shape = data.shape;
|
||||
|
||||
var fillColor = data._fillTint;
|
||||
var lineColor = data._lineTint;
|
||||
var data = this.graphicsData[i];
|
||||
|
||||
context.lineWidth = data.lineWidth;
|
||||
|
||||
if (data.type === Phaser.POLYGON)
|
||||
switch (data.type)
|
||||
{
|
||||
context.beginPath();
|
||||
case Phaser.RECTANGLE:
|
||||
this.drawRectangle(data, context);
|
||||
break;
|
||||
|
||||
var points = shape.points;
|
||||
case Phaser.CIRCLE:
|
||||
this.drawCircle(data, context);
|
||||
break;
|
||||
|
||||
context.moveTo(points[0], points[1]);
|
||||
case Phaser.POLYGON:
|
||||
this.drawPolygon(data, context);
|
||||
break;
|
||||
|
||||
for (var j = 1; j < points.length / 2; j++)
|
||||
{
|
||||
context.lineTo(points[j * 2], points[j * 2 + 1]);
|
||||
}
|
||||
case Phaser.ELLIPSE:
|
||||
this.drawEllipse(data, context);
|
||||
break;
|
||||
|
||||
if (shape.closed)
|
||||
{
|
||||
context.lineTo(points[0], points[1]);
|
||||
}
|
||||
|
||||
// if the first and last point are the same close the path - much neater :)
|
||||
if (points[0] === points[points.length - 2] && points[1] === points[points.length - 1])
|
||||
{
|
||||
context.closePath();
|
||||
}
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if (data.type === Phaser.RECTANGLE)
|
||||
{
|
||||
if (data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (fillColor | 0).toString(16)).substr(-6);
|
||||
context.fillRect(shape.x, shape.y, shape.width, shape.height);
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (lineColor | 0).toString(16)).substr(-6);
|
||||
context.strokeRect(shape.x, shape.y, shape.width, shape.height);
|
||||
}
|
||||
}
|
||||
else if (data.type === Phaser.CIRCLE)
|
||||
{
|
||||
// TODO - need to be Undefined!
|
||||
context.beginPath();
|
||||
context.arc(shape.x, shape.y, shape.radius, 0, 2 * Math.PI);
|
||||
context.closePath();
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if (data.type === Phaser.ELLIPSE)
|
||||
{
|
||||
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
|
||||
|
||||
var w = shape.width * 2;
|
||||
var h = shape.height * 2;
|
||||
|
||||
var x = shape.x - (w / 2);
|
||||
var y = shape.y - (h / 2);
|
||||
|
||||
context.beginPath();
|
||||
|
||||
var kappa = 0.5522848,
|
||||
ox = (w / 2) * kappa, // control point offset horizontal
|
||||
oy = (h / 2) * kappa, // control point offset vertical
|
||||
xe = x + w, // x-end
|
||||
ye = y + h, // y-end
|
||||
xm = x + (w / 2), // x-middle
|
||||
ym = y + (h / 2); // y-middle
|
||||
|
||||
context.moveTo(x, ym);
|
||||
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
|
||||
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
|
||||
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
|
||||
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
|
||||
|
||||
context.closePath();
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if (data.type === Phaser.ROUNDEDRECTANGLE)
|
||||
{
|
||||
var rx = shape.x;
|
||||
var ry = shape.y;
|
||||
var width = shape.width;
|
||||
var height = shape.height;
|
||||
var radius = shape.radius;
|
||||
|
||||
var maxRadius = Math.min(width, height) / 2 | 0;
|
||||
radius = radius > maxRadius ? maxRadius : radius;
|
||||
|
||||
context.beginPath();
|
||||
context.moveTo(rx, ry + radius);
|
||||
context.lineTo(rx, ry + height - radius);
|
||||
context.quadraticCurveTo(rx, ry + height, rx + radius, ry + height);
|
||||
context.lineTo(rx + width - radius, ry + height);
|
||||
context.quadraticCurveTo(rx + width, ry + height, rx + width, ry + height - radius);
|
||||
context.lineTo(rx + width, ry + radius);
|
||||
context.quadraticCurveTo(rx + width, ry, rx + width - radius, ry);
|
||||
context.lineTo(rx + radius, ry);
|
||||
context.quadraticCurveTo(rx, ry, rx, ry + radius);
|
||||
context.closePath();
|
||||
|
||||
if (data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
case Phaser.ROUNDEDRECTANGLE:
|
||||
this.drawRoundedRectangle(data, context);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
updateGraphicsTint: function (graphics)
|
||||
drawRectangle: function (data, context)
|
||||
{
|
||||
if (graphics.tint === 0xFFFFFF)
|
||||
var shape = data.shape;
|
||||
|
||||
if (data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * this.worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (data._fillTint | 0).toString(16)).substr(-6);
|
||||
context.fillRect(shape.x, shape.y, shape.width, shape.height);
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * this.worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (data._lineTint | 0).toString(16)).substr(-6);
|
||||
context.strokeRect(shape.x, shape.y, shape.width, shape.height);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
drawRoundedRectangle: function (data, context)
|
||||
{
|
||||
var shape = data.shape;
|
||||
|
||||
var rx = shape.x;
|
||||
var ry = shape.y;
|
||||
var width = shape.width;
|
||||
var height = shape.height;
|
||||
var radius = shape.radius;
|
||||
|
||||
var maxRadius = Math.min(width, height) / 2 | 0;
|
||||
radius = radius > maxRadius ? maxRadius : radius;
|
||||
|
||||
context.beginPath();
|
||||
context.moveTo(rx, ry + radius);
|
||||
context.lineTo(rx, ry + height - radius);
|
||||
context.quadraticCurveTo(rx, ry + height, rx + radius, ry + height);
|
||||
context.lineTo(rx + width - radius, ry + height);
|
||||
context.quadraticCurveTo(rx + width, ry + height, rx + width, ry + height - radius);
|
||||
context.lineTo(rx + width, ry + radius);
|
||||
context.quadraticCurveTo(rx + width, ry, rx + width - radius, ry);
|
||||
context.lineTo(rx + radius, ry);
|
||||
context.quadraticCurveTo(rx, ry, rx, ry + radius);
|
||||
context.closePath();
|
||||
|
||||
if (data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * this.worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (data._fillTint | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * this.worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (data._lineTint | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
drawEllipse: function (data, context)
|
||||
{
|
||||
var shape = data.shape;
|
||||
|
||||
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
|
||||
|
||||
var w = shape.width * 2;
|
||||
var h = shape.height * 2;
|
||||
|
||||
var x = shape.x - (w / 2);
|
||||
var y = shape.y - (h / 2);
|
||||
|
||||
context.beginPath();
|
||||
|
||||
var kappa = 0.5522848;
|
||||
var ox = (w / 2) * kappa; // control point offset horizontal
|
||||
var oy = (h / 2) * kappa; // control point offset vertical
|
||||
var xe = x + w; // x-end
|
||||
var ye = y + h; // y-end
|
||||
var xm = x + (w / 2); // x-middle
|
||||
var ym = y + (h / 2); // y-middle
|
||||
|
||||
context.moveTo(x, ym);
|
||||
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
|
||||
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
|
||||
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
|
||||
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
|
||||
|
||||
context.closePath();
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * this.worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (data._fillTint | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * this.worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (data._lineTint | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
drawCircle: function (data, context)
|
||||
{
|
||||
var shape = data.shape;
|
||||
|
||||
context.beginPath();
|
||||
context.arc(shape.x, shape.y, shape.radius, 0, 2 * Math.PI);
|
||||
context.closePath();
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * this.worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (data._fillTint | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * this.worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (data._lineTint | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
drawPolygon: function (data, context)
|
||||
{
|
||||
var shape = data.shape;
|
||||
|
||||
context.beginPath();
|
||||
|
||||
var points = shape.points;
|
||||
|
||||
context.moveTo(points[0], points[1]);
|
||||
|
||||
for (var j = 1; j < points.length / 2; j++)
|
||||
{
|
||||
context.lineTo(points[j * 2], points[j * 2 + 1]);
|
||||
}
|
||||
|
||||
if (shape.closed)
|
||||
{
|
||||
context.lineTo(points[0], points[1]);
|
||||
}
|
||||
|
||||
// if the first and last point are the same close the path - much neater :)
|
||||
if (points[0] === points[points.length - 2] && points[1] === points[points.length - 1])
|
||||
{
|
||||
context.closePath();
|
||||
}
|
||||
|
||||
if (data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * this.worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + (data._fillTint | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
|
||||
if (data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * this.worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + (data._lineTint | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
updateGraphicsTint: function ()
|
||||
{
|
||||
if (this.tint === 0xFFFFFF)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var tintR = (graphics.tint >> 16 & 0xFF) / 255;
|
||||
var tintG = (graphics.tint >> 8 & 0xFF) / 255;
|
||||
var tintB = (graphics.tint & 0xFF)/ 255;
|
||||
var tintR = (this.tint >> 16 & 0xFF) / 255;
|
||||
var tintG = (this.tint >> 8 & 0xFF) / 255;
|
||||
var tintB = (this.tint & 0xFF) / 255;
|
||||
|
||||
for (var i = 0; i < graphics.graphicsData.length; i++)
|
||||
for (var i = 0; i < this.graphicsData.length; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
var data = this.graphicsData[i];
|
||||
|
||||
var fillColor = data.fillColor | 0;
|
||||
var lineColor = data.lineColor | 0;
|
||||
|
||||
data._fillTint = (((fillColor >> 16 & 0xFF) / 255 * tintR * 255 << 16) + ((fillColor >> 8 & 0xFF) / 255 * tintG * 255 << 8) + (fillColor & 0xFF) / 255 * tintB * 255);
|
||||
data._lineTint = (((lineColor >> 16 & 0xFF) / 255 * tintR * 255 << 16) + ((lineColor >> 8 & 0xFF) / 255 * tintG * 255 << 8) + (lineColor & 0xFF) / 255 * tintB * 255);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,40 +1,36 @@
|
|||
/**
|
||||
* Renders the object using the Canvas renderer
|
||||
*
|
||||
* @method _renderCanvas
|
||||
* @param renderSession {RenderSession}
|
||||
* @param {Matrix} [matrix] - Optional matrix. If provided the Display Object will be rendered using this matrix, otherwise it will use its worldTransform.
|
||||
* @private
|
||||
* Note that 'this' in all functions here refer to the owning object.
|
||||
* For example the Group, Stage, Sprite, etc. because the render function
|
||||
* here is mapped to the prototype for the game object.
|
||||
*/
|
||||
Phaser.Renderer.Canvas.GameObjects.Sprite = {
|
||||
|
||||
render: function (renderer, source, matrix)
|
||||
render: function (renderer)
|
||||
{
|
||||
// If the sprite is not visible or the alpha is 0 then no need to render this element
|
||||
if (!source.visible || source.alpha === 0 || !source.renderable)
|
||||
if (!this.visible || this.alpha === 0 || !this.renderable)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
// Add back in: || src.texture.crop.width <= 0 || src.texture.crop.height <= 0
|
||||
|
||||
// If they provided an alternative rendering matrix then use it
|
||||
var wt = (matrix) ? matrix : source.worldTransform;
|
||||
var wt = this.worldTransform;
|
||||
|
||||
if (source.blendMode !== renderer.currentBlendMode)
|
||||
if (this.blendMode !== renderer.currentBlendMode)
|
||||
{
|
||||
renderer.currentBlendMode = source.blendMode;
|
||||
renderer.currentBlendMode = this.blendMode;
|
||||
renderer.context.globalCompositeOperation = Phaser.blendModesCanvas[renderer.currentBlendMode];
|
||||
}
|
||||
|
||||
// Check if the texture can be rendered
|
||||
|
||||
if (source._mask)
|
||||
if (this._mask)
|
||||
{
|
||||
renderer.pushMask(source._mask);
|
||||
renderer.pushMask(this._mask);
|
||||
}
|
||||
|
||||
// Ignore null sources
|
||||
// Ignore null thiss
|
||||
/*
|
||||
if (!src.texture.valid)
|
||||
{
|
||||
|
|
@ -53,28 +49,28 @@ Phaser.Renderer.Canvas.GameObjects.Sprite = {
|
|||
}
|
||||
*/
|
||||
|
||||
var resolution = source.texture.baseTexture.resolution / renderer.game.resolution;
|
||||
var resolution = this.texture.baseTexture.resolution / renderer.game.resolution;
|
||||
|
||||
renderer.context.globalAlpha = source.worldAlpha;
|
||||
renderer.context.globalAlpha = this.worldAlpha;
|
||||
|
||||
// If smoothingEnabled is supported and we need to change the smoothing property for src texture
|
||||
if (renderer.smoothProperty && renderer.currentScaleMode !== source.texture.baseTexture.scaleMode)
|
||||
if (renderer.smoothProperty && renderer.currentScaleMode !== this.texture.baseTexture.scaleMode)
|
||||
{
|
||||
renderer.currentScaleMode = source.texture.baseTexture.scaleMode;
|
||||
renderer.currentScaleMode = this.texture.baseTexture.scaleMode;
|
||||
renderer.context[renderer.smoothProperty] = (renderer.currentScaleMode === Phaser.scaleModes.LINEAR);
|
||||
}
|
||||
|
||||
// If the texture is trimmed we offset by the trim x/y, otherwise we use the frame dimensions
|
||||
var dx = (source.texture.trim) ? source.texture.trim.x - source.anchor.x * source.texture.trim.width : source.anchor.x * -source.texture.frame.width;
|
||||
var dy = (source.texture.trim) ? source.texture.trim.y - source.anchor.y * source.texture.trim.height : source.anchor.y * -source.texture.frame.height;
|
||||
var dx = (this.texture.trim) ? this.texture.trim.x - this.anchor.x * this.texture.trim.width : this.anchor.x * -this.texture.frame.width;
|
||||
var dy = (this.texture.trim) ? this.texture.trim.y - this.anchor.y * this.texture.trim.height : this.anchor.y * -this.texture.frame.height;
|
||||
|
||||
var tx = (wt.tx * renderer.game.resolution) + renderer.game.camera._shake.x;
|
||||
var ty = (wt.ty * renderer.game.resolution) + renderer.game.camera._shake.y;
|
||||
|
||||
var cw = source.texture.crop.width;
|
||||
var ch = source.texture.crop.height;
|
||||
var cw = this.texture.crop.width;
|
||||
var ch = this.texture.crop.height;
|
||||
|
||||
if (source.texture.rotated)
|
||||
if (this.texture.rotated)
|
||||
{
|
||||
var a = wt.a;
|
||||
var b = wt.b;
|
||||
|
|
@ -113,34 +109,34 @@ Phaser.Renderer.Canvas.GameObjects.Sprite = {
|
|||
dx /= resolution;
|
||||
dy /= resolution;
|
||||
|
||||
if (source.tint !== 0xFFFFFF)
|
||||
if (this.tint !== 0xFFFFFF)
|
||||
{
|
||||
if (source.texture.requiresReTint || source.cachedTint !== source.tint)
|
||||
if (this.texture.requiresReTint || this.cachedTint !== this.tint)
|
||||
{
|
||||
source.tintedTexture = PIXI.CanvasTinter.getTintedTexture(source, source.tint);
|
||||
this.tintedTexture = PIXI.CanvasTinter.getTintedTexture(this, this.tint);
|
||||
|
||||
source.cachedTint = source.tint;
|
||||
source.texture.requiresReTint = false;
|
||||
this.cachedTint = this.tint;
|
||||
this.texture.requiresReTint = false;
|
||||
}
|
||||
|
||||
renderer.context.drawImage(source.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
|
||||
renderer.context.drawImage(this.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
|
||||
}
|
||||
else
|
||||
{
|
||||
var cx = source.texture.crop.x;
|
||||
var cy = source.texture.crop.y;
|
||||
var cx = this.texture.crop.x;
|
||||
var cy = this.texture.crop.y;
|
||||
|
||||
renderer.context.drawImage(source.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
|
||||
renderer.context.drawImage(this.texture.baseTexture.this, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
|
||||
}
|
||||
|
||||
for (var i = 0; i < source.children.length; i++)
|
||||
for (var i = 0; i < this.children.length; i++)
|
||||
{
|
||||
var child = source.children[i];
|
||||
var child = this.children[i];
|
||||
|
||||
child.render(renderer, child);
|
||||
}
|
||||
|
||||
if (source._mask)
|
||||
if (this._mask)
|
||||
{
|
||||
renderer.popMask();
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue