Shaders will now automatically get all active uniforms and populate the uniforms object

Author: photonstorm

src/renderer/webgl/WebGLPipeline.js

@@ -571,12 +571,10 @@ var WebGLPipeline = new Class({
 
         var vName = 'vertShader';
         var fName = 'fragShader';
-        var uName = 'uniforms';
         var aName = 'attributes';
 
         var defaultVertShader = GetFastValue(config, vName, null);
         var defaultFragShader = Utils.parseFragmentShaderMaxTextures(GetFastValue(config, fName, null), renderer.maxTextures);
-        var defaultUniforms = GetFastValue(config, uName, null);
         var defaultAttribs = GetFastValue(config, aName, null);
 
         var configShaders = GetFastValue(config, 'shaders', []);
@@ -587,7 +585,7 @@ var WebGLPipeline = new Class({
         {
             if (defaultVertShader && defaultFragShader)
             {
-                this.shaders = [ new WebGLShader(this, 'default', defaultVertShader, defaultFragShader, DeepCopy(defaultAttribs), DeepCopy(defaultUniforms)) ];
+                this.shaders = [ new WebGLShader(this, 'default', defaultVertShader, defaultFragShader, DeepCopy(defaultAttribs)) ];
             }
         }
         else
@@ -603,11 +601,10 @@ var WebGLPipeline = new Class({
                 var vertShader = GetFastValue(shaderEntry, vName, defaultVertShader);
                 var fragShader = Utils.parseFragmentShaderMaxTextures(GetFastValue(shaderEntry, fName, defaultFragShader), renderer.maxTextures);
                 var attributes = GetFastValue(shaderEntry, aName, defaultAttribs);
-                var uniforms = GetFastValue(shaderEntry, uName, defaultUniforms);
 
                 if (vertShader && fragShader)
                 {
-                    newShaders.push(new WebGLShader(this, name, vertShader, fragShader, DeepCopy(attributes), DeepCopy(uniforms)));
+                    newShaders.push(new WebGLShader(this, name, vertShader, fragShader, DeepCopy(attributes)));
                 }
             }
 
@@ -948,6 +945,9 @@ var WebGLPipeline = new Class({
      * This hook is called _after_ the quad (or tri) has been added to the batch, so you can safely
      * call 'flush' from within this.
      *
+     * Note that Game Objects may call `batchQuad` or `batchTri` multiple times for a single draw,
+     * for example the Graphics Game Object.
+     *
      * @method Phaser.Renderer.WebGL.WebGLPipeline#onBatch
      * @since 3.50.0
      *
@@ -989,7 +989,7 @@ var WebGLPipeline = new Class({
      * By default this is an empty method hook that you can override and use in your own custom pipelines.
      *
      * This method is called once per frame, right before anything has been rendered, but after the canvas
-     * has been cleared. If this pipeline has a render target, it will be cleared.
+     * has been cleared. If this pipeline has a render target, it will also have been cleared by this point.
      *
      * @method Phaser.Renderer.WebGL.WebGLPipeline#onPreRender
      * @since 3.50.0
@@ -1003,6 +1003,8 @@ var WebGLPipeline = new Class({
      *
      * This method is called _once per frame_, by every Camera in a Scene that wants to render.
      *
+     * It is called at the start of the rendering process, before anything has been drawn to the Camera.
+     *
      * @method Phaser.Renderer.WebGL.WebGLPipeline#onRender
      * @since 3.50.0
      *
@@ -1018,6 +1020,9 @@ var WebGLPipeline = new Class({
      *
      * This method is called _once per frame_, after all rendering has happened and snapshots have been taken.
      *
+     * It is called at the very end of the rendering process, once all Cameras, for all Scenes, have
+     * been rendered.
+     *
      * @method Phaser.Renderer.WebGL.WebGLPipeline#onPostRender
      * @since 3.50.0
      */
@@ -1031,7 +1036,7 @@ var WebGLPipeline = new Class({
      * This method is called every time this pipeline is asked to flush its batch.
      *
      * It is called immediately before the `gl.bufferData` and `gl.drawArray` calls are made, so you can
-     * perform any final pre-render modifications. To apply changes post-render, see `onPostBatch`.
+     * perform any final pre-render modifications. To apply changes post-render, see `onAfterFlush`.
      *
      * @method Phaser.Renderer.WebGL.WebGLPipeline#onBeforeFlush
      * @since 3.50.0

src/renderer/webgl/WebGLShader.js

@@ -22,13 +22,12 @@ var WEBGL_CONST = require('./const');
  * @param {string} vertexShader - The vertex shader source code as a single string.
  * @param {string} fragmentShader - The fragment shader source code as a single string.
  * @param {Phaser.Types.Renderer.WebGL.WebGLPipelineAttributesConfig[]} attributes - An array of attributes.
- * @param {string[]} [uniforms] - An array of shader uniform names that will be looked-up to get the locations for.
  */
 var WebGLShader = new Class({
 
     initialize:
 
-    function WebGLShader (pipeline, name, vertexShader, fragmentShader, attributes, uniforms)
+    function WebGLShader (pipeline, name, vertexShader, fragmentShader, attributes)
     {
         /**
          * A reference to the WebGLPipeline that owns this Shader.
@@ -120,11 +119,11 @@ var WebGLShader = new Class({
         this.vertexSize = 0;
 
         /**
-         * The uniforms that this shader requires, as set via the configuration object.
+         * The active uniforms that this shader has.
          *
-         * This is an object that maps the uniform names to their WebGL location.
+         * This is an object that maps the uniform names to their WebGL location and cached values.
          *
-         * It is populated with their locations via the `setUniformLocations` method.
+         * It is populated automatically via the `createUniforms` method.
          *
          * @name Phaser.Renderer.WebGL.WebGLShader#uniforms
          * @type {Phaser.Types.Renderer.WebGL.WebGLPipelineUniformsConfig}
@@ -133,11 +132,7 @@ var WebGLShader = new Class({
         this.uniforms = {};
 
         this.createAttributes(attributes);
-
-        if (uniforms)
-        {
-            this.setUniformLocations(uniforms);
-        }
+        this.createUniforms();
     },
 
     /**
@@ -325,38 +320,83 @@ var WebGLShader = new Class({
      * Sets up the `WebGLShader.uniforms` object, populating it with the names
      * and locations of the shader uniforms this shader requires.
      *
+     * It works by first calling `gl.getProgramParameter(program, gl.ACTIVE_UNIFORMS)` to
+     * find out how many active uniforms this shader has. It then iterates through them,
+     * calling `gl.getActiveUniform` to get the WebGL Active Info from each one. Finally,
+     * the name and location are stored in the local array.
+     *
      * This method is called automatically when this class is created.
      *
-     * @method Phaser.Renderer.WebGL.WebGLShader#setUniformLocations
+     * @method Phaser.Renderer.WebGL.WebGLShader#createUniforms
      * @since 3.50.0
      *
-     * @param {string[]} uniformNames - An array of the uniform names to get the locations for.
-     *
      * @return {this} This WebGLShader instance.
      */
-    setUniformLocations: function (uniformNames)
+    createUniforms: function ()
     {
         var gl = this.gl;
         var program = this.program;
         var uniforms = this.uniforms;
 
-        for (var i = 0; i < uniformNames.length; i++)
-        {
-            var name = uniformNames[i];
+        var i;
+        var name;
+        var location;
+
+        //  Look-up all active uniforms
 
-            var location = gl.getUniformLocation(program, name);
+        var totalUniforms = gl.getProgramParameter(program, gl.ACTIVE_UNIFORMS);
+
+        for (i = 0; i < totalUniforms; i++)
+        {
+            var info = gl.getActiveUniform(program, i);
 
-            if (location !== null)
+            if (info)
             {
-                uniforms[name] =
+                name = info.name;
+
+                location = gl.getUniformLocation(program, name);
+
+                if (location !== null)
+                {
+                    uniforms[name] =
+                    {
+                        name: name,
+                        location: location,
+                        value1: null,
+                        value2: null,
+                        value3: null,
+                        value4: null
+                    };
+                }
+
+                //  If the uniform name contains [] for an array struct,
+                //  we'll add an entry for the non-struct name as well.
+                //  Such as uMainSampler[12] = uMainSampler
+
+                var struct = name.indexOf('[');
+
+                if (struct > 0)
                 {
-                    name: name,
-                    location: location,
-                    value1: null,
-                    value2: null,
-                    value3: null,
-                    value4: null
-                };
+                    name = name.substr(0, struct);
+
+                    if (!uniforms.hasOwnProperty(name))
+                    {
+                        location = gl.getUniformLocation(program, name);
+
+                        if (location !== null)
+                        {
+                            uniforms[name] =
+                            {
+                                name: name,
+                                location: location,
+                                value1: null,
+                                value2: null,
+                                value3: null,
+                                value4: null
+                            };
+                        }
+                    }
+                }
             }
         }
 

src/renderer/webgl/typedefs/WebGLPipelineConfig.js

@@ -5,6 +5,5 @@
  * @property {string} [name] - The name of the shader. Doesn't have to be unique, but makes shader look-up easier if it is.
  * @property {string} [vertShader] - The source code, as a string, for the vertex shader. If not given, uses the `Phaser.Types.Renderer.WebGL.WebGLPipelineConfig.vertShader` property instead.
  * @property {string} [fragShader] - The source code, as a string, for the fragment shader. Can include `%count%` and `%forloop%` declarations for multi-texture support. If not given, uses the `Phaser.Types.Renderer.WebGL.WebGLPipelineConfig.fragShader` property instead.
- * @property {string[]} [uniforms] - An array of shader uniform names that will be looked-up to get the locations for. If not given, uses the `Phaser.Types.Renderer.WebGL.WebGLPipelineConfig.uniforms` property instead.
- * @property {Phaser.Types.Renderer.WebGL.WebGLPipelineAttributesConfig} [attributes] - An array of shader attribute data. All shaders bound to this pipeline must use the same attributes.
+  * @property {Phaser.Types.Renderer.WebGL.WebGLPipelineAttributesConfig} [attributes] - An array of shader attribute data. All shaders bound to this pipeline must use the same attributes.
  */