Fix inputeText border

dist/preview release/babylon.max.js

@@ -105304,6 +105304,9 @@ var BABYLON;
              */
             _this.scalePivot = null;
             _this._existingMeshScale = new BABYLON.Vector3();
+            // Dragging
+            _this._dragMesh = null;
+            _this.pointerDragBehavior = new BABYLON.PointerDragBehavior();
             // Do not update the gizmo's scale so it has a fixed size to the object its attached to
             _this._updateScale = false;
             _this._anchorMesh = new BABYLON.AbstractMesh("anchor", gizmoLayer.utilityLayerScene);
@@ -105394,6 +105397,7 @@ var BABYLON;
                         _this.updateBoundingBox();
                         BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                     }
+                    _this._updateDummy();
                 });
                 // Selection/deselection
                 _dragBehavior.onDragStartObservable.add(function () {
@@ -105403,6 +105407,7 @@ var BABYLON;
                 _dragBehavior.onDragEndObservable.add(function () {
                     _this.onRotationSphereDragEndObservable.notifyObservers({});
                     _this._selectNode(null);
+                    _this._updateDummy();
                 });
                 this_1._rotateSpheresParent.addChild(sphere);
             };
@@ -105455,6 +105460,7 @@ var BABYLON;
                                 _this._anchorMesh.removeChild(_this.attachedMesh);
                                 BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                             }
+                            _this._updateDummy();
                         });
                         // Selection/deselection
                         _dragBehavior.onDragStartObservable.add(function () {
@@ -105464,6 +105470,7 @@ var BABYLON;
                         _dragBehavior.onDragEndObservable.add(function () {
                             _this.onScaleBoxDragEndObservable.notifyObservers({});
                             _this._selectNode(null);
+                            _this._updateDummy();
                         });
                         this_2._scaleBoxesParent.addChild(box);
                     };
@@ -105502,6 +105509,11 @@ var BABYLON;
                     _this._updateRotationSpheres();
                     _this._updateScaleBoxes();
                 }
+                // If dragg mesh is enabled and dragging, update the attached mesh pose to match the drag mesh
+                if (_this._dragMesh && _this.attachedMesh && _this.pointerDragBehavior.dragging) {
+                    _this._lineBoundingBox.position.rotateByQuaternionToRef(_this._rootMesh.rotationQuaternion, _this._tmpVector);
+                    _this.attachedMesh.setAbsolutePosition(_this._dragMesh.position.add(_this._tmpVector.scale(-1)));
+                }
             });
             _this.updateBoundingBox();
             return _this;
@@ -105534,6 +105546,7 @@ var BABYLON;
             this._PivotCached--;
         };
         BoundingBoxGizmo.prototype._attachedMeshChanged = function (value) {
+            var _this = this;
             if (value) {
                 // Reset anchor mesh to match attached mesh's scale
                 // This is needed to avoid invalid box/sphere position on first drag
@@ -105542,6 +105555,9 @@ var BABYLON;
                 this._anchorMesh.removeChild(value);
                 BoundingBoxGizmo._RestorePivotPoint(value);
                 this.updateBoundingBox();
+                this.gizmoLayer.utilityLayerScene.onAfterRenderObservable.addOnce(function () {
+                    _this._updateDummy();
+                });
             }
         };
         BoundingBoxGizmo.prototype._selectNode = function (selectedMesh) {
@@ -105663,6 +105679,23 @@ var BABYLON;
                 }
             });
         };
+        BoundingBoxGizmo.prototype._updateDummy = function () {
+            if (this._dragMesh) {
+                this._dragMesh.position.copyFrom(this._lineBoundingBox.getAbsolutePosition());
+                this._dragMesh.scaling.copyFrom(this._lineBoundingBox.scaling);
+                this._dragMesh.rotationQuaternion.copyFrom(this._rootMesh.rotationQuaternion);
+            }
+        };
+        /**
+         * Enables a pointer drag behavior on the bounding box of the gizmo
+         */
+        BoundingBoxGizmo.prototype.enableDragBehavior = function () {
+            this._dragMesh = BABYLON.Mesh.CreateBox("dummy", 1, this.gizmoLayer.utilityLayerScene);
+            this._dragMesh.visibility = 0;
+            this._dragMesh.rotationQuaternion = new BABYLON.Quaternion();
+            this.pointerDragBehavior.useObjectOrienationForDragging = false;
+            this._dragMesh.addBehavior(this.pointerDragBehavior);
+        };
         /**
          * Disposes of the gizmo
          */
@@ -105672,6 +105705,9 @@ var BABYLON;
             this._lineBoundingBox.dispose();
             this._rotateSpheresParent.dispose();
             this._scaleBoxesParent.dispose();
+            if (this._dragMesh) {
+                this._dragMesh.dispose();
+            }
             _super.prototype.dispose.call(this);
         };
         /**

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

@@ -105271,6 +105271,9 @@ var BABYLON;
              */
             _this.scalePivot = null;
             _this._existingMeshScale = new BABYLON.Vector3();
+            // Dragging
+            _this._dragMesh = null;
+            _this.pointerDragBehavior = new BABYLON.PointerDragBehavior();
             // Do not update the gizmo's scale so it has a fixed size to the object its attached to
             _this._updateScale = false;
             _this._anchorMesh = new BABYLON.AbstractMesh("anchor", gizmoLayer.utilityLayerScene);
@@ -105361,6 +105364,7 @@ var BABYLON;
                         _this.updateBoundingBox();
                         BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                     }
+                    _this._updateDummy();
                 });
                 // Selection/deselection
                 _dragBehavior.onDragStartObservable.add(function () {
@@ -105370,6 +105374,7 @@ var BABYLON;
                 _dragBehavior.onDragEndObservable.add(function () {
                     _this.onRotationSphereDragEndObservable.notifyObservers({});
                     _this._selectNode(null);
+                    _this._updateDummy();
                 });
                 this_1._rotateSpheresParent.addChild(sphere);
             };
@@ -105422,6 +105427,7 @@ var BABYLON;
                                 _this._anchorMesh.removeChild(_this.attachedMesh);
                                 BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                             }
+                            _this._updateDummy();
                         });
                         // Selection/deselection
                         _dragBehavior.onDragStartObservable.add(function () {
@@ -105431,6 +105437,7 @@ var BABYLON;
                         _dragBehavior.onDragEndObservable.add(function () {
                             _this.onScaleBoxDragEndObservable.notifyObservers({});
                             _this._selectNode(null);
+                            _this._updateDummy();
                         });
                         this_2._scaleBoxesParent.addChild(box);
                     };
@@ -105469,6 +105476,11 @@ var BABYLON;
                     _this._updateRotationSpheres();
                     _this._updateScaleBoxes();
                 }
+                // If dragg mesh is enabled and dragging, update the attached mesh pose to match the drag mesh
+                if (_this._dragMesh && _this.attachedMesh && _this.pointerDragBehavior.dragging) {
+                    _this._lineBoundingBox.position.rotateByQuaternionToRef(_this._rootMesh.rotationQuaternion, _this._tmpVector);
+                    _this.attachedMesh.setAbsolutePosition(_this._dragMesh.position.add(_this._tmpVector.scale(-1)));
+                }
             });
             _this.updateBoundingBox();
             return _this;
@@ -105501,6 +105513,7 @@ var BABYLON;
             this._PivotCached--;
         };
         BoundingBoxGizmo.prototype._attachedMeshChanged = function (value) {
+            var _this = this;
             if (value) {
                 // Reset anchor mesh to match attached mesh's scale
                 // This is needed to avoid invalid box/sphere position on first drag
@@ -105509,6 +105522,9 @@ var BABYLON;
                 this._anchorMesh.removeChild(value);
                 BoundingBoxGizmo._RestorePivotPoint(value);
                 this.updateBoundingBox();
+                this.gizmoLayer.utilityLayerScene.onAfterRenderObservable.addOnce(function () {
+                    _this._updateDummy();
+                });
             }
         };
         BoundingBoxGizmo.prototype._selectNode = function (selectedMesh) {
@@ -105630,6 +105646,23 @@ var BABYLON;
                 }
             });
         };
+        BoundingBoxGizmo.prototype._updateDummy = function () {
+            if (this._dragMesh) {
+                this._dragMesh.position.copyFrom(this._lineBoundingBox.getAbsolutePosition());
+                this._dragMesh.scaling.copyFrom(this._lineBoundingBox.scaling);
+                this._dragMesh.rotationQuaternion.copyFrom(this._rootMesh.rotationQuaternion);
+            }
+        };
+        /**
+         * Enables a pointer drag behavior on the bounding box of the gizmo
+         */
+        BoundingBoxGizmo.prototype.enableDragBehavior = function () {
+            this._dragMesh = BABYLON.Mesh.CreateBox("dummy", 1, this.gizmoLayer.utilityLayerScene);
+            this._dragMesh.visibility = 0;
+            this._dragMesh.rotationQuaternion = new BABYLON.Quaternion();
+            this.pointerDragBehavior.useObjectOrienationForDragging = false;
+            this._dragMesh.addBehavior(this.pointerDragBehavior);
+        };
         /**
          * Disposes of the gizmo
          */
@@ -105639,6 +105672,9 @@ var BABYLON;
             this._lineBoundingBox.dispose();
             this._rotateSpheresParent.dispose();
             this._scaleBoxesParent.dispose();
+            if (this._dragMesh) {
+                this._dragMesh.dispose();
+            }
             _super.prototype.dispose.call(this);
         };
         /**

dist/preview release/es6.js

@@ -105271,6 +105271,9 @@ var BABYLON;
              */
             _this.scalePivot = null;
             _this._existingMeshScale = new BABYLON.Vector3();
+            // Dragging
+            _this._dragMesh = null;
+            _this.pointerDragBehavior = new BABYLON.PointerDragBehavior();
             // Do not update the gizmo's scale so it has a fixed size to the object its attached to
             _this._updateScale = false;
             _this._anchorMesh = new BABYLON.AbstractMesh("anchor", gizmoLayer.utilityLayerScene);
@@ -105361,6 +105364,7 @@ var BABYLON;
                         _this.updateBoundingBox();
                         BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                     }
+                    _this._updateDummy();
                 });
                 // Selection/deselection
                 _dragBehavior.onDragStartObservable.add(function () {
@@ -105370,6 +105374,7 @@ var BABYLON;
                 _dragBehavior.onDragEndObservable.add(function () {
                     _this.onRotationSphereDragEndObservable.notifyObservers({});
                     _this._selectNode(null);
+                    _this._updateDummy();
                 });
                 this_1._rotateSpheresParent.addChild(sphere);
             };
@@ -105422,6 +105427,7 @@ var BABYLON;
                                 _this._anchorMesh.removeChild(_this.attachedMesh);
                                 BoundingBoxGizmo._RestorePivotPoint(_this.attachedMesh);
                             }
+                            _this._updateDummy();
                         });
                         // Selection/deselection
                         _dragBehavior.onDragStartObservable.add(function () {
@@ -105431,6 +105437,7 @@ var BABYLON;
                         _dragBehavior.onDragEndObservable.add(function () {
                             _this.onScaleBoxDragEndObservable.notifyObservers({});
                             _this._selectNode(null);
+                            _this._updateDummy();
                         });
                         this_2._scaleBoxesParent.addChild(box);
                     };
@@ -105469,6 +105476,11 @@ var BABYLON;
                     _this._updateRotationSpheres();
                     _this._updateScaleBoxes();
                 }
+                // If dragg mesh is enabled and dragging, update the attached mesh pose to match the drag mesh
+                if (_this._dragMesh && _this.attachedMesh && _this.pointerDragBehavior.dragging) {
+                    _this._lineBoundingBox.position.rotateByQuaternionToRef(_this._rootMesh.rotationQuaternion, _this._tmpVector);
+                    _this.attachedMesh.setAbsolutePosition(_this._dragMesh.position.add(_this._tmpVector.scale(-1)));
+                }
             });
             _this.updateBoundingBox();
             return _this;
@@ -105501,6 +105513,7 @@ var BABYLON;
             this._PivotCached--;
         };
         BoundingBoxGizmo.prototype._attachedMeshChanged = function (value) {
+            var _this = this;
             if (value) {
                 // Reset anchor mesh to match attached mesh's scale
                 // This is needed to avoid invalid box/sphere position on first drag
@@ -105509,6 +105522,9 @@ var BABYLON;
                 this._anchorMesh.removeChild(value);
                 BoundingBoxGizmo._RestorePivotPoint(value);
                 this.updateBoundingBox();
+                this.gizmoLayer.utilityLayerScene.onAfterRenderObservable.addOnce(function () {
+                    _this._updateDummy();
+                });
             }
         };
         BoundingBoxGizmo.prototype._selectNode = function (selectedMesh) {
@@ -105630,6 +105646,23 @@ var BABYLON;
                 }
             });
         };
+        BoundingBoxGizmo.prototype._updateDummy = function () {
+            if (this._dragMesh) {
+                this._dragMesh.position.copyFrom(this._lineBoundingBox.getAbsolutePosition());
+                this._dragMesh.scaling.copyFrom(this._lineBoundingBox.scaling);
+                this._dragMesh.rotationQuaternion.copyFrom(this._rootMesh.rotationQuaternion);
+            }
+        };
+        /**
+         * Enables a pointer drag behavior on the bounding box of the gizmo
+         */
+        BoundingBoxGizmo.prototype.enableDragBehavior = function () {
+            this._dragMesh = BABYLON.Mesh.CreateBox("dummy", 1, this.gizmoLayer.utilityLayerScene);
+            this._dragMesh.visibility = 0;
+            this._dragMesh.rotationQuaternion = new BABYLON.Quaternion();
+            this.pointerDragBehavior.useObjectOrienationForDragging = false;
+            this._dragMesh.addBehavior(this.pointerDragBehavior);
+        };
         /**
          * Disposes of the gizmo
          */
@@ -105639,6 +105672,9 @@ var BABYLON;
             this._lineBoundingBox.dispose();
             this._rotateSpheresParent.dispose();
             this._scaleBoxesParent.dispose();
+            if (this._dragMesh) {
+                this._dragMesh.dispose();
+            }
             _super.prototype.dispose.call(this);
         };
         /**

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

@@ -1615,6 +1615,8 @@ declare module BABYLON.GUI {
             thickness: number;
             /** Gets or sets the background color when focused */
             focusedBackground: string;
+            /** Gets or sets the background color when focused */
+            focusedColor: string;
             /** Gets or sets the background color */
             background: string;
             /** Gets or sets the placeholder color */

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

@@ -1740,6 +1740,8 @@ declare module 'babylonjs-gui/2D/controls/inputText' {
             thickness: number;
             /** Gets or sets the background color when focused */
             focusedBackground: string;
+            /** Gets or sets the background color when focused */
+            focusedColor: string;
             /** Gets or sets the background color */
             background: string;
             /** Gets or sets the placeholder color */
@@ -4791,6 +4793,8 @@ declare module BABYLON.GUI {
             thickness: number;
             /** Gets or sets the background color when focused */
             focusedBackground: string;
+            /** Gets or sets the background color when focused */
+            focusedColor: string;
             /** Gets or sets the background color */
             background: string;
             /** Gets or sets the placeholder color */

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

@@ -1728,6 +1728,37 @@ declare module BabylonViewer {
     }
 }
 declare module BabylonViewer {
+    export interface ICameraConfiguration {
+        position?: {
+            x: number;
+            y: number;
+            z: number;
+        };
+        rotation?: {
+            x: number;
+            y: number;
+            z: number;
+            w: number;
+        };
+        fov?: number;
+        fovMode?: number;
+        minZ?: number;
+        maxZ?: number;
+        inertia?: number;
+        exposure?: number;
+        pinchPrecision?: number;
+        behaviors?: {
+            [name: string]: boolean | number | ICameraBehaviorConfiguration;
+        };
+        disableCameraControl?: boolean;
+        disableCtrlForPanning?: boolean;
+        disableAutoFocus?: boolean;
+        [propName: string]: any;
+    }
+    export interface ICameraBehaviorConfiguration {
+        type: number;
+        [propName: string]: any;
+    }
 }
 declare module BabylonViewer {
     /**

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

@@ -1872,7 +1872,37 @@ declare module 'babylonjs-viewer/loader/plugins/extendedMaterialLoaderPlugin' {
 }
 
 declare module 'babylonjs-viewer/configuration/interfaces/cameraConfiguration' {
-    
+    export interface ICameraConfiguration {
+        position?: {
+            x: number;
+            y: number;
+            z: number;
+        };
+        rotation?: {
+            x: number;
+            y: number;
+            z: number;
+            w: number;
+        };
+        fov?: number;
+        fovMode?: number;
+        minZ?: number;
+        maxZ?: number;
+        inertia?: number;
+        exposure?: number;
+        pinchPrecision?: number;
+        behaviors?: {
+            [name: string]: boolean | number | ICameraBehaviorConfiguration;
+        };
+        disableCameraControl?: boolean;
+        disableCtrlForPanning?: boolean;
+        disableAutoFocus?: boolean;
+        [propName: string]: any;
+    }
+    export interface ICameraBehaviorConfiguration {
+        type: number;
+        [propName: string]: any;
+    }
 }
 
 declare module 'babylonjs-viewer/configuration/interfaces/colorGradingConfiguration' {

gui/src/2D/controls/inputText.ts

@@ -12,6 +12,7 @@ export class InputText extends Control implements IFocusableControl {
     private _placeholderText = "";
     private _background = "#222222";
     private _focusedBackground = "#000000";
+    private _focusedColor = "white";
     private _placeholderColor = "gray";
     private _thickness = 1;
     private _margin = new ValueAndUnit(10, ValueAndUnit.UNITMODE_PIXEL);
@@ -183,6 +184,20 @@ export class InputText extends Control implements IFocusableControl {
         this._markAsDirty();
     }
 
+    /** Gets or sets the background color when focused */
+    public get focusedColor(): string {
+        return this._focusedColor;
+    }
+
+    public set focusedColor(value: string) {
+        if (this._focusedColor === value) {
+            return;
+        }
+
+        this._focusedColor = value;
+        this._markAsDirty();
+    }
+
     /** Gets or sets the background color */
     public get background(): string {
         return this._background;
@@ -829,9 +844,7 @@ export class InputText extends Control implements IFocusableControl {
         let rootY = this._fontOffset.ascent + (this._currentMeasure.height - this._fontOffset.height) / 2;
         let availableWidth = this._width.getValueInPixel(this._host, this._tempParentMeasure.width) - marginWidth;
 
-        if (this._isFocused) {
-            context.save();
-        }
+        context.save();
         context.beginPath();
         context.rect(clipTextLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, availableWidth + 2, this._currentMeasure.height);
         context.clip();
@@ -923,20 +936,27 @@ export class InputText extends Control implements IFocusableControl {
                 context.fillRect(highlightCursorLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, width, this._fontOffset.height);
                 context.globalAlpha = 1.0;
             }
+        }
+        context.restore();
 
-            context.restore();
-
-            // Border
-            if (this._thickness) {
+        // Border
+        if (this._thickness) {
+            if (this._isFocused) {
+                if (this.focusedColor) {
+                    context.strokeStyle = this.focusedColor;
+                }
+            } else {
                 if (this.color) {
                     context.strokeStyle = this.color;
                 }
-                context.lineWidth = this._thickness;
-
-                context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2,
-                    this._currentMeasure.width - this._thickness, this._currentMeasure.height - this._thickness);
             }
+
+            context.lineWidth = this._thickness;
+
+            context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2,
+                this._currentMeasure.width - this._thickness, this._currentMeasure.height - this._thickness);
         }
+
         context.restore();
     }