Fixed camera effects

Author: bitnenfer

src/renderer/webgl/WebGLRenderer.js

@@ -2,6 +2,7 @@ var Class = require('../../utils/Class');
 var CONST = require('../../const');
 var WebGLSnapshot = require('../snapshot/WebGLSnapshot');
 var IsSizePowerOfTwo = require('../../math/pow2/IsSizePowerOfTwo');
+var Utils = require('./Utils');
 
 // Default Pipelines
 var TextureTintPipeline = require('./pipelines/TextureTintPipeline');
@@ -233,13 +234,19 @@ var WebGLRenderer = new Class({
         var gl = this.gl;
         var scissorState = this.currentScissorState;
 
-        if (!x !== 0 || y !== 0 || width !== gl.canvas.width || height !== gl.canvas.height) 
+        if (x == 0 && 
+            y == 0 && 
+            width == gl.canvas.width && 
+            height == gl.canvas.height &&
+            width > 0 &&
+            height > 0)
         {
-                return;
+            return;
         }
 
         if (!scissorState.enabled)
         {
+            this.flush();
             gl.enable(gl.SCISSOR_TEST);
             scissorState.enabled = true;
         }
@@ -259,6 +266,7 @@ var WebGLRenderer = new Class({
         if (scissorState.enabled)
         {
             gl.disable(gl.SCISSOR_TEST);
+            scissorState.enabled = false;
         }
     },
 
@@ -549,6 +557,60 @@ var WebGLRenderer = new Class({
     },
 
     /* Rendering Functions */
+    preRenderCamera: function (camera)
+    {
+        this.beginScissor(camera.x, camera.y, camera.width, camera.height);
+        
+        if (camera.backgroundColor.alphaGL > 0)
+        {
+            var color = camera.backgroundColor;
+            var FlatTintPipeline = this.pipelines.FlatTintPipeline;
+
+            FlatTintPipeline.batchFillRect(
+                0, 0, 1, 1, 0, 
+                camera.x, camera.y, camera.width, camera.height, 
+                Utils.getTintFromFloats(color.redGL, color.greenGL, color.blueGL, 1.0),
+                color.alphaGL,
+                1, 0, 0, 1, 0, 0,
+                [1, 0, 0, 1, 0, 0]
+            );
+
+            FlatTintPipeline.flush();
+        }
+    },
+
+    postRenderCamera: function (camera)
+    {
+        if (camera._fadeAlpha > 0 || camera._flashAlpha > 0)
+        {
+            var FlatTintPipeline = this.pipelines.FlatTintPipeline;
+
+            // Fade
+            FlatTintPipeline.batchFillRect(
+                0, 0, 1, 1, 0, 
+                camera.x, camera.y, camera.width, camera.height, 
+                Utils.getTintFromFloats(camera._fadeRed, camera._fadeGreen, camera._fadeBlue, 1.0),
+                camera._fadeAlpha,
+                1, 0, 0, 1, 0, 0,
+                [1, 0, 0, 1, 0, 0]
+            );
+
+            // Flash
+            FlatTintPipeline.batchFillRect(
+                0, 0, 1, 1, 0, 
+                camera.x, camera.y, camera.width, camera.height, 
+                Utils.getTintFromFloats(camera._flashRed, camera._flashGreen, camera._flashBlue, 1.0),
+                camera._flashAlpha,
+                1, 0, 0, 1, 0, 0,
+                [1, 0, 0, 1, 0, 0]
+            );
+
+            FlatTintPipeline.flush();
+        }
+
+        this.endScissor();
+    },
+
     preRender: function ()
     {
         if (this.contextLost) return;
@@ -569,7 +631,7 @@ var WebGLRenderer = new Class({
         var list = children.list;
         var childCount = list.length;
 
-        this.beginScissor(camera.x, camera.y, camera.width, camera.height);
+        this.preRenderCamera(camera);
 
         for (var index = 0; index < childCount; ++index)
         {
@@ -599,7 +661,8 @@ var WebGLRenderer = new Class({
         }
 
         this.flush();
-        this.endScissor();
+        this.setBlendMode(CONST.BlendModes.NORMAL);
+        this.postRenderCamera(camera);
     },
 
     postRender: function ()

src/renderer/webgl/pipelines/TextureTintPipeline.js

@@ -144,13 +144,7 @@ var TextureTintPipeline = new Class({
                 var ty0 = x * b + y * d + f;
                 var tx1 = xw * a + yh * c + e;
                 var ty1 = xw * b + yh * d + f;
-
-                if ((tx0 < cameraX || tx0 > cameraWidth || ty0 < cameraX || ty0 > cameraHeight) &&
-                    (tx1 < cameraY || tx1 > cameraWidth || ty1 < cameraY || ty1 > cameraHeight))
-                {
-                    continue;
-                }
-
+                
                 // Bind Texture if texture wasn't bound.
                 // This needs to be here because of multiple
                 // texture atlas.
@@ -270,15 +264,6 @@ var TextureTintPipeline = new Class({
         var tx3 = xw * mva + y * mvc + mve;
         var ty3 = xw * mvb + y * mvd + mvf;
         var vertexOffset = 0;
-
-        if ((tx0 < cameraX || tx0 > cameraWidth || ty0 < cameraY || ty0 > cameraHeight) &&
-            (tx1 < cameraX || tx1 > cameraWidth || ty1 < cameraY || ty1 > cameraHeight) &&
-            (tx2 < cameraX || tx2 > cameraWidth || ty2 < cameraY || ty2 > cameraHeight) &&
-            (tx3 < cameraX || tx3 > cameraWidth || ty3 < cameraY || ty3 > cameraHeight))
-        {
-            return;
-        }
-
         var u0 = frameX / texture.width;
         var v0 = frameY / texture.height;
         var u1 = frameX / texture.width;
@@ -403,14 +388,6 @@ var TextureTintPipeline = new Class({
         var tint3 = getTint(tintBR, alphaBR);
         var vertexOffset = 0;
 
-        if ((tx0 < cameraX || tx0 > cameraWidth || ty0 < cameraY || ty0 > cameraHeight) &&
-            (tx1 < cameraX || tx1 > cameraWidth || ty1 < cameraY || ty1 > cameraHeight) &&
-            (tx2 < cameraX || tx2 > cameraWidth || ty2 < cameraY || ty2 > cameraHeight) &&
-            (tx3 < cameraX || tx3 > cameraWidth || ty3 < cameraY || ty3 > cameraHeight))
-        {
-            return;
-        }
-
         renderer.setTexture2D(texture, 0);
 
         vertexOffset = this.vertexCount * this.vertexComponentCount;
@@ -675,14 +652,6 @@ var TextureTintPipeline = new Class({
             vmin = glyphY / textureHeight;
             vmax = (glyphY + glyphH) / textureHeight;
 
-            if ((tx0 < cameraX || tx0 > cameraWidth || ty0 < cameraY || ty0 > cameraHeight) &&
-                (tx1 < cameraX || tx1 > cameraWidth || ty1 < cameraY || ty1 > cameraHeight) &&
-                (tx2 < cameraX || tx2 > cameraWidth || ty2 < cameraY || ty2 > cameraHeight) &&
-                (tx3 < cameraX || tx3 > cameraWidth || ty3 < cameraY || ty3 > cameraHeight))
-            {
-                continue;
-            }
-
             if (this.vertexCount + 6 > this.vertexCapacity)
             {
                 this.flush();