Added Blitter Canvas support.

Added BlitImage function.
This commit is contained in:
photonstorm 2017-02-06 16:20:45 +00:00
parent 03242d3410
commit 00f9bcb8e2
6 changed files with 71 additions and 3 deletions

View file

@ -1,4 +1,4 @@
var CHECKSUM = {
build: 'b209de10-eaff-11e6-83d3-cdfcfc553d04'
build: 'f3375a50-ec87-11e6-853a-69675ac00795'
};
module.exports = CHECKSUM;

View file

@ -41,7 +41,7 @@ var Blitter = function (state, x, y, key, frame)
Blitter.prototype = Object.create(GameObject.prototype);
Blitter.prototype.constructor = Blitter;
// Blitter.prototype.renderCanvas = require('./BlitterCanvasRenderer');
Blitter.prototype.renderCanvas = require('./BlitterCanvasRenderer');
Blitter.prototype.renderWebGL = require('./BlitterWebGLRenderer');
// frame MUST be part of the Blitter texture

View file

@ -0,0 +1,33 @@
var BlitterCanvasRenderer = function (renderer, src, interpolationPercentage)
{
var worldAlpha = src.color.worldAlpha;
var len = src.children.list.length;
// Skip rendering?
if (src.skipRender || !src.visible || worldAlpha === 0 || len === 0)
{
return;
}
renderer.resetTransform();
renderer.setBlendMode(src.blendMode);
renderer.setAlpha(worldAlpha);
// Render bobs
for (var i = 0; i < len; i++)
{
var bob = src.children.list[i];
var frame = bob.frame;
// if (!bob.visible)
// {
// continue;
// }
renderer.blitImage(bob.x, bob.y, frame);
}
};
module.exports = BlitterCanvasRenderer;

View file

@ -12,7 +12,6 @@ var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage)
}
// Render bobs
//for (var i = len; i >= 0; i--)
for (var i = 0; i <= len; ++i)
{
var bob = src.children.list[i];

View file

@ -1,5 +1,6 @@
var CONST = require('../../const');
var DrawImage = require('./utils/DrawImage');
var BlitImage = require('./utils/BlitImage');
var GetBlendModes = require('./utils/GetBlendModes');
var CanvasRenderer = function (game)
@ -43,6 +44,7 @@ var CanvasRenderer = function (game)
// Map to the required function
this.drawImage = DrawImage;
this.blitImage = BlitImage;
this.blendModes = GetBlendModes();
@ -125,6 +127,29 @@ CanvasRenderer.prototype = {
ctx.fillRect(0, 0, this.width, this.height);
},
resetTransform: function ()
{
this.context.setTransform(1, 0, 0, 1, 0, 0);
},
setBlendMode: function (blendMode)
{
if (this.currentBlendMode !== blendMode)
{
this.context.globalCompositeOperation = blendMode;
this.currentBlendMode = blendMode;
}
},
setAlpha: function (alpha)
{
if (this.currentAlpha !== alpha)
{
this.context.globalAlpha = alpha;
this.currentAlpha = alpha;
}
},
/**
* Renders the State.
*

View file

@ -0,0 +1,11 @@
// No scaling, anchor, rotation or effects, literally draws the frame directly to the canvas
var BlitImage = function (dx, dy, frame)
{
var ctx = this.context;
var cd = frame.canvasData;
ctx.drawImage(frame.source.image, cd.sx, cd.sy, cd.sWidth, cd.sHeight, dx, dy, cd.dWidth, cd.dHeight);
};
module.exports = BlitImage;