Skip to content

Commit 702e738

Browse files
committed
When a Static Tilemap Layer is generated in WebGL it will use the Cameras roundPixels value to clamp the tile coordinates.
1 parent 50821c2 commit 702e738

2 files changed

Lines changed: 146 additions & 144 deletions

File tree

CHANGELOG.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@ The Tile Sprite Game Object has been given an internal overhaul to make it more
138138
* The `batchTexture` method in the Texture Tint Pipeline now supports cropped Game Objects and will adjust the drawn texture frame accordingly.
139139
* The `Matrix Stack` Component has been removed. It's no longer used internally and was just wasting space.
140140
* You can now specify the `lineHeight` of a Retro Font in the Retro Font Config object (thanks @FelixNemis)
141+
* When a Static Tilemap Layer is generated in WebGL it will use the Cameras `roundPixels` value to clamp the tile coordinates.
141142

142143
### Game Config Resolution Specific Bug Fixes
143144

src/tilemaps/staticlayer/StaticTilemapLayer.js

Lines changed: 145 additions & 144 deletions
Original file line numberDiff line numberDiff line change
@@ -308,163 +308,164 @@ var StaticTilemapLayer = new Class({
308308
upload: function (camera)
309309
{
310310
var renderer = this.renderer;
311-
312311
var gl = renderer.gl;
313312

314-
if (gl)
315-
{
316-
var pipeline = renderer.pipelines.TextureTintPipeline;
313+
var pipeline = renderer.pipelines.TextureTintPipeline;
317314

318-
if (this.dirty)
315+
if (this.dirty)
316+
{
317+
var tileset = this.tileset;
318+
var mapWidth = this.layer.width;
319+
var mapHeight = this.layer.height;
320+
var width = tileset.image.source[0].width;
321+
var height = tileset.image.source[0].height;
322+
var mapData = this.layer.data;
323+
var tile;
324+
var row;
325+
var col;
326+
var texCoords;
327+
328+
var vertexBuffer = this.vertexBuffer;
329+
var bufferData = this.bufferData;
330+
var vOffset = -1;
331+
var vertexCount = 0;
332+
var tintEffect = false;
333+
var bufferSize = (mapWidth * mapHeight) * pipeline.vertexSize * 6;
334+
335+
if (bufferData === null)
319336
{
320-
var tileset = this.tileset;
321-
var mapWidth = this.layer.width;
322-
var mapHeight = this.layer.height;
323-
var width = tileset.image.source[0].width;
324-
var height = tileset.image.source[0].height;
325-
var mapData = this.layer.data;
326-
var tile;
327-
var row;
328-
var col;
329-
var texCoords;
330-
331-
var vertexBuffer = this.vertexBuffer;
332-
var bufferData = this.bufferData;
333-
var voffset = -1;
334-
var vertexCount = 0;
335-
var tintEffect = false;
336-
var bufferSize = (mapWidth * mapHeight) * pipeline.vertexSize * 6;
337-
338-
if (bufferData === null)
339-
{
340-
bufferData = new ArrayBuffer(bufferSize);
341-
this.bufferData = bufferData;
342-
this.vertexViewF32 = new Float32Array(bufferData);
343-
this.vertexViewU32 = new Uint32Array(bufferData);
344-
}
345-
346-
var vertexViewF32 = this.vertexViewF32;
347-
var vertexViewU32 = this.vertexViewU32;
348-
349-
var c = 0;
350-
var i = 0;
351-
352-
for (row = 0; row < mapHeight; ++row)
337+
bufferData = new ArrayBuffer(bufferSize);
338+
this.bufferData = bufferData;
339+
this.vertexViewF32 = new Float32Array(bufferData);
340+
this.vertexViewU32 = new Uint32Array(bufferData);
341+
}
342+
343+
var vertexViewF32 = this.vertexViewF32;
344+
var vertexViewU32 = this.vertexViewU32;
345+
346+
for (row = 0; row < mapHeight; row++)
347+
{
348+
for (col = 0; col < mapWidth; col++)
353349
{
354-
for (col = 0; col < mapWidth; ++col)
350+
tile = mapData[row][col];
351+
352+
if (!tile || tile.index === -1 || !tile.visible)
355353
{
356-
c++;
357-
358-
tile = mapData[row][col];
359-
360-
if (!tile || tile.index === -1 || !tile.visible)
361-
{
362-
continue;
363-
}
364-
365-
var tx = tile.pixelX;
366-
var ty = tile.pixelY;
367-
var txw = tx + tile.width;
368-
var tyh = ty + tile.height;
369-
370-
texCoords = tileset.getTileTextureCoordinates(tile.index);
371-
372-
if (!texCoords)
373-
{
374-
continue;
375-
}
376-
377-
var u0 = texCoords.x / width;
378-
var v0 = texCoords.y / height;
379-
var u1 = (texCoords.x + tile.width) / width;
380-
var v1 = (texCoords.y + tile.height) / height;
381-
382-
var tint = Utils.getTintAppendFloatAlpha(0xffffff, camera.alpha * this.alpha * tile.alpha);
383-
384-
var tx0 = tx;
385-
var ty0 = ty;
386-
var tx1 = tx;
387-
var ty1 = tyh;
388-
var tx2 = txw;
389-
var ty2 = tyh;
390-
var tx3 = txw;
391-
var ty3 = ty;
392-
393-
vertexViewF32[++voffset] = tx0;
394-
vertexViewF32[++voffset] = ty0;
395-
vertexViewF32[++voffset] = u0;
396-
vertexViewF32[++voffset] = v0;
397-
vertexViewF32[++voffset] = tintEffect;
398-
vertexViewU32[++voffset] = tint;
399-
400-
vertexViewF32[++voffset] = tx1;
401-
vertexViewF32[++voffset] = ty1;
402-
vertexViewF32[++voffset] = u0;
403-
vertexViewF32[++voffset] = v1;
404-
vertexViewF32[++voffset] = tintEffect;
405-
vertexViewU32[++voffset] = tint;
406-
407-
vertexViewF32[++voffset] = tx2;
408-
vertexViewF32[++voffset] = ty2;
409-
vertexViewF32[++voffset] = u1;
410-
vertexViewF32[++voffset] = v1;
411-
vertexViewF32[++voffset] = tintEffect;
412-
vertexViewU32[++voffset] = tint;
413-
414-
vertexViewF32[++voffset] = tx0;
415-
vertexViewF32[++voffset] = ty0;
416-
vertexViewF32[++voffset] = u0;
417-
vertexViewF32[++voffset] = v0;
418-
vertexViewF32[++voffset] = tintEffect;
419-
vertexViewU32[++voffset] = tint;
420-
421-
vertexViewF32[++voffset] = tx2;
422-
vertexViewF32[++voffset] = ty2;
423-
vertexViewF32[++voffset] = u1;
424-
vertexViewF32[++voffset] = v1;
425-
vertexViewF32[++voffset] = tintEffect;
426-
vertexViewU32[++voffset] = tint;
427-
428-
vertexViewF32[++voffset] = tx3;
429-
vertexViewF32[++voffset] = ty3;
430-
vertexViewF32[++voffset] = u1;
431-
vertexViewF32[++voffset] = v0;
432-
vertexViewF32[++voffset] = tintEffect;
433-
vertexViewU32[++voffset] = tint;
434-
435-
vertexCount += 6;
436-
437-
i++;
354+
continue;
438355
}
356+
357+
var tx = tile.pixelX;
358+
var ty = tile.pixelY;
359+
var txw = tx + tile.width;
360+
var tyh = ty + tile.height;
361+
362+
texCoords = tileset.getTileTextureCoordinates(tile.index);
363+
364+
if (!texCoords)
365+
{
366+
continue;
367+
}
368+
369+
var u0 = texCoords.x / width;
370+
var v0 = texCoords.y / height;
371+
var u1 = (texCoords.x + tile.width) / width;
372+
var v1 = (texCoords.y + tile.height) / height;
373+
374+
var tint = Utils.getTintAppendFloatAlpha(0xffffff, camera.alpha * this.alpha * tile.alpha);
375+
376+
var tx0 = tx;
377+
var ty0 = ty;
378+
var tx1 = tx;
379+
var ty1 = tyh;
380+
var tx2 = txw;
381+
var ty2 = tyh;
382+
var tx3 = txw;
383+
var ty3 = ty;
384+
385+
if (camera.roundPixels)
386+
{
387+
tx0 |= 0;
388+
ty0 |= 0;
389+
390+
tx1 |= 0;
391+
ty1 |= 0;
392+
393+
tx2 |= 0;
394+
ty2 |= 0;
395+
396+
tx3 |= 0;
397+
ty3 |= 0;
398+
}
399+
400+
vertexViewF32[++vOffset] = tx0;
401+
vertexViewF32[++vOffset] = ty0;
402+
vertexViewF32[++vOffset] = u0;
403+
vertexViewF32[++vOffset] = v0;
404+
vertexViewF32[++vOffset] = tintEffect;
405+
vertexViewU32[++vOffset] = tint;
406+
407+
vertexViewF32[++vOffset] = tx1;
408+
vertexViewF32[++vOffset] = ty1;
409+
vertexViewF32[++vOffset] = u0;
410+
vertexViewF32[++vOffset] = v1;
411+
vertexViewF32[++vOffset] = tintEffect;
412+
vertexViewU32[++vOffset] = tint;
413+
414+
vertexViewF32[++vOffset] = tx2;
415+
vertexViewF32[++vOffset] = ty2;
416+
vertexViewF32[++vOffset] = u1;
417+
vertexViewF32[++vOffset] = v1;
418+
vertexViewF32[++vOffset] = tintEffect;
419+
vertexViewU32[++vOffset] = tint;
420+
421+
vertexViewF32[++vOffset] = tx0;
422+
vertexViewF32[++vOffset] = ty0;
423+
vertexViewF32[++vOffset] = u0;
424+
vertexViewF32[++vOffset] = v0;
425+
vertexViewF32[++vOffset] = tintEffect;
426+
vertexViewU32[++vOffset] = tint;
427+
428+
vertexViewF32[++vOffset] = tx2;
429+
vertexViewF32[++vOffset] = ty2;
430+
vertexViewF32[++vOffset] = u1;
431+
vertexViewF32[++vOffset] = v1;
432+
vertexViewF32[++vOffset] = tintEffect;
433+
vertexViewU32[++vOffset] = tint;
434+
435+
vertexViewF32[++vOffset] = tx3;
436+
vertexViewF32[++vOffset] = ty3;
437+
vertexViewF32[++vOffset] = u1;
438+
vertexViewF32[++vOffset] = v0;
439+
vertexViewF32[++vOffset] = tintEffect;
440+
vertexViewU32[++vOffset] = tint;
441+
442+
vertexCount += 6;
439443
}
444+
}
440445

441-
this.vertexCount = vertexCount;
442-
443-
this.dirty = false;
444-
445-
if (vertexBuffer === null)
446-
{
447-
vertexBuffer = renderer.createVertexBuffer(bufferData, gl.STATIC_DRAW);
448-
449-
this.vertexBuffer = vertexBuffer;
450-
}
451-
else
452-
{
453-
renderer.setVertexBuffer(vertexBuffer);
454-
455-
gl.bufferSubData(gl.ARRAY_BUFFER, 0, bufferData);
456-
}
446+
this.dirty = false;
457447

458-
window.noCull = c;
459-
window.cull = i;
448+
this.vertexCount = vertexCount;
449+
450+
if (vertexBuffer === null)
451+
{
452+
vertexBuffer = renderer.createVertexBuffer(bufferData, gl.STATIC_DRAW);
453+
454+
this.vertexBuffer = vertexBuffer;
455+
}
456+
else
457+
{
458+
renderer.setVertexBuffer(vertexBuffer);
459+
460+
gl.bufferSubData(gl.ARRAY_BUFFER, 0, bufferData);
460461
}
461-
462-
pipeline.modelIdentity();
463-
pipeline.modelTranslate(this.x - (camera.scrollX * this.scrollFactorX), this.y - (camera.scrollY * this.scrollFactorY), 0);
464-
pipeline.modelScale(this.scaleX, this.scaleY, 1);
465-
pipeline.viewLoad2D(camera.matrix.matrix);
466462
}
467463

464+
pipeline.modelIdentity();
465+
pipeline.modelTranslate(this.x - (camera.scrollX * this.scrollFactorX), this.y - (camera.scrollY * this.scrollFactorY), 0);
466+
pipeline.modelScale(this.scaleX, this.scaleY, 1);
467+
pipeline.viewLoad2D(camera.matrix.matrix);
468+
468469
return this;
469470
},
470471

0 commit comments

Comments
 (0)