Merge pull request #4368 from sebavan/FIX

Fix

dist/preview release/what's new.md

@@ -49,7 +49,9 @@
 - Physics `unregisterOnPhysicsCollide` didn't remove callback correctly [#4291](https://github.com/BabylonJS/Babylon.js/issues/4291) ([RaananW](https://github.com/RaananW))
 - Added missing getter and setter for global exposure in ColorCurves ([RaananW](https://github.com/RaananW))
 - Fixed an issue with view matrix when `ArcRotateCamera` was used with collisions ([Deltakosh](https://github.com/deltakosh))
-- Fixed a bug with setting `unlit` on `PBRMaterial` after the material is ready ([bghgary](http://www.github.com/bghgary))
+- Fixed a bug with setting `unlit` on `PBRMaterial` after the material is ready (Wrong dirty flags) ([bghgary](http://www.github.com/bghgary))
+- Fixed `HighlightLayer` support on browsers not supporting HalfFloat ([sebavan](http://www.github.com/sebavan))
+- Fixed support for R and RG texture formats ([sebavan](http://www.github.com/sebavan))
 
 ### Viewer
 
@@ -61,3 +63,4 @@
 - It wasn't possible to disable camera behavior(s) using configuration  [#4348](https://github.com/BabylonJS/Babylon.js/issues/4348) ([RaananW](https://github.com/RaananW))
 
 ## Breaking changes
+- Fixing support for R and RG texture formats made us remove TextureFormat_R32F and TextureFormat_RG32F as they were mixing formats and types. Please, use the respective TextureFormat_R and TextureFormat_RG with the Float types ([sebavan](http://www.github.com/sebavan))

src/Engine/babylon.engine.ts

@@ -446,10 +446,8 @@
         private static _TEXTUREFORMAT_LUMINANCE_ALPHA = 2;
         private static _TEXTUREFORMAT_RGB = 4;
         private static _TEXTUREFORMAT_RGBA = 5;
-        private static _TEXTUREFORMAT_R32F = 6;
-        private static _TEXTUREFORMAT_RG32F = 7;
-        private static _TEXTUREFORMAT_RGB32F = 8;
-        private static _TEXTUREFORMAT_RGBA32F = 9;
+        private static _TEXTUREFORMAT_R = 6;
+        private static _TEXTUREFORMAT_RG = 7;
 
         private static _TEXTURETYPE_UNSIGNED_INT = 0;
         private static _TEXTURETYPE_FLOAT = 1;
@@ -645,32 +643,18 @@
         }
 
         /**
-         * R32F
+         * R
          */
-        public static get TEXTUREFORMAT_R32F(): number {
-            return Engine._TEXTUREFORMAT_R32F;
+        public static get TEXTUREFORMAT_R(): number {
+            return Engine._TEXTUREFORMAT_R;
         }       
         
         /**
-         * RG32F
+         * RG
          */
-        public static get TEXTUREFORMAT_RG32F(): number {
-            return Engine._TEXTUREFORMAT_RG32F;
-        }       
-        
-        /**
-         * RGB32F
-         */
-        public static get TEXTUREFORMAT_RGB32F(): number {
-            return Engine._TEXTUREFORMAT_RGB32F;
-        }       
-        
-        /**
-         * RGBA32F
-         */
-        public static get TEXTUREFORMAT_RGBA32F(): number {
-            return Engine._TEXTUREFORMAT_RGBA32F;
-        }             
+        public static get TEXTUREFORMAT_RG(): number {
+            return Engine._TEXTUREFORMAT_RG;
+        }
 
         /** LUMINANCE_ALPHA */
         public static get TEXTUREFORMAT_LUMINANCE_ALPHA(): number {
@@ -5904,9 +5888,13 @@
          * @param format defines the data format
          * @param invertY defines if data must be stored with Y axis inverted
          * @param compression defines the used compression (can be null)
+         * @param textureType defines the texture Type (Engine.TEXTURETYPE_UNSIGNED_INT, Engine.TEXTURETYPE_FLOAT...)
          */
-        public updateRawTexture3D(texture: InternalTexture, data: Nullable<ArrayBufferView>, format: number, invertY: boolean, compression: Nullable<string> = null): void {
+        public updateRawTexture3D(texture: InternalTexture, data: Nullable<ArrayBufferView>, format: number, invertY: boolean, compression: Nullable<string> = null, textureType = Engine.TEXTURETYPE_UNSIGNED_INT): void {
+            var internalType = this._getWebGLTextureType(textureType);
             var internalFormat = this._getInternalFormat(format);
+            var internalSizedFomat = this._getRGBABufferInternalSizedFormat(textureType, format);
+
             this._bindTextureDirectly(this._gl.TEXTURE_3D, texture, true);
             this._gl.pixelStorei(this._gl.UNPACK_FLIP_Y_WEBGL, invertY === undefined ? 1 : (invertY ? 1 : 0));
 
@@ -5924,7 +5912,7 @@
             if (compression && data) {
                 this._gl.compressedTexImage3D(this._gl.TEXTURE_3D, 0, (<any>this.getCaps().s3tc)[compression], texture.width, texture.height, texture.depth, 0, data);
             } else {
-                this._gl.texImage3D(this._gl.TEXTURE_3D, 0, internalFormat, texture.width, texture.height, texture.depth, 0, internalFormat, this._gl.UNSIGNED_BYTE, data);
+                this._gl.texImage3D(this._gl.TEXTURE_3D, 0, internalSizedFomat, texture.width, texture.height, texture.depth, 0, internalFormat, internalType, data);
             }
 
             if (texture.generateMipMaps) {
@@ -5946,9 +5934,10 @@
          * @param invertY defines if data must be stored with Y axis inverted
          * @param samplingMode defines the required sampling mode (like BABYLON.Texture.NEAREST_SAMPLINGMODE)
          * @param compression defines the compressed used (can be null)
+         * @param textureType defines the compressed used (can be null)
          * @returns a new raw 3D texture (stored in an InternalTexture)
          */
-        public createRawTexture3D(data: Nullable<ArrayBufferView>, width: number, height: number, depth: number, format: number, generateMipMaps: boolean, invertY: boolean, samplingMode: number, compression: Nullable<string> = null): InternalTexture {
+        public createRawTexture3D(data: Nullable<ArrayBufferView>, width: number, height: number, depth: number, format: number, generateMipMaps: boolean, invertY: boolean, samplingMode: number, compression: Nullable<string> = null, textureType = Engine.TEXTURETYPE_UNSIGNED_INT): InternalTexture {
             var texture = new InternalTexture(this, InternalTexture.DATASOURCE_RAW3D);
             texture.baseWidth = width;
             texture.baseHeight = height;
@@ -5957,6 +5946,7 @@
             texture.height = height;
             texture.depth = depth;
             texture.format = format;
+            texture.type = textureType;
             texture.generateMipMaps = generateMipMaps;
             texture.samplingMode = samplingMode;
             texture.is3D = true;
@@ -5965,7 +5955,7 @@
                 texture._bufferView = data;
             }
 
-            this.updateRawTexture3D(texture, data, format, invertY, compression);
+            this.updateRawTexture3D(texture, data, format, invertY, compression, textureType);
             this._bindTextureDirectly(this._gl.TEXTURE_3D, texture, true);
 
             // Filters
@@ -7079,17 +7069,15 @@
                     internalFormat = this._gl.LUMINANCE_ALPHA;
                     break;
                 case Engine.TEXTUREFORMAT_RGB:
-                case Engine.TEXTUREFORMAT_RGB32F:
                     internalFormat = this._gl.RGB;
                     break;
                 case Engine.TEXTUREFORMAT_RGBA:
-                case Engine.TEXTUREFORMAT_RGBA32F:
                     internalFormat = this._gl.RGBA;
                     break;
-                case Engine.TEXTUREFORMAT_R32F:
+                case Engine.TEXTUREFORMAT_R:
                     internalFormat = this._gl.RED;
                     break;       
-                case Engine.TEXTUREFORMAT_RG32F:
+                case Engine.TEXTUREFORMAT_RG:
                     internalFormat = this._gl.RG;
                     break;                                    
             }
@@ -7114,17 +7102,28 @@
             if (type === Engine.TEXTURETYPE_FLOAT) {
                 if (format !== undefined) {
                     switch(format) {
-                        case Engine.TEXTUREFORMAT_R32F:
+                        case Engine.TEXTUREFORMAT_R:
                             return this._gl.R32F;
-                        case Engine.TEXTUREFORMAT_RG32F:
+                        case Engine.TEXTUREFORMAT_RG:
                             return this._gl.RG32F;
-                            case Engine.TEXTUREFORMAT_RGB32F:
-                            return this._gl.RGB32F;                            
+                            case Engine.TEXTUREFORMAT_RGB:
+                            return this._gl.RGB32F;
                     }                    
                 }
                 return this._gl.RGBA32F;
             }
-            else if (type === Engine.TEXTURETYPE_HALF_FLOAT) {
+
+            if (type === Engine.TEXTURETYPE_HALF_FLOAT) {
+                if (format) {
+                    switch(format) {
+                        case Engine.TEXTUREFORMAT_R:
+                            return this._gl.R16F;
+                        case Engine.TEXTUREFORMAT_RG:
+                            return this._gl.RG16F;
+                            case Engine.TEXTUREFORMAT_RGB:
+                            return this._gl.RGB16F;
+                    }                    
+                }
                 return this._gl.RGBA16F;
             }
 
@@ -7133,10 +7132,14 @@
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
                     case Engine.TEXTUREFORMAT_RGB:
-                        return this._gl.RGB;     
+                        return this._gl.RGB;
+                    case Engine.TEXTUREFORMAT_R:
+                        return this._gl.R8;
+                    case Engine.TEXTUREFORMAT_RG:
+                        return this._gl.RG8;
                     case Engine.TEXTUREFORMAT_ALPHA:
-                        return this._gl.ALPHA;                        
-                }                    
+                        return this._gl.ALPHA;
+                }
             }
             return this._gl.RGBA;
         };

src/Layer/babylon.highlightLayer.ts

@@ -271,6 +271,14 @@
             blurTextureWidth = this._engine.needPOTTextures ? Tools.GetExponentOfTwo(blurTextureWidth, this._maxSize) : blurTextureWidth;
             blurTextureHeight = this._engine.needPOTTextures ? Tools.GetExponentOfTwo(blurTextureHeight, this._maxSize) : blurTextureHeight;
 
+            var textureType = 0;
+            if (this._engine.getCaps().textureHalfFloatRender) {
+                textureType = Engine.TEXTURETYPE_HALF_FLOAT;
+            }
+            else {
+                textureType = Engine.TEXTURETYPE_UNSIGNED_INT;
+            }
+
             this._blurTexture = new RenderTargetTexture("HighlightLayerBlurRTT",
                 {
                     width: blurTextureWidth,
@@ -279,7 +287,7 @@
                 this._scene,
                 false,
                 true,
-                Engine.TEXTURETYPE_HALF_FLOAT);
+                textureType);
             this._blurTexture.wrapU = Texture.CLAMP_ADDRESSMODE;
             this._blurTexture.wrapV = Texture.CLAMP_ADDRESSMODE;
             this._blurTexture.anisotropicFilteringLevel = 16;
@@ -315,7 +323,7 @@
                         width:  blurTextureWidth,
                         height: blurTextureHeight
                     },
-                    null, Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, Engine.TEXTURETYPE_HALF_FLOAT);
+                    null, Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, textureType);
                 this._horizontalBlurPostprocess.width = blurTextureWidth;
                 this._horizontalBlurPostprocess.height = blurTextureHeight;
                 this._horizontalBlurPostprocess.onApplyObservable.add(effect => {
@@ -326,7 +334,7 @@
                         width:  blurTextureWidth,
                         height: blurTextureHeight
                     },
-                    null, Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, Engine.TEXTURETYPE_HALF_FLOAT);
+                    null, Texture.BILINEAR_SAMPLINGMODE, this._scene.getEngine(), false, textureType);
 
                 this._postProcesses = [this._horizontalBlurPostprocess, this._verticalBlurPostprocess];
             }

src/Materials/Textures/babylon.rawTexture3D.ts

@@ -16,11 +16,15 @@
          * @param generateMipMaps defines a boolean indicating if mip levels should be generated (true by default)
          * @param invertY defines if texture must be stored with Y axis inverted
          * @param samplingMode defines the sampling mode to use (BABYLON.Texture.TRILINEAR_SAMPLINGMODE by default)
+         * @param textureType defines the texture Type (Engine.TEXTURETYPE_UNSIGNED_INT, Engine.TEXTURETYPE_FLOAT...)
          */
         constructor(data: ArrayBufferView, width: number, height: number, depth: number, 
-                    /** Gets or sets the texture format to use*/
+                    /** Gets or sets the texture format to use */
                     public format: number, scene: Scene, 
-                    generateMipMaps: boolean = true, invertY: boolean = false, samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE) {
+                    generateMipMaps: boolean = true, 
+                    invertY: boolean = false, 
+                    samplingMode: number = Texture.TRILINEAR_SAMPLINGMODE,
+                    textureType = Engine.TEXTURETYPE_UNSIGNED_INT) {
             super(null, scene, !generateMipMaps, invertY);
             this._engine = scene.getEngine();
 
@@ -32,7 +36,9 @@
                 format,
                 generateMipMaps,
                 invertY,
-                samplingMode
+                samplingMode,
+                undefined,
+                textureType
             )
     
             this.is3D = true;
@@ -46,7 +52,7 @@
             if (!this._texture) {
                 return;
             }
-            this._engine.updateRawTexture3D(this._texture, data, this._texture.format, this._texture!.invertY);
+            this._engine.updateRawTexture3D(this._texture, data, this._texture.format, this._texture!.invertY, undefined, this._texture.type);
         }
     }
 }

src/Particles/babylon.gpuParticleSystem.ts

@@ -379,7 +379,7 @@
                 d.push(Math.random());
                 d.push(Math.random());
             }
-            this._randomTexture = new RawTexture(new Float32Array(d), maxTextureSize, 1, Engine.TEXTUREFORMAT_RGBA32F, this._scene, false, false, Texture.NEAREST_SAMPLINGMODE, Engine.TEXTURETYPE_FLOAT)
+            this._randomTexture = new RawTexture(new Float32Array(d), maxTextureSize, 1, Engine.TEXTUREFORMAT_RGBA, this._scene, false, false, Texture.NEAREST_SAMPLINGMODE, Engine.TEXTURETYPE_FLOAT)
             this._randomTexture.wrapU = Texture.WRAP_ADDRESSMODE;
             this._randomTexture.wrapV = Texture.WRAP_ADDRESSMODE;
 

src/babylon.mixins.ts

@@ -57,8 +57,13 @@ interface WebGLRenderingContext {
     R32F: number;
     RG32F: number;
     RGB32F: number;
+    R16F: number;
+    RG16F: number;
+    RGB16F: number;
     RED: number;
     RG: number;
+    R8: number;
+    RG8: number;
 
     UNSIGNED_INT_24_8: number;
     DEPTH24_STENCIL8: number;