Removed global scene graph. New system works with camera system

This commit is contained in:
Felipe Alfonso 2017-02-20 21:38:22 -03:00
parent 08da842e4b
commit efdc4898f3
13 changed files with 323 additions and 185 deletions

View file

@ -1,4 +1,4 @@
var Transform = require('../components/Transform');
var Transform2DMatrix = require('../components/Transform2DMatrix').Transform2DMatrix;
var Camera = function (x, y, width, height)
{
@ -7,13 +7,11 @@ var Camera = function (x, y, width, height)
this.width = width;
this.height = height;
this.state = null;
this.statePositionX = 0.0;
this.statePositionY = 0.0;
this.scrollX = 0.0;
this.scrollY = 0.0;
this.zoom = 1.0;
this.rotation = 0.0;
this.matrix = new Transform2DMatrix(1, 0, 0, 1, 0, 0);
// shake
this._shakeDuration = 0.0;
@ -165,24 +163,10 @@ Camera.prototype = {
preRender: function ()
{
var state = this.state;
var stateTransform = state.sys.transform;
this.statePositionX = stateTransform.positionX;
this.statePositionY = stateTransform.positionY;
stateTransform.positionX = this.statePositionX + this.x;
stateTransform.positionY = this.statePositionY + this.y;
Transform.updateRoot(stateTransform, -this.scrollX + this._shakeOffsetX, -this.scrollY + this._shakeOffsetY, this.zoom, this.rotation);
},
postRender: function ()
{
var stateTransform = this.state.sys.transform;
stateTransform.positionX = this.statePositionX;
stateTransform.positionY = this.statePositionY;
this.matrix.loadIdentity().
translate(this.x + this._shakeOffsetX, this.y + this._shakeOffsetY).
rotate(this.rotation).
scale(this.zoom, this.zoom);
},
destroy: function ()

View file

@ -262,4 +262,4 @@ Object.defineProperties(Transform.prototype,{
}
});
module.exports = Transform;
//module.exports = Transform;

View file

@ -0,0 +1,186 @@
var mathCos = Math.cos;
var mathSin = Math.sin;
var mathSqrt = Math.sqrt;
var mathAcos = Math.acos;
var mathAtan = Math.atan;
var Transform2DMatrix = function (a, b, c, d, tx, ty)
{
a = typeof a === 'number' ? a : 1;
b = typeof b === 'number' ? b : 0;
c = typeof c === 'number' ? c : 0;
d = typeof d === 'number' ? d : 1;
tx = typeof tx === 'number' ? tx : 0;
ty = typeof ty === 'number' ? ty : 0;
this.matrix = new Float32Array([a, b, c, d, tx, ty]);
this.decomposedMatrix = {
translateX: 0,
translateY: 0,
scaleX: 1,
scaleY: 1,
rotation: 0
};
};
Transform2DMatrix.prototype.loadIdentity = function ()
{
var matrix = this.matrix;
matrix[0] = 1;
matrix[1] = 0;
matrix[2] = 0;
matrix[3] = 1;
matrix[4] = 0;
matrix[5] = 0;
return this;
};
Transform2DMatrix.prototype.translate = function (x, y)
{
var matrix = this.matrix;
matrix[4] = matrix[0] * x + matrix[2] * y + matrix[4];
matrix[5] = matrix[1] * x + matrix[3] * y + matrix[5];
return this;
};
Transform2DMatrix.prototype.scale = function (x, y)
{
var matrix = this.matrix;
matrix[0] = matrix[0] * x;
matrix[1] = matrix[1] * x;
matrix[2] = matrix[2] * y;
matrix[3] = matrix[3] * y;
return this;
};
Transform2DMatrix.prototype.rotate = function (radian)
{
var matrix = this.matrix;
var a = matrix[0];
var b = matrix[1];
var c = matrix[2];
var d = matrix[3];
var sr = mathSin(radian);
var cr = mathCos(radian);
matrix[0] = a * cr + c * sr;
matrix[1] = b * cr + d * sr;
matrix[2] = a * -sr + c * cr;
matrix[3] = b * -sr + d * cr;
return this;
};
Transform2DMatrix.prototype.multiply = function (otherMatrix)
{
var matrix = this.matrix;
var a0 = matrix[0];
var b0 = matrix[1];
var c0 = matrix[2];
var d0 = matrix[3];
var tx0 = matrix[4];
var ty0 = matrix[5];
var a1 = otherMatrix[0];
var b1 = otherMatrix[1];
var c1 = otherMatrix[2];
var d1 = otherMatrix[3];
var tx1 = otherMatrix[4];
var ty1 = otherMatrix[5];
matrix[0] = a1 * a0 + b1 * c0;
matrix[1] = a1 * b0 + b1 * d0;
matrix[2] = c1 * a0 + d1 * c0;
matrix[3] = c1 * b0 + d1 * d0;
matrix[4] = tx1 * a0 + ty1 * c0 + tx0;
matrix[5] = tx1 * b0 + ty1 * d0 + ty0;
return this;
};
Transform2DMatrix.prototype.transform = function (a, b, c, d, tx, ty)
{
var matrix = this.matrix;
var a0 = matrix[0];
var b0 = matrix[1];
var c0 = matrix[2];
var d0 = matrix[3];
var tx0 = matrix[4];
var ty0 = matrix[5];
matrix[0] = a * a0 + b * c0;
matrix[1] = a * b0 + b * d0;
matrix[2] = c * a0 + d * c0;
matrix[3] = c * b0 + d * d0;
matrix[4] = tx * a0 + ty * c0 + tx0;
matrix[5] = tx * b0 + ty * d0 + ty0;
return this;
};
Transform2DMatrix.prototype.setTransform = function (a, b, c, d, tx, ty)
{
var matrix = this.matrix;
matrix[0] = a;
matrix[1] = b;
matrix[2] = c;
matrix[3] = d;
matrix[4] = tx;
matrix[5] = ty;
return this;
};
Transform2DMatrix.prototype.decomposeMatrix = function ()
{
var decomposedMatrix = this.decomposedMatrix;
var matrix = this.matrix;
var a = matrix[0];
var b = matrix[1];
var c = matrix[2];
var d = matrix[3];
var a2 = a * a;
var b2 = b * b;
var c2 = c * c;
var d2 = d * d;
var sx = mathSqrt(a2 + c2);
var sy = mathSqrt(b2 + d2);
decomposedMatrix.translateX = matrix[4];
decomposedMatrix.translateY = matrix[5];
decomposedMatrix.scaleX = sx;
decomposedMatrix.scaleY = sy;
decomposedMatrix.rotation = mathAcos(a / sx) * (mathAtan(-c / a) < 0 ? -1 : 1);
return decomposedMatrix;
};
Transform2DMatrix.prototype.fromTransform2D = function (transform2D)
{
this.loadIdentity().
translate(transform2D.x, transform2D.y).
rotate(transform2D.angle).
scale(transform2D.scaleX, transform2D.scaleY);
return this;
};
var Transform2D = function (x, y)
{
this.x = x;
this.y = y;
this.scaleX = 1;
this.scaleY = 1;
this.angle = 0;
};
module.exports = {
Transform2DMatrix: Transform2DMatrix,
Transform2D: Transform2D
};

View file

@ -5,6 +5,8 @@ module.exports = {
Children: require('./Children'),
Color: require('./Color'),
Data: require('./Data'),
Transform: require('./Transform')
//Transform: require('./Transform')
Transform2D: require('./Transform2DMatrix').Transform2D,
Transform2DMatrix: require('./Transform2DMatrix').Transform2DMatrix
};

View file

@ -171,7 +171,7 @@ function init ()
return false;
};
Features.webGL = testWebGL();
Features.webGL = true;//testWebGL();
Features.worker = !!window['Worker'];

View file

@ -39,9 +39,7 @@ var GameObject = function (state, x, y, texture, frame, parent)
this.frame = frame;
// All GameObjects have the following components, always:
this.transform = new Component.Transform(this, this.state.sys.transform);
this.transform.positionX = x;
this.transform.positionY = y;
this.transform = new Component.Transform2D(x, y);
this.anchor = new Component.Anchor();
@ -112,13 +110,12 @@ Object.defineProperties(GameObject.prototype, {
get: function ()
{
return this.transform.positionX;
return this.transform.x;
},
set: function (value)
{
this.transform.positionX = value;
this.transform.dirtyLocal = true;
this.transform.x = value;
}
},
@ -129,13 +126,12 @@ Object.defineProperties(GameObject.prototype, {
get: function ()
{
return this.transform.positionY;
return this.transform.y;
},
set: function (value)
{
this.transform.positionY = value;
this.transform.dirtyLocal = true;
this.transform.y = value;
}
},
@ -153,7 +149,6 @@ Object.defineProperties(GameObject.prototype, {
{
this.transform.scaleX = value;
this.transform.scaleY = value;
this.transform.dirtyLocal = true;
}
},
@ -170,7 +165,6 @@ Object.defineProperties(GameObject.prototype, {
set: function (value)
{
this.transform.scaleX = value;
this.transform.dirtyLocal = true;
}
},
@ -187,7 +181,6 @@ Object.defineProperties(GameObject.prototype, {
set: function (value)
{
this.transform.scaleY = value;
this.transform.dirtyLocal = true;
}
},
@ -198,13 +191,12 @@ Object.defineProperties(GameObject.prototype, {
get: function ()
{
return this.transform.rotation;
return this.transform.angle;
},
set: function (value)
{
this.transform.rotation = value;
this.transform.dirtyLocal = true;
this.transform.angle = value;
}
},
@ -215,14 +207,13 @@ Object.defineProperties(GameObject.prototype, {
get: function ()
{
return WrapAngle(this.transform.rotation * MATH_CONST.RAD_TO_DEG);
return WrapAngle(this.transform.angle * MATH_CONST.RAD_TO_DEG);
},
set: function (value)
{
// value is in degrees
this.transform.rotation = WrapAngle(value * MATH_CONST.DEG_TO_RAD);
this.transform.dirtyLocal = true;
this.transform.angle = WrapAngle(value * MATH_CONST.DEG_TO_RAD);
}
},

View file

@ -1,109 +1,84 @@
var ImageWebGLRenderer = function (renderer, src, interpolationPercentage)
var ImageWebGLRenderer = function (renderer, src, interpolationPercentage, camera)
{
var frame = src.frame;
// var alpha = src.color.worldAlpha * 255 << 24;
var alpha = 16777216;
// Skip rendering?
// if (src.skipRender || !src.visible || alpha === 0 || !frame.cutWidth || !frame.cutHeight)
// {
// return;
// }
// var verts = src.transform.getVertexData(interpolationPercentage, renderer);
// var index = src.frame.source.glTextureIndex;
// var tint = src.color._glTint;
// var bg = src.color._glBg;
// renderer.batch.add(frame.source, src.blendMode, verts, frame.uvs, index, alpha, tint, bg);
// Not inlined
//renderer.setBlendMode(src.color._blendMode);
//renderer.spriteBatch.add(
// src.frame,
// src.anchorX, src.anchorY,
// transform.worldMatrix.matrix,
// src.color._glTint
//);
/*******************/
// Inline spriteBatch.add gives a huge boost
var transform = src.transform;
var transform2D = src.transform;
var spriteBatch = renderer.spriteBatch;
var anchorX = src.anchorX;
var anchorY = src.anchorY;
var matrix = transform.worldMatrix;
var vertexColor = src.color._glTint;
//renderer.setBlendMode(src.color._blendMode);
renderer.setBatch(spriteBatch, 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 = spriteBatch.vertexDataBuffer;
var vertexBufferF32 = vertexDataBuffer.floatView;
var vertexBufferU32 = vertexDataBuffer.uintView;
var vertexOffset = vertexDataBuffer.allocate(44);
var vertexOffset = vertexDataBuffer.allocate(40);
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 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 x = width * -anchorX + frame.x;
var y = height * -anchorY + frame.y;
var a = matrix[0];
var b = matrix[1];
var c = matrix[2];
var d = matrix[3];
var tx = matrix[4];
var ty = matrix[5];
var xw = x + width;
var yh = y + height;
vertexBufferF32[vertexOffset++] = x;
vertexBufferF32[vertexOffset++] = y;
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.setBatch(spriteBatch, frame.texture.source[frame.sourceIndex].glTexture);
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = uvs.x0;
vertexBufferF32[vertexOffset++] = uvs.y0;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.topLeft;
vertexBufferF32[vertexOffset++] = x;
vertexBufferF32[vertexOffset++] = yh;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = tyh;
vertexBufferF32[vertexOffset++] = uvs.x1;
vertexBufferF32[vertexOffset++] = uvs.y1;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.bottomLeft;
vertexBufferF32[vertexOffset++] = xw;
vertexBufferF32[vertexOffset++] = yh;
vertexBufferF32[vertexOffset++] = txw;
vertexBufferF32[vertexOffset++] = tyh;
vertexBufferF32[vertexOffset++] = uvs.x2;
vertexBufferF32[vertexOffset++] = uvs.y2;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.bottomRight;
vertexBufferF32[vertexOffset++] = xw;
vertexBufferF32[vertexOffset++] = y;
vertexBufferF32[vertexOffset++] = txw;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = uvs.x3;
vertexBufferF32[vertexOffset++] = uvs.y3;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.topRight;
spriteBatch.elementCount += 6;
};

View file

@ -12,7 +12,6 @@ var BlitterBatch = require('./batches/blitter/BlitterBatch');
var AAQuadBatch = require('./batches/aaquad/AAQuadBatch');
var SpriteBatch = require('./batches/sprite/SpriteBatch');
var BlendModes = require('../BlendModes');
var Transform = require('../../components/Transform');
var WebGLRenderer = function (game)
{
@ -207,7 +206,7 @@ WebGLRenderer.prototype = {
* by the amount of time that will be simulated the next time update()
* runs. Useful for interpolating frames.
*/
render: function (state, flatRenderArray, interpolationPercentage, camera)
render: function (state, children, interpolationPercentage, camera)
{
// Could move to the State Systems or MainLoop
var gl = this.gl;
@ -248,7 +247,7 @@ WebGLRenderer.prototype = {
this.blendMode = newBlendMode;
}
// drawing child
child.renderWebGL(this, child, interpolationPercentage);
child.renderWebGL(this, child, interpolationPercentage, camera);
batch = this.batch;
if (batch && batch.isFull())
{

View file

@ -69,12 +69,10 @@ SpriteBatch.prototype = {
var attribArray = [
CreateAttribDesc(gl, program, 'a_position', 2, gl.FLOAT, false, CONST.VERTEX_SIZE, 0),
CreateAttribDesc(gl, program, 'a_tex_coord', 2, gl.FLOAT, false, CONST.VERTEX_SIZE, 8),
CreateAttribDesc(gl, program, 'transform_a', 1, gl.FLOAT, false, CONST.VERTEX_SIZE, 16),
CreateAttribDesc(gl, program, 'transform_b', 1, gl.FLOAT, false, CONST.VERTEX_SIZE, 20),
CreateAttribDesc(gl, program, 'transform_c', 1, gl.FLOAT, false, CONST.VERTEX_SIZE, 24),
CreateAttribDesc(gl, program, 'transform_d', 1, gl.FLOAT, false, CONST.VERTEX_SIZE, 28),
CreateAttribDesc(gl, program, 'transform_t', 2, gl.FLOAT, false, CONST.VERTEX_SIZE, 32),
CreateAttribDesc(gl, program, 'a_color', 3, gl.UNSIGNED_BYTE, true, CONST.VERTEX_SIZE, 40)
CreateAttribDesc(gl, program, 'a_translate', 2, gl.FLOAT, false, CONST.VERTEX_SIZE, 16),
CreateAttribDesc(gl, program, 'a_scale', 2, gl.FLOAT, false, CONST.VERTEX_SIZE, 24),
CreateAttribDesc(gl, program, 'a_rotation', 1, gl.FLOAT, false, CONST.VERTEX_SIZE, 32),
CreateAttribDesc(gl, program, 'a_color', 3, gl.UNSIGNED_BYTE, true, CONST.VERTEX_SIZE, 36)
];
var vertexArray = new VertexArray(CreateBuffer(gl, gl.ARRAY_BUFFER, gl.STREAM_DRAW, null, vertexDataBuffer.getByteCapacity()), attribArray);
var viewMatrixLocation = gl.getUniformLocation(program, 'u_view_matrix');
@ -114,7 +112,7 @@ SpriteBatch.prototype = {
return (this.vertexDataBuffer.getByteLength() >= this.vertexDataBuffer.getByteCapacity());
},
add: function (frame, anchorX, anchorY, matrix, vertexColor)
add: function (frame, anchorX, anchorY, transform2D, vertexColor, camera)
{
this.manager.setBatch(this, frame.texture.source[frame.sourceIndex].glTexture);
@ -127,61 +125,68 @@ SpriteBatch.prototype = {
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 a = matrix[0];
var b = matrix[1];
var c = matrix[2];
var d = matrix[3];
var tx = matrix[4];
var ty = matrix[5];
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++] = x;
vertexBufferF32[vertexOffset++] = y;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = uvs.x0;
vertexBufferF32[vertexOffset++] = uvs.y0;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.topLeft;
vertexBufferF32[vertexOffset++] = x;
vertexBufferF32[vertexOffset++] = y + height;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = tyh;
vertexBufferF32[vertexOffset++] = uvs.x1;
vertexBufferF32[vertexOffset++] = uvs.y1;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.bottomLeft;
vertexBufferF32[vertexOffset++] = x + width;
vertexBufferF32[vertexOffset++] = y + height;
vertexBufferF32[vertexOffset++] = txw;
vertexBufferF32[vertexOffset++] = tyh;
vertexBufferF32[vertexOffset++] = uvs.x2;
vertexBufferF32[vertexOffset++] = uvs.y2;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = translateX;
vertexBufferF32[vertexOffset++] = translateY;
vertexBufferF32[vertexOffset++] = scaleX;
vertexBufferF32[vertexOffset++] = scaleY;
vertexBufferF32[vertexOffset++] = rotation;
vertexBufferU32[vertexOffset++] = vertexColor.bottomRight;
vertexBufferF32[vertexOffset++] = x + width;
vertexBufferF32[vertexOffset++] = y;
vertexBufferF32[vertexOffset++] = txw;
vertexBufferF32[vertexOffset++] = ty;
vertexBufferF32[vertexOffset++] = uvs.x3;
vertexBufferF32[vertexOffset++] = uvs.y3;
vertexBufferF32[vertexOffset++] = a;
vertexBufferF32[vertexOffset++] = b;
vertexBufferF32[vertexOffset++] = c;
vertexBufferF32[vertexOffset++] = d;
vertexBufferF32[vertexOffset++] = tx;
vertexBufferF32[vertexOffset++] = ty;
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;

View file

@ -2,19 +2,17 @@ module.exports = [
'uniform mat4 u_view_matrix;',
'attribute vec2 a_position;',
'attribute vec2 a_tex_coord;',
'attribute float transform_a;',
'attribute float transform_b;',
'attribute float transform_c;',
'attribute float transform_d;',
'attribute vec2 transform_t;',
'attribute vec2 a_translate;',
'attribute vec2 a_scale;',
'attribute float a_rotation;',
'attribute vec3 a_color;',
'varying vec2 v_tex_coord;',
'varying vec3 v_color;',
'void main () {',
' vec2 t_position;',
' t_position.x = a_position.x * transform_a + a_position.y * transform_c;',
' t_position.y = a_position.x * transform_b + a_position.y * transform_d;',
' gl_Position = u_view_matrix * vec4(t_position + transform_t, 1.0, 1.0);',
' float c = cos(a_rotation);',
' float s = sin(a_rotation);',
' vec2 t_position = vec2(a_position.x * c - a_position.y * s, a_position.x * s + a_position.y * c);',
' gl_Position = u_view_matrix * vec4(t_position * a_scale + a_translate, 1.0, 1.0);',
' v_tex_coord = a_tex_coord;',
' v_color = a_color;',
'}'

View file

@ -4,13 +4,13 @@ var VertexShader = require('./VertexShader');
var CONST = {
// VERTEX_SIZE = (sizeof(vec2) * 4) + (sizeof(float) + sizeof(uint32))
VERTEX_SIZE: 44,
VERTEX_SIZE: 40,
INDEX_SIZE: 2,
SPRITE_VERTEX_COUNT: 4,
SPRITE_INDEX_COUNT: 6,
// How many 32-bit components does the vertex have.
SPRITE_VERTEX_COMPONENT_COUNT: 11,
SPRITE_VERTEX_COMPONENT_COUNT: 10,
// Can't be bigger since index are 16-bit
MAX_SPRITES: 2000,

View file

@ -92,7 +92,7 @@ Systems.prototype = {
this.children = new Component.Children(this.state);
this.color = new Component.Color(this.state);
this.data = new Component.Data(this.state);
this.transform = new Component.Transform(this.state);
//this.transform = new Component.Transform(this.state);
this.inject();
},
@ -113,7 +113,7 @@ Systems.prototype = {
this.state.state = this.stateManager;
this.state.cameras = this.cameras;
this.state.transform = this.transform;
//this.state.transform = this.transform;
this.state.cache = this.game.cache;
this.state.textures = this.game.textures;
@ -139,7 +139,7 @@ Systems.prototype = {
return;
}
this.cameras.render(renderer, this.transform.flatRenderArray, interpolation);
this.cameras.render(renderer, this.children, interpolation);
}
};

View file

@ -84,7 +84,7 @@ CameraManager.prototype = {
}
},
render: function (renderer, flatRenderArray, interpolation)
render: function (renderer, children, interpolation)
{
var cameras = this.cameras;
@ -94,9 +94,7 @@ CameraManager.prototype = {
camera.preRender();
renderer.render(this.state, flatRenderArray, interpolation, camera);
camera.postRender();
renderer.render(this.state, children, interpolation, camera);
}
},