Adding callback on CubeTexture and a CubeTexture Loader Task

dist/preview release/babylon.max.js

@@ -6288,7 +6288,8 @@ var BABYLON;
         });
         texture.onLoadedCallbacks = [];
     };
-    var partialLoad = function (url, index, loadedImages, scene, onfinish) {
+    var partialLoad = function (url, index, loadedImages, scene, onfinish, onErrorCallBack) {
+        if (onErrorCallBack === void 0) { onErrorCallBack = null; }
         var img;
         var onload = function () {
             loadedImages[index] = img;
@@ -6300,15 +6301,19 @@ var BABYLON;
         };
         var onerror = function () {
             scene._removePendingData(img);
+            if (onErrorCallBack) {
+                onErrorCallBack();
+            }
         };
         img = BABYLON.Tools.LoadImage(url, onload, onerror, scene.database);
         scene._addPendingData(img);
     };
-    var cascadeLoad = function (rootUrl, scene, onfinish, files) {
+    var cascadeLoad = function (rootUrl, scene, onfinish, files, onError) {
+        if (onError === void 0) { onError = null; }
         var loadedImages = [];
         loadedImages._internalCount = 0;
         for (var index = 0; index < 6; index++) {
-            partialLoad(files[index], index, loadedImages, scene, onfinish);
+            partialLoad(files[index], index, loadedImages, scene, onfinish, onError);
         }
     };
     var InstancingAttributeInfo = (function () {
@@ -8226,8 +8231,10 @@ var BABYLON;
             this._loadedTexturesCache.push(texture);
             return texture;
         };
-        Engine.prototype.createCubeTexture = function (rootUrl, scene, files, noMipmap) {
+        Engine.prototype.createCubeTexture = function (rootUrl, scene, files, noMipmap, onLoad, onError) {
             var _this = this;
+            if (onLoad === void 0) { onLoad = null; }
+            if (onError === void 0) { onError = null; }
             var gl = this._gl;
             var texture = gl.createTexture();
             texture.isCube = true;
@@ -8254,7 +8261,7 @@ var BABYLON;
                     texture._width = info.width;
                     texture._height = info.height;
                     texture.isReady = true;
-                }, null, null, true);
+                }, null, null, true, onError);
             }
             else {
                 cascadeLoad(rootUrl, scene, function (imgs) {
@@ -8285,7 +8292,10 @@ var BABYLON;
                     texture._width = width;
                     texture._height = height;
                     texture.isReady = true;
-                }, files);
+                    if (onLoad) {
+                        onLoad();
+                    }
+                }, files, onError);
             }
             this._loadedTexturesCache.push(texture);
             return texture;
@@ -23166,7 +23176,9 @@ var BABYLON;
 (function (BABYLON) {
     var CubeTexture = (function (_super) {
         __extends(CubeTexture, _super);
-        function CubeTexture(rootUrl, scene, extensions, noMipmap, files) {
+        function CubeTexture(rootUrl, scene, extensions, noMipmap, files, onLoad, onError) {
+            if (onLoad === void 0) { onLoad = null; }
+            if (onError === void 0) { onError = null; }
             _super.call(this, scene);
             this.coordinatesMode = BABYLON.Texture.CUBIC_MODE;
             this.name = rootUrl;
@@ -23190,12 +23202,20 @@ var BABYLON;
             this._files = files;
             if (!this._texture) {
                 if (!scene.useDelayedTextureLoading) {
-                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap);
+                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap, onLoad, onError);
                 }
                 else {
                     this.delayLoadState = BABYLON.Engine.DELAYLOADSTATE_NOTLOADED;
                 }
             }
+            else {
+                if (this._texture.isReady) {
+                    BABYLON.Tools.SetImmediate(function () { return onLoad(); });
+                }
+                else {
+                    this._texture.onLoadedCallbacks.push(onLoad);
+                }
+            }
             this.isCube = true;
             this._textureMatrix = BABYLON.Matrix.Identity();
         }
@@ -48744,7 +48764,7 @@ var BABYLON;
             // Why before rendering the canvas? because some primitives may move and get away/under the mouse cursor (which is not moving). So we need to update at both location in order to always have an accurate list, which is needed for the hover state change.
             this._updateIntersectionList(this._primPointerInfo.canvasPointerPos, capturedPrim !== null, true);
             // Update the over status, same as above, it's could be done here or during rendering, but will be performed only once per render frame
-            this._updateOverStatus();
+            this._updateOverStatus(true);
             // Check if we have nothing to raise
             if (!this._actualOverPrimitive && !capturedPrim) {
                 return;
@@ -48847,11 +48867,14 @@ var BABYLON;
             this._actualIntersectionList = ii.intersectedPrimitives;
             this._previousOverPrimitive = this._actualOverPrimitive;
             this._actualOverPrimitive = ii.topMostIntersectedPrimitive;
+            if (this._previousOverPrimitive && this._actualOverPrimitive && this._previousOverPrimitive.prim !== this._actualOverPrimitive.prim) {
+                console.log("changed");
+            }
             this._intersectionRenderId = this.scene.getRenderId();
         };
         // Based on the previousIntersectionList and the actualInstersectionList we can determined which primitives are being hover state or loosing it
-        Canvas2D.prototype._updateOverStatus = function () {
-            if ((this.scene.getRenderId() === this._hoverStatusRenderId) || !this._previousIntersectionList || !this._actualIntersectionList) {
+        Canvas2D.prototype._updateOverStatus = function (force) {
+            if ((!force && (this.scene.getRenderId() === this._hoverStatusRenderId)) || !this._previousIntersectionList || !this._actualIntersectionList) {
                 return;
             }
             // Detect a change of over
@@ -48981,6 +49004,7 @@ var BABYLON;
                             var ppi = _this._primPointerInfo;
                             var capturedPrim = _this.getCapturedPrimitive(ppi.pointerId);
                             _this._updateIntersectionList(ppi.canvasPointerPos, capturedPrim !== null, true);
+                            _this._updateOverStatus(false);
                             var ii = new BABYLON.IntersectInfo2D();
                             ii.pickPosition = ppi.canvasPointerPos.clone();
                             ii.findFirstOnly = false;
@@ -49497,7 +49521,7 @@ var BABYLON;
             this._updateCanvasState(false);
             if (this._primPointerInfo.canvasPointerPos) {
                 this._updateIntersectionList(this._primPointerInfo.canvasPointerPos, false, false);
-                this._updateOverStatus(); // TODO this._primPointerInfo may not be up to date!
+                this._updateOverStatus(false); // TODO this._primPointerInfo may not be up to date!
             }
             this.engine.setState(false);
             this._groupRender();
@@ -54017,6 +54041,35 @@ var BABYLON;
         return TextureAssetTask;
     }());
     BABYLON.TextureAssetTask = TextureAssetTask;
+    var CubeTextureAssetTask = (function () {
+        function CubeTextureAssetTask(name, url, extensions, noMipmap, files) {
+            this.name = name;
+            this.url = url;
+            this.extensions = extensions;
+            this.noMipmap = noMipmap;
+            this.files = files;
+            this.isCompleted = false;
+        }
+        CubeTextureAssetTask.prototype.run = function (scene, onSuccess, onError) {
+            var _this = this;
+            var onload = function () {
+                _this.isCompleted = true;
+                if (_this.onSuccess) {
+                    _this.onSuccess(_this);
+                }
+                onSuccess();
+            };
+            var onerror = function () {
+                if (_this.onError) {
+                    _this.onError(_this);
+                }
+                onError();
+            };
+            this.texture = new BABYLON.CubeTexture(this.url, scene, this.extensions, this.noMipmap, this.files, onload, onerror);
+        };
+        return CubeTextureAssetTask;
+    }());
+    BABYLON.CubeTextureAssetTask = CubeTextureAssetTask;
     var AssetsManager = (function () {
         function AssetsManager(scene) {
             this.tasks = new Array();

src/Canvas2d/babylon.canvas2d.js

@@ -375,7 +375,7 @@ var BABYLON;
             // Why before rendering the canvas? because some primitives may move and get away/under the mouse cursor (which is not moving). So we need to update at both location in order to always have an accurate list, which is needed for the hover state change.
             this._updateIntersectionList(this._primPointerInfo.canvasPointerPos, capturedPrim !== null, true);
             // Update the over status, same as above, it's could be done here or during rendering, but will be performed only once per render frame
-            this._updateOverStatus();
+            this._updateOverStatus(true);
             // Check if we have nothing to raise
             if (!this._actualOverPrimitive && !capturedPrim) {
                 return;
@@ -478,11 +478,14 @@ var BABYLON;
             this._actualIntersectionList = ii.intersectedPrimitives;
             this._previousOverPrimitive = this._actualOverPrimitive;
             this._actualOverPrimitive = ii.topMostIntersectedPrimitive;
+            if (this._previousOverPrimitive && this._actualOverPrimitive && this._previousOverPrimitive.prim !== this._actualOverPrimitive.prim) {
+                console.log("changed");
+            }
             this._intersectionRenderId = this.scene.getRenderId();
         };
         // Based on the previousIntersectionList and the actualInstersectionList we can determined which primitives are being hover state or loosing it
-        Canvas2D.prototype._updateOverStatus = function () {
-            if ((this.scene.getRenderId() === this._hoverStatusRenderId) || !this._previousIntersectionList || !this._actualIntersectionList) {
+        Canvas2D.prototype._updateOverStatus = function (force) {
+            if ((!force && (this.scene.getRenderId() === this._hoverStatusRenderId)) || !this._previousIntersectionList || !this._actualIntersectionList) {
                 return;
             }
             // Detect a change of over
@@ -612,6 +615,7 @@ var BABYLON;
                             var ppi = _this._primPointerInfo;
                             var capturedPrim = _this.getCapturedPrimitive(ppi.pointerId);
                             _this._updateIntersectionList(ppi.canvasPointerPos, capturedPrim !== null, true);
+                            _this._updateOverStatus(false);
                             var ii = new BABYLON.IntersectInfo2D();
                             ii.pickPosition = ppi.canvasPointerPos.clone();
                             ii.findFirstOnly = false;
@@ -1128,7 +1132,7 @@ var BABYLON;
             this._updateCanvasState(false);
             if (this._primPointerInfo.canvasPointerPos) {
                 this._updateIntersectionList(this._primPointerInfo.canvasPointerPos, false, false);
-                this._updateOverStatus(); // TODO this._primPointerInfo may not be up to date!
+                this._updateOverStatus(false); // TODO this._primPointerInfo may not be up to date!
             }
             this.engine.setState(false);
             this._groupRender();

src/Materials/Textures/babylon.cubeTexture.js

@@ -7,7 +7,9 @@ var BABYLON;
 (function (BABYLON) {
     var CubeTexture = (function (_super) {
         __extends(CubeTexture, _super);
-        function CubeTexture(rootUrl, scene, extensions, noMipmap, files) {
+        function CubeTexture(rootUrl, scene, extensions, noMipmap, files, onLoad, onError) {
+            if (onLoad === void 0) { onLoad = null; }
+            if (onError === void 0) { onError = null; }
             _super.call(this, scene);
             this.coordinatesMode = BABYLON.Texture.CUBIC_MODE;
             this.name = rootUrl;
@@ -31,12 +33,20 @@ var BABYLON;
             this._files = files;
             if (!this._texture) {
                 if (!scene.useDelayedTextureLoading) {
-                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap);
+                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap, onLoad, onError);
                 }
                 else {
                     this.delayLoadState = BABYLON.Engine.DELAYLOADSTATE_NOTLOADED;
                 }
             }
+            else {
+                if (this._texture.isReady) {
+                    BABYLON.Tools.SetImmediate(function () { return onLoad(); });
+                }
+                else {
+                    this._texture.onLoadedCallbacks.push(onLoad);
+                }
+            }
             this.isCube = true;
             this._textureMatrix = BABYLON.Matrix.Identity();
         }

src/Materials/Textures/babylon.cubeTexture.ts

@@ -12,7 +12,7 @@
             return new CubeTexture("", scene, null, noMipmap, files);
         }
 
-        constructor(rootUrl: string, scene: Scene, extensions?: string[], noMipmap?: boolean, files?: string[]) {
+        constructor(rootUrl: string, scene: Scene, extensions?: string[], noMipmap?: boolean, files?: string[], onLoad: () => void = null, onError: () => void = null) {
             super(scene);
 
             this.name = rootUrl;
@@ -45,10 +45,16 @@
 
             if (!this._texture) {
                 if (!scene.useDelayedTextureLoading) {
-                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap);
+                    this._texture = scene.getEngine().createCubeTexture(rootUrl, scene, files, noMipmap, onLoad, onError);
                 } else {
                     this.delayLoadState = Engine.DELAYLOADSTATE_NOTLOADED;
                 }
+            } else {
+                if (this._texture.isReady) {
+                    Tools.SetImmediate(() => onLoad());
+                } else {
+                    this._texture.onLoadedCallbacks.push(onLoad);
+                }
             }
 
             this.isCube = true;

src/Tools/babylon.assetsManager.js

@@ -138,6 +138,35 @@ var BABYLON;
         return TextureAssetTask;
     }());
     BABYLON.TextureAssetTask = TextureAssetTask;
+    var CubeTextureAssetTask = (function () {
+        function CubeTextureAssetTask(name, url, extensions, noMipmap, files) {
+            this.name = name;
+            this.url = url;
+            this.extensions = extensions;
+            this.noMipmap = noMipmap;
+            this.files = files;
+            this.isCompleted = false;
+        }
+        CubeTextureAssetTask.prototype.run = function (scene, onSuccess, onError) {
+            var _this = this;
+            var onload = function () {
+                _this.isCompleted = true;
+                if (_this.onSuccess) {
+                    _this.onSuccess(_this);
+                }
+                onSuccess();
+            };
+            var onerror = function () {
+                if (_this.onError) {
+                    _this.onError(_this);
+                }
+                onError();
+            };
+            this.texture = new BABYLON.CubeTexture(this.url, scene, this.extensions, this.noMipmap, this.files, onload, onerror);
+        };
+        return CubeTextureAssetTask;
+    }());
+    BABYLON.CubeTextureAssetTask = CubeTextureAssetTask;
     var AssetsManager = (function () {
         function AssetsManager(scene) {
             this.tasks = new Array();

src/Tools/babylon.assetsManager.ts

@@ -179,6 +179,40 @@
         }
     }
 
+    export class CubeTextureAssetTask implements IAssetTask {
+        public onSuccess: (task: IAssetTask) => void;
+        public onError: (task: IAssetTask) => void;
+
+        public isCompleted = false;
+        public texture: CubeTexture;
+
+        constructor(public name: string, public url: string, public extensions?: string[], public noMipmap?: boolean, public files?: string[]) {
+        }
+
+        public run(scene: Scene, onSuccess: () => void, onError: () => void) {
+
+            var onload = () => {
+                this.isCompleted = true;
+
+                if (this.onSuccess) {
+                    this.onSuccess(this);
+                }
+
+                onSuccess();
+            };
+
+            var onerror = () => {
+                if (this.onError) {
+                    this.onError(this);
+                }
+
+                onError();
+            };
+
+            this.texture = new CubeTexture(this.url, scene, this.extensions, this.noMipmap, this.files, onload, onerror);
+        }
+    }
+
     export class AssetsManager {
         private _scene: Scene;
 

src/babylon.engine.js

@@ -82,7 +82,8 @@ var BABYLON;
         });
         texture.onLoadedCallbacks = [];
     };
-    var partialLoad = function (url, index, loadedImages, scene, onfinish) {
+    var partialLoad = function (url, index, loadedImages, scene, onfinish, onErrorCallBack) {
+        if (onErrorCallBack === void 0) { onErrorCallBack = null; }
         var img;
         var onload = function () {
             loadedImages[index] = img;
@@ -94,15 +95,19 @@ var BABYLON;
         };
         var onerror = function () {
             scene._removePendingData(img);
+            if (onErrorCallBack) {
+                onErrorCallBack();
+            }
         };
         img = BABYLON.Tools.LoadImage(url, onload, onerror, scene.database);
         scene._addPendingData(img);
     };
-    var cascadeLoad = function (rootUrl, scene, onfinish, files) {
+    var cascadeLoad = function (rootUrl, scene, onfinish, files, onError) {
+        if (onError === void 0) { onError = null; }
         var loadedImages = [];
         loadedImages._internalCount = 0;
         for (var index = 0; index < 6; index++) {
-            partialLoad(files[index], index, loadedImages, scene, onfinish);
+            partialLoad(files[index], index, loadedImages, scene, onfinish, onError);
         }
     };
     var InstancingAttributeInfo = (function () {
@@ -2020,8 +2025,10 @@ var BABYLON;
             this._loadedTexturesCache.push(texture);
             return texture;
         };
-        Engine.prototype.createCubeTexture = function (rootUrl, scene, files, noMipmap) {
+        Engine.prototype.createCubeTexture = function (rootUrl, scene, files, noMipmap, onLoad, onError) {
             var _this = this;
+            if (onLoad === void 0) { onLoad = null; }
+            if (onError === void 0) { onError = null; }
             var gl = this._gl;
             var texture = gl.createTexture();
             texture.isCube = true;
@@ -2048,7 +2055,7 @@ var BABYLON;
                     texture._width = info.width;
                     texture._height = info.height;
                     texture.isReady = true;
-                }, null, null, true);
+                }, null, null, true, onError);
             }
             else {
                 cascadeLoad(rootUrl, scene, function (imgs) {
@@ -2079,7 +2086,10 @@ var BABYLON;
                     texture._width = width;
                     texture._height = height;
                     texture.isReady = true;
-                }, files);
+                    if (onLoad) {
+                        onLoad();
+                    }
+                }, files, onError);
             }
             this._loadedTexturesCache.push(texture);
             return texture;

src/babylon.engine.ts

@@ -95,7 +95,7 @@
     };
 
     var partialLoad = (url: string, index: number, loadedImages: any, scene,
-        onfinish: (images: HTMLImageElement[]) => void) => {
+        onfinish: (images: HTMLImageElement[]) => void, onErrorCallBack: () => void = null) => {
 
         var img: HTMLImageElement;
 
@@ -112,6 +112,10 @@
 
         var onerror = () => {
             scene._removePendingData(img);
+
+            if (onErrorCallBack) {
+                onErrorCallBack();
+            }
         };
 
         img = Tools.LoadImage(url, onload, onerror, scene.database);
@@ -119,13 +123,13 @@
     }
 
     var cascadeLoad = (rootUrl: string, scene,
-        onfinish: (images: HTMLImageElement[]) => void, files: string[]) => {
+        onfinish: (images: HTMLImageElement[]) => void, files: string[], onError: () => void = null) => {
 
         var loadedImages: any = [];
         loadedImages._internalCount = 0;
 
         for (var index = 0; index < 6; index++) {
-            partialLoad(files[index], index, loadedImages, scene, onfinish);
+            partialLoad(files[index], index, loadedImages, scene, onfinish, onError);
         }
     };
 
@@ -2413,7 +2417,7 @@
             return texture;
         }
 
-        public createCubeTexture(rootUrl: string, scene: Scene, files: string[], noMipmap?: boolean): WebGLTexture {
+        public createCubeTexture(rootUrl: string, scene: Scene, files: string[], noMipmap?: boolean, onLoad: () => void = null, onError: () => void = null): WebGLTexture {
             var gl = this._gl;
 
             var texture = gl.createTexture();
@@ -2451,7 +2455,7 @@
                     texture._width = info.width;
                     texture._height = info.height;
                     texture.isReady = true;
-                }, null, null, true);
+                }, null, null, true, onError);
             } else {
                 cascadeLoad(rootUrl, scene, imgs => {
                     var width = Tools.GetExponentOfTwo(imgs[0].width, this._caps.maxCubemapTextureSize);
@@ -2490,7 +2494,11 @@
                     texture._width = width;
                     texture._height = height;
                     texture.isReady = true;
-                }, files);
+
+                    if (onLoad) {
+                        onLoad();
+                    }
+                }, files, onError);
             }
 
             this._loadedTexturesCache.push(texture);