Merge pull request #1658 from ajaxorg/bugfix/textinput

Bugfix/textinput

demo/kitchen-sink/demo.js

@@ -33,6 +33,10 @@ define(function(require, exports, module) {
 "use strict";
 
 require("ace/lib/fixoldbrowsers");
+
+require("ace/multi_select")
+require("ace/ext/spellcheck");
+
 var config = require("ace/config");
 config.init();
 var env = {};
@@ -51,7 +55,6 @@ var HashHandler = require("ace/keyboard/hash_handler").HashHandler;
 
 var Renderer = require("ace/virtual_renderer").VirtualRenderer;
 var Editor = require("ace/editor").Editor;
-var MultiSelect = require("ace/multi_select").MultiSelect;
 
 var whitespace = require("ace/ext/whitespace");
 
@@ -89,8 +92,6 @@ split.on("focus", function(editor) {
 env.split = split;
 window.env = env;
 
-// add multiple cursor support to editor
-require("ace/multi_select").MultiSelect(env.editor);
 
 var consoleEl = dom.createElement("div");
 container.parentNode.appendChild(consoleEl);
@@ -531,6 +532,7 @@ bindCheckbox("highlight_token", function(checked) {
     }
 });
 
+
 /************** dragover ***************************/
 event.addListener(container, "dragover", function(e) {
     var types = e.dataTransfer.types;
@@ -562,6 +564,12 @@ event.addListener(container, "drop", function(e) {
 
 
 
+
+
+
+
+
+
 var StatusBar = require("ace/ext/statusbar").StatusBar;
 new StatusBar(env.editor, cmdLine.container);
 
@@ -613,7 +621,22 @@ env.editor.setOptions({
     enableBasicAutocompletion: true,
     enableSnippets: true
 })
-
+/* for textinput debuggging
+dom.importCssString("\
+  .ace_text-input {\
+    position: absolute;\
+    z-index: 10!important;\
+    width: 6em!important;\
+    height: 1em;\
+    opacity: 1!important;\
+    background: rgba(0, 92, 255, 0.11);\
+    border: none;\
+    font: inherit;\
+    padding: 0 1px;\
+    margin: 0 -1px;\
+    text-indent: 0em;\
+}\
+")*/
 });
 
 // allow easy access to ace in console, but not in ace code which uses strict

lib/ace/css/editor.css

@@ -143,6 +143,7 @@
     font: inherit;
     padding: 0 1px;
     margin: 0 -1px;
+    text-indent: -1em;
 }
 
 .ace_text-input.ace_composition {
@@ -150,6 +151,7 @@
     color: #111;
     z-index: 1000;
     opacity: 1;
+    text-indent: 0;
 }
 
 .ace_layer {

lib/ace/editor.js

@@ -2367,7 +2367,10 @@ config.defineOptions(Editor.prototype, "editor", {
         initialValue: true
     },
     readOnly: {
-        set: function(readOnly) { this.$resetCursorStyle(); },
+        set: function(readOnly) {
+            this.textInput.setReadOnly(readOnly); 
+            this.$resetCursorStyle(); 
+        },
         initialValue: false
     },
     cursorStyle: {

lib/ace/ext/spellcheck.js

@@ -17,8 +17,9 @@ exports.contextMenuHandler = function(e){
     var PLACEHOLDER = "\x01\x01";
     var value = w + " " + PLACEHOLDER;
     text.value = value;
-    text.setSelectionRange(w.length + 1, w.length + 1);
+    text.setSelectionRange(w.length, w.length + 1);
     text.setSelectionRange(0, 0);
+    text.setSelectionRange(0, w.length);
 
     var afterKeydown = false;
     event.addListener(text, "keydown", function onKeydown() {

lib/ace/keyboard/textinput.js

@@ -40,9 +40,7 @@ var BROKEN_SETDATA = useragent.isChrome < 18;
 var TextInput = function(parentNode, host) {
     var text = dom.createElement("textarea");
     text.className = "ace_text-input";
-    /*/ debug
-    text.style.cssText = "opacity:1;background:rgba(0, 250, 0, 0.3);outline:rgba(0, 250, 0, 0.8) solid 1px;outline-offset:3px;width:5em;z-pindex:500";
-    /**/
+
     if (useragent.isTouchPad)
         text.setAttribute("x-palm-disable-auto-cap", true);
 
@@ -394,6 +392,7 @@ var TextInput = function(parentNode, host) {
         var c = inComposition;
         inComposition = false;
         var timer = setTimeout(function() {
+            timer = null;
             var str = text.value.replace(/\x01/g, "");
             // console.log(str, c.lastValue)
             if (inComposition)
@@ -407,14 +406,15 @@ var TextInput = function(parentNode, host) {
         });
         inputHandler = function compositionInputHandler(str) {
             // console.log("onCompositionEnd", str, c.lastValue)
-            clearTimeout(timer);
+            if (timer)
+                clearTimeout(timer);
             str = str.replace(/\x01/g, "");
             if (str == c.lastValue)
                 return "";
-            if (c.lastValue)
+            if (c.lastValue && timer)
                 host.undo();
             return str;
-        }        
+        };
         host.onCompositionEnd();
         host.removeListener("mousedown", onCompositionEnd);
         if (e.type == "compositionend" && c.range) {
@@ -449,7 +449,6 @@ var TextInput = function(parentNode, host) {
             tempStyle = text.style.cssText;
 
         text.style.cssText = "z-index:100000;" + (useragent.isIE ? "opacity:0.1;" : "");
-        //debug*/ text.style.cssText += "background:rgba(250, 0, 0, 0.3); opacity:1;";
 
         resetSelection(host.selection.isEmpty());
         host._emit("nativecontextmenu", {target: host, domEvent: e});

lib/ace/scrollbar.js

@@ -73,6 +73,7 @@ var ScrollBarV = function(parent, renderer) {
     this.element.style.overflowY = "scroll";
     
     event.addListener(this.element, "scroll", this.onScrollV.bind(this));
+    event.addListener(this.element, "mousedown", event.preventDefault);
 };
 
 var ScrollBarH = function(parent, renderer) {
@@ -98,6 +99,7 @@ var ScrollBarH = function(parent, renderer) {
     this.element.style.overflowX = "scroll";
 
     event.addListener(this.element, "scroll", this.onScrollH.bind(this));
+    event.addListener(this.element, "mousedown", event.preventDefault);
 };
 
 (function() {

lib/ace/virtual_renderer.js

@@ -70,7 +70,7 @@ var VirtualRenderer = function(container, theme) {
     // dom.importCssString(editorCss, "ace_editor", container.ownerDocument);
 
     // in IE <= 9 the native cursor always shines through
-    this.$keepTextAreaAtCursor = !useragent.isIE;
+    this.$keepTextAreaAtCursor = true;
 
     dom.addCssClass(this.container, "ace_editor");