Merge pull request #4718 from theom/master

Add an InputPassword control

Tools/Gulp/config.json

@@ -1806,6 +1806,7 @@
                     "../../gui/src/2D/controls/button.ts",
                     "../../gui/src/2D/controls/colorpicker.ts",
                     "../../gui/src/2D/controls/inputText.ts",
+                    "../../gui/src/2D/controls/inputPassword.ts",
                     "../../gui/src/2D/controls/virtualKeyboard.ts",
                     "../../gui/src/2D/controls/multiLine.ts",
                     "../../gui/src/2D/controls/grid.ts",                    
@@ -2020,4 +2021,4 @@
             ]
         }
     }
-}
+}

dist/preview release/what's new.md

@@ -26,6 +26,7 @@
   - Added support for angular speed gradients. [Doc](https://doc.babylonjs.com/babylon101/particles#rotation)
 - Added SceneComponent to help decoupling Scene from its components ([sebavan](http://www.github.com/sebavan))
 - Playground can now be used with TypeScript directly!. [Demo](https://www.babylonjs-playground.com/ts.html) ([Deltakosh](https://github.com/deltakosh), [NasimiAsl](https://github.com/NasimiAsl)) 
+- New GUI control: [InputPassword](https://doc.babylonjs.com/how_to/gui#inputpassword) ([theom](https://github.com/theom))
 
 ## Updates
 

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

@@ -0,0 +1,16 @@
+/// <reference path="../../../../dist/preview release/babylon.d.ts"/>
+
+module BABYLON.GUI {
+    /**
+     * Class used to create a password control
+     */
+    export class InputPassword extends InputText {
+        protected _beforeRenderText(text: string): string {
+            let txt = "";
+            for (let i = 0; i < text.length; i++) {
+                txt += "\u2022";
+            }
+            return txt;
+        }
+    }
+}

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

@@ -239,7 +239,7 @@ module BABYLON.GUI {
             // Specific cases
             switch (keyCode) {
                 case 32: //SPACE
-                    key = " "; //ie11 key for space is "Spacebar" 
+                    key = " "; //ie11 key for space is "Spacebar"
                     break;
                 case 8: // BACKSPACE
                     if (this._text && this._text.length > 0) {
@@ -310,7 +310,7 @@ module BABYLON.GUI {
             }
         }
 
-        /** @hidden */       
+        /** @hidden */
         public processKeyboard(evt: KeyboardEvent): void {
             this.processKey(evt.keyCode, evt.key);
         }
@@ -357,7 +357,7 @@ module BABYLON.GUI {
                     context.fillStyle = this.color;
                 }
 
-                let text = this._text;
+                let text = this._beforeRenderText(this._text);
 
                 if (!this._isFocused && !this._text && this._placeholderText) {
                     text = this._placeholderText;
@@ -460,7 +460,7 @@ module BABYLON.GUI {
             context.restore();
         }
 
-        public _onPointerDown(target: Control, coordinates: Vector2, pointerId:number, buttonIndex: number): boolean {
+        public _onPointerDown(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number): boolean {
             if (!super._onPointerDown(target, coordinates, pointerId, buttonIndex)) {
                 return false;
             }
@@ -477,10 +477,14 @@ module BABYLON.GUI {
             return true;
         }
 
-        public _onPointerUp(target: Control, coordinates: Vector2, pointerId:number, buttonIndex: number, notifyClick: boolean): void {
+        public _onPointerUp(target: Control, coordinates: Vector2, pointerId: number, buttonIndex: number, notifyClick: boolean): void {
             super._onPointerUp(target, coordinates, pointerId, buttonIndex, notifyClick);
         }
 
+        protected _beforeRenderText(text: string): string {
+            return text;
+        }
+
         public dispose() {
             super.dispose();