Additionnal decoupling

Tools/Gulp/config.json

@@ -116,7 +116,9 @@
             "environmentHelper",
             "particleHelper",
             "videoDome",
-            "photoDome"
+            "photoDome",
+            "behaviors",
+            "imageProcessing"            
         ],
         "minimal": [
             "freeCamera",
@@ -126,7 +128,13 @@
             "meshBuilder",
             "freeCamera",
             "hemisphericLight"
-        ]
+        ],
+        "360Viewer": [
+            "freeCamera",
+            "hemisphericLight",
+            "meshBuilder",
+            "picking"
+        ]      
     },
     "workloads": {
         "core": {
@@ -174,12 +182,7 @@
                 "../../src/Materials/babylon.uniformBuffer.js",
                 "../../src/Mesh/babylon.mesh.vertexData.js",
                 "../../src/Mesh/babylon.geometry.js",
-                "../../src/PostProcess/babylon.postProcessManager.js",
                 "../../src/Tools/babylon.performanceMonitor.js",
-                "../../src/Materials/babylon.imageProcessingConfiguration.js",
-                "../../src/Materials/Textures/babylon.colorGradingTexture.js",
-                "../../src/Materials/babylon.colorCurves.js",
-                "../../src/Behaviors/babylon.behavior.js",
                 "../../src/Materials/babylon.materialHelper.js",
                 "../../src/Materials/babylon.pushMaterial.js",
                 "../../src/Materials/babylon.standardMaterial.js"
@@ -219,7 +222,7 @@
                 "fresnelFunction",
                 "reflectionFunction",
                 "imageProcessingDeclaration",
-                "imageProcessingFunctions",
+                "imageProcessingFunctions",                
                 "bumpFragmentFunctions",
                 "clipPlaneFragmentDeclaration",
                 "fogFragmentDeclaration",
@@ -230,6 +233,24 @@
                 "fogFragment"
             ]
         },
+        "behaviors": {
+            "files": [
+                "../../src/Behaviors/babylon.behavior.js"
+            ],
+            "dependUpon": [
+                "core"
+            ]
+        },   
+        "imageProcessing": {
+            "files": [
+                "../../src/Materials/babylon.imageProcessingConfiguration.js",
+                "../../src/Materials/Textures/babylon.colorGradingTexture.js",
+                "../../src/Materials/babylon.colorCurves.js"
+            ],
+            "dependUpon": [
+                "core"
+            ]
+        },        
         "particles": {
             "files": [
                 "../../src/Particles/babylon.particle.js",
@@ -290,7 +311,7 @@
                 "../../src/Behaviors/Cameras/babylon.autoRotationBehavior.js"
             ],
             "dependUpon": [
-                "core"
+                "behaviors"
             ]
         },
         "meshBehaviors": {
@@ -298,7 +319,7 @@
                 "../../src/Behaviors/Mesh/babylon.pointerDragBehavior.js"
             ],
             "dependUpon": [
-                "core"
+                "behaviors"
             ]
         },
         "textureTools": {
@@ -680,6 +701,7 @@
         },
         "postProcesses": {
             "files": [
+                "../../src/PostProcess/babylon.postProcessManager.js",
                 "../../src/PostProcess/babylon.postProcess.js",
                 "../../src/PostProcess/babylon.passPostProcess.js"
             ],
@@ -853,7 +875,8 @@
                 "../../src/PostProcess/babylon.imageProcessingPostProcess.js"
             ],
             "dependUpon": [
-                "postProcesses"
+                "postProcesses",
+                "imageProcessing"
             ],
             "shaders": [
                 "imageProcessing.fragment"
@@ -879,7 +902,8 @@
                 "../../src/PostProcess/babylon.imageProcessingPostProcess.js"
             ],
             "dependUpon": [
-                "postProcesses"
+                "postProcesses",
+                "imageProcessing"
             ],
             "shaders": [
                 "refraction.fragment",

dist/preview release/gui/babylon.gui.d.ts

@@ -1944,6 +1944,8 @@ declare module BABYLON.GUI {
         constructor(name?: string | undefined);
         protected _getTypeName(): string;
         protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        /** Releases associated resources */
+        dispose(): void;
     }
 }
 
@@ -2539,3 +2541,19 @@ declare module BABYLON.GUI {
         private _sphericalMapping(source);
     }
 }
+
+
+declare module BABYLON.GUI {
+    /**
+     * Class used to create a container panel deployed on the surface of a cylinder
+     */
+    class CylinderPanel extends VolumeBasedPanel {
+        private _radius;
+        /**
+         * Gets or sets the radius of the cylinder where to project controls (5 by default)
+         */
+        radius: float;
+        protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
+        private _cylindricalMapping(source);
+    }
+}

dist/preview release/gui/babylon.gui.js

@@ -6778,6 +6778,14 @@ var BABYLON;
                 }
                 _super.prototype._additionalProcessing.call(this, parentMeasure, context);
             };
+            /** Releases associated resources */
+            Grid.prototype.dispose = function () {
+                _super.prototype.dispose.call(this);
+                for (var _i = 0, _a = this._childControls; _i < _a.length; _i++) {
+                    var control = _a[_i];
+                    control.dispose();
+                }
+            };
             return Grid;
         }(GUI.Container));
         GUI.Grid = Grid;
@@ -8505,7 +8513,7 @@ var BABYLON;
             __extends(SpherePanel, _super);
             function SpherePanel() {
                 var _this = _super !== null && _super.apply(this, arguments) || this;
-                _this._radius = 4.0;
+                _this._radius = 5.0;
                 return _this;
             }
             Object.defineProperty(SpherePanel.prototype, "radius", {
@@ -8563,6 +8571,76 @@ var BABYLON;
     })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
 })(BABYLON || (BABYLON = {}));
 
+/// <reference path="../../../../dist/preview release/babylon.d.ts"/>
+
+var BABYLON;
+(function (BABYLON) {
+    var GUI;
+    (function (GUI) {
+        /**
+         * Class used to create a container panel deployed on the surface of a cylinder
+         */
+        var CylinderPanel = /** @class */ (function (_super) {
+            __extends(CylinderPanel, _super);
+            function CylinderPanel() {
+                var _this = _super !== null && _super.apply(this, arguments) || this;
+                _this._radius = 5.0;
+                return _this;
+            }
+            Object.defineProperty(CylinderPanel.prototype, "radius", {
+                /**
+                 * Gets or sets the radius of the cylinder where to project controls (5 by default)
+                 */
+                get: function () {
+                    return this._radius;
+                },
+                set: function (value) {
+                    var _this = this;
+                    if (this._radius === value) {
+                        return;
+                    }
+                    this._radius = value;
+                    BABYLON.Tools.SetImmediate(function () {
+                        _this._arrangeChildren();
+                    });
+                },
+                enumerable: true,
+                configurable: true
+            });
+            CylinderPanel.prototype._mapGridNode = function (control, nodePosition) {
+                var newPos = this._cylindricalMapping(nodePosition);
+                var mesh = control.mesh;
+                if (!mesh) {
+                    return;
+                }
+                switch (this.orientation) {
+                    case GUI.Container3D.FACEORIGIN_ORIENTATION:
+                        mesh.lookAt(new BABYLON.Vector3(-newPos.x, 0, -newPos.z));
+                        break;
+                    case GUI.Container3D.FACEORIGINREVERSED_ORIENTATION:
+                        mesh.lookAt(new BABYLON.Vector3(newPos.x, 0, newPos.z));
+                        break;
+                    case GUI.Container3D.FACEFORWARD_ORIENTATION:
+                        mesh.lookAt(new BABYLON.Vector3(0, 0, 1));
+                        break;
+                    case GUI.Container3D.FACEFORWARDREVERSED_ORIENTATION:
+                        mesh.lookAt(new BABYLON.Vector3(0, 0, -1));
+                        break;
+                }
+                control.position = newPos;
+            };
+            CylinderPanel.prototype._cylindricalMapping = function (source) {
+                var newPos = new BABYLON.Vector3(0, source.y, this._radius);
+                var yAngle = (source.x / this._radius);
+                BABYLON.Matrix.RotationYawPitchRollToRef(yAngle, 0, 0, BABYLON.Tmp.Matrix[0]);
+                return BABYLON.Vector3.TransformNormal(newPos, BABYLON.Tmp.Matrix[0]);
+            };
+            return CylinderPanel;
+        }(GUI.VolumeBasedPanel));
+        GUI.CylinderPanel = CylinderPanel;
+    })(GUI = BABYLON.GUI || (BABYLON.GUI = {}));
+})(BABYLON || (BABYLON = {}));
+
     
 
     return BABYLON.GUI;

dist/preview release/gui/babylon.gui.module.d.ts

@@ -1949,6 +1949,8 @@ declare module BABYLON.GUI {
         constructor(name?: string | undefined);
         protected _getTypeName(): string;
         protected _additionalProcessing(parentMeasure: Measure, context: CanvasRenderingContext2D): void;
+        /** Releases associated resources */
+        dispose(): void;
     }
 }
 
@@ -2544,3 +2546,19 @@ declare module BABYLON.GUI {
         private _sphericalMapping(source);
     }
 }
+
+
+declare module BABYLON.GUI {
+    /**
+     * Class used to create a container panel deployed on the surface of a cylinder
+     */
+    class CylinderPanel extends VolumeBasedPanel {
+        private _radius;
+        /**
+         * Gets or sets the radius of the cylinder where to project controls (5 by default)
+         */
+        radius: float;
+        protected _mapGridNode(control: Control3D, nodePosition: Vector3): void;
+        private _cylindricalMapping(source);
+    }
+}

localDev/indexMini.html

@@ -0,0 +1,97 @@
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
+
+<head>
+    <title>Local Development</title>
+
+    <script src="../dist/preview%20release/babylon.max.js"></script>
+
+    <style>
+        html,
+        body {
+            width: 100%;
+            height: 100%;
+            padding: 0;
+            margin: 0;
+            overflow: hidden;
+        }
+
+        #renderCanvas {
+            width: 100%;
+            height: 100%;
+        }
+
+        #fps {
+            position: absolute;
+            background-color: black;
+            border: 2px solid red;
+            text-align: center;
+            font-size: 16px;
+            color: white;
+            top: 15px;
+            right: 10px;
+            width: 60px;
+            height: 20px;
+        }
+    </style>
+</head>
+
+<body>
+    <div id="fps">0</div>
+    <canvas id="renderCanvas" touch-action="none"></canvas>
+
+    <script>
+        var canvas = document.getElementById("renderCanvas");
+        var divFps = document.getElementById("fps");
+
+        // Global to simulate PG.
+        var engine = new BABYLON.Engine(canvas, true, { stencil: true, disableWebGL2Support: false, preserveDrawingBuffer: true });
+
+        if (BABYLON.Engine.isSupported()) {
+
+            // This creates a basic Babylon Scene object (non-mesh)
+            var scene = new BABYLON.Scene(engine);
+
+            // This creates and positions a free camera (non-mesh)
+            var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);
+
+            camera.attachControl(canvas, true);
+
+            // This targets the camera to scene origin
+            camera.setTarget(BABYLON.Vector3.Zero());
+
+            // This attaches the camera to the canvas
+            camera.attachControl(canvas, true);
+
+            // This creates a light, aiming 0,1,0 - to the sky (non-mesh)
+            var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);
+
+            // Default intensity is 1. Let's dim the light a small amount
+            light.intensity = 0.7;
+
+            // Our built-in 'sphere' shape. Params: name, subdivs, size, scene
+            var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);
+
+            // Move the sphere upward 1/2 its height
+            sphere.position.y = 1;
+
+            // Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
+            var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);            
+
+
+            engine.runRenderLoop(function () {
+                if (scene.activeCamera) {
+                    scene.render();
+                }
+                divFps.innerHTML = engine.getFps().toFixed() + " fps";
+            });
+        }
+
+        // Resize
+        window.addEventListener("resize", function () {
+            engine.resize();
+        });
+    </script>
+</body>
+
+</html>

src/Materials/Background/babylon.backgroundMaterial.ts

@@ -410,10 +410,12 @@
             }
 
             // Attaches observer.
-            this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
-                this._computePrimaryColorFromPerceptualColor();
-                this._markAllSubMeshesAsImageProcessingDirty();
-            });
+            if (this._imageProcessingConfiguration) {
+                this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
+                    this._computePrimaryColorFromPerceptualColor();
+                    this._markAllSubMeshesAsImageProcessingDirty();
+                });
+            }
         }
 
         /**
@@ -745,7 +747,7 @@
                 defines.USEHIGHLIGHTANDSHADOWCOLORS = !this._useRGBColor && (this._primaryColorShadowLevel !== 0 || this._primaryColorHighlightLevel !== 0);
             }
 
-            if (defines._areImageProcessingDirty) {
+            if (defines._areImageProcessingDirty && this._imageProcessingConfiguration) {
                 if (!this._imageProcessingConfiguration.isReady()) {
                     return false;
                 }
@@ -825,8 +827,10 @@
                 var samplers = ["diffuseSampler", "reflectionSampler", "reflectionSamplerLow", "reflectionSamplerHigh"];
                 var uniformBuffers = ["Material", "Scene"];
 
-                ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
-                ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+                if (ImageProcessingConfiguration) {
+                    ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
+                    ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+                }
 
                 MaterialHelper.PrepareUniformsAndSamplersList(<EffectCreationOptions>{
                     uniformsNames: uniforms,

src/Materials/PBR/babylon.pbrBaseMaterial.ts

@@ -525,9 +525,11 @@
             }
 
             // Attaches observer.
-            this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
-                this._markAllSubMeshesAsImageProcessingDirty();
-            });
+            if (this._imageProcessingConfiguration) {
+                this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
+                    this._markAllSubMeshesAsImageProcessingDirty();
+                });
+            }
         }
 
         /**
@@ -807,7 +809,7 @@
                 }
             }
 
-            if (defines._areImageProcessingDirty) {
+            if (defines._areImageProcessingDirty && this._imageProcessingConfiguration) {
                 if (!this._imageProcessingConfiguration.isReady()) {
                     return false;
                 }
@@ -983,8 +985,10 @@
                 "microSurfaceSampler", "environmentBrdfSampler"];
             var uniformBuffers = ["Material", "Scene"];
 
-            ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
-            ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+            if (ImageProcessingConfiguration) {
+                ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
+                ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+            }
 
             MaterialHelper.PrepareUniformsAndSamplersList(<EffectCreationOptions>{
                 uniformsNames: uniforms,
@@ -1231,7 +1235,7 @@
                 defines.SPECULARAA = scene.getEngine().getCaps().standardDerivatives && this._enableSpecularAntiAliasing;
             }
 
-            if (defines._areImageProcessingDirty) {
+            if (defines._areImageProcessingDirty && this._imageProcessingConfiguration) {
                 this._imageProcessingConfiguration.prepareDefines(defines);
             }
 

src/Materials/babylon.standardMaterial.ts

@@ -370,9 +370,11 @@ module BABYLON {
             }
 
             // Attaches observer.
-            this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
-                this._markAllSubMeshesAsImageProcessingDirty();
-            });
+            if (this._imageProcessingConfiguration) {
+                this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
+                    this._markAllSubMeshesAsImageProcessingDirty();
+                });
+            }
         }
 
         /**
@@ -735,7 +737,7 @@ module BABYLON {
                 defines.PREMULTIPLYALPHA = (this.alphaMode === Engine.ALPHA_PREMULTIPLIED || this.alphaMode === Engine.ALPHA_PREMULTIPLIED_PORTERDUFF);
             }
 
-            if (defines._areImageProcessingDirty) {
+            if (defines._areImageProcessingDirty && this._imageProcessingConfiguration) {
                 if (!this._imageProcessingConfiguration.isReady()) {
                     return false;
                 }
@@ -890,8 +892,10 @@ module BABYLON {
 
                 var uniformBuffers = ["Material", "Scene"];
 
-                ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
-                ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+                if (ImageProcessingConfiguration) {
+                    ImageProcessingConfiguration.PrepareUniforms(uniforms, defines);
+                    ImageProcessingConfiguration.PrepareSamplers(samplers, defines);
+                }
 
                 MaterialHelper.PrepareUniformsAndSamplersList(<EffectCreationOptions>{
                     uniformsNames: uniforms,
@@ -1223,7 +1227,7 @@ module BABYLON {
                 MaterialHelper.BindLogDepth(defines, effect, scene);
 
                 // image processing
-                if (!this._imageProcessingConfiguration.applyByPostProcess) {
+                if (this._imageProcessingConfiguration && !this._imageProcessingConfiguration.applyByPostProcess) {
                     this._imageProcessingConfiguration.bind(this._activeEffect);
                 }
             }

src/PostProcess/babylon.imageProcessingPostProcess.ts

@@ -65,9 +65,11 @@
             }
 
             // Attaches observer.
-            this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
-                this._updateParameters();
-            });
+            if (this._imageProcessingConfiguration) {
+                this._imageProcessingObserver = this._imageProcessingConfiguration.onUpdateParameters.add(conf => {
+                    this._updateParameters();
+                });
+            }
 
             // Ensure the effect will be rebuilt.
             if (!doNotBuild) {
@@ -350,10 +352,12 @@
             }
 
             var samplers = ["textureSampler"];
-            ImageProcessingConfiguration.PrepareSamplers(samplers, this._defines);
-
             var uniforms = ["scale"];
-            ImageProcessingConfiguration.PrepareUniforms(uniforms, this._defines);
+
+            if (ImageProcessingConfiguration) {
+                ImageProcessingConfiguration.PrepareSamplers(samplers, this._defines);
+                ImageProcessingConfiguration.PrepareUniforms(uniforms, this._defines);
+            }
 
             this.updateEffect(defines, uniforms, samplers);
         }
@@ -365,7 +369,9 @@
                 this._imageProcessingConfiguration.onUpdateParameters.remove(this._imageProcessingObserver);
             }
 
-            this.imageProcessingConfiguration.applyByPostProcess = false;
+            if (this._imageProcessingConfiguration) {
+                this.imageProcessingConfiguration.applyByPostProcess = false;
+            }
         }
     }
 }

src/babylon.scene.ts

@@ -1245,7 +1245,9 @@
 
             this._renderingManager = new RenderingManager(this);
 
-            this.postProcessManager = new PostProcessManager(this);
+            if (PostProcessManager) {
+                this.postProcessManager = new PostProcessManager(this);
+            }
 
             if (OutlineRenderer) {
                 this._outlineRenderer = new OutlineRenderer(this);
@@ -1266,8 +1268,10 @@
             // Uniform Buffer
             this._createUbo();
 
-            // Default Image processing definition.
-            this._imageProcessingConfiguration = new ImageProcessingConfiguration();
+            // Default Image processing definition
+            if (ImageProcessingConfiguration) {
+                this._imageProcessingConfiguration = new ImageProcessingConfiguration();
+            }
         }
 
         /**
@@ -4568,7 +4572,9 @@
             this.onAfterRenderTargetsRenderObservable.notifyObservers(this);
 
             // Prepare Frame
-            this.postProcessManager._prepareFrame();
+            if (this.postProcessManager) {
+                this.postProcessManager._prepareFrame();
+            }
 
             // Backgrounds
             var layerIndex;
@@ -4641,7 +4647,9 @@
             }
             
             // Finalize frame
-            this.postProcessManager._finalizeFrame(camera.isIntermediate);
+            if (this.postProcessManager) {
+                this.postProcessManager._finalizeFrame(camera.isIntermediate);
+            }
 
             // Reset some special arrays
             this._renderTargets.reset();