Skip to content

Commit 070d946

Browse files
bitnenferbitnenfer
committed
Mesh and Sprite rendering
1 parent 336cc4e commit 070d946

8 files changed

Lines changed: 140 additions & 62 deletions

File tree

‎src/gameobjects/index.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ var GameObjects = {
2222
//Particles: require('./particles/ParticleEmitterManager'),
2323
//PathFollower: require('./pathfollower/PathFollower'),
2424
//Sprite3D: require('./sprite3d/Sprite3D'),
25-
//Sprite: require('./sprite/Sprite'),
25+
Sprite: require('./sprite/Sprite'),
2626
//StaticTilemapLayer: require('./tilemap/staticlayer/StaticTilemapLayer'),
2727
//Text: require('./text/static/Text'),
2828
//Tile: require('./tilemap/Tile'),
@@ -42,7 +42,7 @@ var GameObjects = {
4242
//Image: require('./image/ImageFactory'),
4343
//Particles: require('./particles/ParticleManagerFactory'),
4444
//PathFollower: require('./pathfollower/PathFollowerFactory'),
45-
//Sprite: require('./sprite/SpriteFactory'),
45+
Sprite: require('./sprite/SpriteFactory'),
4646
//Sprite3D: require('./sprite3d/Sprite3DFactory'),
4747
//StaticBitmapText: require('./bitmaptext/static/BitmapTextFactory'),
4848
//Text: require('./text/static/TextFactory'),
@@ -59,7 +59,7 @@ var GameObjects = {
5959
//Group: require('./group/GroupCreator'),
6060
//Image: require('./image/ImageCreator'),
6161
//Particles: require('./particles/ParticleManagerCreator'),
62-
//Sprite: require('./sprite/SpriteCreator'),
62+
Sprite: require('./sprite/SpriteCreator'),
6363
//Sprite3D: require('./sprite3d/Sprite3DCreator'),
6464
//StaticBitmapText: require('./bitmaptext/static/BitmapTextCreator'),
6565
//Text: require('./text/static/TextCreator'),
@@ -74,17 +74,17 @@ if (WEBGL_RENDERER)
7474
{
7575
// WebGL only Game Objects
7676
//GameObjects.LightLayer = require('./lightlayer/LightLayer');
77-
//GameObjects.Mesh = require('./mesh/Mesh');
77+
GameObjects.Mesh = require('./mesh/Mesh');
7878
//GameObjects.Quad = require('./quad/Quad');
7979

8080
//GameObjects.Factories.EffectLayer = require('./effectlayer/EffectLayerFactory');
8181
//GameObjects.Factories.LightLayer = require('./lightlayer/LightLayerFactory');
82-
//GameObjects.Factories.Mesh = require('./mesh/MeshFactory');
82+
GameObjects.Factories.Mesh = require('./mesh/MeshFactory');
8383
//GameObjects.Factories.Quad = require('./quad/QuadFactory');
8484

8585
//GameObjects.Creators.EffectLayer = require('./effectlayer/EffectLayerCreator');
8686
//GameObjects.Creators.LightLayer = require('./lightlayer/LightLayerCreator');
87-
//GameObjects.Creators.Mesh = require('./mesh/MeshCreator');
87+
GameObjects.Creators.Mesh = require('./mesh/MeshCreator');
8888
//GameObjects.Creators.Quad = require('./quad/QuadCreator');
8989
}
9090

‎src/gameobjects/mesh/Mesh.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ var Mesh = new Class({
2525

2626
initialize:
2727

28-
function Mesh (scene, x, y, vertices, uv, indices, colors, alphas, texture, frame)
28+
function Mesh (scene, x, y, vertices, uv, colors, alphas, texture, frame)
2929
{
3030
GameObject.call(this, scene, 'Mesh');
3131

@@ -71,7 +71,6 @@ var Mesh = new Class({
7171

7272
this.vertices = new Float32Array(vertices);
7373
this.uv = new Float32Array(uv);
74-
this.indices = new Uint16Array(indices);
7574
this.colors = new Uint32Array(colors);
7675
this.alphas = new Float32Array(alphas);
7776
}

‎src/gameobjects/mesh/MeshCreator.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,11 @@ GameObjectCreator.register('mesh', function (config)
1111
var key = GetAdvancedValue(config, 'key', null);
1212
var frame = GetAdvancedValue(config, 'frame', null);
1313
var vertices = GetValue(config, 'vertices', []);
14-
var indices = GetValue(config, 'indices', []);
1514
var colors = GetValue(config, 'colors', []);
1615
var alphas = GetValue(config, 'alphas', []);
1716
var uv = GetValue(config, 'uv', []);
1817

19-
var mesh = new Mesh(this.scene, 0, 0, vertices, uv, indices, colors, alphas, key, frame);
18+
var mesh = new Mesh(this.scene, 0, 0, vertices, uv, colors, alphas, key, frame);
2019

2120
BuildGameObject(this.scene, mesh, config);
2221

‎src/gameobjects/mesh/MeshFactory.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ var GameObjectFactory = require('../GameObjectFactory');
1111

1212
if (WEBGL_RENDERER)
1313
{
14-
GameObjectFactory.register('mesh', function (x, y, vertices, uv, key, frame)
14+
GameObjectFactory.register('mesh', function (x, y, vertices, uv, colors, alphas, texture, frame)
1515
{
1616
return this.displayList.add(new Mesh(this.scene, x, y, vertices, uv, key, frame));
1717
});

‎src/gameobjects/mesh/MeshWebGLRenderer.js‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,7 @@ var MeshWebGLRenderer = function (renderer, src, interpolationPercentage, camera
77
return;
88
}
99

10-
if (src.indices.length > 0)
11-
{
12-
renderer.spriteBatch.addMeshIndexed(src, camera);
13-
}
14-
else
15-
{
16-
renderer.spriteBatch.addMesh(src, camera);
17-
}
10+
renderer.pipelines.TextureTintPipeline.batchMesh(src, camera);
1811
};
1912

2013
module.exports = MeshWebGLRenderer;

‎src/gameobjects/sprite/SpriteWebGLRenderer.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ var SpriteWebGLRenderer = function (renderer, src, interpolationPercentage, came
77
return;
88
}
99

10-
renderer.spriteRenderer.drawSprite(src, camera);
10+
renderer.pipelines.TextureTintPipeline.batchSprite(src, camera);
1111
};
1212

1313
module.exports = SpriteWebGLRenderer;

‎src/renderer/webgl/WebGLRenderer.js‎

Lines changed: 16 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -212,7 +212,7 @@ var WebGLRenderer = new Class({
212212
this.currentPipeline.bind(overrideProgram);
213213
}
214214

215-
return pipeline;
215+
return this.currentPipeline;
216216
},
217217

218218
setBlendMode: function (blendModeId)
@@ -251,6 +251,8 @@ var WebGLRenderer = new Class({
251251

252252
if (texture !== this.currentTextures[textureUnit])
253253
{
254+
this.flush();
255+
254256
gl.activeTexture(gl.TEXTURE0 + textureUnit);
255257
gl.bindTexture(gl.TEXTURE_2D, texture);
256258

@@ -266,6 +268,8 @@ var WebGLRenderer = new Class({
266268

267269
if (framebuffer !== this.currentFramebuffer)
268270
{
271+
this.flush();
272+
269273
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
270274
}
271275

@@ -278,6 +282,8 @@ var WebGLRenderer = new Class({
278282

279283
if (program !== this.currentProgram)
280284
{
285+
this.flush();
286+
281287
gl.useProgram(program);
282288
}
283289

@@ -290,6 +296,8 @@ var WebGLRenderer = new Class({
290296

291297
if (vertexBuffer !== this.currentVertexBuffer)
292298
{
299+
this.flush();
300+
293301
gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
294302
}
295303

@@ -302,6 +310,8 @@ var WebGLRenderer = new Class({
302310

303311
if (indexBuffer !== this.currentIndexBuffer)
304312
{
313+
this.flush();
314+
305315
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuffer);
306316
}
307317

@@ -545,10 +555,11 @@ var WebGLRenderer = new Class({
545555

546556
pipeline = this.currentPipeline;
547557

548-
if (pipeline && pipeline.shouldFlush())
549-
{
550-
pipeline.flush();
551-
}
558+
}
559+
560+
if (pipeline && pipeline.vertexCount > 0)
561+
{
562+
pipeline.flush();
552563
}
553564

554565
if (scissorEnabled)

‎src/renderer/webgl/pipelines/TextureTintPipeline.js‎

Lines changed: 113 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -95,11 +95,10 @@ var TextureTintPipeline = new Class({
9595
{
9696
this.renderer.setPipeline(this);
9797

98+
var getTint = Utils.getTintAppendFloatAlpha;
9899
var vertexViewF32 = this.vertexViewF32;
99100
var vertexViewU32 = this.vertexViewU32;
100101
var renderer = this.renderer;
101-
var gl = this.gl;
102-
var shader = this.currentProgram;
103102
var list = blitter.getRenderList();
104103
var length = list.length;
105104
var cameraMatrix = camera.matrix.matrix;
@@ -126,7 +125,7 @@ var TextureTintPipeline = new Class({
126125
var bob = list[batchOffset + index];
127126
var frame = bob.frame;
128127
var alpha = bob.alpha;
129-
var tint = Utils.getTintAppendFloatAlpha(0xffffff, bob.alpha);
128+
var tint = getTint(0xffffff, bob.alpha);
130129
var uvs = frame.uvs;
131130
var flipX = bob.flipX;
132131
var flipY = bob.flipY;
@@ -202,9 +201,11 @@ var TextureTintPipeline = new Class({
202201
this.flush();
203202
}
204203

204+
var getTint = Utils.getTintAppendFloatAlpha;
205205
var vertexViewF32 = this.vertexViewF32;
206206
var vertexViewU32 = this.vertexViewU32;
207-
var shader = this.currentProgram;
207+
var renderer = this.renderer;
208+
var vertexOffset = this.vertexCount * this.vertexComponentCount;
208209
var cameraMatrix = camera.matrix.matrix;
209210
var a = cameraMatrix[0];
210211
var b = cameraMatrix[1];
@@ -265,47 +266,122 @@ var TextureTintPipeline = new Class({
265266
var ty2 = xw * mvb + yh * mvd + mvf;
266267
var tx3 = xw * mva + y * mvc + mve;
267268
var ty3 = xw * mvb + y * mvd + mvf;
268-
var getTint = Utils.getTintAppendFloatAlpha;
269269
var tint0 = getTint(tintTL, alphaTL);
270270
var tint1 = getTint(tintTR, alphaTR);
271271
var tint2 = getTint(tintBL, alphaBL);
272272
var tint3 = getTint(tintBR, alphaBR);
273273

274-
renderer.setTexture2D(frame.texture.source[frame.sourceIndex].glTexture, 0);
275-
276-
vertexViewF32[0] = tx0;
277-
vertexViewF32[1] = ty0;
278-
vertexViewF32[2] = uvs.x0;
279-
vertexViewF32[3] = uvs.y0;
280-
vertexViewU32[4] = tint0;
281-
vertexViewF32[5] = tx1;
282-
vertexViewF32[6] = ty1;
283-
vertexViewF32[7] = uvs.x1;
284-
vertexViewF32[8] = uvs.y1;
285-
vertexViewU32[9] = tint1;
286-
vertexViewF32[10] = tx2;
287-
vertexViewF32[11] = ty2;
288-
vertexViewF32[12] = uvs.x2;
289-
vertexViewF32[13] = uvs.y2;
290-
vertexViewU32[14] = tint2;
291-
vertexViewF32[15] = tx0;
292-
vertexViewF32[16] = ty0;
293-
vertexViewF32[17] = uvs.x0;
294-
vertexViewF32[18] = uvs.y0;
295-
vertexViewU32[19] = tint0;
296-
vertexViewF32[20] = tx2;
297-
vertexViewF32[21] = ty2;
298-
vertexViewF32[22] = uvs.x2;
299-
vertexViewF32[23] = uvs.y2;
300-
vertexViewU32[24] = tint2;
301-
vertexViewF32[25] = tx3;
302-
vertexViewF32[26] = ty3;
303-
vertexViewF32[27] = uvs.x3;
304-
vertexViewF32[28] = uvs.y3;
305-
vertexViewU32[29] = tint3;
274+
renderer.setTexture2D(texture, 0);
275+
276+
vertexViewF32[vertexOffset + 0] = tx0;
277+
vertexViewF32[vertexOffset + 1] = ty0;
278+
vertexViewF32[vertexOffset + 2] = uvs.x0;
279+
vertexViewF32[vertexOffset + 3] = uvs.y0;
280+
vertexViewU32[vertexOffset + 4] = tint0;
281+
vertexViewF32[vertexOffset + 5] = tx1;
282+
vertexViewF32[vertexOffset + 6] = ty1;
283+
vertexViewF32[vertexOffset + 7] = uvs.x1;
284+
vertexViewF32[vertexOffset + 8] = uvs.y1;
285+
vertexViewU32[vertexOffset + 9] = tint1;
286+
vertexViewF32[vertexOffset + 10] = tx2;
287+
vertexViewF32[vertexOffset + 11] = ty2;
288+
vertexViewF32[vertexOffset + 12] = uvs.x2;
289+
vertexViewF32[vertexOffset + 13] = uvs.y2;
290+
vertexViewU32[vertexOffset + 14] = tint2;
291+
vertexViewF32[vertexOffset + 15] = tx0;
292+
vertexViewF32[vertexOffset + 16] = ty0;
293+
vertexViewF32[vertexOffset + 17] = uvs.x0;
294+
vertexViewF32[vertexOffset + 18] = uvs.y0;
295+
vertexViewU32[vertexOffset + 19] = tint0;
296+
vertexViewF32[vertexOffset + 20] = tx2;
297+
vertexViewF32[vertexOffset + 21] = ty2;
298+
vertexViewF32[vertexOffset + 22] = uvs.x2;
299+
vertexViewF32[vertexOffset + 23] = uvs.y2;
300+
vertexViewU32[vertexOffset + 24] = tint2;
301+
vertexViewF32[vertexOffset + 25] = tx3;
302+
vertexViewF32[vertexOffset + 26] = ty3;
303+
vertexViewF32[vertexOffset + 27] = uvs.x3;
304+
vertexViewF32[vertexOffset + 28] = uvs.y3;
305+
vertexViewU32[vertexOffset + 29] = tint3;
306306

307307
this.vertexCount += 6;
308+
},
309+
310+
batchMesh: function (mesh, camera)
311+
{
312+
this.renderer.setPipeline(this);
313+
var vertices = mesh.vertices;
314+
var length = vertices.length;
315+
var vertexCount = (length / 2)|0;
316+
317+
if (this.vertexCount + vertexCount > this.vertexCapacity)
318+
{
319+
this.flush();
320+
}
321+
322+
var getTint = Utils.getTintAppendFloatAlpha;
323+
var uvs = mesh.uv;
324+
var colors = mesh.colors;
325+
var alphas = mesh.alphas;
326+
var vertexViewF32 = this.vertexViewF32;
327+
var vertexViewU32 = this.vertexViewU32;
328+
var renderer = this.renderer;
329+
var vertexOffset = this.vertexCount * this.vertexComponentCount;
330+
var cameraMatrix = camera.matrix.matrix;
331+
var a = cameraMatrix[0];
332+
var b = cameraMatrix[1];
333+
var c = cameraMatrix[2];
334+
var d = cameraMatrix[3];
335+
var e = cameraMatrix[4];
336+
var f = cameraMatrix[5];
337+
var frame = mesh.frame;
338+
var texture = mesh.texture.source[frame.sourceIndex].glTexture;
339+
var translateX = mesh.x - camera.scrollX * mesh.scrollFactorX;
340+
var translateY = mesh.y - camera.scrollY * mesh.scrollFactorY;
341+
var scaleX = mesh.scaleX;
342+
var scaleY = mesh.scaleY;
343+
var rotation = -mesh.rotation;
344+
var sr = Math.sin(rotation);
345+
var cr = Math.cos(rotation);
346+
var sra = cr * scaleX;
347+
var srb = -sr * scaleX;
348+
var src = sr * scaleY;
349+
var srd = cr * scaleY;
350+
var sre = translateX;
351+
var srf = translateY;
352+
var cma = cameraMatrix[0];
353+
var cmb = cameraMatrix[1];
354+
var cmc = cameraMatrix[2];
355+
var cmd = cameraMatrix[3];
356+
var cme = cameraMatrix[4];
357+
var cmf = cameraMatrix[5];
358+
var mva = sra * cma + srb * cmc;
359+
var mvb = sra * cmb + srb * cmd;
360+
var mvc = src * cma + srd * cmc;
361+
var mvd = src * cmb + srd * cmd;
362+
var mve = sre * cma + srf * cmc + cme;
363+
var mvf = sre * cmb + srf * cmd + cmf;
364+
365+
renderer.setTexture2D(texture, 0);
366+
367+
for (var index = 0, index0 = 0; index < length; index += 2)
368+
{
369+
var x = vertices[index + 0];
370+
var y = vertices[index + 1];
371+
var tx = x * mva + y * mvc + mve;
372+
var ty = x * mvb + y * mvd + mvf;
373+
374+
vertexViewF32[vertexOffset + 0] = tx;
375+
vertexViewF32[vertexOffset + 1] = ty;
376+
vertexViewF32[vertexOffset + 2] = uvs[index + 0];
377+
vertexViewF32[vertexOffset + 3] = uvs[index + 1];
378+
vertexViewU32[vertexOffset + 4] = getTint(colors[index0], alphas[index0]);
379+
380+
vertexOffset += 5;
381+
index0 += 1;
382+
}
308383

384+
this.vertexCount += vertexCount;
309385
}
310386
});
311387

0 commit comments

Comments
 (0)