Merge pull request #2712 from BabylonJS/master

Nightly

Tools/Gulp/config.json

@@ -68,6 +68,7 @@
                 "../../src/babylon.scene.js",
                 "../../src/Mesh/babylon.buffer.js",
                 "../../src/Mesh/babylon.vertexBuffer.js",
+                "../../src/Materials/Textures/babylon.internalTexture.js",
                 "../../src/Materials/Textures/babylon.baseTexture.js",
                 "../../src/Materials/Textures/babylon.texture.js",
                 "../../src/Mesh/babylon.mesh.js",

localDev/index.html

@@ -70,11 +70,13 @@
 					// call the scene creation from the js.
 					var scene = createScene();
 
-					// Register a render loop to repeatedly render the scene
-					engine.runRenderLoop(function () {
-						scene.render();
-						divFps.innerHTML = engine.getFps().toFixed() + " fps";
-					});
+					if (scene) {
+						// Register a render loop to repeatedly render the scene
+						engine.runRenderLoop(function () {
+							scene.render();
+							divFps.innerHTML = engine.getFps().toFixed() + " fps";
+						});
+					}
 
 					// Resize
 					window.addEventListener("resize", function () {

src/Layer/babylon.highlightlayer.ts

@@ -334,6 +334,7 @@ module BABYLON {
             this._mainTexture.updateSamplingMode(Texture.BILINEAR_SAMPLINGMODE);
             this._mainTexture.renderParticles = false;
             this._mainTexture.renderList = null;
+            this._mainTexture.ignoreCameraViewport = true;
 
             this._blurTexture = new RenderTargetTexture("HighlightLayerBlurRTT",
                 {
@@ -349,6 +350,7 @@ module BABYLON {
             this._blurTexture.anisotropicFilteringLevel = 16;
             this._blurTexture.updateSamplingMode(Texture.TRILINEAR_SAMPLINGMODE);
             this._blurTexture.renderParticles = false;
+            this._blurTexture.ignoreCameraViewport = true;
 
             this._downSamplePostprocess = new PassPostProcess("HighlightLayerPPP", this._options.blurTextureSizeRatio,
                 null, Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine());
@@ -388,7 +390,7 @@ module BABYLON {
 
                 this._scene.postProcessManager.directRender(
                     [this._downSamplePostprocess, this._horizontalBlurPostprocess, this._verticalBlurPostprocess],
-                    this._blurTexture.getInternalTexture());
+                    this._blurTexture.getInternalTexture(), true);
 
                 this.onAfterBlurObservable.notifyObservers(this);
             });
@@ -774,8 +776,8 @@ module BABYLON {
                 this._mainTextureDesiredSize.height = this._options.mainTextureFixedSize;
             }
             else {
-                this._mainTextureDesiredSize.width = this._engine.getRenderingCanvas().width * this._options.mainTextureRatio;
-                this._mainTextureDesiredSize.height = this._engine.getRenderingCanvas().height * this._options.mainTextureRatio;
+                this._mainTextureDesiredSize.width = this._engine.getRenderWidth() * this._options.mainTextureRatio;
+                this._mainTextureDesiredSize.height = this._engine.getRenderHeight() * this._options.mainTextureRatio;
 
                 this._mainTextureDesiredSize.width = this._engine.needPOTTextures ? Tools.GetExponentOfTwo(this._mainTextureDesiredSize.width, this._maxSize) : this._mainTextureDesiredSize.width;
                 this._mainTextureDesiredSize.height = this._engine.needPOTTextures ? Tools.GetExponentOfTwo(this._mainTextureDesiredSize.height, this._maxSize) : this._mainTextureDesiredSize.height;

src/Layer/babylon.layer.ts

@@ -70,6 +70,23 @@
 
             var engine = this._scene.getEngine();
 
+            this._rebuild();
+
+            // Effects
+            this._effect = engine.createEffect("layer",
+                [VertexBuffer.PositionKind],
+                ["textureMatrix", "color", "scale", "offset"],
+                ["textureSampler"], "");
+
+            this._alphaTestEffect = engine.createEffect("layer",
+                [VertexBuffer.PositionKind],
+                ["textureMatrix", "color", "scale", "offset"],
+                ["textureSampler"], "#define ALPHATEST");
+        }
+
+        public _rebuild(): void {
+            var engine = this._scene.getEngine();
+
             // VBO
             var vertices = [];
             vertices.push(1, 1);
@@ -91,17 +108,6 @@
             indices.push(3);
 
             this._indexBuffer = engine.createIndexBuffer(indices);
-
-            // Effects
-            this._effect = engine.createEffect("layer",
-                [VertexBuffer.PositionKind],
-                ["textureMatrix", "color", "scale", "offset"],
-                ["textureSampler"], "");
-
-            this._alphaTestEffect = engine.createEffect("layer",
-                [VertexBuffer.PositionKind],
-                ["textureMatrix", "color", "scale", "offset"],
-                ["textureSampler"], "#define ALPHATEST");
         }
 
         public render(): void {
@@ -119,7 +125,6 @@
             engine.enableEffect(currentEffect);
             engine.setState(false);
 
-
             // Texture
             currentEffect.setTexture("textureSampler", this.texture);
             currentEffect.setMatrix("textureMatrix", this.texture.getTextureMatrix());

src/Materials/Textures/Procedurals/babylon.proceduralTexture.ts

@@ -113,7 +113,7 @@
 
                     if (this._fallbackTexture) {
                         this._texture = this._fallbackTexture._texture;
-                        this._texture.references++;
+                        this._texture.incrementReferences();
                     }
 
                     this._fallbackTextureUsed = true;

src/Materials/Textures/babylon.baseTexture.ts

@@ -103,10 +103,8 @@
 
         public delayLoadState = Engine.DELAYLOADSTATE_NONE;
 
-        public _cachedAnisotropicFilteringLevel: number;
-
         private _scene: Scene;
-        public _texture: WebGLTexture;
+        public _texture: InternalTexture;
         private _uid: string;
 
         public get isBlocking(): boolean {
@@ -131,7 +129,7 @@
             return null;
         }
 
-        public getInternalTexture(): WebGLTexture {
+        public getInternalTexture(): InternalTexture {
             return this._texture;
         }
 
@@ -153,8 +151,8 @@
         }
 
         public getSize(): ISize {
-            if (this._texture._width) {
-                return new Size(this._texture._width, this._texture._height);
+            if (this._texture.width) {
+                return new Size(this._texture.width, this._texture.height);
             }
 
             if (this._texture._size) {
@@ -172,7 +170,7 @@
                 return new Size(this._texture._size, this._texture._size);
             }
 
-            return new Size(this._texture._baseWidth, this._texture._baseHeight);
+            return new Size(this._texture.baseWidth, this._texture.baseHeight);
         }
 
         public scale(ratio: number): void {
@@ -182,26 +180,14 @@
             return false;
         }
 
-        public _removeFromCache(url: string, noMipmap: boolean): void {
-            var texturesCache = this._scene.getEngine().getLoadedTexturesCache();
-            for (var index = 0; index < texturesCache.length; index++) {
-                var texturesCacheEntry = texturesCache[index];
-
-                if (texturesCacheEntry.url === url && texturesCacheEntry.generateMipMaps === !noMipmap) {
-                    texturesCache.splice(index, 1);
-                    return;
-                }
-            }
-        }
-
-        public _getFromCache(url: string, noMipmap: boolean, sampling?: number): WebGLTexture {
+        public _getFromCache(url: string, noMipmap: boolean, sampling?: number): InternalTexture {
             var texturesCache = this._scene.getEngine().getLoadedTexturesCache();
             for (var index = 0; index < texturesCache.length; index++) {
                 var texturesCacheEntry = texturesCache[index];
 
                 if (texturesCacheEntry.url === url && texturesCacheEntry.generateMipMaps === !noMipmap) {
                     if (!sampling || sampling === texturesCacheEntry.samplingMode) {
-                        texturesCacheEntry.references++;
+                        texturesCacheEntry.incrementReferences();
                         return texturesCacheEntry;
                     }
                 }
@@ -210,6 +196,10 @@
             return null;
         }
 
+        public _rebuild(): void {
+            
+        }
+
         public delayLoad(): void {
         }
 
@@ -250,8 +240,8 @@
 
         public releaseInternalTexture(): void {
             if (this._texture) {
-                this._scene.getEngine().releaseInternalTexture(this._texture);
-                delete this._texture;
+                this._texture.dispose();
+                this._texture = null;
             }
         }
 

src/Materials/Textures/babylon.colorGradingTexture.ts

@@ -145,7 +145,7 @@ module BABYLON {
                     }
                 }
 
-                this.getScene().getEngine().updateTextureSize(texture, size * size, size);
+                texture.updateSize(size * size, size);
                 this.getScene().getEngine().updateRawTexture(texture, data, BABYLON.Engine.TEXTUREFORMAT_RGBA, false);
             }
 

src/Materials/Textures/babylon.cubeTexture.ts

@@ -71,7 +71,7 @@
                 if (this._texture.isReady) {
                     Tools.SetImmediate(() => onLoad());
                 } else {
-                    this._texture.onLoadedCallbacks.push(onLoad);
+                    this._texture.onLoadedObservable.add(onLoad);
                 }
             }
         }

src/Materials/Textures/babylon.dynamicTexture.ts

@@ -119,5 +119,9 @@ module BABYLON {
 
             return newTexture;
         }
+
+        public _rebuild(): void {
+            this.update();
+        }
     }
 } 

src/Materials/Textures/babylon.hdrCubeTexture.ts

@@ -153,7 +153,7 @@ module BABYLON {
                 this._size = intArrayView[1]; // CubeMap max mip face size.
 
                 // Update Texture Information.
-                this.getScene().getEngine().updateTextureSize(this._texture, this._size, this._size);
+                this._texture.updateSize(this._size, this._size);
 
                 // Fill polynomial information.
                 var sphericalPolynomial = new SphericalPolynomial();

src/Materials/Textures/babylon.internalTexture.ts

@@ -0,0 +1,163 @@
+module BABYLON {
+    export class InternalTexture {
+
+        public static DATASOURCE_UNKNOWN = 0;
+        public static DATASOURCE_URL = 1;
+        public static DATASOURCE_TEMP = 2;
+        public static DATASOURCE_RAW = 3;
+        public static DATASOURCE_DYNAMIC = 4;
+        public static DATASOURCE_RENDERTARGET = 5;
+        public static DATASOURCE_MULTIRENDERTARGET = 6;
+        public static DATASOURCE_CUBE = 7;
+        public static DATASOURCE_CUBERAW = 8;
+        public static DATASOURCE_CUBEPREFILTERED = 9;
+
+        public isReady: boolean;
+        public isCube: boolean;
+        public url: string;
+        public samplingMode: number;
+        public generateMipMaps: boolean;
+        public samples: number;
+        public type: number;
+        public format: number;
+        public onLoadedObservable = new Observable<InternalTexture>();
+        public width: number;
+        public height: number;
+        public baseWidth: number;
+        public baseHeight: number;
+        public invertY: boolean;
+
+        // Private
+        public _dataSource = InternalTexture.DATASOURCE_UNKNOWN;
+        public _buffer: ArrayBuffer | HTMLImageElement;
+        public _size: number;
+        public _extension: string;
+        public _files: string[];
+        public _workingCanvas: HTMLCanvasElement;
+        public _workingContext: CanvasRenderingContext2D;
+        public _framebuffer: WebGLFramebuffer;
+        public _depthStencilBuffer: WebGLRenderbuffer;
+        public _MSAAFramebuffer: WebGLFramebuffer;
+        public _MSAARenderBuffer: WebGLRenderbuffer;
+        public _cachedCoordinatesMode: number;
+        public _cachedWrapU: number;
+        public _cachedWrapV: number;
+        public _cachedAnisotropicFilteringLevel: number;
+        public _isDisabled: boolean;
+        public _generateStencilBuffer: boolean;
+        public _generateDepthBuffer: boolean;
+        public _sphericalPolynomial: BABYLON.SphericalPolynomial;
+        public _lodGenerationScale: number;
+        public _lodGenerationOffset: number;
+        // The following three fields helps sharing generated fixed LODs for texture filtering
+        // In environment not supporting the textureLOD extension like EDGE. They are for internal use only.
+        // They are at the level of the gl texture to benefit from the cache.
+        public _lodTextureHigh: BABYLON.BaseTexture;
+        public _lodTextureMid: BABYLON.BaseTexture;
+        public _lodTextureLow: BABYLON.BaseTexture;
+
+        public _webGLTexture: WebGLTexture;
+        public _references: number = 1;
+        private _engine: Engine;
+
+        public get dataSource(): number {
+            return this._dataSource;
+        }
+
+        constructor(engine: Engine, dataSource: number) {
+            this._engine = engine;
+            this._dataSource = dataSource;
+            
+            this._webGLTexture = engine._createTexture();
+        }
+
+        public incrementReferences(): void {
+            this._references++;
+        }
+
+        public updateSize(width: number, height: number): void {
+            this.width = width;
+            this.height = height;
+            this._size = width * height;
+            this.baseWidth = width;
+            this.baseHeight = height;
+        }
+
+        public _rebuild(): void {
+            var proxy: InternalTexture;
+            this.isReady = false;
+            this._cachedCoordinatesMode = null;
+            this._cachedWrapU = null;
+            this._cachedWrapV = null;
+            this._cachedAnisotropicFilteringLevel = null;
+
+            switch (this._dataSource) {
+                case InternalTexture.DATASOURCE_TEMP:
+                    return;
+
+                case InternalTexture.DATASOURCE_URL:
+                    proxy = this._engine.createTexture(this.url, !this.generateMipMaps, this.invertY, null, this.samplingMode, () => {
+                        this.isReady = true;
+                    }, null, this._buffer, null, this.format); 
+                    proxy._swapAndDie(this);
+                    return;
+                
+                case InternalTexture.DATASOURCE_DYNAMIC:
+                    proxy = this._engine.createDynamicTexture(this.baseWidth, this.baseHeight, this.generateMipMaps, this.samplingMode); 
+                    proxy._swapAndDie(this);
+
+                    // The engine will make sure to update content so no need to flag it as isReady = true
+                return;
+
+                case InternalTexture.DATASOURCE_CUBE:
+                    proxy = this._engine.createCubeTexture(this.url, null, this._files, !this.generateMipMaps, () => {
+                        this.isReady = true;
+                    }, null, this.format, this._extension);
+                    proxy._swapAndDie(this);
+                    return;
+
+                case InternalTexture.DATASOURCE_CUBEPREFILTERED:
+                    proxy = this._engine.createPrefilteredCubeTexture(this.url, null, this._lodGenerationScale, this._lodGenerationOffset, (proxy) => {
+                        proxy._swapAndDie(this);
+                        
+                        this.isReady = true;
+                    }, null, this.format, this._extension);
+                    return;
+            }
+        }
+
+        private _swapAndDie(target: InternalTexture): void {
+            target._webGLTexture = this._webGLTexture;
+
+            if (this._lodTextureHigh) {
+                target._lodTextureHigh = this._lodTextureHigh;
+            }
+
+            if (this._lodTextureMid) {
+                target._lodTextureMid = this._lodTextureMid;
+            }
+
+            if (this._lodTextureLow) {
+                target._lodTextureLow = this._lodTextureLow;
+            }
+
+            let cache = this._engine.getLoadedTexturesCache();
+            var index = cache.indexOf(this);
+            if (index !== -1) {
+                cache.splice(index, 1);
+            }
+        }
+        
+        public dispose(): void {
+            if (!this._webGLTexture) {
+                return;
+            }
+
+            this._references--;
+            if (this._references === 0) {
+                this._engine._releaseTexture(this);
+                this._webGLTexture = null;
+            }
+        }
+    }
+}

src/Materials/Textures/babylon.multiRenderTarget.ts

@@ -10,7 +10,7 @@ module BABYLON {
     };
     export class MultiRenderTarget extends RenderTargetTexture {
 
-        private _webGLTextures: WebGLTexture[];
+        private _internalTextures: InternalTexture[];
         private _textures: Texture[];
         private _count: number;
 
@@ -75,21 +75,21 @@ module BABYLON {
                 textureCount: count
             };
 
-            this._webGLTextures = scene.getEngine().createMultipleRenderTarget(size, this._multiRenderTargetOptions);
+            this._internalTextures = scene.getEngine().createMultipleRenderTarget(size, this._multiRenderTargetOptions);
 
             this._createInternalTextures();
         }
 
         private _createInternalTextures(): void {
             this._textures = [];
-            for (var i = 0; i < this._webGLTextures.length; i++) {
+            for (var i = 0; i < this._internalTextures.length; i++) {
                 var texture = new BABYLON.Texture(null, this.getScene());
-                texture._texture = this._webGLTextures[i];
+                texture._texture = this._internalTextures[i];
                 this._textures.push(texture);
             }
 
             // Keeps references to frame buffer and stencil/depth buffer
-            this._texture = this._webGLTextures[0];
+            this._texture = this._internalTextures[0];
         }
 
         public get samples(): number {
@@ -101,14 +101,14 @@ module BABYLON {
                 return;
             }
             
-            for (var i = 0 ; i < this._webGLTextures.length; i++) {
-                this._samples = this.getScene().getEngine().updateRenderTargetTextureSampleCount(this._webGLTextures[i], value);
+            for (var i = 0 ; i < this._internalTextures.length; i++) {
+                this._samples = this.getScene().getEngine().updateRenderTargetTextureSampleCount(this._internalTextures[i], value);
             }
         }
 
         public resize(size: any) {
             this.releaseInternalTextures();
-            this._webGLTextures = this.getScene().getEngine().createMultipleRenderTarget(size, this._multiRenderTargetOptions);
+            this._internalTextures = this.getScene().getEngine().createMultipleRenderTarget(size, this._multiRenderTargetOptions);
             this._createInternalTextures();
         }
 
@@ -119,14 +119,14 @@ module BABYLON {
         }
 
         public releaseInternalTextures(): void {
-            if (!this._webGLTextures) {
+            if (!this._internalTextures) {
                 return;
             }
 
-            for (var i = this._webGLTextures.length - 1; i >= 0; i--) {
-                if (this._webGLTextures[i] !== undefined) {
-                    this.getScene().getEngine().releaseInternalTexture(this._webGLTextures[i]);
-                    this._webGLTextures.splice(i, 1);
+            for (var i = this._internalTextures.length - 1; i >= 0; i--) {
+                if (this._internalTextures[i] !== undefined) {
+                    this._internalTextures[i].dispose();
+                    this._internalTextures.splice(i, 1);
                 }
             }
         }

src/Materials/Textures/babylon.renderTargetTexture.ts

@@ -577,5 +577,11 @@
 
             super.dispose();
         }
+
+        public _rebuild(): void {
+            if (this.refreshRate === RenderTargetTexture.REFRESHRATE_RENDER_ONCE) {
+                this.refreshRate = RenderTargetTexture.REFRESHRATE_RENDER_ONCE;
+            }
+        }
     }
 }

src/Materials/Textures/babylon.texture.ts

@@ -154,7 +154,7 @@
                 if (this._texture.isReady) {
                     Tools.SetImmediate(() => load());
                 } else {
-                    this._texture.onLoadedCallbacks.push(load);
+                    this._texture.onLoadedObservable.add(load);
                 }
             }
         }
@@ -182,7 +182,7 @@
                 if (this._texture.isReady) {
                     Tools.SetImmediate(() => this._delayedOnLoad());
                 } else {
-                    this._texture.onLoadedCallbacks.push(this._delayedOnLoad);
+                    this._texture.onLoadedObservable.add(this._delayedOnLoad);
                 }
             }
         }

src/Materials/babylon.effect.ts

@@ -108,9 +108,11 @@
         public _key: string;
         private _indexParameters: any;
         private _fallbacks: EffectFallbacks;
+        private _vertexSourceCode: string;
+        private _fragmentSourceCode: string;
 
         private _program: WebGLProgram;
-        private _valueCache: { [key: string]: any } = {};
+        private _valueCache: { [key: string]: any };
         private static _baseCache: { [key: number]: WebGLBuffer } = {};
 
         constructor(baseName: any, attributesNamesOrOptions: string[] | EffectCreationOptions, uniformsNamesOrEngine: string[] | Engine, samplers?: string[], engine?: Engine, defines?: string, fallbacks?: EffectFallbacks, onCompiled?: (effect: Effect) => void, onError?: (effect: Effect, errors: string) => void, indexParameters?: any) {
@@ -179,7 +181,14 @@
                         this._loadFragmentShader(fragmentSource, (fragmentCode) => {
                             this._processIncludes(fragmentCode, fragmentCodeWithIncludes => {
                                 this._processShaderConversion(fragmentCodeWithIncludes, true, migratedFragmentCode => {
-                                    this._prepareEffect(migratedVertexCode, migratedFragmentCode, this._attributesNames, this.defines, this._fallbacks, baseName);
+                                    if (baseName) {
+                                        this._vertexSourceCode = "#define SHADER_NAME vertex:" + baseName + "\n" + migratedVertexCode;
+                                        this._fragmentSourceCode = "#define SHADER_NAME fragment:" + baseName + "\n" + migratedFragmentCode;
+                                    } else {
+                                        this._vertexSourceCode = migratedVertexCode;
+                                        this._fragmentSourceCode = migratedFragmentCode;
+                                    }
+                                    this._prepareEffect();
                                 });
                             });
                         });
@@ -492,15 +501,15 @@
             return source;
         }
 
-        private _prepareEffect(vertexSourceCode: string, fragmentSourceCode: string, attributesNames: string[], defines: string, fallbacks?: EffectFallbacks, baseName?: string): void {
+        public _prepareEffect() {
+            let attributesNames = this._attributesNames;
+            let defines = this.defines;
+            let fallbacks = this._fallbacks;
+            this._valueCache = {};
+
             try {
                 var engine = this._engine;
-                if (baseName) {
-                    vertexSourceCode = "#define SHADER_NAME vertex:" + baseName + "\n" + vertexSourceCode;
-                    fragmentSourceCode = "#define SHADER_NAME fragment:" + baseName + "\n" + fragmentSourceCode;
-                }
-
-                this._program = engine.createShaderProgram(vertexSourceCode, fragmentSourceCode, defines);
+                this._program = engine.createShaderProgram(this._vertexSourceCode, this._fragmentSourceCode, defines);
 
                 if (engine.webGLVersion > 1) {
                     for (var name in this._uniformBuffersNames) {
@@ -541,28 +550,29 @@
                 BABYLON.Tools.Error("Attributes: " + attributesNames.map(function(attribute) {
                     return " " + attribute;
                 }));
-                this._dumpShadersSource(vertexSourceCode, fragmentSourceCode, defines);
+                this._dumpShadersSource(this._vertexSourceCode, this._fragmentSourceCode, defines);
                 Tools.Error("Error: " + this._compilationError);
 
                 if (fallbacks && fallbacks.isMoreFallbacks) {
                     Tools.Error("Trying next fallback.");
-                    defines = fallbacks.reduce(defines);
-                    this._prepareEffect(vertexSourceCode, fragmentSourceCode, attributesNames, defines, fallbacks);
+                    this.defines = fallbacks.reduce(this.defines);
+                    this._prepareEffect();
                 } else { // Sorry we did everything we can
 
                     if (this.onError) {
                         this.onError(this, this._compilationError);
                     }
                     this.onErrorObservable.notifyObservers(this);
+                    this.onErrorObservable.clear();
                 }
-            }
+            }            
         }
 
         public get isSupported(): boolean {
             return this._compilationError === "";
         }
 
-        public _bindTexture(channel: string, texture: WebGLTexture): void {
+        public _bindTexture(channel: string, texture: InternalTexture): void {
             this._engine._bindTexture(this._samplers.indexOf(channel), texture);
         }
 

src/Materials/babylon.uniformBuffer.ts

@@ -144,6 +144,8 @@ module BABYLON {
                 this.updateColor3 = this._updateColor3ForEffect;
                 this.updateColor4 = this._updateColor4ForEffect;
             } else {
+                this._engine._uniformBuffers.push(this);
+                
                 this.updateMatrix3x3 = this._updateMatrix3x3ForUniform;
                 this.updateMatrix2x2 = this._updateMatrix2x2ForUniform;
                 this.updateFloat = this._updateFloatForUniform;
@@ -371,14 +373,22 @@ module BABYLON {
             this._fillAlignment(4);
             this._bufferData = new Float32Array(this._data);
 
+            this._rebuild();
+
+            this._needSync = true;
+        }
+        
+        public _rebuild(): void {
+            if (this._noUBO) {
+                return;
+            }
+
             if (this._dynamic) {
                 this._buffer = this._engine.createDynamicUniformBuffer(this._bufferData);
             } else {
                 this._buffer = this._engine.createUniformBuffer(this._bufferData);
             }
-
-            this._needSync = true;
-        } 
+        }
 
         /**
          * Updates the WebGL Uniform Buffer on the GPU.
@@ -603,6 +613,16 @@ module BABYLON {
          * Disposes the uniform buffer.
          */
         public dispose(): void {
+            if (this._noUBO) {
+                return;
+            }
+
+            let index = this._engine._uniformBuffers.indexOf(this);
+
+            if (index !== -1) {
+                this._engine._uniformBuffers.splice(index, 1);
+            }
+
             if (!this._buffer) {
                 return;
             }

src/Math/babylon.math.ts

@@ -4387,7 +4387,7 @@
         }
 
         public toGlobal(renderWidthOrEngine: number | Engine, renderHeight: number): Viewport {
-            if ((<Engine>renderWidthOrEngine)._gl) {
+            if ((<Engine>renderWidthOrEngine).getRenderWidth) {
                 var engine = (<Engine>renderWidthOrEngine);
                 return this.toGlobal(engine.getRenderWidth(), engine.getRenderHeight());
             }

src/Mesh/babylon.abstractMesh.ts

@@ -8,7 +8,7 @@
         private static _BILLBOARDMODE_ALL = 7;
 
         public static OCCLUSION_TYPE_NONE = 0;
-        public static OCCLUSION_TYPE_OPTIMISITC = 1;
+        public static OCCLUSION_TYPE_OPTIMISTIC = 1;
         public static OCCLUSION_TYPE_STRICT = 2;
         public static OCCLUSION_ALGORITHM_TYPE_ACCURATE = 0;
         public static OCCLUSION_ALGORITHM_TYPE_CONSERVATIVE = 1;
@@ -145,7 +145,7 @@
 
         * OCCLUSION_TYPE_NONE (Default Value): this option means no occlusion query whith the Mesh.
 
-        * OCCLUSION_TYPE_OPTIMISITC: this option is means use occlusion query and if occlusionRetryCount is reached and the query is broken show the mesh.
+        * OCCLUSION_TYPE_OPTIMISTIC: this option is means use occlusion query and if occlusionRetryCount is reached and the query is broken show the mesh.
 
             * OCCLUSION_TYPE_STRICT: this option is means use occlusion query and if occlusionRetryCount is reached and the query is broken restore the last state of the mesh occlusion if the mesh was visible then show the mesh if was hidden then hide don't show.
          */
@@ -472,6 +472,16 @@
             return ret;
         }
 
+        public _rebuild(): void {
+            if (!this.subMeshes) {
+                return;
+            }
+            
+            for (var subMesh of this.subMeshes) {
+                subMesh._rebuild();
+            }
+        }
+
         public _resyncLightSources(): void {
             this._lightSources.length = 0;
 
@@ -2340,7 +2350,7 @@
 
                         // if optimistic set isOccluded to false regardless of the status of isOccluded. (Render in the current render loop)
                         // if strict continue the last state of the object.
-                        this._isOccluded = this.occlusionType === AbstractMesh.OCCLUSION_TYPE_OPTIMISITC ? false : this._isOccluded;
+                        this._isOccluded = this.occlusionType === AbstractMesh.OCCLUSION_TYPE_OPTIMISTIC ? false : this._isOccluded;
                     }
                     else {
                         return;

src/Mesh/babylon.buffer.ts

@@ -90,6 +90,11 @@
             }
         }
 
+        public _rebuild(): void {
+            this._buffer = null;
+            this.create(this._data);
+        }
+
         public update(data: number[] | Float32Array): void {
             this.create(data);
         }

src/Mesh/babylon.geometry.ts

@@ -106,6 +106,23 @@
             return true;
         }
 
+        public _rebuild(): void {
+            if (this._vertexArrayObjects) {
+                this._vertexArrayObjects = {};
+            }
+
+            // Index buffer
+            if (this._meshes.length !== 0 && this._indices) {
+                this._indexBuffer = this._engine.createIndexBuffer(this._indices);
+            }
+
+            // Vertex buffers
+            for (var key in this._vertexBuffers) {
+                let vertexBuffer = <VertexBuffer>this._vertexBuffers[key];
+                vertexBuffer._rebuild();
+            }
+        }
+
         public setAllVerticesData(vertexData: VertexData, updatable?: boolean): void {
             vertexData.applyToGeometry(this, updatable);
             this.notifyUpdate();

src/Mesh/babylon.subMesh.ts

@@ -275,6 +275,12 @@
             return intersectInfo;
         }
 
+        public _rebuild(): void {
+            if (this._linesIndexBuffer) {
+                this._linesIndexBuffer = null;
+            }
+        }
+
         // Clone    
         /**
          * Creates a new Submesh from the passed Mesh.  

src/Mesh/babylon.vertexBuffer.ts

@@ -60,6 +60,14 @@
             this._kind = kind;
         }
 
+        public _rebuild(): void {
+            if (!this._buffer) {
+                return;
+            }
+
+            this._buffer._rebuild();
+        }
+
         /**
          * Returns the kind of the VertexBuffer (string).  
          */

src/PostProcess/babylon.postProcess.ts

@@ -27,7 +27,7 @@
         private _options: number | PostProcessOptions;
         private _reusable = false;
         private _textureType: number;
-        public _textures = new SmartArray<WebGLTexture>(2);
+        public _textures = new SmartArray<InternalTexture>(2);
         public _currentRenderTextureInd = 0;
         private _effect: Effect;
         private _samplers: string[];
@@ -38,7 +38,7 @@
         protected _indexParameters: any;
         private _shareOutputWithPostProcess: PostProcess;
         private _texelSize = Vector2.Zero();
-        private _forcedOutputTexture: WebGLTexture;
+        private _forcedOutputTexture: InternalTexture;
        
         // Events
 
@@ -112,11 +112,11 @@
             this._onAfterRenderObserver = this.onAfterRenderObservable.add(callback);
         }
 
-        public get outputTexture(): WebGLTexture {
+        public get outputTexture(): InternalTexture {
             return this._textures.data[this._currentRenderTextureInd];
         }   
 
-        public set outputTexture(value: WebGLTexture) {
+        public set outputTexture(value: InternalTexture) {
             this._forcedOutputTexture = value;
         }   
 
@@ -130,7 +130,7 @@
             }
 
             if (this._forcedOutputTexture) {
-                this._texelSize.copyFromFloats(1.0 / this._forcedOutputTexture._width, 1.0 / this._forcedOutputTexture._height);
+                this._texelSize.copyFromFloats(1.0 / this._forcedOutputTexture.width, 1.0 / this._forcedOutputTexture.height);
             }
 
             return this._texelSize;
@@ -207,7 +207,7 @@
             this.width = -1;
         }
 
-        public activate(camera: Camera, sourceTexture?: WebGLTexture, forceDepthStencil?: boolean): void {            
+        public activate(camera: Camera, sourceTexture?: InternalTexture, forceDepthStencil?: boolean): void {            
             if (!this._shareOutputWithPostProcess && !this._forcedOutputTexture) {
                 camera = camera || this._camera;
 
@@ -215,8 +215,8 @@
                 var engine = scene.getEngine();
                 var maxSize = engine.getCaps().maxTextureSize;
 
-                var requiredWidth = ((sourceTexture ? sourceTexture._width : this._engine.getRenderingCanvas().width) * <number>this._options) | 0;
-                var requiredHeight = ((sourceTexture ? sourceTexture._height : this._engine.getRenderingCanvas().height) * <number>this._options) | 0;
+                var requiredWidth = ((sourceTexture ? sourceTexture.width : this._engine.getRenderingCanvas().width) * <number>this._options) | 0;
+                var requiredHeight = ((sourceTexture ? sourceTexture.height : this._engine.getRenderingCanvas().height) * <number>this._options) | 0;
 
                 var desiredWidth = (<PostProcessOptions>this._options).width || requiredWidth;
                 var desiredHeight = (<PostProcessOptions>this._options).height || requiredHeight;
@@ -268,15 +268,15 @@
                 });
             }
 
-            var target: WebGLTexture;
+            var target: InternalTexture;
                         
             if (this._shareOutputWithPostProcess) {
                 target = this._shareOutputWithPostProcess.outputTexture;
             } else if (this._forcedOutputTexture) {
                 target = this._forcedOutputTexture;
 
-                this.width = this._forcedOutputTexture._width;
-                this.height = this._forcedOutputTexture._height;
+                this.width = this._forcedOutputTexture.width;
+                this.height = this._forcedOutputTexture.height;
             } else {
                 target = this.outputTexture;
             }
@@ -312,7 +312,7 @@
             }
 
             if (this._forcedOutputTexture) {
-                var size = this._forcedOutputTexture._width / this._forcedOutputTexture._height;
+                var size = this._forcedOutputTexture.width / this._forcedOutputTexture.height;
             }
 
             return this.width / this.height;
@@ -336,7 +336,7 @@
             }            
 
             // Texture            
-            var source: WebGLTexture;                        
+            var source: InternalTexture;                        
             if (this._shareOutputWithPostProcess) {
                 source = this._shareOutputWithPostProcess.outputTexture;
             } else if (this._forcedOutputTexture) {

src/PostProcess/babylon.postProcessManager.ts

@@ -36,7 +36,7 @@
         }
 
         // Methods
-        public _prepareFrame(sourceTexture?: WebGLTexture, postProcesses?: PostProcess[]): boolean {
+        public _prepareFrame(sourceTexture?: InternalTexture, postProcesses?: PostProcess[]): boolean {
             var postProcesses = postProcesses || this._scene.activeCamera._postProcesses;
 
             if (postProcesses.length === 0 || !this._scene.postProcessesEnabled) {
@@ -47,7 +47,7 @@
             return true;
         }
 
-        public directRender(postProcesses: PostProcess[], targetTexture?: WebGLTexture): void {
+        public directRender(postProcesses: PostProcess[], targetTexture?: InternalTexture, forceFullscreenViewport = false): void {
             var engine = this._scene.getEngine();
 
             for (var index = 0; index < postProcesses.length; index++) {
@@ -55,7 +55,7 @@
                     postProcesses[index + 1].activate(this._scene.activeCamera, targetTexture);
                 } else {
                     if (targetTexture) {
-                        engine.bindFramebuffer(targetTexture);
+                        engine.bindFramebuffer(targetTexture, 0, null, null, forceFullscreenViewport);
                     } else {
                         engine.restoreDefaultFramebuffer();
                     }
@@ -83,7 +83,7 @@
             engine.setDepthWrite(true);
         }
 
-        public _finalizeFrame(doNotPresent?: boolean, targetTexture?: WebGLTexture, faceIndex?: number, postProcesses?: PostProcess[]): void {
+        public _finalizeFrame(doNotPresent?: boolean, targetTexture?: InternalTexture, faceIndex?: number, postProcesses?: PostProcess[]): void {
             postProcesses = postProcesses || this._scene.activeCamera._postProcesses;
             if (postProcesses.length === 0 || !this._scene.postProcessesEnabled) {
                 return;

src/Tools/babylon.dds.ts

@@ -359,8 +359,7 @@
             return byteArray;
         }
 
-        public static UploadDDSLevels(engine: Engine, arrayBuffer: any, info: DDSInfo, loadMipmaps: boolean, faces: number, lodIndex = -1): void {
-            var gl = engine._gl;
+        public static UploadDDSLevels(engine: Engine, gl:WebGLRenderingContext, arrayBuffer: any, info: DDSInfo, loadMipmaps: boolean, faces: number, lodIndex = -1): void {
             var ext = engine.getCaps().s3tc;
 
             var header = new Int32Array(arrayBuffer, 0, headerLengthInt),

src/babylon.mixins.ts

@@ -112,43 +112,6 @@ interface CanvasRenderingContext2D {
     msImageSmoothingEnabled: boolean;
 }
 
-interface WebGLTexture {
-    isReady: boolean;
-    isCube: boolean;
-    url: string;
-    samplingMode: number;
-    references: number;
-    generateMipMaps: boolean;
-    samples: number;
-    type: number;
-    format: number;
-    onLoadedCallbacks: Array<Function>;
-    _size: number;
-    _baseWidth: number;
-    _baseHeight: number;
-    _width: number;
-    _height: number;
-    _workingCanvas: HTMLCanvasElement;
-    _workingContext: CanvasRenderingContext2D;
-    _framebuffer: WebGLFramebuffer;
-    _depthStencilBuffer: WebGLRenderbuffer;
-    _MSAAFramebuffer: WebGLFramebuffer;
-    _MSAARenderBuffer: WebGLRenderbuffer;
-    _cachedCoordinatesMode: number;
-    _cachedWrapU: number;
-    _cachedWrapV: number;
-    _isDisabled: boolean;
-    _generateStencilBuffer: boolean;
-    _generateDepthBuffer: boolean;
-    _sphericalPolynomial: BABYLON.SphericalPolynomial;
-    // The following three fields helps sharing generated fixed LODs for texture filtering
-    // In environment not supporting the textureLOD extension like EDGE. They are for internal use only.
-    // They are at the level of the gl texture to benefit from the cache.
-    _lodTextureHigh: BABYLON.BaseTexture;
-    _lodTextureMid: BABYLON.BaseTexture;
-    _lodTextureLow: BABYLON.BaseTexture;
-}
-
 interface WebGLBuffer {
     references: number;
     capacity: number;

src/babylon.scene.ts

@@ -1637,8 +1637,6 @@
             this._cachedVisibility = null;
         }
 
-
-
         public registerBeforeRender(func: () => void): void {
             this.onBeforeRenderObservable.add(func);
         }
@@ -3833,6 +3831,28 @@
         }
 
         // Misc.
+        public _rebuildGeometries(): void {
+            for (var geometry of this._geometries) {
+                geometry._rebuild();
+            }
+
+            for (var mesh of this.meshes) {
+                mesh._rebuild();
+            }
+
+            for (var layer of this.layers) {
+                layer._rebuild();
+            }
+        }
+
+        public _rebuildTextures(): void {
+            for (var texture of this.textures) {
+                texture._rebuild();
+            }
+
+            this.markAllMaterialsAsDirty(Material.TextureDirtyFlag);
+        }
+
         public createDefaultCameraOrLight(createArcRotateCamera = false, replace = false, attachCameraControls = false) {
             // Dispose existing camera or light in replace mode.
             if (replace) {