Fix #4157

Fix inspector white line issue
Fix RawTexture issue with RGB format

dist/preview release/babylon.max.js

@@ -17018,6 +17018,8 @@ var BABYLON;
                 switch (format) {
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
+                    case Engine.TEXTUREFORMAT_RGB:
+                        return this._gl.RGB;
                 }
             }
             return this._gl.RGBA;

dist/preview release/babylon.no-module.max.js

@@ -16985,6 +16985,8 @@ var BABYLON;
                 switch (format) {
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
+                    case Engine.TEXTUREFORMAT_RGB:
+                        return this._gl.RGB;
                 }
             }
             return this._gl.RGBA;

dist/preview release/es6.js

@@ -16985,6 +16985,8 @@ var BABYLON;
                 switch (format) {
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
+                    case Engine.TEXTUREFORMAT_RGB:
+                        return this._gl.RGB;
                 }
             }
             return this._gl.RGBA;

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

@@ -268,6 +268,12 @@ declare module BABYLON.GUI {
        * An event triggered after the control is drawn
        */
         onAfterDrawObservable: Observable<Control>;
+        /** Gets or set information about font offsets (used to render and align text) */
+        fontOffset: {
+            ascent: number;
+            height: number;
+            descent: number;
+        };
         alpha: number;
         scaleX: number;
         scaleY: number;

dist/preview release/gui/babylon.gui.js

@@ -1081,6 +1081,17 @@ var BABYLON;
                 enumerable: true,
                 configurable: true
             });
+            Object.defineProperty(Control.prototype, "fontOffset", {
+                /** Gets or set information about font offsets (used to render and align text) */
+                get: function () {
+                    return this._fontOffset;
+                },
+                set: function (offset) {
+                    this._fontOffset = offset;
+                },
+                enumerable: true,
+                configurable: true
+            });
             Object.defineProperty(Control.prototype, "alpha", {
                 get: function () {
                     return this._alpha;

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

@@ -273,6 +273,12 @@ declare module BABYLON.GUI {
        * An event triggered after the control is drawn
        */
         onAfterDrawObservable: Observable<Control>;
+        /** Gets or set information about font offsets (used to render and align text) */
+        fontOffset: {
+            ascent: number;
+            height: number;
+            descent: number;
+        };
         alpha: number;
         scaleX: number;
         scaleY: number;

dist/preview release/inspector/babylon.inspector.css

@@ -242,6 +242,36 @@
   .insp-wrapper .tab-panel .stat-infos {
     width: 100%;
     padding: 4px; }
+  .insp-wrapper .tab-panel .gltf-actions {
+    overflow-y: auto;
+    padding-left: 5px; }
+    .insp-wrapper .tab-panel .gltf-actions .gltf-title {
+      font-size: 1.1em;
+      padding-bottom: 10px;
+      border-bottom: 1px solid #5db0d7;
+      margin: 10px 0 10px 0; }
+    .insp-wrapper .tab-panel .gltf-actions .gltf-input {
+      background-color: #2c2c2c;
+      border: none;
+      outline: none;
+      font-family: "Inconsolata", sans-serif;
+      color: #b3b3b3;
+      padding: 5px;
+      margin: 0px 6px 0px 0; }
+      .insp-wrapper .tab-panel .gltf-actions .gltf-input:hover {
+        background-color: #383838; }
+    .insp-wrapper .tab-panel .gltf-actions .gltf-button {
+      background-color: #2c2c2c;
+      border: none;
+      outline: none;
+      font-family: "Inconsolata", sans-serif;
+      color: #ccc;
+      padding: 5px 10px;
+      margin: 0px 6px 0px 0; }
+      .insp-wrapper .tab-panel .gltf-actions .gltf-button:hover {
+        background-color: #383838; }
+      .insp-wrapper .tab-panel .gltf-actions .gltf-button:active {
+        background-color: #454545; }
   .insp-wrapper .property-type {
     color: #5db0d7; }
   .insp-wrapper .property-name, .insp-wrapper .insp-details .base-row .prop-name, .insp-wrapper .insp-details .row .prop-name, .insp-wrapper .insp-details .header-row .prop-name {

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

@@ -1017,6 +1017,17 @@ declare module INSPECTOR {
     }
 }
 
+
+
+declare module INSPECTOR {
+    class GLTFTab extends Tab {
+        constructor(tabbar: TabBar, inspector: Inspector);
+        dispose(): void;
+        private _addExport(inspector, actions);
+        private static _IsSkyBox(transformNode);
+    }
+}
+
 declare module INSPECTOR {
     /**
      * A tab bar will contains each view the inspector can have : Canvas2D, Meshes...

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

@@ -2801,7 +2801,7 @@ var INSPECTOR;
                     node.active(false);
                 }
             }
-            item.getDiv().scrollIntoView();
+            //  item.getDiv().scrollIntoView();
             item.active(true);
         };
         /** Returns the treeitem corersponding to the given obj, null if not found */
@@ -4021,6 +4021,65 @@ var INSPECTOR;
     INSPECTOR.StatsTab = StatsTab;
 })(INSPECTOR || (INSPECTOR = {}));
 
+/// <reference path="../../../dist/preview release/glTF2Interface/babylon.glTF2Interface.d.ts"/>
+/// <reference path="../../../dist/preview release/serializers/babylon.glTF2Serializer.d.ts"/>
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = Object.setPrototypeOf ||
+        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
+    return function (d, b) {
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var INSPECTOR;
+(function (INSPECTOR) {
+    var GLTFTab = /** @class */ (function (_super) {
+        __extends(GLTFTab, _super);
+        function GLTFTab(tabbar, inspector) {
+            var _this = _super.call(this, tabbar, 'GLTF') || this;
+            _this._panel = INSPECTOR.Helpers.CreateDiv('tab-panel');
+            var actions = INSPECTOR.Helpers.CreateDiv('gltf-actions', _this._panel);
+            _this._addExport(inspector, actions);
+            return _this;
+        }
+        GLTFTab.prototype.dispose = function () {
+            // Nothing to dispose
+        };
+        GLTFTab.prototype._addExport = function (inspector, actions) {
+            var title = INSPECTOR.Helpers.CreateDiv('gltf-title', actions);
+            title.textContent = 'Export';
+            var name = INSPECTOR.Helpers.CreateInput('gltf-input', actions);
+            name.placeholder = "File name...";
+            var button = INSPECTOR.Helpers.CreateElement('button', 'gltf-button', actions);
+            button.innerText = 'Export GLB';
+            button.addEventListener('click', function () {
+                var data = BABYLON.GLTF2Export.GLB(inspector.scene, name.value || "scene", {
+                    shouldExportMesh: function (mesh) { return !GLTFTab._IsSkyBox(mesh); }
+                });
+                if (data) {
+                    data.downloadFiles();
+                }
+            });
+        };
+        GLTFTab._IsSkyBox = function (transformNode) {
+            if (transformNode instanceof BABYLON.Mesh) {
+                if (transformNode.material) {
+                    var material = transformNode.material;
+                    var reflectionTexture = material.reflectionTexture;
+                    if (reflectionTexture && reflectionTexture.coordinatesMode === BABYLON.Texture.SKYBOX_MODE) {
+                        return true;
+                    }
+                }
+            }
+            return false;
+        };
+        return GLTFTab;
+    }(INSPECTOR.Tab));
+    INSPECTOR.GLTFTab = GLTFTab;
+})(INSPECTOR || (INSPECTOR = {}));
+
 var __extends = (this && this.__extends) || (function () {
     var extendStatics = Object.setPrototypeOf ||
         ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
@@ -4056,6 +4115,9 @@ var INSPECTOR;
             _this._tabs.push(_this._meshTab);
             _this._tabs.push(new INSPECTOR.LightTab(_this, _this._inspector));
             _this._tabs.push(new INSPECTOR.MaterialTab(_this, _this._inspector));
+            if (BABYLON.GLTF2Export) {
+                _this._tabs.push(new INSPECTOR.GLTFTab(_this, _this._inspector));
+            }
             if (BABYLON.GUI) {
                 _this._tabs.push(new INSPECTOR.GUITab(_this, _this._inspector));
             }

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

@@ -17106,6 +17106,8 @@ var BABYLON;
                 switch (format) {
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
+                    case Engine.TEXTUREFORMAT_RGB:
+                        return this._gl.RGB;
                 }
             }
             return this._gl.RGBA;

gui/src/controls/control.ts

@@ -107,6 +107,15 @@ module BABYLON.GUI {
        */
         public onAfterDrawObservable = new Observable<Control>();
 
+        /** Gets or set information about font offsets (used to render and align text) */
+        public get fontOffset(): { ascent: number, height: number, descent: number } {
+            return this._fontOffset;
+        }
+
+        public set fontOffset(offset: { ascent: number, height: number, descent: number }) {
+            this._fontOffset = offset;
+        }
+
         public get alpha(): number {
             return this._alpha;
         }

inspector/src/tabs/PropertyTab.ts

@@ -101,7 +101,7 @@ module INSPECTOR {
                     node.active(false);
                 }
             }
-            item.getDiv().scrollIntoView();
+          //  item.getDiv().scrollIntoView();
             item.active(true);
         }
 

src/Engine/babylon.engine.ts

@@ -7100,6 +7100,8 @@
                 switch(format) {
                     case Engine.TEXTUREFORMAT_LUMINANCE:
                         return this._gl.LUMINANCE;
+                    case Engine.TEXTUREFORMAT_RGB:
+                        return this._gl.RGB;                        
                 }                    
             }
             return this._gl.RGBA;