third-party/codemirror-3.15/addon/hint/show-hint.js

   1 (function() {
   2   "use strict";
   3
   4   CodeMirror.showHint = function(cm, getHints, options) {
   5     // We want a single cursor position.
   6     if (cm.somethingSelected()) return;
   7     if (getHints == null) getHints = cm.getHelper(cm.getCursor(), "hint");
   8     if (getHints == null) return;
   9
  10     if (cm.state.completionActive) cm.state.completionActive.close();
  11
  12     var completion = cm.state.completionActive = new Completion(cm, getHints, options || {});
  13     CodeMirror.signal(cm, "startCompletion", cm);
  14     if (completion.options.async)
  15       getHints(cm, function(hints) { completion.showHints(hints); }, completion.options);
  16     else
  17       return completion.showHints(getHints(cm, completion.options));
  18   };
  19
  20   function Completion(cm, getHints, options) {
  21     this.cm = cm;
  22     this.getHints = getHints;
  23     this.options = options;
  24     this.widget = this.onClose = null;
  25   }
  26
  27   Completion.prototype = {
  28     close: function() {
  29       if (!this.active()) return;
  30       this.cm.state.completionActive = null;
  31
  32       if (this.widget) this.widget.close();
  33       if (this.onClose) this.onClose();
  34       CodeMirror.signal(this.cm, "endCompletion", this.cm);
  35     },
  36
  37     active: function() {
  38       return this.cm.state.completionActive == this;
  39     },
  40
  41     pick: function(data, i) {
  42       var completion = data.list[i];
  43       if (completion.hint) completion.hint(this.cm, data, completion);
  44       else this.cm.replaceRange(getText(completion), data.from, data.to);
  45       this.close();
  46     },
  47
  48     showHints: function(data) {
  49       if (!data || !data.list.length || !this.active()) return this.close();
  50
  51       if (this.options.completeSingle != false && data.list.length == 1)
  52         this.pick(data, 0);
  53       else
  54         this.showWidget(data);
  55     },
  56
  57     showWidget: function(data) {
  58       this.widget = new Widget(this, data);
  59       CodeMirror.signal(data, "shown");
  60
  61       var debounce = null, completion = this, finished;
  62       var closeOn = this.options.closeCharacters || /[\s()\[\]{};:>,]/;
  63       var startPos = this.cm.getCursor(), startLen = this.cm.getLine(startPos.line).length;
  64
  65       function done() {
  66         if (finished) return;
  67         finished = true;
  68         completion.close();
  69         completion.cm.off("cursorActivity", activity);
  70         CodeMirror.signal(data, "close");
  71       }
  72       function isDone() {
  73         if (finished) return true;
  74         if (!completion.widget) { done(); return true; }
  75       }
  76
  77       function update() {
  78         if (isDone()) return;
  79         CodeMirror.signal(data, "update");
  80         if (completion.options.async)
  81           completion.getHints(completion.cm, finishUpdate, completion.options);
  82         else
  83           finishUpdate(completion.getHints(completion.cm, completion.options));
  84       }
  85       function finishUpdate(data_) {
  86         data = data_;
  87         if (isDone()) return;
  88         if (!data || !data.list.length) return done();
  89         completion.widget.close();
  90         completion.widget = new Widget(completion, data);
  91       }
  92
  93       function activity() {
  94         clearTimeout(debounce);
  95         var pos = completion.cm.getCursor(), line = completion.cm.getLine(pos.line);
  96         if (pos.line != startPos.line || line.length - pos.ch != startLen - startPos.ch ||
  97             pos.ch < startPos.ch || completion.cm.somethingSelected() ||
  98             (pos.ch && closeOn.test(line.charAt(pos.ch - 1))))
  99           completion.close();
 100         else
 101           debounce = setTimeout(update, 170);
 102       }
 103       this.cm.on("cursorActivity", activity);
 104       this.onClose = done;
 105     }
 106   };
 107
 108   function getText(completion) {
 109     if (typeof completion == "string") return completion;
 110     else return completion.text;
 111   }
 112
 113   function buildKeyMap(options, handle) {
 114     var baseMap = {
 115       Up: function() {handle.moveFocus(-1);},
 116       Down: function() {handle.moveFocus(1);},
 117       PageUp: function() {handle.moveFocus(-handle.menuSize());},
 118       PageDown: function() {handle.moveFocus(handle.menuSize());},
 119       Home: function() {handle.setFocus(0);},
 120       End: function() {handle.setFocus(handle.length);},
 121       Enter: handle.pick,
 122       Tab: handle.pick,
 123       Esc: handle.close
 124     };
 125     var ourMap = options.customKeys ? {} : baseMap;
 126     function addBinding(key, val) {
 127       var bound;
 128       if (typeof val != "string")
 129         bound = function(cm) { return val(cm, handle); };
 130       // This mechanism is deprecated
 131       else if (baseMap.hasOwnProperty(val))
 132         bound = baseMap[val];
 133       else
 134         bound = val;
 135       ourMap[key] = bound;
 136     }
 137     if (options.customKeys)
 138       for (var key in options.customKeys) if (options.customKeys.hasOwnProperty(key))
 139         addBinding(key, options.customKeys[key]);
 140     if (options.extraKeys)
 141       for (var key in options.extraKeys) if (options.extraKeys.hasOwnProperty(key))
 142         addBinding(key, options.extraKeys[key]);
 143     return ourMap;
 144   }
 145
 146   function Widget(completion, data) {
 147     this.completion = completion;
 148     this.data = data;
 149     var widget = this, cm = completion.cm, options = completion.options;
 150
 151     var hints = this.hints = document.createElement("ul");
 152     hints.className = "CodeMirror-hints";
 153     this.selectedHint = 0;
 154
 155     var completions = data.list;
 156     for (var i = 0; i < completions.length; ++i) {
 157       var elt = hints.appendChild(document.createElement("li")), cur = completions[i];
 158       var className = "CodeMirror-hint" + (i ? "" : " CodeMirror-hint-active");
 159       if (cur.className != null) className = cur.className + " " + className;
 160       elt.className = className;
 161       if (cur.render) cur.render(elt, data, cur);
 162       else elt.appendChild(document.createTextNode(cur.displayText || getText(cur)));
 163       elt.hintId = i;
 164     }
 165
 166     var pos = cm.cursorCoords(options.alignWithWord !== false ? data.from : null);
 167     var left = pos.left, top = pos.bottom, below = true;
 168     hints.style.left = left + "px";
 169     hints.style.top = top + "px";
 170     // If we're at the edge of the screen, then we want the menu to appear on the left of the cursor.
 171     var winW = window.innerWidth || Math.max(document.body.offsetWidth, document.documentElement.offsetWidth);
 172     var winH = window.innerHeight || Math.max(document.body.offsetHeight, document.documentElement.offsetHeight);
 173     var box = hints.getBoundingClientRect();
 174     var overlapX = box.right - winW, overlapY = box.bottom - winH;
 175     if (overlapX > 0) {
 176       if (box.right - box.left > winW) {
 177         hints.style.width = (winW - 5) + "px";
 178         overlapX -= (box.right - box.left) - winW;
 179       }
 180       hints.style.left = (left = pos.left - overlapX) + "px";
 181     }
 182     if (overlapY > 0) {
 183       var height = box.bottom - box.top;
 184       if (box.top - (pos.bottom - pos.top) - height > 0) {
 185         overlapY = height + (pos.bottom - pos.top);
 186         below = false;
 187       } else if (height > winH) {
 188         hints.style.height = (winH - 5) + "px";
 189         overlapY -= height - winH;
 190       }
 191       hints.style.top = (top = pos.bottom - overlapY) + "px";
 192     }
 193     (options.container || document.body).appendChild(hints);
 194
 195     cm.addKeyMap(this.keyMap = buildKeyMap(options, {
 196       moveFocus: function(n) { widget.changeActive(widget.selectedHint + n); },
 197       setFocus: function(n) { widget.changeActive(n); },
 198       menuSize: function() { return widget.screenAmount(); },
 199       length: completions.length,
 200       close: function() { completion.close(); },
 201       pick: function() { widget.pick(); }
 202     }));
 203
 204     if (options.closeOnUnfocus !== false) {
 205       var closingOnBlur;
 206       cm.on("blur", this.onBlur = function() { closingOnBlur = setTimeout(function() { completion.close(); }, 100); });
 207       cm.on("focus", this.onFocus = function() { clearTimeout(closingOnBlur); });
 208     }
 209
 210     var startScroll = cm.getScrollInfo();
 211     cm.on("scroll", this.onScroll = function() {
 212       var curScroll = cm.getScrollInfo(), editor = cm.getWrapperElement().getBoundingClientRect();
 213       var newTop = top + startScroll.top - curScroll.top;
 214       var point = newTop - (window.pageYOffset || (document.documentElement || document.body).scrollTop);
 215       if (!below) point += hints.offsetHeight;
 216       if (point <= editor.top || point >= editor.bottom) return completion.close();
 217       hints.style.top = newTop + "px";
 218       hints.style.left = (left + startScroll.left - curScroll.left) + "px";
 219     });
 220
 221     CodeMirror.on(hints, "dblclick", function(e) {
 222       var t = e.target || e.srcElement;
 223       if (t.hintId != null) {widget.changeActive(t.hintId); widget.pick();}
 224     });
 225     CodeMirror.on(hints, "click", function(e) {
 226       var t = e.target || e.srcElement;
 227       if (t.hintId != null) widget.changeActive(t.hintId);
 228     });
 229     CodeMirror.on(hints, "mousedown", function() {
 230       setTimeout(function(){cm.focus();}, 20);
 231     });
 232
 233     CodeMirror.signal(data, "select", completions[0], hints.firstChild);
 234     return true;
 235   }
 236
 237   Widget.prototype = {
 238     close: function() {
 239       if (this.completion.widget != this) return;
 240       this.completion.widget = null;
 241       this.hints.parentNode.removeChild(this.hints);
 242       this.completion.cm.removeKeyMap(this.keyMap);
 243
 244       var cm = this.completion.cm;
 245       if (this.completion.options.closeOnUnfocus !== false) {
 246         cm.off("blur", this.onBlur);
 247         cm.off("focus", this.onFocus);
 248       }
 249       cm.off("scroll", this.onScroll);
 250     },
 251
 252     pick: function() {
 253       this.completion.pick(this.data, this.selectedHint);
 254     },
 255
 256     changeActive: function(i) {
 257       i = Math.max(0, Math.min(i, this.data.list.length - 1));
 258       if (this.selectedHint == i) return;
 259       var node = this.hints.childNodes[this.selectedHint];
 260       node.className = node.className.replace(" CodeMirror-hint-active", "");
 261       node = this.hints.childNodes[this.selectedHint = i];
 262       node.className += " CodeMirror-hint-active";
 263       if (node.offsetTop < this.hints.scrollTop)
 264         this.hints.scrollTop = node.offsetTop - 3;
 265       else if (node.offsetTop + node.offsetHeight > this.hints.scrollTop + this.hints.clientHeight)
 266         this.hints.scrollTop = node.offsetTop + node.offsetHeight - this.hints.clientHeight + 3;
 267       CodeMirror.signal(this.data, "select", this.data.list[this.selectedHint], node);
 268     },
 269
 270     screenAmount: function() {
 271       return Math.floor(this.hints.clientHeight / this.hints.firstChild.offsetHeight) || 1;
 272     }
 273   };
 274 })();