Tile border added to static tilemap

Author: bitnenfer

v3/src/gameobjects/tilemap/static/BuildFromConfig.js

@@ -15,8 +15,9 @@ var BuildFromConfig = function (state, config)
     var tileHeight = GetValue(config, 'tile.height', 16);
     var tileTexture = GetValue(config, 'tile.texture', null);
     var tileFrame = GetValue(config, 'tile.frame', null);
+    var tileBorder = GetValue(config, 'tile.border', 0);
 
-    var map = new StaticTilemap(state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileTexture, tileFrame);
+    var map = new StaticTilemap(state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, tileTexture, tileFrame);
 
     BuildGameObject(state, map, config);
 

v3/src/gameobjects/tilemap/static/StaticTilemap.js

@@ -27,7 +27,7 @@ var StaticTilemap = new Class({
 
     initialize:
 
-    function StaticTilemap (state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame)
+    function StaticTilemap (state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame)
     {
         GameObject.call(this, state, 'StaticTilemap');
 
@@ -45,6 +45,7 @@ var StaticTilemap = new Class({
         this.vertexCount = 0;
         this.cullStart = 0;
         this.cullEnd = 0;
+        this.tileBorder = tileBorder;
         this.setTexture(texture, frame);
         this.setPosition(x, y);
         this.setSizeToFrame();
@@ -62,8 +63,11 @@ var StaticTilemap = new Class({
                 var vbo = this.vbo;
                 var mapWidth = this.mapWidth;
                 var mapHeight = this.mapHeight;
+                var border = this.tileBorder;
                 var tileWidth = this.tileWidth;
                 var tileHeight = this.tileHeight;
+                var tileWidthBorder = tileWidth + border * 2;
+                var tileHeightBorder = tileHeight + border * 2;
                 var bufferData = this.bufferData;
                 var bufferF32, bufferU32;
                 var voffset = 0;
@@ -89,10 +93,10 @@ var StaticTilemap = new Class({
                     for (var x = 0; x < mapWidth; ++x)
                     {
                         var tileId = mapData[y * mapWidth + x];
-                        var halfTileWidth =  (tileWidth) * 0.5;
-                        var halfTileHeight =  (tileHeight) * 0.5;
-                        var rectx = (((tileId % setWidth)|0) * tileWidth) + halfTileWidth;
-                        var recty = (((tileId / setWidth)|0) * tileHeight) + halfTileHeight;
+                        var halfTileWidth = (tileWidthBorder) * 0.5;
+                        var halfTileHeight = (tileHeightBorder) * 0.5;
+                        var rectx = (((tileId % setWidth)|0) * tileWidthBorder) + halfTileWidth;
+                        var recty = (((tileId / setWidth)|0) * tileHeightBorder) + halfTileHeight;
                         var tx = x * tileWidth;
                         var ty = y * tileHeight;
                         var txw = tx + tileWidth;

v3/src/gameobjects/tilemap/static/StaticTilemapFactory.js

@@ -7,9 +7,9 @@ var StaticTilemapFactory = {
 
     KEY: 'staticTilemap',
 
-    add: function (mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame)
+    add: function (mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame)
     {
-        return this.children.add(new StaticTilemap(this.state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, texture, frame));
+        return this.children.add(new StaticTilemap(this.state, mapData, x, y, tileWidth, tileHeight, mapWidth, mapHeight, tileBorder, texture, frame));
     },
 
     make: function (config)

v3/src/renderer/webgl/renderers/spritebatch/SpriteBatch.js

@@ -374,10 +374,10 @@ SpriteBatch.prototype = {
         var sra, srb, src, srd, sre, srf, cma, cmb, cmc, cmd, cme, cmf;
         var halfTileWidth = (width) * 0.5;
         var halfTileHeight = (height) * 0.5;
-        var u0 = (rectX - halfTileWidth) / textureWidth;
-        var v0 = (rectY - halfTileHeight) / textureHeight;
-        var u1 = (rectX + halfTileWidth) / textureWidth;
-        var v1 = (rectY + halfTileHeight) / textureHeight;
+        var u0 = (rectX - (halfTileWidth - 0.5)) / textureWidth;
+        var v0 = (rectY - (halfTileHeight - 0.5)) / textureHeight;
+        var u1 = (rectX + (halfTileWidth - 0.5)) / textureWidth;
+        var v1 = (rectY + (halfTileHeight - 0.5)) / textureHeight;
         var scrollX = camera.scrollX * scrollFactorX;
         var scrollY = camera.scrollY * scrollFactorY;