Merge branch 'Env' of https://github.com/sebavan/Babylon.js into Env

src/Engine/babylon.engine.ts

@@ -5523,7 +5523,7 @@
                 isKTX = true;
             } else {
                 isDDS = (extension === ".dds");
-                isEnv = (extension.indexOf(".env") === 0);
+                isEnv = (extension === ".env");
             }
 
             let onerror = (request?: XMLHttpRequest, exception?: any) => {

src/Materials/Textures/babylon.baseTexture.ts

@@ -117,10 +117,24 @@
         public lodLevelInAlpha = false;
 
         @serialize()
-        public lodGenerationOffset = 0.0;
+        public get lodGenerationOffset(): number {
+            if (this._texture) return this._texture._lodGenerationOffset;
+
+            return 0.0;
+        }
+        public set lodGenerationOffset(value: number) {
+            if (this._texture) this._texture._lodGenerationOffset = value;
+        }
 
         @serialize()
-        public lodGenerationScale = 0.8;
+        public get lodGenerationScale(): number {
+            if (this._texture) return this._texture._lodGenerationScale;
+
+            return 0.0;
+        }
+        public set lodGenerationScale(value: number) {
+            if (this._texture) this._texture._lodGenerationScale = value;
+        }
 
         @serialize()
         public isRenderTarget = false;

src/Materials/Textures/babylon.internalTexture.ts

@@ -188,9 +188,9 @@ module BABYLON {
         /** @hidden */
         public _sphericalPolynomial: Nullable<SphericalPolynomial>;
         /** @hidden */
-        public _lodGenerationScale: number;
+        public _lodGenerationScale: number = 0.8;
         /** @hidden */
-        public _lodGenerationOffset: number;
+        public _lodGenerationOffset: number= 0;
 
         // 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.
@@ -369,7 +369,7 @@ module BABYLON {
             }
         }
 
-        private _swapAndDie(target: InternalTexture): void {
+        public _swapAndDie(target: InternalTexture): void {
             target._webGLTexture = this._webGLTexture;
 
             if (this._framebuffer) {

src/Shaders/background.fragment.fx

@@ -166,7 +166,7 @@ vec4 reflectionColor = vec4(1., 1., 1., 1.);
             float lodReflectionNormalized = clamp(reflectionLOD, 0., 1.);
             float lodReflectionNormalizedDoubled = lodReflectionNormalized * 2.0;
 
-            vec3 reflectionSpecularMid = sampleReflection(reflectionSampler, reflectionCoords);
+            vec4 reflectionSpecularMid = sampleReflection(reflectionSampler, reflectionCoords);
             if(lodReflectionNormalizedDoubled < 1.0){
                 reflectionColor = mix(
                     sampleReflection(reflectionSamplerHigh, reflectionCoords),

src/Shaders/pbr.fragment.fx

@@ -573,7 +573,7 @@ void main(void) {
             float lodReflectionNormalized = clamp(reflectionLOD / log2(vReflectionMicrosurfaceInfos.x), 0., 1.);
             float lodReflectionNormalizedDoubled = lodReflectionNormalized * 2.0;
 
-            vec3 environmentSpecularMid = sampleReflection(reflectionSampler, reflectionCoords).rgb;
+            vec4 environmentSpecularMid = sampleReflection(reflectionSampler, reflectionCoords);
             if(lodReflectionNormalizedDoubled < 1.0){
                 environmentRadiance = mix(
                     sampleReflection(reflectionSamplerHigh, reflectionCoords),

src/Tools/babylon.environmentTextureTools.ts

@@ -68,6 +68,34 @@ module BABYLON {
         l22: Array<number>;
     }
 
+    interface EnvironmentTextureIrradianceInfoV1 {
+        polynomials: boolean;
+
+        l00: Array<number>;
+
+        l1_1: Array<number>;
+        l10: Array<number>;
+        l11: Array<number>;
+
+        l2_2: Array<number>;
+        l2_1: Array<number>;
+        l20: Array<number>;
+        l21: Array<number>;
+        l22: Array<number>;
+
+        x: Array<number>;
+        y: Array<number>;
+        z: Array<number>;
+
+        xx: Array<number>;
+        yy: Array<number>;
+        zz: Array<number>;
+
+        yz: Array<number>;
+        zx: Array<number>;
+        xy: Array<number>;
+    }
+
     /**
      * Sets of helpers addressing the serialization and deserialization of environment texture
      * stored in a BabylonJS env file.
@@ -128,7 +156,7 @@ module BABYLON {
             }
 
             let engine = internalTexture.getEngine();
-            if (engine && !engine.premultipliedAlpha) {
+            if (engine && engine.premultipliedAlpha) {
                 return Promise.reject("Env texture can only be created when the engine is created with the premultipliedAlpa option.");
             }
 
@@ -206,7 +234,7 @@ module BABYLON {
                 let info: EnvironmentTextureInfo = {
                     version: 1,
                     width: cubeWidth,
-                    irradiance: null,
+                    irradiance: this._CreateEnvTextureIrradiance(texture),
                     specular: {
                         mipmaps: []
                     }
@@ -266,6 +294,34 @@ module BABYLON {
         }
 
         /**
+         * Creates a JSON representation of the spherical data.
+         * @param texture defines the texture containing the polynomials
+         * @return the JSON representation of the spherical info
+         */
+        private static _CreateEnvTextureIrradiance(texture: CubeTexture) : Nullable<EnvironmentTextureIrradianceInfoV1> {
+            let polynmials = texture.sphericalPolynomial;
+            if (polynmials == null) {
+                return null;
+            }
+
+            return {
+                polynomials: true,
+
+                x: [polynmials.x.x, polynmials.x.y, polynmials.x.z],
+                y: [polynmials.y.x, polynmials.y.y, polynmials.y.z],
+                z: [polynmials.z.x, polynmials.z.y, polynmials.z.z],
+
+                xx: [polynmials.xx.x, polynmials.xx.y, polynmials.xx.z],
+                yy: [polynmials.yy.x, polynmials.yy.y, polynmials.yy.z],
+                zz: [polynmials.zz.x, polynmials.zz.y, polynmials.zz.z],
+
+                yz: [polynmials.yz.x, polynmials.yz.y, polynmials.yz.z],
+                zx: [polynmials.zx.x, polynmials.zx.y, polynmials.zx.z],
+                xy: [polynmials.xy.x, polynmials.xy.y, polynmials.xy.z]
+            } as any;
+        }
+
+        /**
          * Uploads the texture info contained in the env file to te GPU.
          * @param texture defines the internal texture to upload to
          * @param arrayBuffer defines the buffer cotaining the data to load
@@ -292,29 +348,37 @@ module BABYLON {
 
             // Gets everything ready.
             let engine = texture.getEngine();
-            let textureType = Engine.TEXTURETYPE_UNSIGNED_INT;
             let expandTexture = false;
+            let generateNonLODTextures = false;
             let rgbmPostProcess: Nullable<PostProcess> = null;
             let cubeRtt: Nullable<InternalTexture> = null;
-            var caps = engine.getCaps();
+            let lodTextures: Nullable<{ [lod: number]: BaseTexture}> = null;
+            let caps = engine.getCaps();
+
+            texture.format = Engine.TEXTUREFORMAT_RGBA;
+            texture.type = Engine.TEXTURETYPE_UNSIGNED_INT;
+            texture.samplingMode = Texture.TRILINEAR_SAMPLINGMODE;
 
-            // If hal or full float available we can uncompress the texture 
-            if (caps.textureHalfFloatRender) {
+            // Add extra process if texture lod is not supported
+            if (!caps.textureLOD) {
+                lodTextures = { };
+                generateNonLODTextures = true;
+            }
+            // If half float available we can uncompress the texture
+            else if (caps.textureHalfFloatRender) {
                 expandTexture = true;
-                textureType = Engine.TEXTURETYPE_HALF_FLOAT;
+                texture.type = Engine.TEXTURETYPE_HALF_FLOAT;
             }
+            // If full float available we can uncompress the texture
             else if (caps.textureFloatRender) {
                 expandTexture = true;
-                textureType = Engine.TEXTURETYPE_FLOAT;
+                texture.type = Engine.TEXTURETYPE_FLOAT;
             }
-            texture.type = textureType;
-            texture.format = Engine.TEXTUREFORMAT_RGBA;
-            texture.samplingMode = Texture.TRILINEAR_SAMPLINGMODE;
 
             // Expand the texture if possible
             if (expandTexture) {
                 // Simply run through the decode PP
-                rgbmPostProcess = new PostProcess("rgbmDecode", "rgbmDecode", null, null, 1, null, Texture.TRILINEAR_SAMPLINGMODE, engine, false, undefined, textureType, undefined, null, false);
+                rgbmPostProcess = new PostProcess("rgbmDecode", "rgbmDecode", null, null, 1, null, Texture.TRILINEAR_SAMPLINGMODE, engine, false, undefined, texture.type, undefined, null, false);
                 
                 texture._isRGBM = false;
                 texture.invertY = false;
@@ -323,13 +387,56 @@ module BABYLON {
                     generateMipMaps: true,
                     generateStencilBuffer: false,
                     samplingMode: Texture.TRILINEAR_SAMPLINGMODE,
-                    type: textureType,
+                    type: texture.type,
                     format: Engine.TEXTUREFORMAT_RGBA
                 })
             }
             else {
                 texture._isRGBM = true;
                 texture.invertY = true;
+
+                // In case of missing support, applies the same patch than DDS files.
+                if (generateNonLODTextures) {
+                    let mipSlices = 3;
+                    let scale = texture._lodGenerationScale;
+                    let offset = texture._lodGenerationOffset;
+    
+                    for (let i = 0; i < mipSlices; i++) {
+                        //compute LOD from even spacing in smoothness (matching shader calculation)
+                        let smoothness = i / (mipSlices - 1);
+                        let roughness = 1 - smoothness;
+    
+                        let minLODIndex = offset; // roughness = 0
+                        let maxLODIndex = Scalar.Log2(info.width) * scale + offset; // roughness = 1
+    
+                        let lodIndex = minLODIndex + (maxLODIndex - minLODIndex) * roughness;
+                        let mipmapIndex = Math.round(Math.min(Math.max(lodIndex, 0), maxLODIndex));
+    
+                        let glTextureFromLod = new InternalTexture(engine, InternalTexture.DATASOURCE_TEMP);
+                        glTextureFromLod.isCube = true;
+                        glTextureFromLod.invertY = true;
+                        glTextureFromLod.generateMipMaps = false;
+                        engine.updateTextureSamplingMode(Texture.LINEAR_LINEAR, glTextureFromLod);
+    
+                        // Wrap in a base texture for easy binding.
+                        let lodTexture = new BaseTexture(null);
+                        lodTexture.isCube = true;
+                        lodTexture._texture = glTextureFromLod;
+                        lodTextures![mipmapIndex] = lodTexture;
+
+                        switch (i) {
+                            case 0:
+                            texture._lodTextureLow = lodTexture;
+                            break;
+                            case 1:
+                            texture._lodTextureMid = lodTexture;
+                            break;
+                            case 2:
+                            texture._lodTextureHigh = lodTexture;
+                            break;
+                        }
+                    }
+                }
             }
 
             let promises: Promise<void>[] = [];
@@ -338,11 +445,11 @@ module BABYLON {
                 // All faces
                 for (let face = 0; face < 6; face++) {
                     // Retrieves the face data
-                    const imageData = specularInfo.mipmaps[i * 6 + face];
+                    let imageData = specularInfo.mipmaps[i * 6 + face];
                     let bytes = new Uint8Array(arrayBuffer, specularInfo.specularDataPosition! + imageData.position, imageData.length);
 
                     // Constructs an image element from bytes
-                    var blob = new Blob([bytes], { type: 'image/png' });
+                    let blob = new Blob([bytes], { type: 'image/png' });
                     let url = URL.createObjectURL(blob);
                     let image = new Image();
                     image.src = url;
@@ -374,6 +481,14 @@ module BABYLON {
                             }
                             else {
                                 engine._uploadImageToTexture(texture, face, i, image);
+
+                                // Upload the face to the none lod texture support
+                                if (generateNonLODTextures) {
+                                    let lodTexture = lodTextures![i];
+                                    if (lodTexture) {
+                                        engine._uploadImageToTexture(lodTexture._texture!, face, 0, image);
+                                    }
+                                }
                                 resolve();
                             }
                         };
@@ -387,16 +502,36 @@ module BABYLON {
 
             // Once all done, finishes the cleanup and return
             return Promise.all(promises).then(() => {
+                // Relase temp Cube Texture resources.
                 if (cubeRtt) {
-                    texture._webGLTexture = cubeRtt._webGLTexture;
+                    engine._releaseFramebufferObjects(cubeRtt);
+                    cubeRtt._swapAndDie(texture);
                 }
+                // Relase temp Post Process.
                 if (rgbmPostProcess) {
                     rgbmPostProcess.dispose();
                 }
+                // Flag internal texture as ready in case they are in use.
+                if (generateNonLODTextures) {
+                    if (texture._lodTextureHigh && texture._lodTextureHigh._texture) {
+                        texture._lodTextureHigh._texture.isReady = true;
+                    }
+                    if (texture._lodTextureMid && texture._lodTextureMid._texture) {
+                        texture._lodTextureMid._texture.isReady = true;
+                    }
+                    if (texture._lodTextureLow && texture._lodTextureLow._texture) {
+                        texture._lodTextureLow._texture.isReady = true;
+                    }
+                }
             });
         }
 
-        // TODO.TODO.TODO.
+        /**
+         * Uploads spherical polynomials information to the texture.
+         * @param texture defines the texture we are trying to upload the information to
+         * @param arrayBuffer defines the array buffer holding the data
+         * @param info defines the environment texture info retrieved through the GetEnvInfo method
+         */
         public static UploadPolynomials(texture: InternalTexture, arrayBuffer: any, info: EnvironmentTextureInfo): void {
             if (info.version !== 1) {
                 Tools.Warn('Unsupported babylon environment map version "' + info.version + '"');
@@ -407,12 +542,62 @@ module BABYLON {
                 return;
             }
             
-            //irradiance
-            EnvironmentTextureTools._ConvertSHIrradianceToLambertianRadiance(irradianceInfo);
-
             //harmonics now represent radiance
             texture._sphericalPolynomial = new SphericalPolynomial();
-            EnvironmentTextureTools._ConvertSHToSP(irradianceInfo, texture._sphericalPolynomial);
+
+            if (irradianceInfo.polynomials) {
+                EnvironmentTextureTools._UploadSP(irradianceInfo, texture._sphericalPolynomial);
+            }
+            else {
+                // convert From SH to SP.
+                EnvironmentTextureTools._ConvertSHIrradianceToLambertianRadiance(irradianceInfo);
+                EnvironmentTextureTools._ConvertSHToSP(irradianceInfo, texture._sphericalPolynomial);
+            }
+        }
+
+        /**
+         * Upload spherical polynomial coefficients to the texture
+         * @param polynmials Spherical polynmial coefficients (9)
+         * @param outPolynomialCoefficents Polynomial coefficients (9) object to store result
+         */
+        private static _UploadSP(polynmials: EnvironmentTextureIrradianceInfoV1, outPolynomialCoefficents: SphericalPolynomial) {
+            outPolynomialCoefficents.x.x = polynmials.x[0];
+            outPolynomialCoefficents.x.y = polynmials.x[1];
+            outPolynomialCoefficents.x.z = polynmials.x[2];
+
+            outPolynomialCoefficents.y.x = polynmials.y[0];
+            outPolynomialCoefficents.y.y = polynmials.y[1];
+            outPolynomialCoefficents.y.z = polynmials.y[2];
+
+            outPolynomialCoefficents.z.x = polynmials.z[0];
+            outPolynomialCoefficents.z.y = polynmials.z[1];
+            outPolynomialCoefficents.z.z = polynmials.z[2];
+
+            //xx
+            outPolynomialCoefficents.xx.x = polynmials.xx[0];
+            outPolynomialCoefficents.xx.y = polynmials.xx[1];
+            outPolynomialCoefficents.xx.z = polynmials.xx[2];
+
+            outPolynomialCoefficents.yy.x = polynmials.yy[0];
+            outPolynomialCoefficents.yy.y = polynmials.yy[1];
+            outPolynomialCoefficents.yy.z = polynmials.yy[2];
+
+            outPolynomialCoefficents.zz.x = polynmials.zz[0];
+            outPolynomialCoefficents.zz.y = polynmials.zz[1];
+            outPolynomialCoefficents.zz.z = polynmials.zz[2];
+
+            //yz
+            outPolynomialCoefficents.yz.x = polynmials.yz[0];
+            outPolynomialCoefficents.yz.y = polynmials.yz[1];
+            outPolynomialCoefficents.yz.z = polynmials.yz[2];
+
+            outPolynomialCoefficents.zx.x = polynmials.zx[0];
+            outPolynomialCoefficents.zx.y = polynmials.zx[1];
+            outPolynomialCoefficents.zx.z = polynmials.zx[2];
+
+            outPolynomialCoefficents.xy.x = polynmials.xy[0];
+            outPolynomialCoefficents.xy.y = polynmials.xy[1];
+            outPolynomialCoefficents.xy.z = polynmials.xy[2];
         }
 
         /**
@@ -423,7 +608,7 @@ module BABYLON {
          * @param harmonics Spherical harmonic coefficients (9)
          */
         private static _ConvertSHIrradianceToLambertianRadiance(harmonics: any): void {
-            const scaleFactor = 1 / Math.PI;
+            let scaleFactor = 1 / Math.PI;
             // The resultant SH now represents outgoing radiance, so includes the Lambert 1/pi normalisation factor but without albedo (rho) applied
             // (The pixel shader must apply albedo after texture fetches, etc).
             harmonics.l00[0] *= scaleFactor;
@@ -461,7 +646,7 @@ module BABYLON {
          * @param outPolynomialCoefficents Polynomial coefficients (9) object to store result
          */
         private static _ConvertSHToSP(harmonics: any, outPolynomialCoefficents: SphericalPolynomial) {
-            const rPi = 1 / Math.PI;
+            let rPi = 1 / Math.PI;
 
             //x
             outPolynomialCoefficents.x.x = 1.02333 * harmonics.l11[0] * rPi;