Merge branch 'text_edit' into 'master'

webgl IME keyboard

See merge request upm-packages/ui-widgets/com.unity.uiwidgets!136

Runtime/engine/UIWidgetsMessageManager.cs

             managerObj.AddComponent<UIWidgetsMessageManager>();
         }
         
-#if UNITY_IOS || UNITY_ANDROID
+#if UNITY_IOS || UNITY_ANDROID || UNITY_WEBGL
         string _lastObjectName;
 #endif
         
         }
 
         void UpdateNameIfNeed() {
-#if UNITY_IOS || UNITY_ANDROID
+#if UNITY_IOS || UNITY_ANDROID || UNITY_WEBGL
             var name = this.gameObject.name;
             if (name != this._lastObjectName) {
 
             }
         }
 
-#if UNITY_IOS        
+#if UNITY_IOS || UNITY_WEBGL        
         [DllImport("__Internal")]
         static extern void UIWidgetsMessageSetObjectName(string objectName);
 #elif UNITY_ANDROID

Runtime/engine/UIWidgetsPanel.cs

             size.y = Mathf.Round(size.y);
             return size;
         }
+
+        public Offset windowPosToScreenPos(Offset windowPos) {
+            Camera camera = null;
+            var canvas = this._uiWidgetsPanel.canvas;
+            if (canvas.renderMode != RenderMode.ScreenSpaceCamera) {
+                camera = canvas.GetComponent<GraphicRaycaster>().eventCamera;
+            }
+            var pos = new Vector2(windowPos.dx, windowPos.dy);
+            pos = pos * this.queryDevicePixelRatio() / this._uiWidgetsPanel.canvas.scaleFactor;
+            var rectTransform = this._uiWidgetsPanel.rectTransform;
+            var rect = rectTransform.rect;
+            pos.x += rect.min.x;
+            pos.y = rect.max.y - pos.y;
+            var worldPos = rectTransform.TransformPoint(new Vector2(pos.x, pos.y));
+            var screenPos = RectTransformUtility.WorldToScreenPoint(camera, worldPos);
+            return new Offset(screenPos.x, Screen.height - screenPos.y);
+        }
     }
 
     [RequireComponent(typeof(RectTransform))]

Runtime/painting/text_painter.cs

         }
 
         Offset _getOffsetFromDownstream(int offset, Rect caretPrototype) {
-            var nextCodeUnit = this._text.codeUnitAt(offset);
+            var nextCodeUnit = this._text.codeUnitAt(offset - 1);
             if (nextCodeUnit == null) {
                 return null;
             }

Runtime/rendering/editable.cs

-using System;
-using System.Collections.Generic;
+using System.Collections.Generic;
 using Unity.UIWidgets.foundation;
 using Unity.UIWidgets.gestures;
 using Unity.UIWidgets.painting;
 
         public void handleTapDown(TapDownDetails details) {
             this._lastTapDownPosition = details.globalPosition - this._paintOffset;
+            if (!Application.isMobilePlatform) {
+                this._selectForTap(this._lastTapDownPosition);
+            }
-            if (this.onSelectionChanged != null) {
-                var position = this._textPainter.getPositionForOffset(this.globalToLocal(this._lastTapDownPosition));
-                this.onSelectionChanged(TextSelection.fromPosition(position), this, SelectionChangedCause.tap);
+            if (Application.isMobilePlatform) {
+                this._selectForTap(this._lastTapDownPosition);
             }
         }
 
                 }
             }
 
-            if (this._hasFocus) {
-                var caretOffset = this._textPainter.getOffsetForCaret(this._selection.extendPos,
-                    Rect.fromLTWH(0, 0, 1, this.preferredLineHeight));
-                var caretRec = this._caretPrototype.shift(caretOffset + effectiveOffset);
-                Input.compositionCursorPos = new Vector2(caretRec.left, caretRec.bottom);
-            }
-
             this._textPainter.paint(context.canvas, effectiveOffset);
         }
 
             return new TextSelection(baseOffset: word.start, extentOffset: word.end);
         }
 
+        void _selectForTap(Offset pointerPosition) {
+            if (this.onSelectionChanged != null) {
+                var position = this._textPainter.getPositionForOffset(this.globalToLocal(pointerPosition));
+                this.onSelectionChanged(TextSelection.fromPosition(position), this, SelectionChangedCause.tap);
+            }
+        }
+        
         bool _isMultiline {
             get { return this._maxLines != 1; }
         }

Runtime/service/keyboard.cs

         void hide();
         void setEditingState(TextEditingValue value);
 
+        void setIMEPos(Offset imeGlobalPos);
+
-        bool hashPreview();
+        bool imeRequired();
     }
 
     public interface TextInputUpdateListener {
             this._value = value;
         }
 
+        public void setIMEPos(Offset imeGlobalPos) {
+            var uiWidgetWindowAdapter = Window.instance as UIWidgetWindowAdapter;
+            if (uiWidgetWindowAdapter != null) {
+                var screenPos = uiWidgetWindowAdapter.windowPosToScreenPos(imeGlobalPos);
+                Input.compositionCursorPos = new Vector2(screenPos.dx, screenPos.dy);
+            }
+            else { // editor window case
+                Input.compositionCursorPos = new Vector2(imeGlobalPos.dx, imeGlobalPos.dy);
+            }
+        }
+
         public void setClient(int client, TextInputConfiguration configuration) {
             this._client = client;
         }
         }
 
-        public bool hashPreview() {
-            return false;
+        public bool imeRequired() {
+            return true;
         }
 
         public void OnGUI() {
             this._client = 0;
         }
 
-        public bool hashPreview() {
-            return this._keyboard != null;
+        public bool imeRequired() {
+            return false;
+        }
+
+        public void setIMEPos(Offset imeGlobalPos) {
         }
 
         public void setClient(int client, TextInputConfiguration configuration) {
         }
     }
 
-#if UNITY_IOS || UNITY_ANDROID
-    class UIWidgetsTouchScreenKeyboardDelegate : KeyboardDelegate {
-
-        public UIWidgetsTouchScreenKeyboardDelegate() {
-            UIWidgetsMessageManager.instance.AddChannelMessageDelegate("TextInput", this.handleMethodCall);
+    abstract class AbstractUIWidgetsKeyboardDelegate : KeyboardDelegate {
+        protected AbstractUIWidgetsKeyboardDelegate() {
+            UIWidgetsMessageManager.instance.AddChannelMessageDelegate("TextInput", this._handleMethodCall);
-            UIWidgetsMessageManager.instance.RemoveChannelMessageDelegate("TextInput", this.handleMethodCall);
+            UIWidgetsMessageManager.instance.RemoveChannelMessageDelegate("TextInput", this._handleMethodCall);
-        public void show() {
-            UIWidgetsTextInputShow();
-        }
+        public abstract void show();
-        public void hide() {
-            UIWidgetsTextInputHide();
-        }
+        public abstract void hide();
-        public void setEditingState(TextEditingValue value) {
-            UIWidgetsTextInputSetTextInputEditingState(value.toJson().ToString());
-        }
+        public abstract void setEditingState(TextEditingValue value);
+        public abstract void setIMEPos(Offset imeGlobalPos);
+        public abstract void setClient(int client, TextInputConfiguration configuration);
-        public void setClient(int client, TextInputConfiguration configuration) {
-            UIWidgetsTextInputSetClient(client, configuration.toJson().ToString());
-        }
-
-        public void clearClient() {
-            UIWidgetsTextInputClearTextInputClient();
-        }
-
-        public bool hashPreview() {
+        public abstract void clearClient();
+        public virtual bool imeRequired() {
-        void handleMethodCall(string method, List<JSONNode> args) {
+        void _handleMethodCall(string method, List<JSONNode> args) {
             if (TextInput._currentConnection == null) {
                 return;
             }
                         throw new UIWidgetsError($"unknown method ${method}");
                 }
             }
+        } 
+    }
+    
+#if UNITY_WEBGL
+    class UIWidgetsWebGLKeyboardDelegate : AbstractUIWidgetsKeyboardDelegate {
+        
+        public override void show() {
+            Input.imeCompositionMode = IMECompositionMode.On;
+        }
+
+        public override void hide() {
+        }
+
+        public override void setEditingState(TextEditingValue value) {
+            UIWidgetsTextInputSetTextInputEditingState(value.toJson().ToString());
+        }
+
+        public override void setIMEPos(Offset imeGlobalPos) {
+            var window = Window.instance as UIWidgetWindowAdapter;
+            var canvasPos = window.windowPosToScreenPos(imeGlobalPos);
+            UIWidgetsTextInputSetIMEPos(canvasPos.dx, canvasPos.dy);
+        }
+
+        public override void setClient(int client, TextInputConfiguration configuration) {
+            WebGLInput.captureAllKeyboardInput = false;
+            Input.imeCompositionMode = IMECompositionMode.On;
+            UIWidgetsTextInputSetClient(client, configuration.toJson().ToString());
+        }
+
+        public override void clearClient() {
+            UIWidgetsTextInputClearTextInputClient();
+        }
+
+        public override bool imeRequired() {
+            return true;
+        }
+
+        [DllImport ("__Internal")]
+        internal static extern void UIWidgetsTextInputSetClient(int client, string configuration);
+        
+        [DllImport ("__Internal")]
+        internal static extern void UIWidgetsTextInputSetTextInputEditingState(string jsonText);
+        
+        [DllImport ("__Internal")]
+        internal static extern void UIWidgetsTextInputClearTextInputClient();
+        
+        [DllImport ("__Internal")]
+        internal static extern void UIWidgetsTextInputSetIMEPos(float x, float y);
+
+
+    }
+#endif
+    
+#if UNITY_IOS || UNITY_ANDROID
+    class UIWidgetsTouchScreenKeyboardDelegate : AbstractUIWidgetsKeyboardDelegate {
+
+        public override void show() {
+            UIWidgetsTextInputShow();
+        }
+
+        public override void hide() {
+            UIWidgetsTextInputHide();
+        }
+
+        public override void setEditingState(TextEditingValue value) {
+            UIWidgetsTextInputSetTextInputEditingState(value.toJson().ToString());
+        }
+
+        public override void setIMEPos(Offset imeGlobalPos) {
+        }
+
+        public override void setClient(int client, TextInputConfiguration configuration) {
+            UIWidgetsTextInputSetClient(client, configuration.toJson().ToString());
+        }
+
+        public override void clearClient() {
+            UIWidgetsTextInputClearTextInputClient();
         }
         
 #if UNITY_IOS
         internal static extern void UIWidgetsTextInputSetClient(int client, string configuration);
         
         [DllImport ("__Internal")]
-        internal static extern void UIWidgetsTextInputSetTextInputEditingState(string jsonText); // also send to client ?
+        internal static extern void UIWidgetsTextInputSetTextInputEditingState(string jsonText);
         
         [DllImport ("__Internal")]
         internal static extern void UIWidgetsTextInputClearTextInputClient();

Runtime/service/text_input.cs

             TextInput.keyboardDelegate.setEditingState(value);
         }
 
-        public void setCompositionCursorPos(float x, float y) {
+        public void setIMEPos(Offset imeGlobalPos) {
-            TextInput.setCompositionCursorPos(x, y);
+            D.assert(imeGlobalPos != null);
+            D.assert(this.imeRequired());
+            TextInput.keyboardDelegate.setIMEPos(imeGlobalPos);
+        }
+        
+        public bool imeRequired() {
+            return TextInput.keyboardDelegate != null && TextInput.keyboardDelegate.imeRequired();
+
 
         public void close() {
             if (this.attached) {
             D.assert(client != null);
             var connection = new TextInputConnection(client);
             _currentConnection = connection;
-            string x = configuration.toJson();
-            if (TouchScreenKeyboard.isSupported) {
+            if (Application.isEditor) {
+                keyboardDelegate = new DefaultKeyboardDelegate();
+            } else {
 #if UNITY_IOS || UNITY_ANDROID
                 if (configuration.unityTouchKeyboard) {
                     keyboardDelegate = new UnityTouchScreenKeyboardDelegate();
                 }
+#elif UNITY_WEBGL
+                keyboardDelegate = new UIWidgetsWebGLKeyboardDelegate();
-                keyboardDelegate = new UnityTouchScreenKeyboardDelegate();
+                keyboardDelegate = new DefaultKeyboardDelegate();
-            else {
-                keyboardDelegate = new DefaultKeyboardDelegate();
-            }
             keyboardDelegate.setClient(connection._id, configuration);
             return connection;
         }
             if (_currentConnection != null && _currentConnection._window == Window.instance) {
                 (keyboardDelegate as TextInputOnGUIListener)?.OnGUI();
             }
-        }
-        
-        public static void setCompositionCursorPos(float x, float y) {
-            Input.compositionCursorPos = new Vector2(x, y);
         }
         
         internal static void _updateEditingState(int client, TextEditingValue value) {

Runtime/widgets/editable_text.cs

                 oldWidget.controller.removeListener(this._didChangeTextEditingValue);
                 this.widget.controller.addListener(this._didChangeTextEditingValue);
                 this._updateRemoteEditingValueIfNeeded();
+                this._updateImePosIfNeed();
             }
 
             if (this.widget.focusNode != oldWidget.focusNode) {
                                  
                 ));
                 this._textInputConnection.setEditingState(localValue);
+                this._updateImePosIfNeed();
             }
 
             this._textInputConnection.show();
 
             this._hideSelectionOverlayIfNeeded();
 
-            if (this.widget.selectionControls != null && !this._unityKeyboard()) {
+            if (this.widget.selectionControls != null && Application.isMobilePlatform && !this._unityKeyboard()) {
                 this._selectionOverlay = new TextSelectionOverlay(
                     context: this.context,
                     value: this._value,
 
                 this._value = value;
                 this._updateRemoteEditingValueIfNeeded();
+                this._updateImePosIfNeed();
             }
             else {
                 this._value = value;
 
         void _didChangeTextEditingValue() {
             this._updateRemoteEditingValueIfNeeded();
+            this._updateImePosIfNeed();
             this._startOrStopCursorTimerIfNeeded();
             this._updateOrDisposeSelectionOverlayIfNeeded();
             this._textChangedSinceLastCaretUpdate = true;
         // in the case
         bool _unityKeyboard() {
             return TouchScreenKeyboard.isSupported && this.widget.unityTouchKeyboard;
+        }
+
+        Offset _getImePos() {
+            if (this._hasInputConnection && this._textInputConnection.imeRequired()) {
+                var localPos = this.renderEditable.getLocalRectForCaret(this._value.selection.basePos).bottomLeft;
+                return this.renderEditable.localToGlobal(localPos);
+            }
+
+            return null;
+        }
+
+        bool _imePosUpdateScheduled = false;
+        void _updateImePosIfNeed() {
+            if (!this._hasInputConnection || !this._textInputConnection.imeRequired()) {
+                return;
+            }
+
+            if (this._imePosUpdateScheduled) {
+                return;
+            }
+            
+            this._imePosUpdateScheduled = true;
+            SchedulerBinding.instance.addPostFrameCallback(_ => {
+                this._imePosUpdateScheduled = false;
+                if (!this._hasInputConnection) {
+                    return;
+                }
+                this._textInputConnection.setIMEPos(this._getImePos());
+            });
         }
     }
 

Runtime/Plugins/platform/webgl.meta

+fileFormatVersion: 2
+guid: 2a5204f908bc54d789ea5933245a3bf5
+folderAsset: yes
+DefaultImporter:
+  externalObjects: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/Plugins/platform/webgl/UIWidgetsCanvasInput.jslib

+mergeInto(LibraryManager.library, {
+
+    $UIWidgetsCanvasInputModule__postset: 'UIWidgetsCanvasInputModule.init();',
+    $UIWidgetsCanvasInputModule: { init: function() {
+        
+    // create a buffer that stores all inputs so that tabbing
+    // between them is made possible.
+    var inputs = [];
+
+    // initialize the Canvas Input
+    var UIWidgetsCanvasInput = window.UIWidgetsCanvasInput = function(o) {
+        var self = this;
+
+        o = o ? o : {};
+
+        // setup the defaults
+        self._canvas = o.canvas || null;
+        self._x = o.x || 0;
+        self._y = o.y || 0;
+        self._type = o.type || 'text';
+        self._onchange = o.onchange || function() {};
+        self._onsubmit = o.onsubmit || function() {};
+        self._onkeydown = o.onkeydown || function() {};
+        self._onkeyup = o.onkeyup || function() {};
+        self._onfocus = o.onfocus || function() {};
+        self._onblur = o.onblur || function() {};
+        self._multiline = o.multiline || false;
+        self._hasFocus = false;
+
+        self._createHiddenInput();
+        self.value(o.value  || '');
+        self._inputsIndex = inputs.length - 1;
+
+    };
+
+    // setup the prototype
+    UIWidgetsCanvasInput.prototype = {
+
+        x: function(data) {
+            var self = this;
+
+            if (typeof data !== 'undefined') {
+                self._x = data;
+                self._updateHiddenInput();
+
+                return;
+            } else {
+                return self._x;
+            }
+        },
+
+        y: function(data) {
+            var self = this;
+
+            if (typeof data !== 'undefined') {
+                self._y = data;
+                self._updateHiddenInput();
+
+                return;
+            } else {
+                return self._y;
+            }
+        },
+
+        multiline: function(data) {
+            var self = this;
+            if (typeof data !== 'undefined') {
+                if (data === self._multiline) {
+                    return;
+                }
+                self._multiline = !!data;
+                self._createHiddenInput();
+                return;
+            } else {
+                return self._multiline;
+            }
+        },
+
+        type: function(data) {
+            var self = this;
+            if (typeof data !== 'undefined') {
+                self._type = data;
+                self._hiddenInput.type = data;
+                return;
+            } else {
+                return self._type;
+            }
+        },
+
+        value: function(data) {
+            var self = this;
+            if (typeof data !== 'undefined') {
+                self._hiddenInput.value = data;
+                return;
+            } else {
+                return self._hiddenInput.value;
+            }
+        },
+
+        selection: function() {
+            var self = this;
+            return [self._hiddenInput.selectionStart, self._hiddenInput.selectionEnd];
+        },
+
+        onsubmit: function(fn) {
+            var self = this;
+
+            if (typeof fn !== 'undefined') {
+                self._onsubmit = fn;
+
+                return self;
+            } else {
+                self._onsubmit();
+            }
+        },
+
+        onkeydown: function(fn) {
+            var self = this;
+
+            if (typeof fn !== 'undefined') {
+                self._onkeydown = fn;
+
+                return self;
+            } else {
+                self._onkeydown();
+            }
+        },
+
+        onkeyup: function(fn) {
+            var self = this;
+
+            if (typeof fn !== 'undefined') {
+                self._onkeyup = fn;
+
+                return self;
+            } else {
+                self._onkeyup();
+            }
+        },
+
+        focus: function() {
+            var self = this;
+
+            // only fire the focus event when going from unfocussed
+            if (!self._hasFocus) {
+                self._onfocus(self);
+
+                // remove focus from all other inputs
+                for (var i=0; i<inputs.length; i++) {
+                    if (inputs[i]._hasFocus) {
+                        inputs[i].blur();
+                    }
+                }
+            }
+
+            self._hasFocus = true;
+            self._hiddenInput.focus();
+            return;
+        },
+
+        blur: function(_this) {
+            var self = _this || this;
+
+            self._onblur(self);
+
+            self._hasFocus = false;
+            self._hiddenInput.blur();
+        },
+
+        keydown: function(e, self) {
+            var keyCode = e.which,
+                isShift = e.shiftKey,
+                key = null,
+                startText, endText;
+
+            // make sure the correct text field is being updated
+            if (!self._hasFocus) {
+                return;
+            }
+
+            // fire custom user event
+            self._onkeydown(e, self);
+
+            // add support for Ctrl/Cmd+A selection
+            if (keyCode === 65 && (e.ctrlKey || e.metaKey)) {
+                self.selectText();
+                e.preventDefault();
+                return;
+            }
+
+            // block keys that shouldn't be processed
+            if (keyCode === 17 || e.metaKey || e.ctrlKey) {
+                return;
+            }
+
+            if (keyCode === 13 && !self._multiline) { // enter key
+                e.preventDefault();
+                self._onsubmit(e, self);
+            } else {
+                self._onchange();
+            }
+            return;
+        },
+
+        selectText: function(range) {
+            var self = this,
+                range = range || [0, self.value().length];
+
+            // select the range of text specified (or all if none specified)
+            setTimeout(function() {
+                self._hiddenInput.selectionStart = range[0];
+                self._hiddenInput.selectionEnd = range[1];
+                self._onchange();
+            }, 1);
+
+            return self;
+        },
+
+        destroy: function() {
+            var self = this;
+
+            // pull from the inputs array
+            var index = inputs.indexOf(self);
+            if (index !== -1) {
+                inputs.splice(index, 1);
+            }
+
+            // remove focus
+            if (self._hasFocus) {
+                self.blur();
+            }
+
+            // remove the hidden input box
+            self._hiddenInput.parentNode.removeChild(self._hiddenInput);
+
+            self._renderCtx = null;
+        },
+
+        _updateHiddenInput: function() {
+            var self = this;
+            self._hiddenInput.style.left = (self._x + (self._canvas ? self._canvas.offsetLeft : 0)) + 'px';
+            self._hiddenInput.style.top = (self._y + (self._canvas ? self._canvas.offsetTop : 0)) + 'px';
+        },
+
+        _createHiddenInput: function () {
+            var self = this;
+            if (self._hiddenInput) {
+                self._hiddenInput.parentNode.removeChild(self._hiddenInput);
+                self._hiddenInput = null;
+            }
+            self._hiddenInput = document.createElement(self._multiline ? 'textarea' : 'input');
+            self._hiddenInput.type = self._type;
+            self._hiddenInput.style.position = 'absolute';
+            self._hiddenInput.style.opacity = 0;
+            self._hiddenInput.style.pointerEvents = 'none';
+            self._hiddenInput.style.zIndex = 0;
+            // hide native blue text cursor on iOS
+            self._hiddenInput.style.transform = 'scale(0)';
+
+            self._updateHiddenInput();
+            self._canvas.parentNode.appendChild(self._hiddenInput);
+
+            // setup the keydown listener
+            self._hiddenInput.addEventListener('keydown', function(e) {
+                e = e || window.event;
+
+                if (self._hasFocus) {
+                    // hack to fix touch event bug in iOS Safari
+                    window.focus();
+                    self._hiddenInput.focus();
+
+                    // continue with the keydown event
+                    self.keydown(e, self);
+                }
+            });
+
+            // setup the keyup listener
+            self._hiddenInput.addEventListener('keyup', function(e) {
+                e = e || window.event;
+                self._onchange();
+
+                if (self._hasFocus) {
+                    self._onkeyup(e, self);
+                }
+            });
+        }
+    };
+    
+}}});

Runtime/Plugins/platform/webgl/UIWidgetsCanvasInput.jslib.meta

+fileFormatVersion: 2
+guid: ac437980a48c8464abea9c9c31a16e10
+PluginImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  iconMap: {}
+  executionOrder: {}
+  defineConstraints: []
+  isPreloaded: 0
+  isOverridable: 1
+  isExplicitlyReferenced: 0
+  platformData:
+  - first:
+      Any: 
+    second:
+      enabled: 0
+      settings: {}
+  - first:
+      Editor: Editor
+    second:
+      enabled: 0
+      settings:
+        DefaultValueInitialized: true
+  - first:
+      Facebook: WebGL
+    second:
+      enabled: 1
+      settings: {}
+  - first:
+      WebGL: WebGL
+    second:
+      enabled: 1
+      settings: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/Plugins/platform/webgl/UIWidgetsInputPlugin.jslib

+mergeInto(LibraryManager.library, {
+
+    $UIWidgetsInputPluginModule__postset: 'UIWidgetsInputPluginModule.init();',
+    $UIWidgetsInputPluginModule: { init: function() {
+
+    var UIWidgetsTextInputPlugin = window.UIWidgetsTextInputPlugin = function(o) {
+        this._canvas = o.canvas;
+        this._messageManager = o.messageManager;
+    };
+
+    // setup the prototype
+    UIWidgetsTextInputPlugin.prototype = {
+
+        setClient: function (client, configuration) {
+            var self = this;
+            if (!self._canvasInput) {
+                self._canvasInput = new UIWidgetsCanvasInput({
+                    canvas: self._canvas,
+                    onchange: self._onchange.bind(self),
+                    onsubmit: self._onsubmit.bind(self),
+                });
+                self._canvas.addEventListener('mouseup', function(e) {
+                    if (self._client) {
+                        self._canvasInput.focus();
+
+                    }
+                }, false);
+            }
+
+            var configObj = JSON.parse(configuration);
+            var multiline = configObj.inputType.name === 'TextInputType.multiline';
+            self._canvasInput.type(configObj.obscureText ? 'password' : 'text');
+            self._canvasInput.multiline(multiline);
+
+            self._canvasInput.focus();
+            self._client = client;
+        },
+
+        setTextInputEditingState: function (jsonText) {
+            var self = this;
+            var state = JSON.parse(jsonText);
+            self._canvasInput.value(state.text);
+            self._canvasInput.selectText([state.selectionBase, state.selectionExtent]);
+        },
+
+        setTextInputIMEPos: function(x, y) {
+            var self = this;
+            self._canvasInput.x(x);
+            self._canvasInput.y(y);
+        },
+
+        clearTextInputClient: function () {
+            var self = this;
+            self._canvasInput.blur();
+            self._client = null;
+        },
+
+        _onsubmit: function() {
+            var self = this;
+            if (!self._client) {
+                return;
+            }
+            self._messageManager.sendMethodInvokeMessage('TextInput', 'TextInputClient.performAction',
+                [self._client, 'TextInputAction.done']);
+        },
+
+        _onchange: function() {
+            var self = this;
+            if (!self._client) {
+                return;
+            }
+
+            var value = self._canvasInput.value();
+            var selection = self._canvasInput.selection();
+
+            var state = {
+                selectionBase: selection[0],
+                selectionExtent: selection[1],
+                selectionIsDirectional: false,
+                text: value
+            };
+
+            self._messageManager.sendMethodInvokeMessage('TextInput', 'TextInputClient.updateEditingState',
+                [self._client, state]);
+        }
+    };
+
+
+    var UIWidgetsMessageManager = window.UIWidgetsMessageManager = function(sendMessage) {
+        var self = this;
+        self._sendMesssage = sendMessage;
+
+    };
+
+    UIWidgetsMessageManager.prototype = {
+
+        setObjectName: function (name) {
+            var self = this;
+            self._gameObjectName = name;
+        },
+
+        sendMethodInvokeMessage: function(channel, method, args) {
+            var self = this;
+            var body = {
+                channel: channel,
+                method: method,
+                args: args
+            };
+            self._sendMesssage(self._gameObjectName, 'OnUIWidgetsMethodMessage', JSON.stringify(body));
+        }
+    };
+    
+ }}});

Runtime/Plugins/platform/webgl/UIWidgetsInputPlugin.jslib.meta

+fileFormatVersion: 2
+guid: 77df7fa0e2fd844359da12725acf5825
+PluginImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  iconMap: {}
+  executionOrder: {}
+  defineConstraints: []
+  isPreloaded: 0
+  isOverridable: 1
+  isExplicitlyReferenced: 0
+  platformData:
+  - first:
+      Any: 
+    second:
+      enabled: 0
+      settings: {}
+  - first:
+      Editor: Editor
+    second:
+      enabled: 0
+      settings:
+        DefaultValueInitialized: true
+  - first:
+      Facebook: WebGL
+    second:
+      enabled: 1
+      settings: {}
+  - first:
+      WebGL: WebGL
+    second:
+      enabled: 1
+      settings: {}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/Plugins/platform/webgl/webgl.jslib

+var UIWidgetsLibrary = {
+
+
+    //$method_support__postset: 'method_support.init1();method_support.init2();',
+    //$method_support: {
+        
+    //},
+    $UIWidgetsPlugin: {
+        textInput: null,
+        messageManager: null,
+
+        getTextInput: function() {
+            if (UIWidgetsPlugin.textInput) {
+                return UIWidgetsPlugin.textInput;
+            }
+
+            UIWidgetsPlugin.textInput = new UIWidgetsTextInputPlugin({
+                messageManager: UIWidgetsPlugin.getMessageManager(),
+                canvas: Module.canvas
+            });
+            return UIWidgetsPlugin.textInput;
+        },
+
+        getMessageManager: function() {
+            if (UIWidgetsPlugin.messageManager) {
+                return UIWidgetsPlugin.messageManager;
+            }
+
+            UIWidgetsPlugin.messageManager = new UIWidgetsMessageManager(SendMessage);
+            return UIWidgetsPlugin.messageManager;
+        },
+
+        messageObjectName: ""
+    },
+
+    UIWidgetsWebGLDevicePixelRatio: function () {
+        return window.devicePixelRatio || 1;
+    },
+
+
+    UIWidgetsTextInputSetClient: function (client, configuration) {
+        UIWidgetsPlugin.getTextInput().setClient(client, Pointer_stringify(configuration));
+    },
+
+    UIWidgetsTextInputSetTextInputEditingState: function (jsonText) {
+        UIWidgetsPlugin.getTextInput().setTextInputEditingState(Pointer_stringify(jsonText));
+    },
+
+    UIWidgetsTextInputSetIMEPos: function(x, y) {
+        UIWidgetsPlugin.getTextInput().setTextInputIMEPos(x, y);
+    },
+
+    UIWidgetsTextInputClearTextInputClient: function () {
+        UIWidgetsPlugin.getTextInput().clearTextInputClient();
+    },
+
+    UIWidgetsMessageSetObjectName: function (name) {
+        UIWidgetsPlugin.getMessageManager().setObjectName(Pointer_stringify(name));
+    }
+};
+
+autoAddDeps(UIWidgetsLibrary, '$UIWidgetsPlugin');
+autoAddDeps(UIWidgetsLibrary, '$UIWidgetsCanvasInputModule');
+autoAddDeps(UIWidgetsLibrary, '$UIWidgetsInputPluginModule');
+mergeInto(LibraryManager.library, UIWidgetsLibrary);

Runtime/Plugins/webgl.jslib

-mergeInto(LibraryManager.library, {
-
-    UIWidgetsWebGLDevicePixelRatio: function () {
-        return window.devicePixelRatio || 1;
-    },
-
-});