Mirrors/phaser
2
0
Fork 0
mirror of https://github.com/photonstorm/phaser synced 2025-02-17 14:38:30 +00:00
Code Issues Projects Releases Packages Wiki Activity

Sorted out the mixin needed for the Canvas renderer.

Browse source
This commit is contained in:
Richard Davey 2016-10-05 01:09:23 +01:00
parent 047a994334
commit 4cd0e833d5
15 changed files with 170 additions and 178 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
build/config.php
View file

@ -133,27 +133,6 @@ EOL;
<script src="$path/src/textures/parsers/JSONHash.js"></script>
<script src="$path/src/textures/parsers/SpriteSheet.js"></script>
<script src="$path/src/renderer/canvas/CanvasRenderer.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Container.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Sprite.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Graphics.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/SpriteBatch.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Stage.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Text.js"></script>
<script src="$path/src/renderer/webgl/WebGLRenderer.js"></script>
<script src="$path/src/renderer/webgl/ShaderManager.js"></script>
<script src="$path/src/renderer/webgl/SpriteBatch.js"></script>
<script src="$path/src/renderer/webgl/shaders/Sprite.js"></script>
<script src="$path/src/renderer/webgl/shaders/SpriteBatch.js"></script>
<script src="$path/src/renderer/webgl/shaders/Strip.js"></script>
<script src="$path/src/renderer/webgl/shaders/PrimitiveGraphics.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Container.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Sprite.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Stage.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Text.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Graphics.js"></script>
EOL;
@ -219,6 +198,26 @@ EOL;
<script src="$path/src/plugins/path/PathPoint.js"></script>
<script src="$path/src/plugins/path/EventTarget.js"></script>
<script src="$path/src/renderer/canvas/CanvasRenderer.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Container.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Sprite.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/SpriteBatch.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Stage.js"></script>
<script src="$path/src/renderer/webgl/WebGLRenderer.js"></script>
<script src="$path/src/renderer/webgl/ShaderManager.js"></script>
<script src="$path/src/renderer/webgl/SpriteBatch.js"></script>
<script src="$path/src/renderer/webgl/shaders/Sprite.js"></script>
<script src="$path/src/renderer/webgl/shaders/SpriteBatch.js"></script>
<script src="$path/src/renderer/webgl/shaders/Strip.js"></script>
<script src="$path/src/renderer/webgl/shaders/PrimitiveGraphics.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Container.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Sprite.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Stage.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Text.js"></script>
<script src="$path/src/renderer/webgl/gameobjects/Graphics.js"></script>
EOL;
if ($modules['rope'])
@ -281,6 +280,7 @@ EOL;
{
echo <<<EOL
<script src="$path/src/gameobjects/Text.js"></script>
<script src="$path/src/renderer/canvas/gameobjects/Text.js"></script>
EOL;

9
src/core/Group.js
View file

@ -291,15 +291,6 @@ Phaser.Group = function (game, parent, name, addToStage, enableBody, physicsBody
*/
this._sortProperty = 'z';
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Container.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Container.render;
}
};
Phaser.Group.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);

9
src/core/Stage.js
View file

@ -93,15 +93,6 @@ Phaser.Stage = function (game) {
this.parseConfig(game.config);
}
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Stage.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Stage.render;
}
};
Phaser.Stage.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);

9
src/gameobjects/Graphics.js
View file

@ -201,15 +201,6 @@ Phaser.Graphics = function (game, x, y) {
Phaser.Component.Core.init.call(this, game, x, y, '', null);
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Graphics.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Graphics.render;
}
};
Phaser.Graphics.prototype = Object.create(PIXI.DisplayObjectContainer.prototype);

9
src/gameobjects/Image.js
View file

@ -50,15 +50,6 @@ Phaser.Image = function (game, x, y, key, frame) {
Phaser.Component.Core.init.call(this, game, x, y, key, frame);
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Sprite.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Sprite.render;
}
};
Phaser.Image.prototype = Object.create(PIXI.Sprite.prototype);

9
src/gameobjects/Sprite.js
View file

@ -64,15 +64,6 @@ Phaser.Sprite = function (game, x, y, key, frame) {
Phaser.Component.Core.init.call(this, game, x, y, key, frame);
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Sprite.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Sprite.render;
}
};
Phaser.Sprite.prototype = Object.create(PIXI.Sprite.prototype);

9
src/gameobjects/SpriteBatch.js
View file

@ -44,15 +44,6 @@ Phaser.SpriteBatch = function (game, parent, name, addToStage) {
*/
this.ready = false;
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.SpriteBatch.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.SpriteBatch.render;
}
};
Phaser.SpriteBatch.prototype = Object.create(Phaser.Group.prototype);

9
src/gameobjects/Text.js
View file

@ -190,15 +190,6 @@ Phaser.Text = function (game, x, y, text, style) {
this.updateText();
}
if (this.game.renderType === Phaser.CANVAS)
{
this.render = Phaser.Renderer.Canvas.GameObjects.Text.render;
}
else
{
this.render = Phaser.Renderer.WebGL.GameObjects.Text.render;
}
};
Phaser.Text.prototype = Object.create(Phaser.Sprite.prototype);

30
src/renderer/canvas/CanvasRenderer.js
View file

@ -95,12 +95,7 @@ Phaser.Renderer.Canvas = function (game)
this.currentBlendMode = 0;
this.currentScaleMode = 0;
if (this.game.device.canUseMultiply)
{
this.mapBlendModes();
}
this.resize(this.width, this.height);
this.init();
};
@ -110,6 +105,27 @@ Phaser.Renderer.Canvas.prototype.constructor = Phaser.Renderer.Canvas;
Phaser.Renderer.Canvas.prototype = {
init: function ()
{
// Mixin the renderer functions
for (var renderer in Phaser.Renderer.Canvas.GameObjects)
{
var types = Phaser.Renderer.Canvas.GameObjects[renderer].TYPES;
for (var i = 0; i < types.length; i++)
{
types[i].render = Phaser.Renderer.Canvas.GameObjects[renderer].render;
}
}
if (this.game.device.canUseMultiply)
{
this.mapBlendModes();
}
this.resize(this.width, this.height);
},
/**
* Maps Blend modes to Canvas blend modes.
*
@ -199,7 +215,7 @@ Phaser.Renderer.Canvas.prototype = {
}
}
stage.render(this);
stage.render(this, stage);
// Add Post-render hook
},

36
src/renderer/canvas/gameobjects/Container.js
View file

@ -1,45 +1,53 @@
/**
* 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.
* @author Richard Davey <rich@photonstorm.com>
* @author Mat Groves (@Doormat23)
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
Phaser.Renderer.Canvas.GameObjects.Container = {
render: function (renderer)
TYPES: [
Phaser.Group.prototype,
PIXI.DisplayObjectContainer.prototype
],
render: function (renderer, src)
{
if (this.visible === false || this.alpha === 0)
if (src.visible === false || src.alpha === 0)
{
return;
}
if (this._cacheAsBitmap)
if (src._cacheAsBitmap)
{
return this.renderCachedSprite(renderer);
return this.renderCachedSprite(renderer, src);
}
if (this._mask)
if (src._mask)
{
renderer.pushMask(this._mask);
renderer.pushMask(src._mask);
}
for (var i = 0; i < this.children.length; i++)
for (var i = 0; i < src.children.length; i++)
{
var child = this.children[i];
var child = src.children[i];
child.render(renderer, child);
}
if (this._mask)
if (src._mask)
{
renderer.popMask();
}
},
renderCachedSprite: function (renderer)
renderCachedSprite: function (renderer, src)
{
// TODO
return renderer;
return src;
}
};

10
src/renderer/canvas/gameobjects/Graphics.js
View file

@ -1,3 +1,4 @@
/**
* Note that 'this' in all functions here refer to the owning object.
* For example the Group, Stage, Sprite, etc. because the render function
@ -5,10 +6,15 @@
*/
Phaser.Renderer.Canvas.GameObjects.Graphics = {
render: function (renderer)
TYPES: [
Phaser.Graphics.prototype
],
render: function (renderer, src)
{
return;
var context = renderer.context;
var local = Phaser.Renderer.Canvas.GameObjects.Graphics;
if (this.dirty)
{

74
src/renderer/canvas/gameobjects/Sprite.js
View file

@ -1,36 +1,44 @@
/**
* 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.
* @author Richard Davey <rich@photonstorm.com>
* @author Mat Groves (@Doormat23)
* @copyright 2016 Photon Storm Ltd.
* @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License}
*/
Phaser.Renderer.Canvas.GameObjects.Sprite = {
render: function (renderer)
TYPES: [
Phaser.Sprite.prototype,
Phaser.Image.prototype,
PIXI.Sprite.prototype
],
render: function (renderer, src)
{
// If the sprite is not visible or the alpha is 0 then no need to render this element
if (!this.visible || this.alpha === 0 || !this.renderable)
if (!src.visible || src.alpha === 0 || !src.renderable)
{
return;
}
// Add back in: || src.texture.crop.width <= 0 || src.texture.crop.height <= 0
var wt = this.worldTransform;
var wt = src.worldTransform;
if (this.blendMode !== renderer.currentBlendMode)
if (src.blendMode !== renderer.currentBlendMode)
{
renderer.currentBlendMode = this.blendMode;
renderer.currentBlendMode = src.blendMode;
renderer.context.globalCompositeOperation = Phaser.blendModesCanvas[renderer.currentBlendMode];
}
// Check if the texture can be rendered
if (this._mask)
if (src._mask)
{
renderer.pushMask(this._mask);
renderer.pushMask(src._mask);
}
// Ignore null thiss
// Ignore null srcs
/*
if (!src.texture.valid)
{
@ -49,28 +57,28 @@ Phaser.Renderer.Canvas.GameObjects.Sprite = {
}
*/
var resolution = this.texture.baseTexture.resolution / renderer.game.resolution;
var resolution = src.texture.baseTexture.resolution / renderer.game.resolution;
renderer.context.globalAlpha = this.worldAlpha;
renderer.context.globalAlpha = src.worldAlpha;
// If smoothingEnabled is supported and we need to change the smoothing property for src texture
if (renderer.smoothProperty && renderer.currentScaleMode !== this.texture.baseTexture.scaleMode)
if (renderer.smoothProperty && renderer.currentScaleMode !== src.texture.baseTexture.scaleMode)
{
renderer.currentScaleMode = this.texture.baseTexture.scaleMode;
renderer.currentScaleMode = src.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 = (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 dx = (src.texture.trim) ? src.texture.trim.x - src.anchor.x * src.texture.trim.width : src.anchor.x * -src.texture.frame.width;
var dy = (src.texture.trim) ? src.texture.trim.y - src.anchor.y * src.texture.trim.height : src.anchor.y * -src.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 = this.texture.crop.width;
var ch = this.texture.crop.height;
var cw = src.texture.crop.width;
var ch = src.texture.crop.height;
if (this.texture.rotated)
if (src.texture.rotated)
{
var a = wt.a;
var b = wt.b;
@ -109,34 +117,34 @@ Phaser.Renderer.Canvas.GameObjects.Sprite = {
dx /= resolution;
dy /= resolution;
if (this.tint !== 0xFFFFFF)
if (src.tint !== 0xFFFFFF)
{
if (this.texture.requiresReTint || this.cachedTint !== this.tint)
if (src.texture.requiresReTint || src.cachedTint !== src.tint)
{
this.tintedTexture = PIXI.CanvasTinter.getTintedTexture(this, this.tint);
src.tintedTexture = PIXI.CanvasTinter.getTintedTexture(src, src.tint);
this.cachedTint = this.tint;
this.texture.requiresReTint = false;
src.cachedTint = src.tint;
src.texture.requiresReTint = false;
}
renderer.context.drawImage(this.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
renderer.context.drawImage(src.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
}
else
{
var cx = this.texture.crop.x;
var cy = this.texture.crop.y;
var cx = src.texture.crop.x;
var cy = src.texture.crop.y;
renderer.context.drawImage(this.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
renderer.context.drawImage(src.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
}
for (var i = 0; i < this.children.length; i++)
for (var i = 0; i < src.children.length; i++)
{
var child = this.children[i];
var child = src.children[i];
child.render(renderer, child);
child.render(child);
}
if (this._mask)
if (src._mask)
{
renderer.popMask();
}

4
src/renderer/canvas/gameobjects/SpriteBatch.js
View file

@ -5,6 +5,10 @@
*/
Phaser.Renderer.Canvas.GameObjects.SpriteBatch = {
TYPES: [
Phaser.SpriteBatch.prototype
],
render: function (renderer)
{
if (!this.visible || this.alpha <= 0 || !this.children.length)

21
src/renderer/canvas/gameobjects/Stage.js
View file

@ -1,3 +1,4 @@
/**
* Note that 'this' in all functions here refer to the owning object.
* For example the Group, Stage, Sprite, etc. because the render function
@ -5,24 +6,30 @@
*/
Phaser.Renderer.Canvas.GameObjects.Stage = {
render: function (renderer)
TYPES: [
Phaser.Stage.prototype
],
render: function (renderer, src)
{
if (this.visible === false || this.alpha === 0)
if (src.visible === false || src.alpha === 0)
{
return;
}
if (this._mask)
if (src._mask)
{
renderer.pushMask(this._mask);
renderer.pushMask(src._mask);
}
for (var i = 0; i < this.children.length; i++)
for (var i = 0; i < src.children.length; i++)
{
this.children[i].render(renderer);
var child = src.children[i];
child.render(renderer, child);
}
if (this._mask)
if (src._mask)
{
renderer.popMask();
}

68
src/renderer/canvas/gameobjects/Text.js
View file

@ -1,3 +1,4 @@
/**
* Note that 'this' in all functions here refer to the owning object.
* For example the Group, Stage, Sprite, etc. because the render function
@ -5,59 +6,63 @@
*/
Phaser.Renderer.Canvas.GameObjects.Text = {
render: function (renderer)
TYPES: [
Phaser.Text.prototype
],
render: function (renderer, src)
{
if (this.dirty)
if (src.dirty)
{
this.updateText();
this.dirty = false;
src.updateText();
src.dirty = false;
}
// If the sprite is not visible or the alpha is 0 then no need to render this element
if (!this.visible || this.alpha === 0 || !this.renderable)
if (!src.visible || src.alpha === 0 || !src.renderable)
{
return;
}
// Add back in: || src.texture.crop.width <= 0 || src.texture.crop.height <= 0
var wt = this.worldTransform;
var wt = src.worldTransform;
if (this.blendMode !== renderer.currentBlendMode)
if (src.blendMode !== renderer.currentBlendMode)
{
renderer.currentBlendMode = this.blendMode;
renderer.currentBlendMode = src.blendMode;
renderer.context.globalCompositeOperation = Phaser.blendModesCanvas[renderer.currentBlendMode];
}
// Check if the texture can be rendered
if (this._mask)
if (src._mask)
{
renderer.pushMask(this._mask);
renderer.pushMask(src._mask);
}
var resolution = this.texture.baseTexture.resolution / renderer.game.resolution;
var resolution = src.texture.baseTexture.resolution / renderer.game.resolution;
renderer.context.globalAlpha = this.worldAlpha;
renderer.context.globalAlpha = src.worldAlpha;
// If smoothingEnabled is supported and we need to change the smoothing property for src texture
if (renderer.smoothProperty && renderer.currentScaleMode !== this.texture.baseTexture.scaleMode)
if (renderer.smoothProperty && renderer.currentScaleMode !== src.texture.baseTexture.scaleMode)
{
renderer.currentScaleMode = this.texture.baseTexture.scaleMode;
renderer.currentScaleMode = src.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 = (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 dx = (src.texture.trim) ? src.texture.trim.x - src.anchor.x * src.texture.trim.width : src.anchor.x * -src.texture.frame.width;
var dy = (src.texture.trim) ? src.texture.trim.y - src.anchor.y * src.texture.trim.height : src.anchor.y * -src.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 = this.texture.crop.width;
var ch = this.texture.crop.height;
var cw = src.texture.crop.width;
var ch = src.texture.crop.height;
if (this.texture.rotated)
if (src.texture.rotated)
{
var a = wt.a;
var b = wt.b;
@ -96,32 +101,33 @@ Phaser.Renderer.Canvas.GameObjects.Text = {
dx /= resolution;
dy /= resolution;
if (this.tint !== 0xFFFFFF)
if (src.tint !== 0xFFFFFF)
{
if (this.texture.requiresReTint || this.cachedTint !== this.tint)
if (src.texture.requiresReTint || src.cachedTint !== src.tint)
{
this.tintedTexture = PIXI.CanvasTinter.getTintedTexture(this, this.tint);
src.tintedTexture = PIXI.CanvasTinter.getTintedTexture(src, src.tint);
this.cachedTint = this.tint;
this.texture.requiresReTint = false;
src.cachedTint = src.tint;
src.texture.requiresReTint = false;
}
renderer.context.drawImage(this.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
renderer.context.drawImage(src.tintedTexture, 0, 0, cw, ch, dx, dy, cw / resolution, ch / resolution);
}
else
{
var cx = this.texture.crop.x;
var cy = this.texture.crop.y;
var cx = src.texture.crop.x;
var cy = src.texture.crop.y;
renderer.context.drawImage(this.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
renderer.context.drawImage(src.texture.baseTexture.source, cx, cy, cw, ch, dx, dy, cw / resolution, ch / resolution);
}
for (var i = 0; i < this.children.length; i++)
for (var i = 0; i < src.children.length; i++)
{
this.children[i].render(renderer);
var child = src.children[i];
child.render(renderer, child);
}
if (this._mask)
if (src._mask)
{
renderer.popMask();
}