Sorted out swapping WebGL textures in a non-multi texture environment.

src/renderer/webgl/BatchManager.js

@@ -255,7 +255,7 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
 
             fragmentSrc = this.multiTextureFragmentSrc;
     
-            console.dir(this.multiTextureFragmentSrc);
+            // console.dir(this.multiTextureFragmentSrc);
         }
 
         //  Compile the Shaders
@@ -324,6 +324,8 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
     {
         this._i = 0;
         this.dirty = true;
+        this.currentTextureSource = null;
+        this.currentBatchSize = 0;
     },
 
     end: function ()
@@ -358,8 +360,8 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
         {
             if (this.renderer.textureArray[textureSource.glTextureIndex] !== textureSource)
             {
-                console.log('setCurrentTexture', this.currentBatchSize);
+                console.log('setCurrentTexture - batch size', this.currentBatchSize);
-                console.log(textureSource);
+                // console.log(textureSource);
 
                 if (this.currentBatchSize > 0)
                 {
@@ -377,16 +379,22 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
         }
         else
         {
+            // console.log('setCurrentTexture');
+
             if (this.currentTextureSource === textureSource)
             {
+                // console.log('skip');
                 return;
             }
 
             if (this.currentBatchSize > 0)
             {
+                // console.log('force flush from insdie setCurrentTexture');
                 this.flush();
             }
 
+            // console.log('bind new sprites texture', textureSource.image.currentSrc);
+
             gl.activeTexture(gl.TEXTURE0);
 
             gl.bindTexture(gl.TEXTURE_2D, textureSource.glTexture);
@@ -434,18 +442,29 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
 
     addToBatch: function (gameObject, verts, uvs, textureIndex, alpha, tintColors, bgColors)
     {
-        //  Does this Game Objects texture need updating?
+        // console.log('addToBatch', gameObject.frame.name);
-        if (gameObject.frame.source.glDirty)
-        {
-            this.renderer.updateTexture(gameObject.frame.source);
-        }
 
         //  Check Batch Size and flush if needed
         if (this.currentBatchSize >= this.maxBatchSize)
         {
+            // console.log('force flush because batch limit hit');
             this.flush();
         }
 
+        //  Does this Game Objects texture need updating?
+        if (gameObject.frame.source.glDirty)
+        {
+            //  Check Batch Size and flush if needed
+            if (this.currentBatchSize > 0)
+            {
+                // console.log('force flush before updateTexture');
+                this.flush();
+            }
+
+            // console.log('texture dirty');
+            this.renderer.updateTexture(gameObject.frame.source);
+        }
+
         //  Set texture
         this.setCurrentTexture(gameObject.frame.source);
 
@@ -455,6 +474,8 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
 
         var i = this._i;
 
+        // console.log('addToBatch i / ci', i, this.currentBatchSize);
+
         //  Top Left vert (xy, uv, color)
         positions[i++] = verts.x0;
         positions[i++] = verts.y0;
@@ -501,7 +522,7 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
         var gl = this.gl;
 
         //  Bind the main texture
-        gl.activeTexture(gl.TEXTURE0);
+        // gl.activeTexture(gl.TEXTURE0);
 
         //  Bind the buffers
         gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
@@ -542,6 +563,8 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
 
     flush: function ()
     {
+        // console.log('flush');
+
         //  Always dirty the first pass through but subsequent calls may be clean
         if (this.dirty)
         {
@@ -579,30 +602,19 @@ Phaser.Renderer.WebGL.BatchManager.prototype = {
                 this.renderer.setBlendMode(sprite.blendMode);
             }
 
-            if (!this.renderer.multiTexture && this.currentTextureSource !== sprite.frame.source)
-            {
-                if (currentSize > 0)
-                {
-                    gl.drawElements(gl.TRIANGLES, currentSize * 6, gl.UNSIGNED_SHORT, start * 6 * 2);
-                    this.renderer.drawCount++;
-                }
-
-                start = i;
-                currentSize = 0;
-                this.currentTextureSource = sprite.frame.source;
-            }
-
             currentSize++;
         }
 
         if (currentSize > 0)
         {
+            // console.log('flushed and drew', currentSize);
             gl.drawElements(gl.TRIANGLES, currentSize * 6, gl.UNSIGNED_SHORT, start * 6 * 2);
             this.renderer.drawCount++;
         }
 
         //  Reset the batch
         this.currentBatchSize = 0;
+        this._i = 0;
     },
 
     destroy: function ()

src/renderer/webgl/WebGLRenderer.js

@@ -86,7 +86,7 @@ Phaser.Renderer.WebGL = function (game)
      */
     this.stencilBufferLimit = 6;
 
-    this.multiTexture = true;
+    this.multiTexture = false;
 
     this.extensions = {};
 
@@ -213,8 +213,6 @@ Phaser.Renderer.WebGL.prototype = {
 
         this.maxTextures = gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS);
 
-        console.log('maxTextures', this.maxTextures);
-
         if (this.maxTextures === 1)
         {
             this.multiTexture = false;
@@ -439,14 +437,20 @@ Phaser.Renderer.WebGL.prototype = {
         //  RenderTextures set this to -1
         this.flipY = 1;
 
+        // console.log('render');
+
         this.spriteBatch.begin();
 
         this.filterManager.begin();
 
+        // console.log('render stage');
+
         stage.render(this, stage);
 
         this.spriteBatch.end();
 
+        // debugger;
+
         //  Add Post-render hook
     },
 
@@ -474,7 +478,7 @@ Phaser.Renderer.WebGL.prototype = {
     //  Takes a TextureSource object
     updateTexture: function (source)
     {
-        console.log('updateTexture', source);
+        console.log('updateTexture', source.image.currentSrc);
 
         if (source.compressionAlgorithm)
         {
@@ -697,8 +701,6 @@ Phaser.Renderer.WebGL.prototype = {
 
     createEmptyTexture: function (width, height, scaleMode)
     {
-        console.log('createEmptyTexture');
-
         var gl = this.gl;
         var texture = gl.createTexture();
         var glScaleMode = (scaleMode === Phaser.scaleModes.LINEAR) ? gl.LINEAR : gl.NEAREST;

src/textures/Texture.js

@@ -88,6 +88,20 @@ Phaser.Texture.prototype = {
         }
     },
 
+    setTextureIndex: function (index)
+    {
+        for (var i = 0; i < this.source.length; i++)
+        {
+            this.source[i].glTextureIndex = index;
+
+            console.log('setTextureIndex', index);
+
+            index++;
+        }
+
+        return index;
+    },
+
     /**
     * Destroys this base texture
     *