Merge branch 'master' of https://github.com/BabylonJS/Babylon.js

Playground/babylon.d.txt

@@ -406,9 +406,28 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
+declare module BABYLON {
+    /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -8286,6 +8305,20 @@ declare module BABYLON {
     };
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+}
+declare module BABYLON {
     /** Defines supported spaces */
     export enum Space {
         /** Local (object) space */
@@ -28298,86 +28331,6 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
-declare module BABYLON {
-    /**
      * @hidden
      **/
     export class DepthCullingState {
@@ -28790,7 +28743,6 @@ declare module BABYLON {
         /** @hidden */
private _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
private _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -29223,6 +29175,8 @@ declare module BABYLON {
          */
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
+        /** @hidden */
+        protected _reportDrawCall(): void;
         /** @hidden */
private _releaseEffect(effect: Effect): void;
         /** @hidden */
private _deletePipelineContext(pipelineContext: IPipelineContext): void;
         /**
@@ -29654,7 +29608,7 @@ declare module BABYLON {
         /** @hidden */
private _getInternalFormat(format: number): number;
         /** @hidden */
private _getRGBABufferInternalSizedFormat(type: number, format?: number): number;
         /** @hidden */
private _getRGBAMultiSampleBufferFormat(type: number): number;
-        /** @hidden */
private _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        /** @hidden */
private _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -30365,6 +30319,86 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
+declare module BABYLON {
+    /**
      * Defines the interface used by display changed events
      */
     export interface IDisplayChangedEventArgs {
@@ -30701,6 +30735,7 @@ declare module BABYLON {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
private _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -31001,6 +31036,7 @@ declare module BABYLON {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -31158,16 +31194,6 @@ declare module BABYLON {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -51633,7 +51659,7 @@ declare module BABYLON {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -54654,7 +54680,7 @@ declare module BABYLON {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -54694,7 +54720,7 @@ declare module BABYLON {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */

Playground/css/index_mobile.css

@@ -135,8 +135,6 @@
         min-height: 100px;
         max-height: calc(100% - 40px);
         text-align: left;
-        overflow-y: auto;
-        overflow-x: hidden;
     }
     .navbar .select .toDisplay.languageJS .option {
         background-color: #3f3461;

Playground/js/menuPG.js

@@ -49,7 +49,8 @@ class MenuPG {
         // Handle quit of menus
         for (var i = 0; i < this.allToDisplay.length; i++) {
             this.allToDisplay[i].addEventListener('mouseleave', function () {
-                this.removeAllOptions();
+                if(this.isMobileVersion) return;
+                else this.removeAllOptions();
             }.bind(this));
         }
 
@@ -203,6 +204,13 @@ class MenuPG {
                 this.removeAllOptions();
                 toDisplay.style.display = 'block';
             }
+            
+            // Avoid an iPhone bug making the subitems disappear.
+            // Was previously done with "overflow-y : auto"
+            if(toDisplay.clientHeight < toDisplay.scrollHeight)
+                toDisplay.style.overflowY = "auto";
+            else
+                toDisplay.style.overflowY = "visible";
         }
         toDisplay = evt.target.parentNode.querySelector('.toDisplayBig');
         if (toDisplay) {

dist/preview release/babylon.d.ts

@@ -407,9 +407,28 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
+declare module BABYLON {
+    /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -8338,6 +8357,20 @@ declare module BABYLON {
     };
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+}
+declare module BABYLON {
     /** Defines supported spaces */
     export enum Space {
         /** Local (object) space */
@@ -28811,86 +28844,6 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
-declare module BABYLON {
-    /**
      * @hidden
      **/
     export class DepthCullingState {
@@ -29314,8 +29267,6 @@ declare module BABYLON {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -29763,6 +29714,8 @@ declare module BABYLON {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -30220,7 +30173,7 @@ declare module BABYLON {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -30974,6 +30927,86 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
+declare module BABYLON {
+    /**
      * Defines the interface used by display changed events
      */
     export interface IDisplayChangedEventArgs {
@@ -31311,6 +31344,8 @@ declare module BABYLON {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -31611,6 +31646,7 @@ declare module BABYLON {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -31778,16 +31814,6 @@ declare module BABYLON {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -52430,7 +52456,7 @@ declare module BABYLON {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -55499,7 +55525,7 @@ declare module BABYLON {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -55539,7 +55565,7 @@ declare module BABYLON {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */

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

@@ -406,11 +406,31 @@ declare module "babylonjs/Misc/devTools" {
         static WarnImport(name: string): string;
     }
 }
+declare module "babylonjs/Misc/interfaces/iWebRequest" {
+    /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
 declare module "babylonjs/Misc/webRequest" {
+    import { IWebRequest } from "babylonjs/Misc/interfaces/iWebRequest";
     /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -8435,6 +8455,24 @@ declare module "babylonjs/Shaders/postprocess.vertex" {
         shader: string;
     };
 }
+declare module "babylonjs/Engines/Extensions/engine.renderTarget" {
+    import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
+    import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
+    module "babylonjs/Engines/thinEngine" {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+    }
+}
 declare module "babylonjs/Maths/math.axis" {
     import { Vector3 } from "babylonjs/Maths/math.vector";
     /** Defines supported spaces */
@@ -15576,6 +15614,7 @@ declare module "babylonjs/PostProcesses/postProcess" {
     import { IInspectable } from "babylonjs/Misc/iInspectable";
     import { Engine } from "babylonjs/Engines/engine";
     import { Color4 } from "babylonjs/Maths/math.color";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     /**
      * Size options for a post process
@@ -16667,7 +16706,7 @@ declare module "babylonjs/Materials/Textures/Procedurals/proceduralTextureSceneC
         private _beforeClear;
     }
 }
-declare module "babylonjs/Engines/Extensions/engine.renderTarget" {
+declare module "babylonjs/Engines/Extensions/engine.renderTargetCube" {
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
     module "babylonjs/Engines/thinEngine" {
@@ -16698,6 +16737,7 @@ declare module "babylonjs/Materials/Textures/Procedurals/proceduralTexture" {
     import { Effect } from "babylonjs/Materials/effect";
     import { Texture } from "babylonjs/Materials/Textures/texture";
     import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import "babylonjs/Shaders/procedural.vertex";
     /**
      * Procedural texturing is a way to programmatically create a texture. There are 2 types of procedural textures: code-only, and code that references some classic 2D images, sometimes calmpler' images.
@@ -20458,6 +20498,7 @@ declare module "babylonjs/Materials/Textures/renderTargetTexture" {
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     import { RenderingManager } from "babylonjs/Rendering/renderingManager";
     import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import { Engine } from "babylonjs/Engines/engine";
     /**
      * This Helps creating a texture that will be created from a camera in your scene.
@@ -29647,86 +29688,6 @@ declare module "babylonjs/Engines/engineCapabilities" {
         blendMinMax: boolean;
     }
 }
-declare module "babylonjs/Misc/perfCounter" {
-    /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
 declare module "babylonjs/States/depthCullingState" {
     import { Nullable } from "babylonjs/types";
     /**
@@ -30021,7 +29982,6 @@ declare module "babylonjs/Engines/thinEngine" {
     import { UniformBuffer } from "babylonjs/Materials/uniformBuffer";
     import { Nullable, DataArray, IndicesArray } from "babylonjs/types";
     import { EngineCapabilities } from "babylonjs/Engines/engineCapabilities";
-    import { PerfCounter } from "babylonjs/Misc/perfCounter";
     import { Observable } from "babylonjs/Misc/observable";
     import { DepthCullingState } from "babylonjs/States/depthCullingState";
     import { StencilState } from "babylonjs/States/stencilState";
@@ -30034,11 +29994,11 @@ declare module "babylonjs/Engines/thinEngine" {
     import { WebGLPipelineContext } from "babylonjs/Engines/WebGL/webGLPipelineContext";
     import { VertexBuffer } from "babylonjs/Meshes/buffer";
     import { InstancingAttributeInfo } from "babylonjs/Engines/instancingAttributeInfo";
-    import { WebRequest } from "babylonjs/Misc/webRequest";
     import { DepthTextureCreationOptions } from "babylonjs/Engines/depthTextureCreationOptions";
     import { BaseTexture } from "babylonjs/Materials/Textures/baseTexture";
     import { IOfflineProvider } from "babylonjs/Offline/IOfflineProvider";
     import { IEffectFallbacks } from "babylonjs/Materials/iEffectFallbacks";
+    import { IWebRequest } from "babylonjs/Misc/interfaces/iWebRequest";
     /**
      * Defines the interface used by objects working like Scene
      * @hidden
@@ -30187,8 +30147,6 @@ declare module "babylonjs/Engines/thinEngine" {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -30636,6 +30594,8 @@ declare module "babylonjs/Engines/thinEngine" {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -31093,7 +31053,7 @@ declare module "babylonjs/Engines/thinEngine" {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -31855,6 +31815,86 @@ declare module "babylonjs/Misc/performanceMonitor" {
         protected _wrapPosition(i: number): number;
     }
 }
+declare module "babylonjs/Misc/perfCounter" {
+    /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
 declare module "babylonjs/Engines/engine" {
     import { Observable } from "babylonjs/Misc/observable";
     import { Nullable, IndicesArray } from "babylonjs/types";
@@ -31868,10 +31908,10 @@ declare module "babylonjs/Engines/engine" {
     import { ICustomAnimationFrameRequester } from "babylonjs/Misc/customAnimationFrameRequester";
     import { ThinEngine, EngineOptions } from "babylonjs/Engines/thinEngine";
     import { IViewportLike, IColor4Like } from "babylonjs/Maths/math.like";
-    import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
     import { RenderTargetTexture } from "babylonjs/Materials/Textures/renderTargetTexture";
     import { PerformanceMonitor } from "babylonjs/Misc/performanceMonitor";
     import { DataBuffer } from "babylonjs/Meshes/dataBuffer";
+    import { PerfCounter } from "babylonjs/Misc/perfCounter";
     import { Material } from "babylonjs/Materials/material";
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     /**
@@ -32212,6 +32252,8 @@ declare module "babylonjs/Engines/engine" {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -32512,6 +32554,7 @@ declare module "babylonjs/Engines/engine" {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -32679,16 +32722,6 @@ declare module "babylonjs/Engines/engine" {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -46086,6 +46119,7 @@ declare module "babylonjs/Engines/Extensions/index" {
     export * from "babylonjs/Engines/Extensions/engine.multiRender";
     export * from "babylonjs/Engines/Extensions/engine.cubeTexture";
     export * from "babylonjs/Engines/Extensions/engine.renderTarget";
+    export * from "babylonjs/Engines/Extensions/engine.renderTargetCube";
     export * from "babylonjs/Engines/Extensions/engine.webVR";
     export * from "babylonjs/Engines/Extensions/engine.uniformBuffer";
 }
@@ -46110,7 +46144,7 @@ declare module "babylonjs/Misc/environmentTextureTools" {
     import { SphericalPolynomial } from "babylonjs/Maths/sphericalPolynomial";
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     import { CubeTexture } from "babylonjs/Materials/Textures/cubeTexture";
-    import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import "babylonjs/Shaders/rgbdEncode.fragment";
     import "babylonjs/Shaders/rgbdDecode.fragment";
     /**
@@ -48381,6 +48415,7 @@ declare module "babylonjs/Helpers/photoDome" {
 }
 declare module "babylonjs/Misc/rgbdTextureTools" {
     import "babylonjs/Shaders/rgbdDecode.fragment";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import { Texture } from "babylonjs/Materials/Textures/texture";
     /**
      * Class used to host RGBD texture specific utilities
@@ -54839,7 +54874,9 @@ declare module "babylonjs/Materials/Textures/htmlElementTexture" {
     import { Nullable } from "babylonjs/types";
     import { BaseTexture } from "babylonjs/Materials/Textures/baseTexture";
     import { Matrix } from "babylonjs/Maths/math.vector";
-    import { Engine } from "babylonjs/Engines/engine";
+    import "babylonjs/Engines/Extensions/engine.dynamicTexture";
+    import "babylonjs/Engines/Extensions/engine.videoTexture";
+    import { ThinEngine } from "babylonjs/Engines/thinEngine";
     import { Scene } from "babylonjs/scene";
     /**
      * Defines the options related to the creation of an HtmlElementTexture
@@ -54856,7 +54893,7 @@ declare module "babylonjs/Materials/Textures/htmlElementTexture" {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -58285,10 +58322,11 @@ declare module "babylonjs/Materials/Node/index" {
 declare module "babylonjs/Materials/effectRenderer" {
     import { Nullable } from "babylonjs/types";
     import { Texture } from "babylonjs/Materials/Textures/texture";
-    import { Engine } from "babylonjs/Engines/engine";
+    import { ThinEngine } from "babylonjs/Engines/thinEngine";
     import { Viewport } from "babylonjs/Maths/math.viewport";
     import { Observable } from "babylonjs/Misc/observable";
     import { Effect } from "babylonjs/Materials/effect";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import "babylonjs/Shaders/postprocess.vertex";
     /**
      * Effect Render Options
@@ -58320,7 +58358,7 @@ declare module "babylonjs/Materials/effectRenderer" {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -58360,7 +58398,7 @@ declare module "babylonjs/Materials/effectRenderer" {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */
@@ -67162,9 +67200,28 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
+declare module BABYLON {
+    /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -75093,6 +75150,20 @@ declare module BABYLON {
     };
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+}
+declare module BABYLON {
     /** Defines supported spaces */
     export enum Space {
         /** Local (object) space */
@@ -95566,86 +95637,6 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
-declare module BABYLON {
-    /**
      * @hidden
      **/
     export class DepthCullingState {
@@ -96069,8 +96060,6 @@ declare module BABYLON {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -96518,6 +96507,8 @@ declare module BABYLON {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -96975,7 +96966,7 @@ declare module BABYLON {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -97729,6 +97720,86 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
+declare module BABYLON {
+    /**
      * Defines the interface used by display changed events
      */
     export interface IDisplayChangedEventArgs {
@@ -98066,6 +98137,8 @@ declare module BABYLON {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -98366,6 +98439,7 @@ declare module BABYLON {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -98533,16 +98607,6 @@ declare module BABYLON {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -119185,7 +119249,7 @@ declare module BABYLON {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -122254,7 +122318,7 @@ declare module BABYLON {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -122294,7 +122358,7 @@ declare module BABYLON {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */

dist/preview release/documentation.d.ts

@@ -407,9 +407,28 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
+declare module BABYLON {
+    /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -8338,6 +8357,20 @@ declare module BABYLON {
     };
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+}
+declare module BABYLON {
     /** Defines supported spaces */
     export enum Space {
         /** Local (object) space */
@@ -28811,86 +28844,6 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
-declare module BABYLON {
-    /**
      * @hidden
      **/
     export class DepthCullingState {
@@ -29314,8 +29267,6 @@ declare module BABYLON {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -29763,6 +29714,8 @@ declare module BABYLON {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -30220,7 +30173,7 @@ declare module BABYLON {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -30974,6 +30927,86 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
+declare module BABYLON {
+    /**
      * Defines the interface used by display changed events
      */
     export interface IDisplayChangedEventArgs {
@@ -31311,6 +31344,8 @@ declare module BABYLON {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -31611,6 +31646,7 @@ declare module BABYLON {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -31778,16 +31814,6 @@ declare module BABYLON {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -52430,7 +52456,7 @@ declare module BABYLON {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -55499,7 +55525,7 @@ declare module BABYLON {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -55539,7 +55565,7 @@ declare module BABYLON {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */

dist/preview release/inspector/babylon.inspector.bundle.max.js

@@ -48778,7 +48778,7 @@ var SceneTreeItemComponent = /** @class */ (function (_super) {
                     if (!this._posDragEnd) {
                         // Record movement for generating replay code
                         this._posDragEnd = manager.gizmos.positionGizmo.onDragEndObservable.add(function () {
-                            if (manager.gizmos.positionGizmo && manager.gizmos.positionGizmo.attachedMesh) {
+                            if (manager.gizmos.positionGizmo && manager.gizmos.positionGizmo.attachedMesh && manager.gizmos.positionGizmo.attachedMesh.reservedDataStore) {
                                 var lightGizmo = manager.gizmos.positionGizmo.attachedMesh.reservedDataStore.lightGizmo;
                                 var obj = (lightGizmo && lightGizmo.light) ? lightGizmo.light : manager.gizmos.positionGizmo.attachedMesh;
                                 if (obj.position) {

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

@@ -402,16 +402,50 @@ declare module NODEEDITOR {
     }
 }
 declare module NODEEDITOR {
+    class ListLineOption {
+        label: string;
+        value: number | string;
+    }
+    interface IOptionsLineComponentProps {
+        label: string;
+        target: any;
+        className?: string;
+        propertyName?: string;
+        options: ListLineOption[];
+        noDirectUpdate?: boolean;
+        onSelect?: (value: number | string) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        valuesAreStrings?: boolean;
+        defaultIfNull?: number;
+        getSelection?: (target: any) => number;
+    }
+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
+        value: number | string;
+    }> {
+        private _localChange;
+        private _getValue;
+        constructor(props: IOptionsLineComponentProps);
+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+}
+declare module NODEEDITOR {
     interface ITexturePropertyTabComponentProps {
         globalState: GlobalState;
         node: TextureNodeModel | ReflectionTextureNodeModel;
     }
     export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps, {
         isEmbedded: boolean;
+        loadAsCubeTexture: boolean;
     }> {
         constructor(props: ITexturePropertyTabComponentProps);
         UNSAFE_componentWillUpdate(nextProps: ITexturePropertyTabComponentProps, nextState: {
             isEmbedded: boolean;
+            loadAsCubeTexture: boolean;
         }): void;
         private _generateRandomForCache;
         updateAfterTextureLoad(): void;
@@ -616,38 +650,6 @@ declare module NODEEDITOR {
     }
 }
 declare module NODEEDITOR {
-    class ListLineOption {
-        label: string;
-        value: number | string;
-    }
-    interface IOptionsLineComponentProps {
-        label: string;
-        target: any;
-        className?: string;
-        propertyName?: string;
-        options: ListLineOption[];
-        noDirectUpdate?: boolean;
-        onSelect?: (value: number | string) => void;
-        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
-        valuesAreStrings?: boolean;
-        defaultIfNull?: number;
-        getSelection?: (target: any) => number;
-    }
-    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
-        value: number | string;
-    }> {
-        private _localChange;
-        private _getValue;
-        constructor(props: IOptionsLineComponentProps);
-        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
-            value: number;
-        }): boolean;
-        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
-        updateValue(valueString: string): void;
-        render(): JSX.Element;
-    }
-}
-declare module NODEEDITOR {
     export interface IColor3LineComponentProps {
         label: string;
         target: any;

dist/preview release/nodeEditor/babylon.nodeEditor.max.js

@@ -71352,15 +71352,15 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../sharedComponents/fileButtonLineComponent */ "./sharedComponents/fileButtonLineComponent.tsx");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! babylonjs/Misc/tools */ "babylonjs/Misc/observable");
 /* harmony import */ var babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _textureNodeModel__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./textureNodeModel */ "./components/diagram/texture/textureNodeModel.tsx");
-/* harmony import */ var _sharedComponents_textLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../sharedComponents/textLineComponent */ "./sharedComponents/textLineComponent.tsx");
-/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../sharedComponents/lineContainerComponent */ "./sharedComponents/lineContainerComponent.tsx");
-/* harmony import */ var _sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../sharedComponents/textInputLineComponent */ "./sharedComponents/textInputLineComponent.tsx");
-/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../sharedComponents/checkBoxLineComponent */ "./sharedComponents/checkBoxLineComponent.tsx");
-/* harmony import */ var _sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../sharedComponents/sliderLineComponent */ "./sharedComponents/sliderLineComponent.tsx");
-/* harmony import */ var _sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../sharedComponents/floatLineComponent */ "./sharedComponents/floatLineComponent.tsx");
-/* harmony import */ var _sharedComponents_buttonLineComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../sharedComponents/buttonLineComponent */ "./sharedComponents/buttonLineComponent.tsx");
-/* harmony import */ var _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../reflectionTexture/reflectionTextureNodeModel */ "./components/diagram/reflectionTexture/reflectionTextureNodeModel.tsx");
+/* harmony import */ var _sharedComponents_textLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../sharedComponents/textLineComponent */ "./sharedComponents/textLineComponent.tsx");
+/* harmony import */ var _sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../sharedComponents/lineContainerComponent */ "./sharedComponents/lineContainerComponent.tsx");
+/* harmony import */ var _sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../sharedComponents/textInputLineComponent */ "./sharedComponents/textInputLineComponent.tsx");
+/* harmony import */ var _sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../sharedComponents/checkBoxLineComponent */ "./sharedComponents/checkBoxLineComponent.tsx");
+/* harmony import */ var _sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../sharedComponents/sliderLineComponent */ "./sharedComponents/sliderLineComponent.tsx");
+/* harmony import */ var _sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../sharedComponents/floatLineComponent */ "./sharedComponents/floatLineComponent.tsx");
+/* harmony import */ var _sharedComponents_buttonLineComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../../sharedComponents/buttonLineComponent */ "./sharedComponents/buttonLineComponent.tsx");
+/* harmony import */ var _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../reflectionTexture/reflectionTextureNodeModel */ "./components/diagram/reflectionTexture/reflectionTextureNodeModel.tsx");
+/* harmony import */ var _sharedComponents_optionsLineComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../../../sharedComponents/optionsLineComponent */ "./sharedComponents/optionsLineComponent.tsx");
 
 
 
@@ -71381,13 +71381,14 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
     function TexturePropertyTabComponent(props) {
         var _this = _super.call(this, props) || this;
         var texture = _this.props.node.texture;
-        _this.state = { isEmbedded: !texture || texture.name.substring(0, 4) !== "http" };
+        _this.state = { isEmbedded: !texture || texture.name.substring(0, 4) !== "http", loadAsCubeTexture: texture && texture.isCube };
         return _this;
     }
     TexturePropertyTabComponent.prototype.UNSAFE_componentWillUpdate = function (nextProps, nextState) {
         if (nextProps.node !== this.props.node) {
             var texture = nextProps.node.texture;
             nextState.isEmbedded = !texture || texture.name.substring(0, 4) !== "http";
+            nextState.loadAsCubeTexture = texture && texture.isCube;
         }
     };
     TexturePropertyTabComponent.prototype._generateRandomForCache = function () {
@@ -71399,6 +71400,7 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
     TexturePropertyTabComponent.prototype.updateAfterTextureLoad = function () {
         this.props.globalState.onUpdateRequiredObservable.notifyObservers();
         this.props.globalState.onRebuildRequiredObservable.notifyObservers();
+        this.forceUpdate();
     };
     /**
      * Replaces the texture of the node
@@ -71410,10 +71412,15 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
             return;
         }
         var texture = this.props.node.texture;
+        if (texture && texture.isCube !== this.state.loadAsCubeTexture) {
+            texture.dispose();
+            texture = null;
+        }
         if (!texture) {
-            if (this.props.node instanceof _textureNodeModel__WEBPACK_IMPORTED_MODULE_4__["TextureNodeModel"]) {
+            if (!this.state.loadAsCubeTexture) {
                 this.props.node.texture = new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"](null, this.props.globalState.nodeMaterial.getScene(), false, false);
                 texture = this.props.node.texture;
+                texture.coordinatesMode = babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].EQUIRECTANGULAR_MODE;
             }
             else {
                 this.props.node.texture = new babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["CubeTexture"]("", this.props.globalState.nodeMaterial.getScene());
@@ -71427,19 +71434,14 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
             reader.readAsDataURL(blob);
             reader.onloadend = function () {
                 var base64data = reader.result;
-                if (texture.isCube || _this.props.node instanceof _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_12__["ReflectionTextureNodeModel"]) {
-                    var extension = undefined;
-                    if (file.name.toLowerCase().indexOf(".dds") > 0) {
-                        extension = ".dds";
-                    }
-                    else if (file.name.toLowerCase().indexOf(".env") > 0) {
-                        extension = ".env";
-                    }
-                    texture.updateURL(base64data, extension, function () { return _this.updateAfterTextureLoad(); });
+                var extension = undefined;
+                if (file.name.toLowerCase().indexOf(".dds") > 0) {
+                    extension = ".dds";
                 }
-                else {
-                    texture.updateURL(base64data, null, function () { return _this.updateAfterTextureLoad(); });
+                else if (file.name.toLowerCase().indexOf(".env") > 0) {
+                    extension = ".env";
                 }
+                texture.updateURL(base64data, extension, function () { return _this.updateAfterTextureLoad(); });
             };
         }, undefined, true);
     };
@@ -71452,7 +71454,7 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
             });
             return;
         }
-        if (texture.isCube || this.props.node instanceof _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_12__["ReflectionTextureNodeModel"]) {
+        if (texture.isCube || this.props.node instanceof _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_11__["ReflectionTextureNodeModel"]) {
             var extension = undefined;
             if (url.toLowerCase().indexOf(".dds") > 0) {
                 extension = ".dds";
@@ -71474,70 +71476,106 @@ var TexturePropertyTabComponent = /** @class */ (function (_super) {
             url = texture.name;
         }
         url = url.replace(/\?nocache=\d+/, "");
-        var isInReflectionMode = this.props.node instanceof _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_12__["ReflectionTextureNodeModel"];
+        var isInReflectionMode = this.props.node instanceof _reflectionTexture_reflectionTextureNodeModel__WEBPACK_IMPORTED_MODULE_11__["ReflectionTextureNodeModel"];
+        var reflectionModeOptions = [
+            {
+                label: "Cubic", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CUBIC_MODE
+            },
+            {
+                label: "Equirectangular", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].EQUIRECTANGULAR_MODE
+            },
+            {
+                label: "Explicit", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].EXPLICIT_MODE
+            },
+            {
+                label: "Fixed equirectangular", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].FIXED_EQUIRECTANGULAR_MODE
+            },
+            {
+                label: "Fixed mirrored equirectangular", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].FIXED_EQUIRECTANGULAR_MIRRORED_MODE
+            },
+            {
+                label: "Planar", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].PLANAR_MODE
+            },
+            {
+                label: "Projection", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].PROJECTION_MODE
+            },
+            {
+                label: "Skybox", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].SKYBOX_MODE
+            },
+            {
+                label: "Spherical", value: babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].SPHERICAL_MODE
+            },
+        ];
         return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", null,
-            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_6__["LineContainerComponent"], { title: "GENERAL" },
-                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textLineComponent__WEBPACK_IMPORTED_MODULE_5__["TextLineComponent"], { label: "Type", value: "Texture" }),
-                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__["TextInputLineComponent"], { globalState: this.props.globalState, label: "Name", propertyName: "name", target: this.props.node.block, onChange: function () { return _this.props.globalState.onUpdateRequiredObservable.notifyObservers(); } })),
-            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_6__["LineContainerComponent"], { title: "PROPERTIES" },
-                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "Auto select UV", propertyName: "autoSelectUV", target: this.props.node.block, onValueChanged: function () {
+            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_5__["LineContainerComponent"], { title: "GENERAL" },
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "Type", value: this.props.node.block.getClassName() }),
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { globalState: this.props.globalState, label: "Name", propertyName: "name", target: this.props.node.block, onChange: function () { return _this.props.globalState.onUpdateRequiredObservable.notifyObservers(); } })),
+            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_5__["LineContainerComponent"], { title: "PROPERTIES" },
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Auto select UV", propertyName: "autoSelectUV", target: this.props.node.block, onValueChanged: function () {
                         _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                     } }),
-                " ",
+                texture && isInReflectionMode &&
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_optionsLineComponent__WEBPACK_IMPORTED_MODULE_12__["OptionsLineComponent"], { label: "Reflection mode", options: reflectionModeOptions, target: texture, propertyName: "coordinatesMode", onSelect: function (value) {
+                            texture.coordinatesMode = value;
+                            _this.forceUpdate();
+                            _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
+                        } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "Gamma space", propertyName: "gammaSpace", target: texture, onValueChanged: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Gamma space", propertyName: "gammaSpace", target: texture, onValueChanged: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "Clamp U", isSelected: function () { return texture.wrapU === babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE; }, onSelect: function (value) {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Clamp U", isSelected: function () { return texture.wrapU === babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE; }, onSelect: function (value) {
                             texture.wrapU = value ? babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE : babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].WRAP_ADDRESSMODE;
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "Clamp V", isSelected: function () { return texture.wrapV === babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE; }, onSelect: function (value) {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Clamp V", isSelected: function () { return texture.wrapV === babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE; }, onSelect: function (value) {
                             texture.wrapV = value ? babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].CLAMP_ADDRESSMODE : babylonjs_Misc_tools__WEBPACK_IMPORTED_MODULE_3__["Texture"].WRAP_ADDRESSMODE;
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__["FloatLineComponent"], { label: "Offset U", target: texture, propertyName: "uOffset", onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__["FloatLineComponent"], { label: "Offset U", target: texture, propertyName: "uOffset", onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__["FloatLineComponent"], { label: "Offset V", target: texture, propertyName: "vOffset", onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__["FloatLineComponent"], { label: "Offset V", target: texture, propertyName: "vOffset", onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__["FloatLineComponent"], { label: "Scale U", target: texture, propertyName: "uScale", onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__["FloatLineComponent"], { label: "Scale U", target: texture, propertyName: "uScale", onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__["FloatLineComponent"], { label: "Scale V", target: texture, propertyName: "vScale", onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__["FloatLineComponent"], { label: "Scale V", target: texture, propertyName: "vScale", onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_9__["SliderLineComponent"], { label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_8__["SliderLineComponent"], { label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_9__["SliderLineComponent"], { label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_8__["SliderLineComponent"], { label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } }),
                 texture && !isInReflectionMode &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_9__["SliderLineComponent"], { label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_sliderLineComponent__WEBPACK_IMPORTED_MODULE_8__["SliderLineComponent"], { label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: function () {
                             _this.props.globalState.onUpdateRequiredObservable.notifyObservers();
                         } })),
-            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_6__["LineContainerComponent"], { title: "SOURCE" },
-                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "Embed texture", isSelected: function () { return _this.state.isEmbedded; }, onSelect: function (value) {
+            react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_5__["LineContainerComponent"], { title: "SOURCE" },
+                react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Embed texture", isSelected: function () { return _this.state.isEmbedded; }, onSelect: function (value) {
                         _this.setState({ isEmbedded: value });
                         _this.props.node.texture = null;
                         _this.updateAfterTextureLoad();
                     } }),
+                isInReflectionMode &&
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__["CheckBoxLineComponent"], { label: "Load as cube texture", isSelected: function () { return _this.state.loadAsCubeTexture; }, onSelect: function (value) { return _this.setState({ loadAsCubeTexture: value }); } }),
                 this.state.isEmbedded &&
                     react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__["FileButtonLineComponent"], { label: "Upload", onClick: function (file) { return _this.replaceTexture(file); }, accept: ".jpg, .png, .tga, .dds, .env" }),
                 !this.state.isEmbedded &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__["TextInputLineComponent"], { label: "Link", globalState: this.props.globalState, value: url, onChange: function (newUrl) { return _this.replaceTextureWithUrl(newUrl); } }),
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { label: "Link", globalState: this.props.globalState, value: url, onChange: function (newUrl) { return _this.replaceTextureWithUrl(newUrl); } }),
                 !this.state.isEmbedded && url &&
-                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_buttonLineComponent__WEBPACK_IMPORTED_MODULE_11__["ButtonLineComponent"], { label: "Refresh", onClick: function () { return _this.replaceTextureWithUrl(url + "?nocache=" + _this._generateRandomForCache()); } }))));
+                    react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_buttonLineComponent__WEBPACK_IMPORTED_MODULE_10__["ButtonLineComponent"], { label: "Refresh", onClick: function () { return _this.replaceTextureWithUrl(url + "?nocache=" + _this._generateRandomForCache()); } }))));
     };
     return TexturePropertyTabComponent;
 }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -72217,7 +72255,11 @@ var PreviewManager = /** @class */ (function () {
             this._engine.releaseEffects();
             switch (this._globalState.previewMeshType) {
                 case _previewMeshType__WEBPACK_IMPORTED_MODULE_1__["PreviewMeshType"].Box:
-                    this._meshes.push(babylonjs_Materials_Node_nodeMaterial__WEBPACK_IMPORTED_MODULE_0__["Mesh"].CreateBox("dummy-box", 2, this._scene));
+                    babylonjs_Materials_Node_nodeMaterial__WEBPACK_IMPORTED_MODULE_0__["SceneLoader"].AppendAsync("https://models.babylonjs.com/", "roundedCube.glb", this._scene).then(function () {
+                        var _a;
+                        (_a = _this._meshes).push.apply(_a, _this._scene.meshes);
+                        _this._prepareMeshes();
+                    });
                     break;
                 case _previewMeshType__WEBPACK_IMPORTED_MODULE_1__["PreviewMeshType"].Sphere:
                     this._meshes.push(babylonjs_Materials_Node_nodeMaterial__WEBPACK_IMPORTED_MODULE_0__["Mesh"].CreateSphere("dummy-sphere", 32, 2, this._scene));

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

@@ -511,6 +511,41 @@ declare module "babylonjs-node-editor/components/diagram/reflectionTexture/refle
         prepare(options: NodeCreationOptions, nodes: Array<DefaultNodeModel>, model: DiagramModel, graphEditor: GraphEditor): void;
     }
 }
+declare module "babylonjs-node-editor/sharedComponents/optionsLineComponent" {
+    import * as React from "react";
+    import { Observable } from "babylonjs/Misc/observable";
+    import { PropertyChangedEvent } from "babylonjs-node-editor/sharedComponents/propertyChangedEvent";
+    class ListLineOption {
+        label: string;
+        value: number | string;
+    }
+    interface IOptionsLineComponentProps {
+        label: string;
+        target: any;
+        className?: string;
+        propertyName?: string;
+        options: ListLineOption[];
+        noDirectUpdate?: boolean;
+        onSelect?: (value: number | string) => void;
+        onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+        valuesAreStrings?: boolean;
+        defaultIfNull?: number;
+        getSelection?: (target: any) => number;
+    }
+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
+        value: number | string;
+    }> {
+        private _localChange;
+        private _getValue;
+        constructor(props: IOptionsLineComponentProps);
+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+}
 declare module "babylonjs-node-editor/components/diagram/texture/texturePropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "babylonjs-node-editor/globalState";
@@ -522,10 +557,12 @@ declare module "babylonjs-node-editor/components/diagram/texture/textureProperty
     }
     export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps, {
         isEmbedded: boolean;
+        loadAsCubeTexture: boolean;
     }> {
         constructor(props: ITexturePropertyTabComponentProps);
         UNSAFE_componentWillUpdate(nextProps: ITexturePropertyTabComponentProps, nextState: {
             isEmbedded: boolean;
+            loadAsCubeTexture: boolean;
         }): void;
         private _generateRandomForCache;
         updateAfterTextureLoad(): void;
@@ -759,41 +796,6 @@ declare module "babylonjs-node-editor/components/propertyTab/properties/vector3P
         render(): JSX.Element;
     }
 }
-declare module "babylonjs-node-editor/sharedComponents/optionsLineComponent" {
-    import * as React from "react";
-    import { Observable } from "babylonjs/Misc/observable";
-    import { PropertyChangedEvent } from "babylonjs-node-editor/sharedComponents/propertyChangedEvent";
-    class ListLineOption {
-        label: string;
-        value: number | string;
-    }
-    interface IOptionsLineComponentProps {
-        label: string;
-        target: any;
-        className?: string;
-        propertyName?: string;
-        options: ListLineOption[];
-        noDirectUpdate?: boolean;
-        onSelect?: (value: number | string) => void;
-        onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
-        valuesAreStrings?: boolean;
-        defaultIfNull?: number;
-        getSelection?: (target: any) => number;
-    }
-    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
-        value: number | string;
-    }> {
-        private _localChange;
-        private _getValue;
-        constructor(props: IOptionsLineComponentProps);
-        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
-            value: number;
-        }): boolean;
-        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
-        updateValue(valueString: string): void;
-        render(): JSX.Element;
-    }
-}
 declare module "babylonjs-node-editor/sharedComponents/color3LineComponent" {
     import * as React from "react";
     import { Observable } from "babylonjs/Misc/observable";
@@ -2238,16 +2240,50 @@ declare module NODEEDITOR {
     }
 }
 declare module NODEEDITOR {
+    class ListLineOption {
+        label: string;
+        value: number | string;
+    }
+    interface IOptionsLineComponentProps {
+        label: string;
+        target: any;
+        className?: string;
+        propertyName?: string;
+        options: ListLineOption[];
+        noDirectUpdate?: boolean;
+        onSelect?: (value: number | string) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        valuesAreStrings?: boolean;
+        defaultIfNull?: number;
+        getSelection?: (target: any) => number;
+    }
+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
+        value: number | string;
+    }> {
+        private _localChange;
+        private _getValue;
+        constructor(props: IOptionsLineComponentProps);
+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+}
+declare module NODEEDITOR {
     interface ITexturePropertyTabComponentProps {
         globalState: GlobalState;
         node: TextureNodeModel | ReflectionTextureNodeModel;
     }
     export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps, {
         isEmbedded: boolean;
+        loadAsCubeTexture: boolean;
     }> {
         constructor(props: ITexturePropertyTabComponentProps);
         UNSAFE_componentWillUpdate(nextProps: ITexturePropertyTabComponentProps, nextState: {
             isEmbedded: boolean;
+            loadAsCubeTexture: boolean;
         }): void;
         private _generateRandomForCache;
         updateAfterTextureLoad(): void;
@@ -2452,38 +2488,6 @@ declare module NODEEDITOR {
     }
 }
 declare module NODEEDITOR {
-    class ListLineOption {
-        label: string;
-        value: number | string;
-    }
-    interface IOptionsLineComponentProps {
-        label: string;
-        target: any;
-        className?: string;
-        propertyName?: string;
-        options: ListLineOption[];
-        noDirectUpdate?: boolean;
-        onSelect?: (value: number | string) => void;
-        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
-        valuesAreStrings?: boolean;
-        defaultIfNull?: number;
-        getSelection?: (target: any) => number;
-    }
-    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
-        value: number | string;
-    }> {
-        private _localChange;
-        private _getValue;
-        constructor(props: IOptionsLineComponentProps);
-        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
-            value: number;
-        }): boolean;
-        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
-        updateValue(valueString: string): void;
-        render(): JSX.Element;
-    }
-}
-declare module NODEEDITOR {
     export interface IColor3LineComponentProps {
         label: string;
         target: any;

dist/preview release/packagesSizeBaseLine.json

@@ -1 +1 @@
-{"thinEngineOnly":129467,"engineOnly":166406,"sceneOnly":510287,"minGridMaterial":640532,"minStandardMaterial":771691}
+{"thinEngineOnly":126863,"engineOnly":163772,"sceneOnly":507659,"minGridMaterial":638123,"minStandardMaterial":769282}

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

@@ -406,11 +406,31 @@ declare module "babylonjs/Misc/devTools" {
         static WarnImport(name: string): string;
     }
 }
+declare module "babylonjs/Misc/interfaces/iWebRequest" {
+    /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
 declare module "babylonjs/Misc/webRequest" {
+    import { IWebRequest } from "babylonjs/Misc/interfaces/iWebRequest";
     /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -8435,6 +8455,24 @@ declare module "babylonjs/Shaders/postprocess.vertex" {
         shader: string;
     };
 }
+declare module "babylonjs/Engines/Extensions/engine.renderTarget" {
+    import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
+    import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
+    module "babylonjs/Engines/thinEngine" {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+    }
+}
 declare module "babylonjs/Maths/math.axis" {
     import { Vector3 } from "babylonjs/Maths/math.vector";
     /** Defines supported spaces */
@@ -15576,6 +15614,7 @@ declare module "babylonjs/PostProcesses/postProcess" {
     import { IInspectable } from "babylonjs/Misc/iInspectable";
     import { Engine } from "babylonjs/Engines/engine";
     import { Color4 } from "babylonjs/Maths/math.color";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     /**
      * Size options for a post process
@@ -16667,7 +16706,7 @@ declare module "babylonjs/Materials/Textures/Procedurals/proceduralTextureSceneC
         private _beforeClear;
     }
 }
-declare module "babylonjs/Engines/Extensions/engine.renderTarget" {
+declare module "babylonjs/Engines/Extensions/engine.renderTargetCube" {
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
     module "babylonjs/Engines/thinEngine" {
@@ -16698,6 +16737,7 @@ declare module "babylonjs/Materials/Textures/Procedurals/proceduralTexture" {
     import { Effect } from "babylonjs/Materials/effect";
     import { Texture } from "babylonjs/Materials/Textures/texture";
     import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import "babylonjs/Shaders/procedural.vertex";
     /**
      * Procedural texturing is a way to programmatically create a texture. There are 2 types of procedural textures: code-only, and code that references some classic 2D images, sometimes calmpler' images.
@@ -20458,6 +20498,7 @@ declare module "babylonjs/Materials/Textures/renderTargetTexture" {
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     import { RenderingManager } from "babylonjs/Rendering/renderingManager";
     import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import { Engine } from "babylonjs/Engines/engine";
     /**
      * This Helps creating a texture that will be created from a camera in your scene.
@@ -29647,86 +29688,6 @@ declare module "babylonjs/Engines/engineCapabilities" {
         blendMinMax: boolean;
     }
 }
-declare module "babylonjs/Misc/perfCounter" {
-    /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
 declare module "babylonjs/States/depthCullingState" {
     import { Nullable } from "babylonjs/types";
     /**
@@ -30021,7 +29982,6 @@ declare module "babylonjs/Engines/thinEngine" {
     import { UniformBuffer } from "babylonjs/Materials/uniformBuffer";
     import { Nullable, DataArray, IndicesArray } from "babylonjs/types";
     import { EngineCapabilities } from "babylonjs/Engines/engineCapabilities";
-    import { PerfCounter } from "babylonjs/Misc/perfCounter";
     import { Observable } from "babylonjs/Misc/observable";
     import { DepthCullingState } from "babylonjs/States/depthCullingState";
     import { StencilState } from "babylonjs/States/stencilState";
@@ -30034,11 +29994,11 @@ declare module "babylonjs/Engines/thinEngine" {
     import { WebGLPipelineContext } from "babylonjs/Engines/WebGL/webGLPipelineContext";
     import { VertexBuffer } from "babylonjs/Meshes/buffer";
     import { InstancingAttributeInfo } from "babylonjs/Engines/instancingAttributeInfo";
-    import { WebRequest } from "babylonjs/Misc/webRequest";
     import { DepthTextureCreationOptions } from "babylonjs/Engines/depthTextureCreationOptions";
     import { BaseTexture } from "babylonjs/Materials/Textures/baseTexture";
     import { IOfflineProvider } from "babylonjs/Offline/IOfflineProvider";
     import { IEffectFallbacks } from "babylonjs/Materials/iEffectFallbacks";
+    import { IWebRequest } from "babylonjs/Misc/interfaces/iWebRequest";
     /**
      * Defines the interface used by objects working like Scene
      * @hidden
@@ -30187,8 +30147,6 @@ declare module "babylonjs/Engines/thinEngine" {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -30636,6 +30594,8 @@ declare module "babylonjs/Engines/thinEngine" {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -31093,7 +31053,7 @@ declare module "babylonjs/Engines/thinEngine" {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -31855,6 +31815,86 @@ declare module "babylonjs/Misc/performanceMonitor" {
         protected _wrapPosition(i: number): number;
     }
 }
+declare module "babylonjs/Misc/perfCounter" {
+    /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
 declare module "babylonjs/Engines/engine" {
     import { Observable } from "babylonjs/Misc/observable";
     import { Nullable, IndicesArray } from "babylonjs/types";
@@ -31868,10 +31908,10 @@ declare module "babylonjs/Engines/engine" {
     import { ICustomAnimationFrameRequester } from "babylonjs/Misc/customAnimationFrameRequester";
     import { ThinEngine, EngineOptions } from "babylonjs/Engines/thinEngine";
     import { IViewportLike, IColor4Like } from "babylonjs/Maths/math.like";
-    import { RenderTargetCreationOptions } from "babylonjs/Materials/Textures/renderTargetCreationOptions";
     import { RenderTargetTexture } from "babylonjs/Materials/Textures/renderTargetTexture";
     import { PerformanceMonitor } from "babylonjs/Misc/performanceMonitor";
     import { DataBuffer } from "babylonjs/Meshes/dataBuffer";
+    import { PerfCounter } from "babylonjs/Misc/perfCounter";
     import { Material } from "babylonjs/Materials/material";
     import { PostProcess } from "babylonjs/PostProcesses/postProcess";
     /**
@@ -32212,6 +32252,8 @@ declare module "babylonjs/Engines/engine" {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -32512,6 +32554,7 @@ declare module "babylonjs/Engines/engine" {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -32679,16 +32722,6 @@ declare module "babylonjs/Engines/engine" {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -46086,6 +46119,7 @@ declare module "babylonjs/Engines/Extensions/index" {
     export * from "babylonjs/Engines/Extensions/engine.multiRender";
     export * from "babylonjs/Engines/Extensions/engine.cubeTexture";
     export * from "babylonjs/Engines/Extensions/engine.renderTarget";
+    export * from "babylonjs/Engines/Extensions/engine.renderTargetCube";
     export * from "babylonjs/Engines/Extensions/engine.webVR";
     export * from "babylonjs/Engines/Extensions/engine.uniformBuffer";
 }
@@ -46110,7 +46144,7 @@ declare module "babylonjs/Misc/environmentTextureTools" {
     import { SphericalPolynomial } from "babylonjs/Maths/sphericalPolynomial";
     import { InternalTexture } from "babylonjs/Materials/Textures/internalTexture";
     import { CubeTexture } from "babylonjs/Materials/Textures/cubeTexture";
-    import "babylonjs/Engines/Extensions/engine.renderTarget";
+    import "babylonjs/Engines/Extensions/engine.renderTargetCube";
     import "babylonjs/Shaders/rgbdEncode.fragment";
     import "babylonjs/Shaders/rgbdDecode.fragment";
     /**
@@ -48381,6 +48415,7 @@ declare module "babylonjs/Helpers/photoDome" {
 }
 declare module "babylonjs/Misc/rgbdTextureTools" {
     import "babylonjs/Shaders/rgbdDecode.fragment";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import { Texture } from "babylonjs/Materials/Textures/texture";
     /**
      * Class used to host RGBD texture specific utilities
@@ -54839,7 +54874,9 @@ declare module "babylonjs/Materials/Textures/htmlElementTexture" {
     import { Nullable } from "babylonjs/types";
     import { BaseTexture } from "babylonjs/Materials/Textures/baseTexture";
     import { Matrix } from "babylonjs/Maths/math.vector";
-    import { Engine } from "babylonjs/Engines/engine";
+    import "babylonjs/Engines/Extensions/engine.dynamicTexture";
+    import "babylonjs/Engines/Extensions/engine.videoTexture";
+    import { ThinEngine } from "babylonjs/Engines/thinEngine";
     import { Scene } from "babylonjs/scene";
     /**
      * Defines the options related to the creation of an HtmlElementTexture
@@ -54856,7 +54893,7 @@ declare module "babylonjs/Materials/Textures/htmlElementTexture" {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -58285,10 +58322,11 @@ declare module "babylonjs/Materials/Node/index" {
 declare module "babylonjs/Materials/effectRenderer" {
     import { Nullable } from "babylonjs/types";
     import { Texture } from "babylonjs/Materials/Textures/texture";
-    import { Engine } from "babylonjs/Engines/engine";
+    import { ThinEngine } from "babylonjs/Engines/thinEngine";
     import { Viewport } from "babylonjs/Maths/math.viewport";
     import { Observable } from "babylonjs/Misc/observable";
     import { Effect } from "babylonjs/Materials/effect";
+    import "babylonjs/Engines/Extensions/engine.renderTarget";
     import "babylonjs/Shaders/postprocess.vertex";
     /**
      * Effect Render Options
@@ -58320,7 +58358,7 @@ declare module "babylonjs/Materials/effectRenderer" {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -58360,7 +58398,7 @@ declare module "babylonjs/Materials/effectRenderer" {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */
@@ -67162,9 +67200,28 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * Interface used to define the mechanism to get data from the network
+     */
+    export interface IWebRequest {
+        /**
+         * Returns client's response url
+         */
+        responseURL: string;
+        /**
+         * Returns client's status
+         */
+        status: number;
+        /**
+         * Returns client's status as a text
+         */
+        statusText: string;
+    }
+}
+declare module BABYLON {
+    /**
      * Extended version of XMLHttpRequest with support for customizations (headers, ...)
      */
-    export class WebRequest {
+    export class WebRequest implements IWebRequest {
         private _xhr;
         /**
          * Custom HTTP Request Headers to be sent with XMLHttpRequests
@@ -75093,6 +75150,20 @@ declare module BABYLON {
     };
 }
 declare module BABYLON {
+        interface ThinEngine {
+            /**
+             * Creates a new render target texture
+             * @param size defines the size of the texture
+             * @param options defines the options used to create the texture
+             * @returns a new render target texture stored in an InternalTexture
+             */
+            createRenderTargetTexture(size: number | {
+                width: number;
+                height: number;
+            }, options: boolean | RenderTargetCreationOptions): InternalTexture;
+        }
+}
+declare module BABYLON {
     /** Defines supported spaces */
     export enum Space {
         /** Local (object) space */
@@ -95566,86 +95637,6 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
-     * This class is used to track a performance counter which is number based.
-     * The user has access to many properties which give statistics of different nature.
-     *
-     * The implementer can track two kinds of Performance Counter: time and count.
-     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
-     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
-     */
-    export class PerfCounter {
-        /**
-         * Gets or sets a global boolean to turn on and off all the counters
-         */
-        static Enabled: boolean;
-        /**
-         * Returns the smallest value ever
-         */
-        readonly min: number;
-        /**
-         * Returns the biggest value ever
-         */
-        readonly max: number;
-        /**
-         * Returns the average value since the performance counter is running
-         */
-        readonly average: number;
-        /**
-         * Returns the average value of the last second the counter was monitored
-         */
-        readonly lastSecAverage: number;
-        /**
-         * Returns the current value
-         */
-        readonly current: number;
-        /**
-         * Gets the accumulated total
-         */
-        readonly total: number;
-        /**
-         * Gets the total value count
-         */
-        readonly count: number;
-        /**
-         * Creates a new counter
-         */
-        constructor();
-        /**
-         * Call this method to start monitoring a new frame.
-         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
-         */
-        fetchNewFrame(): void;
-        /**
-         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
-         * @param newCount the count value to add to the monitored count
-         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
-         */
-        addCount(newCount: number, fetchResult: boolean): void;
-        /**
-         * Start monitoring this performance counter
-         */
-        beginMonitoring(): void;
-        /**
-         * Compute the time lapsed since the previous beginMonitoring() call.
-         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
-         */
-        endMonitoring(newFrame?: boolean): void;
-        private _fetchResult;
-        private _startMonitoringTime;
-        private _min;
-        private _max;
-        private _average;
-        private _current;
-        private _totalValueCount;
-        private _totalAccumulated;
-        private _lastSecAverage;
-        private _lastSecAccumulated;
-        private _lastSecTime;
-        private _lastSecValueCount;
-    }
-}
-declare module BABYLON {
-    /**
      * @hidden
      **/
     export class DepthCullingState {
@@ -96069,8 +96060,6 @@ declare module BABYLON {
         _caps: EngineCapabilities;
         private _isStencilEnable;
         protected _colorWrite: boolean;
-        /** @hidden */
-        _drawCalls: PerfCounter;
         private _glVersion;
         private _glRenderer;
         private _glVendor;
@@ -96518,6 +96507,8 @@ declare module BABYLON {
         drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void;
         private _drawMode;
         /** @hidden */
+        protected _reportDrawCall(): void;
+        /** @hidden */
         _releaseEffect(effect: Effect): void;
         /** @hidden */
         _deletePipelineContext(pipelineContext: IPipelineContext): void;
@@ -96975,7 +96966,7 @@ declare module BABYLON {
         /** @hidden */
         _getRGBAMultiSampleBufferFormat(type: number): number;
         /** @hidden */
-        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest;
+        _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest;
         /**
          * Gets a boolean indicating if the engine can be instanciated (ie. if a webGL context can be found)
          * @returns true if the engine can be created
@@ -97729,6 +97720,86 @@ declare module BABYLON {
 }
 declare module BABYLON {
     /**
+     * This class is used to track a performance counter which is number based.
+     * The user has access to many properties which give statistics of different nature.
+     *
+     * The implementer can track two kinds of Performance Counter: time and count.
+     * For time you can optionally call fetchNewFrame() to notify the start of a new frame to monitor, then call beginMonitoring() to start and endMonitoring() to record the lapsed time. endMonitoring takes a newFrame parameter for you to specify if the monitored time should be set for a new frame or accumulated to the current frame being monitored.
+     * For count you first have to call fetchNewFrame() to notify the start of a new frame to monitor, then call addCount() how many time required to increment the count value you monitor.
+     */
+    export class PerfCounter {
+        /**
+         * Gets or sets a global boolean to turn on and off all the counters
+         */
+        static Enabled: boolean;
+        /**
+         * Returns the smallest value ever
+         */
+        readonly min: number;
+        /**
+         * Returns the biggest value ever
+         */
+        readonly max: number;
+        /**
+         * Returns the average value since the performance counter is running
+         */
+        readonly average: number;
+        /**
+         * Returns the average value of the last second the counter was monitored
+         */
+        readonly lastSecAverage: number;
+        /**
+         * Returns the current value
+         */
+        readonly current: number;
+        /**
+         * Gets the accumulated total
+         */
+        readonly total: number;
+        /**
+         * Gets the total value count
+         */
+        readonly count: number;
+        /**
+         * Creates a new counter
+         */
+        constructor();
+        /**
+         * Call this method to start monitoring a new frame.
+         * This scenario is typically used when you accumulate monitoring time many times for a single frame, you call this method at the start of the frame, then beginMonitoring to start recording and endMonitoring(false) to accumulated the recorded time to the PerfCounter or addCount() to accumulate a monitored count.
+         */
+        fetchNewFrame(): void;
+        /**
+         * Call this method to monitor a count of something (e.g. mesh drawn in viewport count)
+         * @param newCount the count value to add to the monitored count
+         * @param fetchResult true when it's the last time in the frame you add to the counter and you wish to update the statistics properties (min/max/average), false if you only want to update statistics.
+         */
+        addCount(newCount: number, fetchResult: boolean): void;
+        /**
+         * Start monitoring this performance counter
+         */
+        beginMonitoring(): void;
+        /**
+         * Compute the time lapsed since the previous beginMonitoring() call.
+         * @param newFrame true by default to fetch the result and monitor a new frame, if false the time monitored will be added to the current frame counter
+         */
+        endMonitoring(newFrame?: boolean): void;
+        private _fetchResult;
+        private _startMonitoringTime;
+        private _min;
+        private _max;
+        private _average;
+        private _current;
+        private _totalValueCount;
+        private _totalAccumulated;
+        private _lastSecAverage;
+        private _lastSecAccumulated;
+        private _lastSecTime;
+        private _lastSecValueCount;
+    }
+}
+declare module BABYLON {
+    /**
      * Defines the interface used by display changed events
      */
     export interface IDisplayChangedEventArgs {
@@ -98066,6 +98137,8 @@ declare module BABYLON {
         protected readonly _supportsHardwareTextureRescaling: boolean;
         private _fps;
         private _deltaTime;
+        /** @hidden */
+        _drawCalls: PerfCounter;
         /**
          * Turn this value on if you want to pause FPS computation when in background
          */
@@ -98366,6 +98439,7 @@ declare module BABYLON {
          * Disable previously set scissor test rectangle
          */
         disableScissor(): void;
+        protected _reportDrawCall(): void;
         /**
          * Initializes a webVR display and starts listening to display change events
          * The onVRDisplayChangedObservable will be notified upon these changes
@@ -98533,16 +98607,6 @@ declare module BABYLON {
          */
         updateDynamicIndexBuffer(indexBuffer: DataBuffer, indices: IndicesArray, offset?: number): void;
         /**
-         * Creates a new render target texture
-         * @param size defines the size of the texture
-         * @param options defines the options used to create the texture
-         * @returns a new render target texture stored in an InternalTexture
-         */
-        createRenderTargetTexture(size: number | {
-            width: number;
-            height: number;
-        }, options: boolean | RenderTargetCreationOptions): InternalTexture;
-        /**
          * Updates the sample count of a render target texture
          * @see http://doc.babylonjs.com/features/webgl2#multisample-render-targets
          * @param texture defines the texture to update
@@ -119185,7 +119249,7 @@ declare module BABYLON {
         /**
          * Defines the engine instance to use the texture with. It is not mandatory if you define a scene.
          */
-        engine: Nullable<Engine>;
+        engine: Nullable<ThinEngine>;
         /**
          * Defines the scene the texture belongs to. It is not mandatory if you define an engine.
          */
@@ -122254,7 +122318,7 @@ declare module BABYLON {
          * @param engine the engine to use for rendering
          * @param options defines the options of the effect renderer
          */
-        constructor(engine: Engine, options?: IEffectRendererOptions);
+        constructor(engine: ThinEngine, options?: IEffectRendererOptions);
         /**
          * Sets the current viewport in normalized coordinates 0-1
          * @param viewport Defines the viewport to set (defaults to 0 0 1 1)
@@ -122294,7 +122358,7 @@ declare module BABYLON {
         /**
          * Engine to use to create the effect
          */
-        engine: Engine;
+        engine: ThinEngine;
         /**
          * Fragment shader for the effect
          */

nodeEditor/src/components/diagram/texture/texturePropertyTabComponent.tsx

@@ -15,27 +15,29 @@ import { FloatLineComponent } from '../../../sharedComponents/floatLineComponent
 import { ButtonLineComponent } from '../../../sharedComponents/buttonLineComponent';
 import { ReflectionTextureNodeModel } from '../reflectionTexture/reflectionTextureNodeModel';
 import { CubeTexture } from 'babylonjs/Materials/Textures/cubeTexture';
+import { OptionsLineComponent } from '../../../sharedComponents/optionsLineComponent';
 
 interface ITexturePropertyTabComponentProps {
     globalState: GlobalState;
     node: TextureNodeModel | ReflectionTextureNodeModel;
 }
 
-export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps, {isEmbedded: boolean}> {
+export class TexturePropertyTabComponent extends React.Component<ITexturePropertyTabComponentProps, {isEmbedded: boolean, loadAsCubeTexture: boolean}> {
 
     constructor(props: ITexturePropertyTabComponentProps) {
         super(props);
 
         let texture = this.props.node.texture as BaseTexture;
 
-        this.state = {isEmbedded: !texture || texture.name.substring(0, 4) !== "http"};
+        this.state = {isEmbedded: !texture || texture.name.substring(0, 4) !== "http", loadAsCubeTexture: texture && texture.isCube};
     }
 
-    UNSAFE_componentWillUpdate(nextProps: ITexturePropertyTabComponentProps, nextState: {isEmbedded: boolean}) {
+    UNSAFE_componentWillUpdate(nextProps: ITexturePropertyTabComponentProps, nextState: {isEmbedded: boolean, loadAsCubeTexture: boolean}) {
         if (nextProps.node !== this.props.node) {
             let texture = nextProps.node.texture as BaseTexture;
 
             nextState.isEmbedded = !texture || texture.name.substring(0, 4) !== "http";
+            nextState.loadAsCubeTexture = texture && texture.isCube;
         }
     }
 
@@ -50,6 +52,7 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
     updateAfterTextureLoad() {
         this.props.globalState.onUpdateRequiredObservable.notifyObservers();
         this.props.globalState.onRebuildRequiredObservable.notifyObservers();
+        this.forceUpdate();
     }
 
 	/**
@@ -62,11 +65,18 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
         }
 
         let texture = this.props.node.texture as BaseTexture;
+
+        if (texture && texture.isCube !== this.state.loadAsCubeTexture) {
+            texture.dispose();
+            (texture as any) = null;
+        }
+
         if (!texture) {
 
-            if (this.props.node instanceof TextureNodeModel) {
+            if (!this.state.loadAsCubeTexture) {
                 this.props.node.texture = new Texture(null, this.props.globalState.nodeMaterial.getScene(), false, false);
                 texture = this.props.node.texture;
+                texture.coordinatesMode = Texture.EQUIRECTANGULAR_MODE;
             } else {
                 this.props.node.texture = new CubeTexture("", this.props.globalState.nodeMaterial.getScene());
                 texture = this.props.node.texture;
@@ -82,18 +92,14 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
             reader.onloadend = () => {
                 let base64data = reader.result as string;                
 
-                if (texture.isCube || this.props.node instanceof ReflectionTextureNodeModel) {
-                    let extension: string | undefined = undefined;
-                    if (file.name.toLowerCase().indexOf(".dds") > 0) {
-                        extension = ".dds";
-                    } else if (file.name.toLowerCase().indexOf(".env") > 0) {
-                        extension = ".env";
-                    }
-
-                    (texture as Texture).updateURL(base64data, extension, () => this.updateAfterTextureLoad());
-                } else {
-                    (texture as Texture).updateURL(base64data, null, () => this.updateAfterTextureLoad());
+                let extension: string | undefined = undefined;
+                if (file.name.toLowerCase().indexOf(".dds") > 0) {
+                    extension = ".dds";
+                } else if (file.name.toLowerCase().indexOf(".env") > 0) {
+                    extension = ".env";
                 }
+
+                (texture as Texture).updateURL(base64data, extension, () => this.updateAfterTextureLoad());
             }
         }, undefined, true);
     }
@@ -132,17 +138,56 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
         url = url.replace(/\?nocache=\d+/, "");
 
         let isInReflectionMode = this.props.node instanceof ReflectionTextureNodeModel;
+
+        var reflectionModeOptions: {label: string, value: number}[] = [
+            {
+                label: "Cubic", value: Texture.CUBIC_MODE
+            },
+            {                
+                label: "Equirectangular", value: Texture.EQUIRECTANGULAR_MODE
+            },
+            {
+                label: "Explicit", value: Texture.EXPLICIT_MODE
+            },
+            {
+                label: "Fixed equirectangular", value: Texture.FIXED_EQUIRECTANGULAR_MODE
+            },
+            {
+                label: "Fixed mirrored equirectangular", value: Texture.FIXED_EQUIRECTANGULAR_MIRRORED_MODE
+            },
+            {
+                label: "Planar", value: Texture.PLANAR_MODE
+            },              
+            {
+                label: "Projection", value: Texture.PROJECTION_MODE
+            },         
+            {
+                label: "Skybox", value: Texture.SKYBOX_MODE
+            },         
+            {
+                label: "Spherical", value: Texture.SPHERICAL_MODE
+            },
+        ];
         
         return (
             <div>
                 <LineContainerComponent title="GENERAL">
-                    <TextLineComponent label="Type" value="Texture" />
+                    <TextLineComponent label="Type" value={this.props.node.block!.getClassName()} />
                     <TextInputLineComponent globalState={this.props.globalState} label="Name" propertyName="name" target={this.props.node.block!} onChange={() => this.props.globalState.onUpdateRequiredObservable.notifyObservers()} />
                 </LineContainerComponent>
                 <LineContainerComponent title="PROPERTIES">
                     <CheckBoxLineComponent label="Auto select UV" propertyName="autoSelectUV" target={this.props.node.block!} onValueChanged={() => {                        
                         this.props.globalState.onUpdateRequiredObservable.notifyObservers();
-                    }}/> {
+                    }}/> 
+                    {
+                        texture && isInReflectionMode &&
+                        <OptionsLineComponent label="Reflection mode" options={reflectionModeOptions} target={texture} propertyName="coordinatesMode" onSelect={(value: any) => {
+                            texture.coordinatesMode = value;
+                            this.forceUpdate();
+                            this.props.globalState.onUpdateRequiredObservable.notifyObservers();
+                        }} />
+                    }                    
+                    {
                         texture && !isInReflectionMode &&
                         <CheckBoxLineComponent label="Gamma space" propertyName="gammaSpace" target={texture} onValueChanged={() => {                        
                             this.props.globalState.onUpdateRequiredObservable.notifyObservers();
@@ -224,6 +269,11 @@ export class TexturePropertyTabComponent extends React.Component<ITexturePropert
                         this.updateAfterTextureLoad();
                     }}/>
                     {
+                        isInReflectionMode &&
+                        <CheckBoxLineComponent label="Load as cube texture" isSelected={() => this.state.loadAsCubeTexture} 
+                            onSelect={value => this.setState({loadAsCubeTexture: value})}/> 
+                    }
+                    {
                         this.state.isEmbedded &&
                         <FileButtonLineComponent label="Upload" onClick={(file) => this.replaceTexture(file)} accept=".jpg, .png, .tga, .dds, .env" />
                     }

nodeEditor/src/components/preview/previewManager.ts

@@ -178,7 +178,10 @@ export class PreviewManager {
         
             switch (this._globalState.previewMeshType) {
                 case PreviewMeshType.Box:
-                    this._meshes.push(Mesh.CreateBox("dummy-box", 2, this._scene));
+                    SceneLoader.AppendAsync("https://models.babylonjs.com/", "roundedCube.glb", this._scene).then(() => {     
+                        this._meshes.push(...this._scene.meshes);
+                        this._prepareMeshes();
+                    });     
                     break;
                 case PreviewMeshType.Sphere:
                     this._meshes.push(Mesh.CreateSphere("dummy-sphere", 32, 2, this._scene));

src/Engines/Extensions/engine.cubeTexture.ts

@@ -4,9 +4,9 @@ import { Logger } from '../../Misc/logger';
 import { Nullable } from '../../types';
 import { Scene } from '../../scene';
 import { IInternalTextureLoader } from '../../Materials/Textures/internalTextureLoader';
-import { WebRequest } from '../../Misc/webRequest';
 import { FileTools } from '../../Misc/fileTools';
 import { DepthTextureCreationOptions } from '../depthTextureCreationOptions';
+import { IWebRequest } from '../../Misc/interfaces/iWebRequest';
 
 declare module "../../Engines/thinEngine" {
     export interface ThinEngine {
@@ -125,7 +125,8 @@ ThinEngine.prototype._createDepthStencilCubeTexture = function(size: number, opt
     return internalTexture;
 };
 
-ThinEngine.prototype._partialLoadFile = function(url: string, index: number, loadedFiles: (string | ArrayBuffer)[], onfinish: (files: (string | ArrayBuffer)[]) => void, onErrorCallBack: Nullable<(message?: string, exception?: any) => void> = null): void {
+ThinEngine.prototype._partialLoadFile = function(url: string, index: number, loadedFiles: (string | ArrayBuffer)[],
+        onfinish: (files: (string | ArrayBuffer)[]) => void, onErrorCallBack: Nullable<(message?: string, exception?: any) => void> = null): void {
     var onload = (data: string | ArrayBuffer) => {
         loadedFiles[index] = data;
         (<any>loadedFiles)._internalCount++;
@@ -135,7 +136,7 @@ ThinEngine.prototype._partialLoadFile = function(url: string, index: number, loa
         }
     };
 
-    const onerror = (request?: WebRequest, exception?: any) => {
+    const onerror = (request?: IWebRequest, exception?: any) => {
         if (onErrorCallBack && request) {
             onErrorCallBack(request.status + " " + request.statusText, exception);
         }
@@ -224,7 +225,7 @@ ThinEngine.prototype.createCubeTexture = function(rootUrl: string, scene: Nullab
         }
     }
 
-    let onInternalError = (request?: WebRequest, exception?: any) => {
+    let onInternalError = (request?: IWebRequest, exception?: any) => {
         if (loader) {
             const fallbackUrl = loader.getFallbackTextureUrl(texture.url, this._textureFormatInUse);
             Logger.Warn((loader.constructor as any).name + " failed when trying to load " + texture.url + ", falling back to the next supported loader");

src/Engines/Extensions/engine.rawTexture.ts

@@ -4,9 +4,9 @@ import { InternalTexture, InternalTextureSource } from '../../Materials/Textures
 import { Logger } from '../../Misc/logger';
 import { Tools } from '../../Misc/tools';
 import { Scene } from '../../scene';
-import { WebRequest } from '../../Misc/webRequest';
 import { Constants } from '../constants';
 import { Engine } from '../engine';
+import { IWebRequest } from '../../Misc/interfaces/iWebRequest';
 
 declare module "../../Engines/engine" {
     export interface Engine {
@@ -389,7 +389,7 @@ Engine.prototype.createRawCubeTextureFromUrl = function(url: string, scene: Scen
     texture.url = url;
     this._internalTexturesCache.push(texture);
 
-    var onerror = (request?: WebRequest, exception?: any) => {
+    var onerror = (request?: IWebRequest, exception?: any) => {
         scene._removePendingData(texture);
         if (onError && request) {
             onError(request.status + " " + request.statusText, exception);

src/Engines/engine.ts

@@ -18,6 +18,7 @@ import { IViewportLike, IColor4Like } from '../Maths/math.like';
 import { RenderTargetTexture } from '../Materials/Textures/renderTargetTexture';
 import { PerformanceMonitor } from '../Misc/performanceMonitor';
 import { DataBuffer } from '../Meshes/dataBuffer';
+import { PerfCounter } from '../Misc/perfCounter';
 
 declare type Material = import("../Materials/material").Material;
 declare type PostProcess = import("../PostProcesses/postProcess").PostProcess;
@@ -432,6 +433,10 @@ export class Engine extends ThinEngine {
     // FPS
     private _fps = 60;
     private _deltaTime = 0;
+
+    /** @hidden */
+    public _drawCalls = new PerfCounter();
+
     /**
      * Turn this value on if you want to pause FPS computation when in background
      */
@@ -1166,6 +1171,10 @@ export class Engine extends ThinEngine {
         gl.disable(gl.SCISSOR_TEST);
     }
 
+    protected _reportDrawCall() {
+        this._drawCalls.addCount(1, false);
+    }
+
     /**
      * Initializes a webVR display and starts listening to display change events
      * The onVRDisplayChangedObservable will be notified upon these changes

src/Engines/nativeEngine.ts

@@ -22,6 +22,7 @@ import { Logger } from "../Misc/logger";
 import { Constants } from './constants';
 import { ThinEngine } from './thinEngine';
 import { EngineCapabilities } from './engineCapabilities';
+import { IWebRequest } from '../Misc/interfaces/iWebRequest';
 
 interface INativeEngine {
     requestAnimationFrame(callback: () => void): void;
@@ -1042,7 +1043,7 @@ export class NativeEngine extends Engine {
                 throw new Error(`Multi-file loading not yet supported.`);
             }
             else {
-                let onInternalError = (request?: WebRequest, exception?: any) => {
+                let onInternalError = (request?: IWebRequest, exception?: any) => {
                     if (onError && request) {
                         onError(request.status + " " + request.statusText, exception);
                     }

src/Engines/thinEngine.ts

@@ -6,7 +6,6 @@ import { IShaderProcessor } from './Processors/iShaderProcessor';
 import { UniformBuffer } from '../Materials/uniformBuffer';
 import { Nullable, DataArray, IndicesArray } from '../types';
 import { EngineCapabilities } from './engineCapabilities';
-import { PerfCounter } from '../Misc/perfCounter';
 import { Observable } from '../Misc/observable';
 import { DepthCullingState } from '../States/depthCullingState';
 import { StencilState } from '../States/stencilState';
@@ -24,12 +23,12 @@ import { IPipelineContext } from './IPipelineContext';
 import { WebGLPipelineContext } from './WebGL/webGLPipelineContext';
 import { VertexBuffer } from '../Meshes/buffer';
 import { InstancingAttributeInfo } from './instancingAttributeInfo';
-import { WebRequest } from '../Misc/webRequest';
 import { FileTools } from '../Misc/fileTools';
 import { DepthTextureCreationOptions } from './depthTextureCreationOptions';
 import { BaseTexture } from '../Materials/Textures/baseTexture';
 import { IOfflineProvider } from '../Offline/IOfflineProvider';
 import { IEffectFallbacks } from '../Materials/iEffectFallbacks';
+import { IWebRequest } from '../Misc/interfaces/iWebRequest';
 
 declare type Observer<T> = import("../Misc/observable").Observer<T>;
 declare type VideoTexture = import("../Materials/Textures/videoTexture").VideoTexture;
@@ -254,9 +253,6 @@ export class ThinEngine {
     private _isStencilEnable: boolean;
     protected _colorWrite = true;
 
-    /** @hidden */
-    public _drawCalls = new PerfCounter();
-
     private _glVersion: string;
     private _glRenderer: string;
     private _glVendor: string;
@@ -1879,7 +1875,8 @@ export class ThinEngine {
         // Apply states
         this.applyStates();
 
-        this._drawCalls.addCount(1, false);
+        this._reportDrawCall();
+
         // Render
 
         const drawMode = this._drawMode(fillMode);
@@ -1902,7 +1899,8 @@ export class ThinEngine {
     public drawArraysType(fillMode: number, verticesStart: number, verticesCount: number, instancesCount?: number): void {
         // Apply states
         this.applyStates();
-        this._drawCalls.addCount(1, false);
+
+        this._reportDrawCall();
 
         const drawMode = this._drawMode(fillMode);
         if (instancesCount) {
@@ -1939,6 +1937,11 @@ export class ThinEngine {
         }
     }
 
+    /** @hidden */
+    protected _reportDrawCall() {
+        // Will be implemented by children
+    }
+
     // Shaders
 
     /** @hidden */
@@ -2832,7 +2835,7 @@ export class ThinEngine {
             };
 
             if (!buffer) {
-                this._loadFile(url, callback, undefined, scene ? scene.offlineProvider : undefined, true, (request?: WebRequest, exception?: any) => {
+                this._loadFile(url, callback, undefined, scene ? scene.offlineProvider : undefined, true, (request?: IWebRequest, exception?: any) => {
                     onInternalError("Unable to load " + (request ? request.responseURL : url, exception));
                 });
             } else {
@@ -4202,7 +4205,8 @@ export class ThinEngine {
     }
 
     /** @hidden */
-    public _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void, offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: WebRequest, exception?: any) => void): IFileRequest {
+    public _loadFile(url: string, onSuccess: (data: string | ArrayBuffer, responseURL?: string) => void, onProgress?: (data: any) => void,
+    offlineProvider?: IOfflineProvider, useArrayBuffer?: boolean, onError?: (request?: IWebRequest, exception?: any) => void): IFileRequest {
         let request = FileTools.LoadFile(url, onSuccess, onProgress, offlineProvider, useArrayBuffer, onError);
         this._activeRequests.push(request);
         request.onCompleteObservable.add((request) => {

src/Materials/Node/Blocks/Dual/reflectionTextureBlock.ts

@@ -17,6 +17,7 @@ import { Constants } from '../../../../Engines/constants';
 
 import "../../../../Shaders/ShadersInclude/reflectionFunction";
 import { CubeTexture } from '../../../Textures/cubeTexture';
+import { Texture } from '../../../Textures/texture';
 
 /**
  * Block used to read a reflection texture from a sampler
@@ -336,7 +337,6 @@ export class ReflectionTextureBlock extends NodeMaterialBlock {
         let view = `${this.view.associatedVariableName}`;
 
         state.compilationString += `vec3 ${this._reflectionColorName};\r\n`;
-        state.compilationString += `#ifdef ${this._define3DName}\r\n`;
         state.compilationString += `#ifdef ${this._defineMirroredEquirectangularFixedName}\r\n`;
         state.compilationString += `    vec3 ${this._reflectionCoordsName} = computeMirroredFixedEquirectangularCoords(${worldPos}, ${worldNormal}, ${direction});\r\n`;
         state.compilationString += `#endif\r\n`;
@@ -377,6 +377,7 @@ export class ReflectionTextureBlock extends NodeMaterialBlock {
         state.compilationString += `    vec3 ${this._reflectionCoordsName} = vec3(0, 0, 0);\r\n`;
         state.compilationString += `#endif\r\n`;
 
+        state.compilationString += `#ifdef ${this._define3DName}\r\n`;
         state.compilationString += `${this._reflectionColorName} = textureCube(${this._cubeSamplerName}, ${this._reflectionCoordsName}).rgb;\r\n`;
         state.compilationString += `#else\r\n`;
         state.compilationString += `vec2 ${this._reflection2DCoordsName} = ${this._reflectionCoordsName}.xy;\r\n`;
@@ -412,7 +413,11 @@ export class ReflectionTextureBlock extends NodeMaterialBlock {
         super._deserialize(serializationObject, scene, rootUrl);
 
         if (serializationObject.texture) {
-            this.texture = CubeTexture.Parse(serializationObject.texture, scene, rootUrl);
+            if (serializationObject.texture.isCube) {
+                this.texture = CubeTexture.Parse(serializationObject.texture, scene, rootUrl);
+            } else {
+                this.texture = Texture.Parse(serializationObject.texture, scene, rootUrl);
+            }
         }
     }
 }

src/Meshes/mesh.ts

@@ -1468,7 +1468,10 @@ export class Mesh extends AbstractMesh implements IGetSetVerticesData {
                 batchCache.visibleInstances[subMeshId] = visibleInstances[defaultRenderId];
             }
         }
-        batchCache.hardwareInstancedRendering[subMeshId] = this._instanceDataStorage.hardwareInstancedRendering && (batchCache.visibleInstances[subMeshId] !== null) && (batchCache.visibleInstances[subMeshId] !== undefined);
+        batchCache.hardwareInstancedRendering[subMeshId] =
+                        this._instanceDataStorage.hardwareInstancedRendering
+                        && (batchCache.visibleInstances[subMeshId] !== null)
+                        && (batchCache.visibleInstances[subMeshId] !== undefined);
         this._instanceDataStorage.previousBatch = batchCache;
         return batchCache;
     }
@@ -1688,15 +1691,27 @@ export class Mesh extends AbstractMesh implements IGetSetVerticesData {
 
         var sideOrientation: Nullable<number>;
 
-        if (!instanceDataStorage.isFrozen) {
+        if (!instanceDataStorage.isFrozen && this._effectiveMaterial.backFaceCulling) {
+            let mainDeterminant = effectiveMesh._getWorldMatrixDeterminant();
             sideOrientation = this.overrideMaterialSideOrientation;
             if (sideOrientation == null) {
                 sideOrientation = this._effectiveMaterial.sideOrientation;
             }
-            if (effectiveMesh._getWorldMatrixDeterminant() < 0) {
+            if (mainDeterminant < 0) {
                 sideOrientation = (sideOrientation === Material.ClockWiseSideOrientation ? Material.CounterClockWiseSideOrientation : Material.ClockWiseSideOrientation);
             }
             instanceDataStorage.sideOrientation = sideOrientation!;
+
+            let visibleInstances = batch.visibleInstances[subMesh._id];
+            if (visibleInstances) {
+                for (var instance of visibleInstances) {
+                    if (mainDeterminant !== instance._getWorldMatrixDeterminant()) {
+                        this._effectiveMaterial.backFaceCulling = false; // Turn off back face culling as one of the instance is having an incompatible world matrix
+                        break;
+                    }
+                }
+            }
+
         } else {
             sideOrientation = instanceDataStorage.sideOrientation;
         }

src/Misc/interfaces/iWebRequest.ts

@@ -0,0 +1,18 @@
+
+/**
+ * Interface used to define the mechanism to get data from the network
+ */
+export interface IWebRequest {
+    /**
+     * Returns client's response url
+     */
+    responseURL: string;
+    /**
+     * Returns client's status
+     */
+    status: number;
+    /**
+     * Returns client's status as a text
+     */
+    statusText: string;
+}

src/Misc/webRequest.ts

@@ -1,7 +1,9 @@
+import { IWebRequest } from './interfaces/iWebRequest';
+
 /**
  * Extended version of XMLHttpRequest with support for customizations (headers, ...)
  */
-export class WebRequest {
+export class WebRequest implements IWebRequest {
     private _xhr = new XMLHttpRequest();
 
     /**