[closes gh-130] Virtual keyboard should no longer appear when output has focus. Fixed infotip touch handling.

source/WebApp/js/ui/codemirror/addon-infotip.js

@@ -41,36 +41,44 @@
     };
   })();
 
-  var activeTimeout;
   function mousemove(e) {
     /* eslint-disable no-invalid-this */
-    if (activeTimeout) {
+    delayedInteraction(this.CodeMirror, e.pageX, e.pageY);
-      clearTimeout(activeTimeout);
-    }
-
-    var wrapper = this;
-    activeTimeout = setTimeout(function() {
-      processMoveOrClick.call(wrapper, e);
-      activeTimeout = null;
-    }, 100);
   }
 
   function mouseout(e) {
+    /* eslint-disable no-invalid-this */
     var cm = this.CodeMirror;
     if (e.target !== cm.getWrapperElement())
       return;
     tooltip.hide();
   }
 
-  function click(e) {
+  function touchstart(e) {
-    processMoveOrClick.call(this, e);
+    /* eslint-disable no-invalid-this */
+    delayedInteraction(this.CodeMirror, e.touches[0].pageX, e.touches[0].pageY);
   }
 
-  function processMoveOrClick(e) {
+  function click(e) {
     /* eslint-disable no-invalid-this */
-    var cm = this.CodeMirror;
+    interaction(this.CodeMirror, e.pageX, e.pageY);
+  }
 
-    var coords = cm.coordsChar({ left: e.x, top: e.y });
+  var activeTimeout;
+  function delayedInteraction(cm, x, y) {
+    /* eslint-disable no-invalid-this */
+    if (activeTimeout) {
+      clearTimeout(activeTimeout);
+    }
+
+    activeTimeout = setTimeout(function() {
+      interaction(cm, x, y);
+      activeTimeout = null;
+    }, 100);
+  }
+
+  function interaction(cm, x, y) {
+    var coords = cm.coordsChar({ left: x, top: y });
     var getTipContent = cm.state.infotip.getTipContent || cm.getHelper(coords, "infotip");
     if (!getTipContent) {
       tooltip.hide();
@@ -78,6 +86,10 @@
     }
 
     var token = cm.getTokenAt(coords);
+    if (token === tooltip.token)
+        return;
+
+    tooltip.token = token;
     var content = getTipContent(cm, token);
     if (content == null) {
       tooltip.hide();
@@ -94,9 +106,10 @@
     var wrapper = cm.getWrapperElement();
     var state = cm.state.infotip;
     if (old && old !== CodeMirror.Init && state) {
-      CodeMirror.off(wrapper, "click",     click);
+      CodeMirror.off(wrapper, "click",      click);
-      CodeMirror.off(wrapper, "mousemove", mousemove);
+      CodeMirror.off(wrapper, "touchstart", touchstart);
-      CodeMirror.off(wrapper, "mouseout",  mouseout);
+      CodeMirror.off(wrapper, "mousemove",  mousemove);
+      CodeMirror.off(wrapper, "mouseout",   mouseout);
       delete cm.state.infotip;
     }
 
@@ -107,8 +120,9 @@
       getTipContent: options.getTipContent
     };
     cm.state.infotip = state;
-    CodeMirror.on(wrapper, "click",     click);
+    CodeMirror.on(wrapper, "click",      click);
-    CodeMirror.on(wrapper, "mousemove", mousemove);
+    CodeMirror.on(wrapper, "touchstart", touchstart);
-    CodeMirror.on(wrapper, "mouseout",  mouseout);
+    CodeMirror.on(wrapper, "mousemove",  mousemove);
+    CodeMirror.on(wrapper, "mouseout",   mouseout);
   });
 });

source/WebApp/js/ui/components/app-mirrorsharp-readonly.js

@@ -36,6 +36,10 @@ Vue.component('app-mirrorsharp-readonly', {
             const wrapper = cm.getWrapperElement();
             wrapper.classList.add('mirrorsharp-theme');
 
+            const codeElement = wrapper.getElementsByClassName('CodeMirror-code')[0];
+            if (codeElement && codeElement.contentEditable) // HACK, mobile only
+                codeElement.contentEditable = false;
+
             this.$watch('language', value => {
                 cm.setOption('mode', modeMap[value]);
             });