mirror of
https://github.com/photonstorm/phaser
synced 2025-02-25 11:57:19 +00:00
Cameras working with BlitterBatch
This commit is contained in:
parent
fbb591fd94
commit
1a0f4119c6
5 changed files with 73 additions and 135 deletions
|
@ -1,4 +1,4 @@
|
||||||
var CHECKSUM = {
|
var CHECKSUM = {
|
||||||
build: '2d175030-f855-11e6-8baa-a7d5f1237a30'
|
build: '9824f700-f86a-11e6-b8eb-f13c1d2880b2'
|
||||||
};
|
};
|
||||||
module.exports = CHECKSUM;
|
module.exports = CHECKSUM;
|
|
@ -1,8 +1,17 @@
|
||||||
var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage)
|
var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage, camera)
|
||||||
{
|
{
|
||||||
var worldAlpha = src.color.worldAlpha;
|
var worldAlpha = src.color.worldAlpha;
|
||||||
var list = src.getRenderList();
|
var list = src.getRenderList();
|
||||||
|
var blitterBatch = renderer.blitterBatch;
|
||||||
|
var cameraMatrix = camera.matrix.matrix;
|
||||||
|
var a = cameraMatrix[0];
|
||||||
|
var b = cameraMatrix[1];
|
||||||
|
var c = cameraMatrix[2];
|
||||||
|
var d = cameraMatrix[3];
|
||||||
|
var e = cameraMatrix[4];
|
||||||
|
var f = cameraMatrix[5];
|
||||||
|
var cameraScrollX = camera.scrollX;
|
||||||
|
var cameraScrollY = camera.scrollY;
|
||||||
// Skip rendering?
|
// Skip rendering?
|
||||||
|
|
||||||
if (src.skipRender || !src.visible || worldAlpha === 0 || list.length === 0)
|
if (src.skipRender || !src.visible || worldAlpha === 0 || list.length === 0)
|
||||||
|
@ -12,11 +21,57 @@ var BlitterWebGLRenderer = function (renderer, src, interpolationPercentage)
|
||||||
|
|
||||||
// Render bobs
|
// Render bobs
|
||||||
|
|
||||||
for (var i = 0; i < list.length; i++)
|
for (var i = 0, l = list.length; i < l; i++)
|
||||||
{
|
{
|
||||||
var bob = list[i];
|
var bob = list[i];
|
||||||
|
var frame = bob.frame;
|
||||||
|
var alpha = bob.alpha;
|
||||||
|
var vertexDataBuffer = blitterBatch.vertexDataBuffer;
|
||||||
|
var vertexBuffer = vertexDataBuffer.floatView;
|
||||||
|
var vertexOffset = 0;
|
||||||
|
var uvs = frame.uvs;
|
||||||
|
var width = frame.width;
|
||||||
|
var height = frame.height;
|
||||||
|
var x = bob.x + frame.x - cameraScrollX;
|
||||||
|
var y = bob.y + frame.y - cameraScrollY;
|
||||||
|
var xw = x + width;
|
||||||
|
var yh = y + height;
|
||||||
|
var tx = x * a + y * c + e;
|
||||||
|
var ty = x * b + y * d + f;
|
||||||
|
var txw = xw * a + yh * c + e;
|
||||||
|
var tyh = xw * b + yh * d + f;
|
||||||
|
|
||||||
renderer.blitterBatch.add(bob.x, bob.y, bob.frame, bob.alpha);
|
if (blitterBatch.elementCount >= blitterBatch.maxParticles)
|
||||||
|
{
|
||||||
|
blitterBatch.flush();
|
||||||
|
}
|
||||||
|
|
||||||
|
renderer.setBatch(blitterBatch, frame.texture.source[frame.sourceIndex].glTexture);
|
||||||
|
vertexOffset = vertexDataBuffer.allocate(20);
|
||||||
|
blitterBatch.elementCount += 6;
|
||||||
|
x += frame.x;
|
||||||
|
y += frame.y;
|
||||||
|
|
||||||
|
vertexBuffer[vertexOffset++] = tx;
|
||||||
|
vertexBuffer[vertexOffset++] = ty;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.x0;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.y0;
|
||||||
|
vertexBuffer[vertexOffset++] = alpha;
|
||||||
|
vertexBuffer[vertexOffset++] = tx;
|
||||||
|
vertexBuffer[vertexOffset++] = tyh;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.x1;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.y1;
|
||||||
|
vertexBuffer[vertexOffset++] = alpha;
|
||||||
|
vertexBuffer[vertexOffset++] = txw;
|
||||||
|
vertexBuffer[vertexOffset++] = tyh;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.x2;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.y2;
|
||||||
|
vertexBuffer[vertexOffset++] = alpha;
|
||||||
|
vertexBuffer[vertexOffset++] = txw;
|
||||||
|
vertexBuffer[vertexOffset++] = ty;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.x3;
|
||||||
|
vertexBuffer[vertexOffset++] = uvs.y3;
|
||||||
|
vertexBuffer[vertexOffset++] = alpha;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,10 @@
|
||||||
|
|
||||||
var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camera)
|
var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camera)
|
||||||
{
|
{
|
||||||
|
//--------------------
|
||||||
|
// Inlined quad push
|
||||||
|
//--------------------
|
||||||
|
|
||||||
var frame = src.frame;
|
var frame = src.frame;
|
||||||
var alpha = 16777216;
|
var alpha = 16777216;
|
||||||
var transform2D = src.transform;
|
var transform2D = src.transform;
|
||||||
|
@ -11,7 +15,7 @@ var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camer
|
||||||
var vertexDataBuffer = spriteBatch.vertexDataBuffer;
|
var vertexDataBuffer = spriteBatch.vertexDataBuffer;
|
||||||
var vertexBufferF32 = vertexDataBuffer.floatView;
|
var vertexBufferF32 = vertexDataBuffer.floatView;
|
||||||
var vertexBufferU32 = vertexDataBuffer.uintView;
|
var vertexBufferU32 = vertexDataBuffer.uintView;
|
||||||
var vertexOffset = vertexDataBuffer.allocate(40);
|
var vertexOffset = 0;
|
||||||
var uvs = frame.uvs;
|
var uvs = frame.uvs;
|
||||||
var width = frame.width;
|
var width = frame.width;
|
||||||
var height = frame.height;
|
var height = frame.height;
|
||||||
|
@ -37,7 +41,9 @@ var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camer
|
||||||
var tyh = xw * b + yh * d + f;
|
var tyh = xw * b + yh * d + f;
|
||||||
|
|
||||||
renderer.setBatch(spriteBatch, frame.texture.source[frame.sourceIndex].glTexture);
|
renderer.setBatch(spriteBatch, frame.texture.source[frame.sourceIndex].glTexture);
|
||||||
|
vertexOffset = vertexDataBuffer.allocate(40);
|
||||||
|
spriteBatch.elementCount += 6;
|
||||||
|
|
||||||
vertexBufferF32[vertexOffset++] = tx;
|
vertexBufferF32[vertexOffset++] = tx;
|
||||||
vertexBufferF32[vertexOffset++] = ty;
|
vertexBufferF32[vertexOffset++] = ty;
|
||||||
vertexBufferF32[vertexOffset++] = uvs.x0;
|
vertexBufferF32[vertexOffset++] = uvs.x0;
|
||||||
|
@ -78,8 +84,6 @@ var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camer
|
||||||
vertexBufferF32[vertexOffset++] = scaleY;
|
vertexBufferF32[vertexOffset++] = scaleY;
|
||||||
vertexBufferF32[vertexOffset++] = rotation;
|
vertexBufferF32[vertexOffset++] = rotation;
|
||||||
vertexBufferU32[vertexOffset++] = vertexColor.topRight;
|
vertexBufferU32[vertexOffset++] = vertexColor.topRight;
|
||||||
|
|
||||||
spriteBatch.elementCount += 6;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
module.exports = ImageWebGLRenderer;
|
module.exports = ImageWebGLRenderer;
|
||||||
|
|
|
@ -112,52 +112,6 @@ BlitterBatch.prototype = {
|
||||||
return (this.vertexDataBuffer.getByteLength() >= this.vertexDataBuffer.getByteCapacity());
|
return (this.vertexDataBuffer.getByteLength() >= this.vertexDataBuffer.getByteCapacity());
|
||||||
},
|
},
|
||||||
|
|
||||||
add: function (x, y, frame, alpha)
|
|
||||||
{
|
|
||||||
this.manager.setBatch(this, frame.texture.source[frame.sourceIndex].glTexture);
|
|
||||||
|
|
||||||
if (this.elementCount >= this.maxParticles)
|
|
||||||
{
|
|
||||||
this.flush();
|
|
||||||
}
|
|
||||||
|
|
||||||
var vertexDataBuffer = this.vertexDataBuffer;
|
|
||||||
var vertexBuffer = vertexDataBuffer.floatView;
|
|
||||||
var vertexOffset = vertexDataBuffer.allocate(CONST.PARTICLE_VERTEX_COMPONENT_COUNT * CONST.PARTICLE_VERTEX_COUNT);
|
|
||||||
var uvs = frame.uvs;
|
|
||||||
var width = frame.width;
|
|
||||||
var height = frame.height;
|
|
||||||
|
|
||||||
x += frame.x;
|
|
||||||
y += frame.y;
|
|
||||||
|
|
||||||
vertexBuffer[vertexOffset++] = x;
|
|
||||||
vertexBuffer[vertexOffset++] = y;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.x0;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.y0;
|
|
||||||
vertexBuffer[vertexOffset++] = alpha;
|
|
||||||
|
|
||||||
vertexBuffer[vertexOffset++] = x;
|
|
||||||
vertexBuffer[vertexOffset++] = y + height;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.x1;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.y1;
|
|
||||||
vertexBuffer[vertexOffset++] = alpha;
|
|
||||||
|
|
||||||
vertexBuffer[vertexOffset++] = x + width;
|
|
||||||
vertexBuffer[vertexOffset++] = y + height;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.x2;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.y2;
|
|
||||||
vertexBuffer[vertexOffset++] = alpha;
|
|
||||||
|
|
||||||
vertexBuffer[vertexOffset++] = x + width;
|
|
||||||
vertexBuffer[vertexOffset++] = y;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.x3;
|
|
||||||
vertexBuffer[vertexOffset++] = uvs.y3;
|
|
||||||
vertexBuffer[vertexOffset++] = alpha;
|
|
||||||
|
|
||||||
this.elementCount += CONST.PARTICLE_INDEX_COUNT;
|
|
||||||
},
|
|
||||||
|
|
||||||
bind: function ()
|
bind: function ()
|
||||||
{
|
{
|
||||||
var gl = this.glContext;
|
var gl = this.glContext;
|
||||||
|
|
|
@ -112,86 +112,6 @@ SpriteBatch.prototype = {
|
||||||
return (this.vertexDataBuffer.getByteLength() >= this.vertexDataBuffer.getByteCapacity());
|
return (this.vertexDataBuffer.getByteLength() >= this.vertexDataBuffer.getByteCapacity());
|
||||||
},
|
},
|
||||||
|
|
||||||
add: function (frame, anchorX, anchorY, transform2D, vertexColor, camera)
|
|
||||||
{
|
|
||||||
this.manager.setBatch(this, frame.texture.source[frame.sourceIndex].glTexture);
|
|
||||||
|
|
||||||
// The user must check if the buffers are full before flushing
|
|
||||||
// this is to give freedom of when should the renderer flush. var vertexDataBuffer = this.vertexDataBuffer;
|
|
||||||
var vertexDataBuffer = this.vertexDataBuffer;
|
|
||||||
var vertexBufferF32 = vertexDataBuffer.floatView;
|
|
||||||
var vertexBufferU32 = vertexDataBuffer.uintView;
|
|
||||||
var vertexOffset = vertexDataBuffer.allocate(CONST.SPRITE_VERTEX_COMPONENT_COUNT * CONST.SPRITE_VERTEX_COUNT);
|
|
||||||
var uvs = frame.uvs;
|
|
||||||
var width = frame.width;
|
|
||||||
var height = frame.height;
|
|
||||||
var translateX = transform2D.x - camera.scrollX;
|
|
||||||
var translateY = transform2D.y - camera.scrollY;
|
|
||||||
var scaleX = transform2D.scaleX;
|
|
||||||
var scaleY = transform2D.scaleY;
|
|
||||||
var rotation = transform2D.angle;
|
|
||||||
var a = cameraMatrix[0];
|
|
||||||
var b = cameraMatrix[1];
|
|
||||||
var c = cameraMatrix[2];
|
|
||||||
var d = cameraMatrix[3];
|
|
||||||
var e = cameraMatrix[4];
|
|
||||||
var f = cameraMatrix[5];
|
|
||||||
var x = width * -anchorX + frame.x;
|
|
||||||
var y = height * -anchorY + frame.y;
|
|
||||||
var xw = x + width;
|
|
||||||
var yh = y + height;
|
|
||||||
var tx = x * a + y * c + e;
|
|
||||||
var ty = x * b + y * d + f;
|
|
||||||
var txw = xw * a + yh * c + e;
|
|
||||||
var tyh = xw * b + yh * d + f;
|
|
||||||
|
|
||||||
vertexBufferF32[vertexOffset++] = tx;
|
|
||||||
vertexBufferF32[vertexOffset++] = ty;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.x0;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.y0;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateX;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateY;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleX;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleY;
|
|
||||||
vertexBufferF32[vertexOffset++] = rotation;
|
|
||||||
vertexBufferU32[vertexOffset++] = vertexColor.topLeft;
|
|
||||||
|
|
||||||
vertexBufferF32[vertexOffset++] = tx;
|
|
||||||
vertexBufferF32[vertexOffset++] = tyh;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.x1;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.y1;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateX;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateY;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleX;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleY;
|
|
||||||
vertexBufferF32[vertexOffset++] = rotation;
|
|
||||||
vertexBufferU32[vertexOffset++] = vertexColor.bottomLeft;
|
|
||||||
|
|
||||||
vertexBufferF32[vertexOffset++] = txw;
|
|
||||||
vertexBufferF32[vertexOffset++] = tyh;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.x2;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.y2;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateX;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateY;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleX;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleY;
|
|
||||||
vertexBufferF32[vertexOffset++] = rotation;
|
|
||||||
vertexBufferU32[vertexOffset++] = vertexColor.bottomRight;
|
|
||||||
|
|
||||||
vertexBufferF32[vertexOffset++] = txw;
|
|
||||||
vertexBufferF32[vertexOffset++] = ty;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.x3;
|
|
||||||
vertexBufferF32[vertexOffset++] = uvs.y3;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateX;
|
|
||||||
vertexBufferF32[vertexOffset++] = translateY;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleX;
|
|
||||||
vertexBufferF32[vertexOffset++] = scaleY;
|
|
||||||
vertexBufferF32[vertexOffset++] = rotation;
|
|
||||||
vertexBufferU32[vertexOffset++] = vertexColor.topRight;
|
|
||||||
|
|
||||||
this.elementCount += CONST.SPRITE_INDEX_COUNT;
|
|
||||||
},
|
|
||||||
|
|
||||||
bind: function ()
|
bind: function ()
|
||||||
{
|
{
|
||||||
var gl = this.glContext;
|
var gl = this.glContext;
|
||||||
|
@ -213,6 +133,11 @@ SpriteBatch.prototype = {
|
||||||
|
|
||||||
flush: function ()
|
flush: function ()
|
||||||
{
|
{
|
||||||
|
if (this.elementCount === 0)
|
||||||
|
{
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
var gl = this.glContext;
|
var gl = this.glContext;
|
||||||
var vertexDataBuffer = this.vertexDataBuffer;
|
var vertexDataBuffer = this.vertexDataBuffer;
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue