Updating configurations

Tools/Gulp/config.json

@@ -80,7 +80,8 @@
                 "../../src/Mesh/babylon.mesh.vertexData.js",
                 "../../src/Mesh/babylon.geometry.js",
                 "../../src/PostProcess/babylon.postProcessManager.js",
-                "../../src/Tools/babylon.performanceMonitor.js" 
+                "../../src/Tools/babylon.performanceMonitor.js",
+                "../../src/Rendering/babylon.OcclusionBoundingBoxRenderer.js"
             ]
         },         
         "particles" : 
@@ -94,7 +95,9 @@
             ],
             "shaders" : [
                 "particles.vertex",
-                "particles.fragment"
+                "particles.fragment",
+                "color.vertex",
+                "color.fragment"
             ]
         },       
         "cameraBehaviors" : 

dist/preview release/babylon.max.js

@@ -11780,12 +11780,14 @@ var BABYLON;
             _this.definedFacingForward = true; // orientation for POV movement & rotation
             _this.position = BABYLON.Vector3.Zero();
             _this._gl = _this.getEngine()._gl;
+            _this._webGLVersion = _this.getEngine().webGLVersion;
+            _this._occlusionInternalRetryCounter = 0;
             _this.occlusionType = AbstractMesh.OCCLUSION_TYPE_NO_VALUE;
             _this.occlusionRetryCount = -1;
-            _this.isOccluded = false;
+            _this._isOccluded = false;
             _this.occlusionQuery = _this._gl.createQuery();
             _this.isOcclusionQueryInProgress = false;
-            _this.occlusionQueryAlgorithmType = AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE;
+            _this._occlusionQueryAlgorithmType = _this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE;
             _this._rotation = BABYLON.Vector3.Zero();
             _this._scaling = BABYLON.Vector3.One();
             _this.billboardMode = AbstractMesh.BILLBOARDMODE_NONE;
@@ -11966,6 +11968,26 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
+        Object.defineProperty(AbstractMesh.prototype, "isOccluded", {
+            get: function () {
+                return this._isOccluded;
+            },
+            set: function (value) {
+                this._isOccluded = value;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        Object.defineProperty(AbstractMesh.prototype, "occlusionQueryAlgorithmType", {
+            get: function () {
+                return this._occlusionQueryAlgorithmType === this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE ? AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE : AbstractMesh.OCCLUSION_ALGORITHM_TYPE_ACCURATE;
+            },
+            set: function (alogrithmType) {
+                this._occlusionQueryAlgorithmType = alogrithmType === AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
+            },
+            enumerable: true,
+            configurable: true
+        });
         Object.defineProperty(AbstractMesh.prototype, "material", {
             get: function () {
                 return this._material;
@@ -13400,6 +13422,9 @@ var BABYLON;
             this.onAfterWorldMatrixUpdateObservable.clear();
             this.onCollideObservable.clear();
             this.onCollisionPositionChangeObservable.clear();
+            if (this._occlusionBoundingBoxRenderer) {
+                this._occlusionBoundingBoxRenderer.dispose();
+            }
             this._isDisposed = true;
             _super.prototype.dispose.call(this);
         };
@@ -13808,6 +13833,43 @@ var BABYLON;
             BABYLON.VertexData.ComputeNormals(positions, indices, normals, { useRightHandedSystem: this.getScene().useRightHandedSystem });
             this.setVerticesData(BABYLON.VertexBuffer.NormalKind, normals, updatable);
         };
+        AbstractMesh.prototype.checkOcclusionQuery = function () {
+            if (this._webGLVersion < 2 || this.occlusionType === AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
+                this._isOccluded = false;
+                return;
+            }
+            if (!this._occlusionBoundingBoxRenderer) {
+                var scene = this.getScene();
+                this._occlusionBoundingBoxRenderer = new BABYLON.OcclusionBoundingBoxRenderer(scene);
+            }
+            if (this.isOcclusionQueryInProgress) {
+                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
+                if (isOcclusionQueryAvailable) {
+                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
+                    this.isOcclusionQueryInProgress = false;
+                    this._occlusionInternalRetryCounter = 0;
+                    this._isOccluded = occlusionQueryResult === 1 ? false : true;
+                }
+                else {
+                    this._occlusionInternalRetryCounter++;
+                    if (this.occlusionRetryCount !== -1 && this._occlusionInternalRetryCounter > this.occlusionRetryCount) {
+                        // break;
+                        this.isOcclusionQueryInProgress = false;
+                        this._occlusionInternalRetryCounter = 0;
+                        // if optimistic set isOccluded to false regardless of the status of isOccluded. (Render in the current render loop)
+                        // if strict continue the last state of the object.
+                        this._isOccluded = this.occlusionType === AbstractMesh.OCCLUSION_TYPE_OPTIMISITC ? false : this._isOccluded;
+                    }
+                    else {
+                        return;
+                    }
+                }
+            }
+            this._gl.beginQuery(this._occlusionQueryAlgorithmType, this.occlusionQuery);
+            this._occlusionBoundingBoxRenderer.render(this);
+            this._gl.endQuery(this._occlusionQueryAlgorithmType);
+            this.isOcclusionQueryInProgress = true;
+        };
         // Statics
         AbstractMesh._BILLBOARDMODE_NONE = 0;
         AbstractMesh._BILLBOARDMODE_X = 1;
@@ -20451,72 +20513,6 @@ var BABYLON;
         return _InstancesBatch;
     }());
     BABYLON._InstancesBatch = _InstancesBatch;
-    var OcclusionBoundingBoxRenderer = (function () {
-        function OcclusionBoundingBoxRenderer(scene) {
-            this.frontColor = new BABYLON.Color3(1, 1, 1);
-            this.backColor = new BABYLON.Color3(0.1, 0.1, 0.1);
-            this._vertexBuffers = {};
-            this._scene = scene;
-        }
-        OcclusionBoundingBoxRenderer.prototype._prepareRessources = function () {
-            if (this._colorShader) {
-                return;
-            }
-            this._colorShader = new BABYLON.ShaderMaterial("colorShader", this._scene, "color", {
-                attributes: [BABYLON.VertexBuffer.PositionKind],
-                uniforms: ["world", "viewProjection", "color"]
-            });
-            var engine = this._scene.getEngine();
-            var boxdata = BABYLON.VertexData.CreateBox({ size: 1.0 });
-            this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = new BABYLON.VertexBuffer(engine, boxdata.positions, BABYLON.VertexBuffer.PositionKind, false);
-            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
-        };
-        OcclusionBoundingBoxRenderer.prototype.render = function (mesh) {
-            this._prepareRessources();
-            if (!this._colorShader.isReady()) {
-                return;
-            }
-            var engine = this._scene.getEngine();
-            engine.setDepthWrite(false);
-            engine.setColorWrite(false);
-            this._colorShader._preBind();
-            var boundingBox = mesh._boundingInfo.boundingBox;
-            var min = boundingBox.minimum;
-            var max = boundingBox.maximum;
-            var diff = max.subtract(min);
-            var median = min.add(diff.scale(0.5));
-            var worldMatrix = BABYLON.Matrix.Scaling(diff.x, diff.y, diff.z)
-                .multiply(BABYLON.Matrix.Translation(median.x, median.y, median.z))
-                .multiply(boundingBox.getWorldMatrix());
-            // VBOs
-            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
-            // Front
-            engine.setDepthFunctionToLess();
-            this._scene.resetCachedMaterial();
-            this._colorShader.setColor4("color", this.frontColor.toColor4());
-            this._colorShader.bind(worldMatrix);
-            // Draw order
-            engine.draw(false, 0, 24);
-            this._colorShader.unbind();
-            engine.setDepthFunctionToLessOrEqual();
-            engine.setDepthWrite(true);
-            engine.setColorWrite(true);
-        };
-        OcclusionBoundingBoxRenderer.prototype.dispose = function () {
-            if (!this._colorShader) {
-                return;
-            }
-            this._colorShader.dispose();
-            var buffer = this._vertexBuffers[BABYLON.VertexBuffer.PositionKind];
-            if (buffer) {
-                buffer.dispose();
-                this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = null;
-            }
-            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
-        };
-        return OcclusionBoundingBoxRenderer;
-    }());
-    BABYLON.OcclusionBoundingBoxRenderer = OcclusionBoundingBoxRenderer;
     var Mesh = (function (_super) {
         __extends(Mesh, _super);
         /**
@@ -21522,65 +21518,15 @@ var BABYLON;
             }
             return this;
         };
-        Mesh.prototype.renderOcclusionBoundingMesh = function () {
-            var scene = this.getScene();
-            if (!this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer = new OcclusionBoundingBoxRenderer(scene);
-            }
-            if (this.isOcclusionQueryInProgress) {
-                console.log("Enter occlusion check");
-                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
-                console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-                if (isOcclusionQueryAvailable) {
-                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
-                    console.log("occlusionQueryResult " + occlusionQueryResult);
-                    this.isOccluded = true;
-                    this.isOcclusionQueryInProgress = false;
-                    if (occlusionQueryResult === 1) {
-                        this.isOccluded = false;
-                        return true;
-                    }
-                }
-                else {
-                    return false;
-                }
-            }
-            console.log("Enter Draw Bound");
-            var occlusionAlgorithmType = this.occlusionQueryAlgorithmType == BABYLON.AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
-            this._gl.beginQuery(occlusionAlgorithmType, this.occlusionQuery);
-            this._occlusionBoundingBoxRenderer.render(this);
-            this._gl.endQuery(occlusionAlgorithmType);
-            this.isOcclusionQueryInProgress = true;
-            var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
-            console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-            if (isOcclusionQueryAvailable) {
-                var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
-                console.log("occlusionQueryResult " + occlusionQueryResult);
-                this.isOccluded = true;
-                this.isOcclusionQueryInProgress = false;
-                if (occlusionQueryResult === 1) {
-                    this.isOccluded = false;
-                    return true;
-                }
-            }
-            else {
-                return false;
-            }
-            return false;
-        };
         /**
          * Triggers the draw call for the mesh.
          * Usually, you don't need to call this method by your own because the mesh rendering is handled by the scene rendering manager.
          * Returns the Mesh.
          */
         Mesh.prototype.render = function (subMesh, enableAlphaMode) {
-            // check occlusion query in progress
-            if (this.occlusionType !== BABYLON.AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
-                var isRenderMesh = this.renderOcclusionBoundingMesh();
-                if (!isRenderMesh) {
-                    return;
-                }
-                console.log("Enter Draw Mesh");
+            this.checkOcclusionQuery();
+            if (this._isOccluded) {
+                return;
             }
             var scene = this.getScene();
             // Managing instances
@@ -21893,9 +21839,6 @@ var BABYLON;
                 this._instancesBuffer.dispose();
                 this._instancesBuffer = null;
             }
-            if (this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer.dispose();
-            }
             while (this.instances.length) {
                 this.instances[0].dispose();
             }
@@ -29710,6 +29653,72 @@ var BABYLON;
 
 //# sourceMappingURL=babylon.performanceMonitor.js.map
 
+var BABYLON;
+(function (BABYLON) {
+    var OcclusionBoundingBoxRenderer = (function () {
+        function OcclusionBoundingBoxRenderer(scene) {
+            this._vertexBuffers = {};
+            this._scene = scene;
+        }
+        OcclusionBoundingBoxRenderer.prototype._prepareRessources = function () {
+            if (this._colorShader) {
+                return;
+            }
+            this._colorShader = new BABYLON.ShaderMaterial("colorShader", this._scene, "color", {
+                attributes: [BABYLON.VertexBuffer.PositionKind],
+                uniforms: ["world", "viewProjection", "color"]
+            });
+            var engine = this._scene.getEngine();
+            var boxdata = BABYLON.VertexData.CreateBox({ size: 1.0 });
+            this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = new BABYLON.VertexBuffer(engine, boxdata.positions, BABYLON.VertexBuffer.PositionKind, false);
+            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
+        };
+        OcclusionBoundingBoxRenderer.prototype.render = function (mesh) {
+            this._prepareRessources();
+            if (!this._colorShader.isReady()) {
+                return;
+            }
+            var engine = this._scene.getEngine();
+            engine.setDepthWrite(false);
+            engine.setColorWrite(false);
+            this._colorShader._preBind();
+            var boundingBox = mesh._boundingInfo.boundingBox;
+            var min = boundingBox.minimum;
+            var max = boundingBox.maximum;
+            var diff = max.subtract(min);
+            var median = min.add(diff.scale(0.5));
+            var worldMatrix = BABYLON.Matrix.Scaling(diff.x, diff.y, diff.z)
+                .multiply(BABYLON.Matrix.Translation(median.x, median.y, median.z))
+                .multiply(boundingBox.getWorldMatrix());
+            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
+            engine.setDepthFunctionToLess();
+            this._scene.resetCachedMaterial();
+            this._colorShader.bind(worldMatrix);
+            engine.draw(false, 0, 24);
+            this._colorShader.unbind();
+            engine.setDepthFunctionToLessOrEqual();
+            engine.setDepthWrite(true);
+            engine.setColorWrite(true);
+        };
+        OcclusionBoundingBoxRenderer.prototype.dispose = function () {
+            if (!this._colorShader) {
+                return;
+            }
+            this._colorShader.dispose();
+            var buffer = this._vertexBuffers[BABYLON.VertexBuffer.PositionKind];
+            if (buffer) {
+                buffer.dispose();
+                this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = null;
+            }
+            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
+        };
+        return OcclusionBoundingBoxRenderer;
+    }());
+    BABYLON.OcclusionBoundingBoxRenderer = OcclusionBoundingBoxRenderer;
+})(BABYLON || (BABYLON = {}));
+
+//# sourceMappingURL=babylon.occlusionBoundingBoxRenderer.js.map
+
 
 
 

dist/preview release/customConfigurations/minimalGLTFViewer/babylon.max.js

@@ -11780,12 +11780,14 @@ var BABYLON;
             _this.definedFacingForward = true; // orientation for POV movement & rotation
             _this.position = BABYLON.Vector3.Zero();
             _this._gl = _this.getEngine()._gl;
+            _this._webGLVersion = _this.getEngine().webGLVersion;
+            _this._occlusionInternalRetryCounter = 0;
             _this.occlusionType = AbstractMesh.OCCLUSION_TYPE_NO_VALUE;
             _this.occlusionRetryCount = -1;
-            _this.isOccluded = false;
+            _this._isOccluded = false;
             _this.occlusionQuery = _this._gl.createQuery();
             _this.isOcclusionQueryInProgress = false;
-            _this.occlusionQueryAlgorithmType = AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE;
+            _this._occlusionQueryAlgorithmType = _this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE;
             _this._rotation = BABYLON.Vector3.Zero();
             _this._scaling = BABYLON.Vector3.One();
             _this.billboardMode = AbstractMesh.BILLBOARDMODE_NONE;
@@ -11966,6 +11968,26 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
+        Object.defineProperty(AbstractMesh.prototype, "isOccluded", {
+            get: function () {
+                return this._isOccluded;
+            },
+            set: function (value) {
+                this._isOccluded = value;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        Object.defineProperty(AbstractMesh.prototype, "occlusionQueryAlgorithmType", {
+            get: function () {
+                return this._occlusionQueryAlgorithmType === this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE ? AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE : AbstractMesh.OCCLUSION_ALGORITHM_TYPE_ACCURATE;
+            },
+            set: function (alogrithmType) {
+                this._occlusionQueryAlgorithmType = alogrithmType === AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
+            },
+            enumerable: true,
+            configurable: true
+        });
         Object.defineProperty(AbstractMesh.prototype, "material", {
             get: function () {
                 return this._material;
@@ -13400,6 +13422,9 @@ var BABYLON;
             this.onAfterWorldMatrixUpdateObservable.clear();
             this.onCollideObservable.clear();
             this.onCollisionPositionChangeObservable.clear();
+            if (this._occlusionBoundingBoxRenderer) {
+                this._occlusionBoundingBoxRenderer.dispose();
+            }
             this._isDisposed = true;
             _super.prototype.dispose.call(this);
         };
@@ -13808,6 +13833,43 @@ var BABYLON;
             BABYLON.VertexData.ComputeNormals(positions, indices, normals, { useRightHandedSystem: this.getScene().useRightHandedSystem });
             this.setVerticesData(BABYLON.VertexBuffer.NormalKind, normals, updatable);
         };
+        AbstractMesh.prototype.checkOcclusionQuery = function () {
+            if (this._webGLVersion < 2 || this.occlusionType === AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
+                this._isOccluded = false;
+                return;
+            }
+            if (!this._occlusionBoundingBoxRenderer) {
+                var scene = this.getScene();
+                this._occlusionBoundingBoxRenderer = new BABYLON.OcclusionBoundingBoxRenderer(scene);
+            }
+            if (this.isOcclusionQueryInProgress) {
+                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
+                if (isOcclusionQueryAvailable) {
+                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
+                    this.isOcclusionQueryInProgress = false;
+                    this._occlusionInternalRetryCounter = 0;
+                    this._isOccluded = occlusionQueryResult === 1 ? false : true;
+                }
+                else {
+                    this._occlusionInternalRetryCounter++;
+                    if (this.occlusionRetryCount !== -1 && this._occlusionInternalRetryCounter > this.occlusionRetryCount) {
+                        // break;
+                        this.isOcclusionQueryInProgress = false;
+                        this._occlusionInternalRetryCounter = 0;
+                        // if optimistic set isOccluded to false regardless of the status of isOccluded. (Render in the current render loop)
+                        // if strict continue the last state of the object.
+                        this._isOccluded = this.occlusionType === AbstractMesh.OCCLUSION_TYPE_OPTIMISITC ? false : this._isOccluded;
+                    }
+                    else {
+                        return;
+                    }
+                }
+            }
+            this._gl.beginQuery(this._occlusionQueryAlgorithmType, this.occlusionQuery);
+            this._occlusionBoundingBoxRenderer.render(this);
+            this._gl.endQuery(this._occlusionQueryAlgorithmType);
+            this.isOcclusionQueryInProgress = true;
+        };
         // Statics
         AbstractMesh._BILLBOARDMODE_NONE = 0;
         AbstractMesh._BILLBOARDMODE_X = 1;
@@ -20451,72 +20513,6 @@ var BABYLON;
         return _InstancesBatch;
     }());
     BABYLON._InstancesBatch = _InstancesBatch;
-    var OcclusionBoundingBoxRenderer = (function () {
-        function OcclusionBoundingBoxRenderer(scene) {
-            this.frontColor = new BABYLON.Color3(1, 1, 1);
-            this.backColor = new BABYLON.Color3(0.1, 0.1, 0.1);
-            this._vertexBuffers = {};
-            this._scene = scene;
-        }
-        OcclusionBoundingBoxRenderer.prototype._prepareRessources = function () {
-            if (this._colorShader) {
-                return;
-            }
-            this._colorShader = new BABYLON.ShaderMaterial("colorShader", this._scene, "color", {
-                attributes: [BABYLON.VertexBuffer.PositionKind],
-                uniforms: ["world", "viewProjection", "color"]
-            });
-            var engine = this._scene.getEngine();
-            var boxdata = BABYLON.VertexData.CreateBox({ size: 1.0 });
-            this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = new BABYLON.VertexBuffer(engine, boxdata.positions, BABYLON.VertexBuffer.PositionKind, false);
-            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
-        };
-        OcclusionBoundingBoxRenderer.prototype.render = function (mesh) {
-            this._prepareRessources();
-            if (!this._colorShader.isReady()) {
-                return;
-            }
-            var engine = this._scene.getEngine();
-            engine.setDepthWrite(false);
-            engine.setColorWrite(false);
-            this._colorShader._preBind();
-            var boundingBox = mesh._boundingInfo.boundingBox;
-            var min = boundingBox.minimum;
-            var max = boundingBox.maximum;
-            var diff = max.subtract(min);
-            var median = min.add(diff.scale(0.5));
-            var worldMatrix = BABYLON.Matrix.Scaling(diff.x, diff.y, diff.z)
-                .multiply(BABYLON.Matrix.Translation(median.x, median.y, median.z))
-                .multiply(boundingBox.getWorldMatrix());
-            // VBOs
-            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
-            // Front
-            engine.setDepthFunctionToLess();
-            this._scene.resetCachedMaterial();
-            this._colorShader.setColor4("color", this.frontColor.toColor4());
-            this._colorShader.bind(worldMatrix);
-            // Draw order
-            engine.draw(false, 0, 24);
-            this._colorShader.unbind();
-            engine.setDepthFunctionToLessOrEqual();
-            engine.setDepthWrite(true);
-            engine.setColorWrite(true);
-        };
-        OcclusionBoundingBoxRenderer.prototype.dispose = function () {
-            if (!this._colorShader) {
-                return;
-            }
-            this._colorShader.dispose();
-            var buffer = this._vertexBuffers[BABYLON.VertexBuffer.PositionKind];
-            if (buffer) {
-                buffer.dispose();
-                this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = null;
-            }
-            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
-        };
-        return OcclusionBoundingBoxRenderer;
-    }());
-    BABYLON.OcclusionBoundingBoxRenderer = OcclusionBoundingBoxRenderer;
     var Mesh = (function (_super) {
         __extends(Mesh, _super);
         /**
@@ -21522,65 +21518,15 @@ var BABYLON;
             }
             return this;
         };
-        Mesh.prototype.renderOcclusionBoundingMesh = function () {
-            var scene = this.getScene();
-            if (!this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer = new OcclusionBoundingBoxRenderer(scene);
-            }
-            if (this.isOcclusionQueryInProgress) {
-                console.log("Enter occlusion check");
-                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
-                console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-                if (isOcclusionQueryAvailable) {
-                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
-                    console.log("occlusionQueryResult " + occlusionQueryResult);
-                    this.isOccluded = true;
-                    this.isOcclusionQueryInProgress = false;
-                    if (occlusionQueryResult === 1) {
-                        this.isOccluded = false;
-                        return true;
-                    }
-                }
-                else {
-                    return false;
-                }
-            }
-            console.log("Enter Draw Bound");
-            var occlusionAlgorithmType = this.occlusionQueryAlgorithmType == BABYLON.AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
-            this._gl.beginQuery(occlusionAlgorithmType, this.occlusionQuery);
-            this._occlusionBoundingBoxRenderer.render(this);
-            this._gl.endQuery(occlusionAlgorithmType);
-            this.isOcclusionQueryInProgress = true;
-            var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE);
-            console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-            if (isOcclusionQueryAvailable) {
-                var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT);
-                console.log("occlusionQueryResult " + occlusionQueryResult);
-                this.isOccluded = true;
-                this.isOcclusionQueryInProgress = false;
-                if (occlusionQueryResult === 1) {
-                    this.isOccluded = false;
-                    return true;
-                }
-            }
-            else {
-                return false;
-            }
-            return false;
-        };
         /**
          * Triggers the draw call for the mesh.
          * Usually, you don't need to call this method by your own because the mesh rendering is handled by the scene rendering manager.
          * Returns the Mesh.
          */
         Mesh.prototype.render = function (subMesh, enableAlphaMode) {
-            // check occlusion query in progress
-            if (this.occlusionType !== BABYLON.AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
-                var isRenderMesh = this.renderOcclusionBoundingMesh();
-                if (!isRenderMesh) {
-                    return;
-                }
-                console.log("Enter Draw Mesh");
+            this.checkOcclusionQuery();
+            if (this._isOccluded) {
+                return;
             }
             var scene = this.getScene();
             // Managing instances
@@ -21893,9 +21839,6 @@ var BABYLON;
                 this._instancesBuffer.dispose();
                 this._instancesBuffer = null;
             }
-            if (this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer.dispose();
-            }
             while (this.instances.length) {
                 this.instances[0].dispose();
             }
@@ -29712,6 +29655,72 @@ var BABYLON;
 
 var BABYLON;
 (function (BABYLON) {
+    var OcclusionBoundingBoxRenderer = (function () {
+        function OcclusionBoundingBoxRenderer(scene) {
+            this._vertexBuffers = {};
+            this._scene = scene;
+        }
+        OcclusionBoundingBoxRenderer.prototype._prepareRessources = function () {
+            if (this._colorShader) {
+                return;
+            }
+            this._colorShader = new BABYLON.ShaderMaterial("colorShader", this._scene, "color", {
+                attributes: [BABYLON.VertexBuffer.PositionKind],
+                uniforms: ["world", "viewProjection", "color"]
+            });
+            var engine = this._scene.getEngine();
+            var boxdata = BABYLON.VertexData.CreateBox({ size: 1.0 });
+            this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = new BABYLON.VertexBuffer(engine, boxdata.positions, BABYLON.VertexBuffer.PositionKind, false);
+            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
+        };
+        OcclusionBoundingBoxRenderer.prototype.render = function (mesh) {
+            this._prepareRessources();
+            if (!this._colorShader.isReady()) {
+                return;
+            }
+            var engine = this._scene.getEngine();
+            engine.setDepthWrite(false);
+            engine.setColorWrite(false);
+            this._colorShader._preBind();
+            var boundingBox = mesh._boundingInfo.boundingBox;
+            var min = boundingBox.minimum;
+            var max = boundingBox.maximum;
+            var diff = max.subtract(min);
+            var median = min.add(diff.scale(0.5));
+            var worldMatrix = BABYLON.Matrix.Scaling(diff.x, diff.y, diff.z)
+                .multiply(BABYLON.Matrix.Translation(median.x, median.y, median.z))
+                .multiply(boundingBox.getWorldMatrix());
+            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
+            engine.setDepthFunctionToLess();
+            this._scene.resetCachedMaterial();
+            this._colorShader.bind(worldMatrix);
+            engine.draw(false, 0, 24);
+            this._colorShader.unbind();
+            engine.setDepthFunctionToLessOrEqual();
+            engine.setDepthWrite(true);
+            engine.setColorWrite(true);
+        };
+        OcclusionBoundingBoxRenderer.prototype.dispose = function () {
+            if (!this._colorShader) {
+                return;
+            }
+            this._colorShader.dispose();
+            var buffer = this._vertexBuffers[BABYLON.VertexBuffer.PositionKind];
+            if (buffer) {
+                buffer.dispose();
+                this._vertexBuffers[BABYLON.VertexBuffer.PositionKind] = null;
+            }
+            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
+        };
+        return OcclusionBoundingBoxRenderer;
+    }());
+    BABYLON.OcclusionBoundingBoxRenderer = OcclusionBoundingBoxRenderer;
+})(BABYLON || (BABYLON = {}));
+
+//# sourceMappingURL=babylon.occlusionBoundingBoxRenderer.js.map
+
+var BABYLON;
+(function (BABYLON) {
     var AnimationRange = (function () {
         function AnimationRange(name, from, to) {
             this.name = name;

src/Mesh/babylon.abstractMesh.ts

@@ -127,13 +127,32 @@
         // Properties
         public definedFacingForward = true; // orientation for POV movement & rotation
         public position = Vector3.Zero();
-        protected _gl = this.getEngine()._gl;
+
+        private _occlusionBoundingBoxRenderer: OcclusionBoundingBoxRenderer;
+        private _gl = this.getEngine()._gl;
+        private _webGLVersion = this.getEngine().webGLVersion;
+        private _occlusionInternalRetryCounter = 0;
         public occlusionType = AbstractMesh.OCCLUSION_TYPE_NO_VALUE;
         public occlusionRetryCount = -1;
-        public isOccluded = false;
+        protected _isOccluded = false;
+        get isOccluded(): boolean {
+            return this._isOccluded;
+        }
+        set isOccluded(value: boolean) {
+            this._isOccluded = value;
+        }
+
         public occlusionQuery = this._gl.createQuery();
         public isOcclusionQueryInProgress = false;
-        public occlusionQueryAlgorithmType= AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE;
+
+        private _occlusionQueryAlgorithmType: number = this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE;
+        get occlusionQueryAlgorithmType(): number {
+            return this._occlusionQueryAlgorithmType === this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE ? AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE : AbstractMesh.OCCLUSION_ALGORITHM_TYPE_ACCURATE;
+        }
+        set occlusionQueryAlgorithmType(alogrithmType: number) {
+            this._occlusionQueryAlgorithmType = alogrithmType === AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
+        }
+
         private _rotation = Vector3.Zero();
         private _rotationQuaternion: Quaternion;
         private _scaling = Vector3.One();
@@ -1815,6 +1834,10 @@
             this.onCollideObservable.clear();
             this.onCollisionPositionChangeObservable.clear();
 
+            if (this._occlusionBoundingBoxRenderer) {
+                this._occlusionBoundingBoxRenderer.dispose();
+            }
+
             this._isDisposed = true;
 
             super.dispose();
@@ -2259,5 +2282,51 @@
             this.setVerticesData(VertexBuffer.NormalKind, normals, updatable);
         }
 
+        protected checkOcclusionQuery() {
+            if (this._webGLVersion < 2 || this.occlusionType === AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
+                this._isOccluded = false;
+                return;
+            }
+
+            if (!this._occlusionBoundingBoxRenderer) {
+                var scene = this.getScene();
+                this._occlusionBoundingBoxRenderer = new OcclusionBoundingBoxRenderer(scene);
+            }
+
+            if (this.isOcclusionQueryInProgress) {
+                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE) as boolean;
+                if (isOcclusionQueryAvailable) {
+                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT) as number;
+
+                    this.isOcclusionQueryInProgress = false;
+                    this._occlusionInternalRetryCounter = 0;
+                    this._isOccluded = occlusionQueryResult === 1 ? false : true;
+                }
+                else {
+
+                    this._occlusionInternalRetryCounter++;
+
+                    if (this.occlusionRetryCount !== -1 && this._occlusionInternalRetryCounter > this.occlusionRetryCount) {
+                        // break;
+                        this.isOcclusionQueryInProgress = false;
+                        this._occlusionInternalRetryCounter = 0;
+
+                        // if optimistic set isOccluded to false regardless of the status of isOccluded. (Render in the current render loop)
+                        // if strict continue the last state of the object.
+                        this._isOccluded = this.occlusionType === AbstractMesh.OCCLUSION_TYPE_OPTIMISITC ? false : this._isOccluded;
+                    }
+                    else {
+                        return;
+                    }
+
+                }
+            }
+
+            this._gl.beginQuery(this._occlusionQueryAlgorithmType, this.occlusionQuery);
+            this._occlusionBoundingBoxRenderer.render(this);
+            this._gl.endQuery(this._occlusionQueryAlgorithmType);
+            this.isOcclusionQueryInProgress = true;
+        }
+
     }
 }

src/Mesh/babylon.mesh.ts

@@ -5,94 +5,6 @@
         public renderSelf = new Array<boolean>();
     }
 
-    export class OcclusionBoundingBoxRenderer {
-        public frontColor = new Color3(1, 1, 1);
-        public backColor = new Color3(0.1, 0.1, 0.1);
-
-        private _scene: Scene;
-        private _colorShader: ShaderMaterial;
-        private _vertexBuffers: { [key: string]: VertexBuffer } = {};
-        private _indexBuffer: WebGLBuffer;
-
-        constructor(scene: Scene) {
-            this._scene = scene;
-        }
-
-        private _prepareRessources(): void {
-            if (this._colorShader) {
-                return;
-            }
-
-            this._colorShader = new ShaderMaterial("colorShader", this._scene, "color",
-                {
-                    attributes: [VertexBuffer.PositionKind],
-                    uniforms: ["world", "viewProjection", "color"]
-                });
-
-
-            var engine = this._scene.getEngine();
-            var boxdata = VertexData.CreateBox({ size: 1.0 });
-            this._vertexBuffers[VertexBuffer.PositionKind] = new VertexBuffer(engine, boxdata.positions, VertexBuffer.PositionKind, false);
-            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
-        }
-
-        public render(mesh: Mesh): void {
-
-            this._prepareRessources();
-
-            if (!this._colorShader.isReady()) {
-                return;
-            }
-
-            var engine = this._scene.getEngine();
-            engine.setDepthWrite(false);
-            engine.setColorWrite(false);
-            this._colorShader._preBind();
-
-            var boundingBox = mesh._boundingInfo.boundingBox;
-            var min = boundingBox.minimum;
-            var max = boundingBox.maximum;
-            var diff = max.subtract(min);
-            var median = min.add(diff.scale(0.5));
-
-            var worldMatrix = Matrix.Scaling(diff.x, diff.y, diff.z)
-                .multiply(Matrix.Translation(median.x, median.y, median.z))
-                .multiply(boundingBox.getWorldMatrix());
-
-            // VBOs
-            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
-
-            // Front
-            engine.setDepthFunctionToLess();
-            this._scene.resetCachedMaterial();
-            this._colorShader.setColor4("color", this.frontColor.toColor4());
-            this._colorShader.bind(worldMatrix);
-
-            // Draw order
-            engine.draw(false, 0, 24);
-
-            this._colorShader.unbind();
-            engine.setDepthFunctionToLessOrEqual();
-            engine.setDepthWrite(true);
-            engine.setColorWrite(true);
-        }
-
-        public dispose(): void {
-            if (!this._colorShader) {
-                return;
-            }
-
-            this._colorShader.dispose();
-
-            var buffer = this._vertexBuffers[VertexBuffer.PositionKind];
-            if (buffer) {
-                buffer.dispose();
-                this._vertexBuffers[VertexBuffer.PositionKind] = null;
-            }
-            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
-        }
-    }
-
     export class Mesh extends AbstractMesh implements IGetSetVerticesData {
         // Consts
         public static _FRONTSIDE: number = 0;
@@ -224,8 +136,6 @@
         private _sourcePositions: Float32Array; // Will be used to save original positions when using software skinning
         private _sourceNormals: Float32Array;   // Will be used to save original normals when using software skinning
 
-        private _occlusionBoundingBoxRenderer: OcclusionBoundingBoxRenderer;
-
         // Will be used to save a source mesh reference, If any
         private _source: BABYLON.Mesh = null;
         public get source(): BABYLON.Mesh {
@@ -1191,64 +1101,6 @@
             return this;
         }
 
-        private renderOcclusionBoundingMesh() {
-
-            var scene = this.getScene();
-            if (!this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer = new OcclusionBoundingBoxRenderer(scene);
-            }
-
-            if (this.isOcclusionQueryInProgress) {
-
-                console.log("Enter occlusion check");
-                var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE) as boolean;
-                console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-                if (isOcclusionQueryAvailable) {
-                    var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT) as number;
-                    console.log("occlusionQueryResult " + occlusionQueryResult);
-
-                    this.isOccluded = true;
-                    this.isOcclusionQueryInProgress = false;
-                    if (occlusionQueryResult === 1) {
-                        this.isOccluded = false;
-                        return true;
-                    }
-                }
-                else {
-                    return false;
-                }
-            }
-
-            console.log("Enter Draw Bound");
-
-            var occlusionAlgorithmType = this.occlusionQueryAlgorithmType == AbstractMesh.OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE ? this._gl.ANY_SAMPLES_PASSED_CONSERVATIVE : this._gl.ANY_SAMPLES_PASSED;
-
-            this._gl.beginQuery(occlusionAlgorithmType, this.occlusionQuery);
-            this._occlusionBoundingBoxRenderer.render(this);
-            this._gl.endQuery(occlusionAlgorithmType);
-            this.isOcclusionQueryInProgress = true;
-
-
-            var isOcclusionQueryAvailable = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT_AVAILABLE) as boolean;
-            console.log("isOcclusionQueryAvailable " + isOcclusionQueryAvailable);
-            if (isOcclusionQueryAvailable) {
-                var occlusionQueryResult = this._gl.getQueryParameter(this.occlusionQuery, this._gl.QUERY_RESULT) as number;
-                console.log("occlusionQueryResult " + occlusionQueryResult);
-
-                this.isOccluded = true;
-                this.isOcclusionQueryInProgress = false;
-                if (occlusionQueryResult === 1) {
-                    this.isOccluded = false;
-                    return true;
-                }
-            }
-            else {
-                return false;
-            }
-
-            return false;
-        }
-
         /**
          * Triggers the draw call for the mesh.
          * Usually, you don't need to call this method by your own because the mesh rendering is handled by the scene rendering manager.   
@@ -1256,15 +1108,9 @@
          */
         public render(subMesh: SubMesh, enableAlphaMode: boolean): Mesh {
 
-            // check occlusion query in progress
-
-            if (this.occlusionType !== AbstractMesh.OCCLUSION_TYPE_NO_VALUE) {
-                var isRenderMesh = this.renderOcclusionBoundingMesh();
-                if (!isRenderMesh) {
-                    return;
-                }
-
-                console.log("Enter Draw Mesh");
+            this.checkOcclusionQuery();
+            if (this._isOccluded) {
+                return;
             }
 
             var scene = this.getScene();
@@ -1630,10 +1476,6 @@
                 this._instancesBuffer = null;
             }
 
-            if (this._occlusionBoundingBoxRenderer) {
-                this._occlusionBoundingBoxRenderer.dispose();
-            }
-
             while (this.instances.length) {
                 this.instances[0].dispose();
             }

src/Rendering/babylon.occlusionBoundingBoxRenderer.ts

@@ -0,0 +1,82 @@
+module BABYLON {
+    
+    export class OcclusionBoundingBoxRenderer {
+        private _scene: Scene;
+        private _colorShader: ShaderMaterial;
+        private _vertexBuffers: { [key: string]: VertexBuffer } = {};
+        private _indexBuffer: WebGLBuffer;
+
+        constructor(scene: Scene) {
+            this._scene = scene;
+        }
+
+        private _prepareRessources(): void {
+            if (this._colorShader) {
+                return;
+            }
+
+            this._colorShader = new ShaderMaterial("colorShader", this._scene, "color",
+                {
+                    attributes: [VertexBuffer.PositionKind],
+                    uniforms: ["world", "viewProjection", "color"]
+                });
+
+            var engine = this._scene.getEngine();
+            var boxdata = VertexData.CreateBox({ size: 1.0 });
+            this._vertexBuffers[VertexBuffer.PositionKind] = new VertexBuffer(engine, boxdata.positions, VertexBuffer.PositionKind, false);
+            this._indexBuffer = engine.createIndexBuffer([0, 1, 1, 2, 2, 3, 3, 0, 4, 5, 5, 6, 6, 7, 7, 4, 0, 7, 1, 6, 2, 5, 3, 4]);
+        }
+
+        public render(mesh: AbstractMesh): void {
+
+            this._prepareRessources();
+
+            if (!this._colorShader.isReady()) {
+                return;
+            }
+
+            var engine = this._scene.getEngine();
+            engine.setDepthWrite(false);
+            engine.setColorWrite(false);
+            this._colorShader._preBind();
+
+            var boundingBox = mesh._boundingInfo.boundingBox;
+            var min = boundingBox.minimum;
+            var max = boundingBox.maximum;
+            var diff = max.subtract(min);
+            var median = min.add(diff.scale(0.5));
+
+            var worldMatrix = Matrix.Scaling(diff.x, diff.y, diff.z)
+                .multiply(Matrix.Translation(median.x, median.y, median.z))
+                .multiply(boundingBox.getWorldMatrix());
+
+            engine.bindBuffers(this._vertexBuffers, this._indexBuffer, this._colorShader.getEffect());
+
+            engine.setDepthFunctionToLess();
+            this._scene.resetCachedMaterial();
+            this._colorShader.bind(worldMatrix);
+
+            engine.draw(false, 0, 24);
+
+            this._colorShader.unbind();
+            engine.setDepthFunctionToLessOrEqual();
+            engine.setDepthWrite(true);
+            engine.setColorWrite(true);
+        }
+
+        public dispose(): void {
+            if (!this._colorShader) {
+                return;
+            }
+
+            this._colorShader.dispose();
+
+            var buffer = this._vertexBuffers[VertexBuffer.PositionKind];
+            if (buffer) {
+                buffer.dispose();
+                this._vertexBuffers[VertexBuffer.PositionKind] = null;
+            }
+            this._scene.getEngine()._releaseBuffer(this._indexBuffer);
+        }
+    }
+}