Fixed shader so blending is applied properly. Textures now have a premultiplied alpha property flag and unpacking property is set at creation.

Author: bitnenfer

v3/src/gameobjects/lightlayer/Const.js

@@ -1,6 +1,6 @@
 module.exports = {
 
     MAX_LIGHTS: 10,
-    DEFERRED_MAX_LIGHTS: 100
+    DEFERRED_MAX_LIGHTS: 50
 
 };

v3/src/renderer/webgl/ResourceManager.js

@@ -93,16 +93,19 @@ var ResourceManager = new Class({
         }
     },
 
-    createTexture: function (mipLevel, minFilter, magFilter, wrapT, wrapS, format, pixels, width, height)
+    createTexture: function (mipLevel, minFilter, magFilter, wrapT, wrapS, format, pixels, width, height, pma)
     {
         var gl = this.gl;
         var texture = gl.createTexture();
 
+        pma = (pma === undefined ||  pma === null) ? true : pma;
+
         gl.bindTexture(gl.TEXTURE_2D, texture);
         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, minFilter);
         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, magFilter);
         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrapS);
         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrapT);
+        gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, pma);
 
         if (pixels === null || pixels === undefined)
         {

v3/src/renderer/webgl/WebGLRenderer.js

@@ -142,7 +142,6 @@ var WebGLRenderer = new Class({
         gl.disable(gl.CULL_FACE);
         gl.enable(gl.BLEND);
         gl.clearColor(color.redGL, color.greenGL, color.blueGL, color.alphaGL);
-        gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
 
         //  Map Blend Modes
         this.blendModes = [];

v3/src/renderer/webgl/resources/Texture.js

@@ -4,12 +4,13 @@ var Texture = new Class({
 
     initialize:
 
-    function Texture (texture, width, height)
+    function Texture (texture, width, height, pma)
     {
         this.texture = texture;
         this.width = width;
         this.height = height;
         this.isRenderTexture = false;
+        this.isAlphaPremultiplied = pma;
     }
 
 });

v3/src/renderer/webgl/shaders/GBufferShader.js

@@ -2,6 +2,8 @@ var GBufferShader = function ()
 {
     var frag = [
         '#extension GL_EXT_draw_buffers : require',
+        
+        '// G-Buffer Shader',
 
         'precision mediump float;',
 
@@ -17,7 +19,7 @@ var GBufferShader = function ()
         '    vec4 spriteColor = texture2D(uMainTexture, v_tex_coord) * vec4(v_color, v_alpha);',
         '    vec3 spriteNormal = texture2D(uNormTexture, v_tex_coord).rgb;',
 
-        '    gl_FragData[0] = vec4(spriteColor.rgb * spriteColor.a, spriteColor.a);',
+        '    gl_FragData[0] = spriteColor;',
         '    gl_FragData[1] = vec4(spriteNormal, spriteColor.a);',
         '}'
     ];

v3/src/renderer/webgl/shaders/LightFragmentShader.js

@@ -1,6 +1,8 @@
 var LightFragmentShader = function (maxLights)
 {
     var frag = [
+        '// Light Fragment Shader ',
+
         'precision mediump float;',
 
         'struct Light',

v3/src/renderer/webgl/shaders/MaskShader.js

@@ -1,5 +1,7 @@
 module.exports = {
     vert: [
+    '// Mask Shader ',
+
     'precision mediump float;',
     'attribute vec2 a_position;',
     'void main()',
@@ -9,6 +11,8 @@ module.exports = {
     ''
     ].join('\n'),
     frag: [
+    '// Mask Shader ',
+    
     'precision mediump float;',
     'uniform vec2 u_resolution;',
     'uniform sampler2D u_main_sampler;',

v3/src/renderer/webgl/shaders/ParticleShader.js

@@ -1,6 +1,8 @@
 var ParticleShader = function ()
 {
     var vert = [
+        '// Particle Shader',
+
         'precision mediump float;',
         'uniform mat4 u_view_matrix;',
 
@@ -21,6 +23,8 @@ var ParticleShader = function ()
     ];
 
     var frag = [
+        '// Particle Shader',
+        
         'precision mediump float;',
 
         'uniform sampler2D u_main_sampler;',
@@ -31,7 +35,7 @@ var ParticleShader = function ()
         'void main()',
         '{',
         '    vec4 sample_color = texture2D(u_main_sampler, v_tex_coord) * v_color;',
-        '    gl_FragColor = vec4(sample_color.rgb * sample_color.a, sample_color.a);',
+        '    gl_FragColor = sample_color;',
         '}'
     ];
 

v3/src/renderer/webgl/shaders/Phong2DShaderDeferred.js

@@ -1,6 +1,8 @@
 var Phong2DShaderDeferred = function (maxLights)
 {
     var vert = [
+        '// Phong 2D Shader Deferred',
+        
         'precision mediump float;',
         'attribute vec2 vertexPosition;',
         'void main()',
@@ -10,6 +12,8 @@ var Phong2DShaderDeferred = function (maxLights)
     ];
 
     var frag = [
+        '// Phong 2D Shader Deferred',
+
         'precision mediump float;',
 
         'struct Light',
@@ -50,7 +54,7 @@ var Phong2DShaderDeferred = function (maxLights)
         '    }',
 
         '    vec4 color_output = vec4(uAmbientLightColor + finalColor, gbColor.a);',
-        '    gl_FragColor = vec4(color_output.rgb * color_output.a, color_output.a);',
+        '    gl_FragColor = color_output;',
         '}'
     ];
 

v3/src/renderer/webgl/shaders/TexturedAndAlphaShader.js

@@ -1,5 +1,7 @@
 module.exports = {
     vert: [
+        '// Textured and Alpha Shader',
+
         'uniform mat4 u_view_matrix;',
         'attribute vec2 a_position;',
         'attribute vec2 a_tex_coord;',
@@ -13,13 +15,15 @@ module.exports = {
         '}'
     ].join('\n'),
     frag: [
+        '// Textured and Alpha Shader',
+        
         'precision mediump float;',
         'uniform sampler2D u_sampler2D;',
         'varying vec2 v_tex_coord;',
         'varying float v_alpha;',
         'void main() {',
         '   vec4 output_color = texture2D(u_sampler2D, v_tex_coord);',
-        '   gl_FragColor = vec4(output_color.rgb * v_alpha * output_color.a, v_alpha * output_color.a);',
+        '   gl_FragColor = output_color;',
         '}'
     ].join('\n')
 };