Merge pull request #2086 from ajaxorg/textinput

IME issues

lib/ace/css/editor.css

@@ -155,8 +155,8 @@
 }
 
 .ace_text-input.ace_composition {
-    background: #f8f8f8;
+    background: inherit;
-    color: #111;
+    color: inherit;
     z-index: 1000;
     opacity: 1;
     text-indent: 0;

lib/ace/keyboard/textinput.js

@@ -255,7 +255,7 @@ var TextInput = function(parentNode, host) {
         } else {
             return clipboardData.getData(mime);
         }
-    }
+    };
 
     var doCopy = function(e, isCut) {
         var data = host.getCopyText();
@@ -280,11 +280,11 @@ var TextInput = function(parentNode, host) {
     
     var onCut = function(e) {
         doCopy(e, true);
-    }
+    };
     
     var onCopy = function(e) {
         doCopy(e, false);
-    }
+    };
     
     var onPaste = function(e) {
         var data = handleClipboardData(e);
@@ -335,7 +335,8 @@ var TextInput = function(parentNode, host) {
 
     // COMPOSITION
     var onCompositionStart = function(e) {
-        if (inComposition || !host.onCompositionStart) return;
+        if (inComposition || !host.onCompositionStart || host.$readOnly) 
+            return;
         // console.log("onCompositionStart", inComposition)
         inComposition = {};
         host.onCompositionStart();
@@ -351,7 +352,8 @@ var TextInput = function(parentNode, host) {
 
     var onCompositionUpdate = function() {
         // console.log("onCompositionUpdate", inComposition && JSON.stringify(text.value))
-        if (!inComposition || !host.onCompositionUpdate) return;
+        if (!inComposition || !host.onCompositionUpdate || host.$readOnly)
+            return;
         var val = text.value.replace(/\x01/g, "");
         if (inComposition.lastValue === val) return;
         
@@ -370,7 +372,7 @@ var TextInput = function(parentNode, host) {
     };
 
     var onCompositionEnd = function(e) {
-        if (!host.onCompositionEnd) return;
+        if (!host.onCompositionEnd || host.$readOnly) return;
         // console.log("onCompositionEnd", inComposition &&inComposition.lastValue)
         var c = inComposition;
         inComposition = false;
@@ -379,7 +381,7 @@ var TextInput = function(parentNode, host) {
             var str = text.value.replace(/\x01/g, "");
             // console.log(str, c.lastValue)
             if (inComposition)
-                return
+                return;
             else if (str == c.lastValue)
                 resetValue();
             else if (!c.lastValue && str) {
@@ -437,13 +439,14 @@ var TextInput = function(parentNode, host) {
         if (!tempStyle)
             tempStyle = text.style.cssText;
         text.style.cssText = (bringToFront ? "z-index:100000;" : "")
+            + "height:" + text.style.height + ";"
             + (useragent.isIE ? "opacity:0.1;" : "");
 
         var rect = host.container.getBoundingClientRect();
         var style = dom.computedStyle(host.container);
         var top = rect.top + (parseInt(style.borderTopWidth) || 0);
         var left = rect.left + (parseInt(rect.borderLeftWidth) || 0);
-        var maxTop = rect.bottom - top - text.clientHeight;
+        var maxTop = rect.bottom - top - text.clientHeight -2;
         var move = function(e) {
             text.style.left = e.clientX - left - 2 + "px";
             text.style.top = Math.min(e.clientY - top - 2, maxTop) + "px";

lib/ace/virtual_renderer.js

@@ -643,18 +643,17 @@ var VirtualRenderer = function(container, theme) {
             var val = this.textarea.value.replace(/^\x01+/, "");
             w *= (this.session.$getStringScreenWidth(val)[0]+2);
             h += 2;
-            posTop -= 1;
         }
         posLeft -= this.scrollLeft;
         if (posLeft > this.$size.scrollerWidth - w)
             posLeft = this.$size.scrollerWidth - w;
 
-        posLeft -= this.scrollBar.width;
+        posLeft += this.gutterWidth;
 
         this.textarea.style.height = h + "px";
         this.textarea.style.width = w + "px";
-        this.textarea.style.right = Math.max(0, this.$size.scrollerWidth - posLeft - w) + "px";
+        this.textarea.style.left = Math.min(posLeft, this.$size.scrollerWidth - w) + "px";
-        this.textarea.style.bottom = Math.max(0, this.$size.height - posTop - h) + "px";
+        this.textarea.style.top = Math.min(posTop, this.$size.height - h) + "px";
     };
 
     /**