| 提交 | 用户 | 时间 | ||
| e7c126 | 1 | /* |
| H | 2 | * Copyright 1999-2018 Alibaba Group Holding Ltd. |
| 3 | * | |
| 4 | * Licensed under the Apache License, Version 2.0 (the "License"); | |
| 5 | * you may not use this file except in compliance with the License. | |
| 6 | * You may obtain a copy of the License at | |
| 7 | * | |
| 8 | * http://www.apache.org/licenses/LICENSE-2.0 | |
| 9 | * | |
| 10 | * Unless required by applicable law or agreed to in writing, software | |
| 11 | * distributed under the License is distributed on an "AS IS" BASIS, | |
| 12 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. | |
| 13 | * See the License for the specific language governing permissions and | |
| 14 | * limitations under the License. | |
| 15 | */ | |
| 16 | ||
| 17 | (function(mod) { | |
| 18 | if (typeof exports == "object" && typeof module == "object") // CommonJS | |
| 19 | mod(require("../../lib/codemirror")); | |
| 20 | else if (typeof define == "function" && define.amd) // AMD | |
| 21 | define(["../../lib/codemirror"], mod); | |
| 22 | else // Plain browser env | |
| 23 | mod(CodeMirror); | |
| 24 | })(function(CodeMirror) { | |
| 25 | "use strict"; | |
| 26 | var GUTTER_ID = "CodeMirror-lint-markers"; | |
| 27 | ||
| 28 | function showTooltip(e, content) { | |
| 29 | var tt = document.createElement("div"); | |
| 30 | tt.className = "CodeMirror-lint-tooltip"; | |
| 31 | tt.appendChild(content.cloneNode(true)); | |
| 32 | document.body.appendChild(tt); | |
| 33 | ||
| 34 | function position(e) { | |
| 35 | if (!tt.parentNode) return CodeMirror.off(document, "mousemove", position); | |
| 36 | tt.style.top = Math.max(0, e.clientY - tt.offsetHeight - 5) + "px"; | |
| 37 | tt.style.left = (e.clientX + 5) + "px"; | |
| 38 | } | |
| 39 | CodeMirror.on(document, "mousemove", position); | |
| 40 | position(e); | |
| 41 | if (tt.style.opacity != null) tt.style.opacity = 1; | |
| 42 | return tt; | |
| 43 | } | |
| 44 | function rm(elt) { | |
| 45 | if (elt.parentNode) elt.parentNode.removeChild(elt); | |
| 46 | } | |
| 47 | function hideTooltip(tt) { | |
| 48 | if (!tt.parentNode) return; | |
| 49 | if (tt.style.opacity == null) rm(tt); | |
| 50 | tt.style.opacity = 0; | |
| 51 | setTimeout(function() { rm(tt); }, 600); | |
| 52 | } | |
| 53 | ||
| 54 | function showTooltipFor(e, content, node) { | |
| 55 | var tooltip = showTooltip(e, content); | |
| 56 | function hide() { | |
| 57 | CodeMirror.off(node, "mouseout", hide); | |
| 58 | if (tooltip) { hideTooltip(tooltip); tooltip = null; } | |
| 59 | } | |
| 60 | var poll = setInterval(function() { | |
| 61 | if (tooltip) for (var n = node;; n = n.parentNode) { | |
| 62 | if (n && n.nodeType == 11) n = n.host; | |
| 63 | if (n == document.body) return; | |
| 64 | if (!n) { hide(); break; } | |
| 65 | } | |
| 66 | if (!tooltip) return clearInterval(poll); | |
| 67 | }, 400); | |
| 68 | CodeMirror.on(node, "mouseout", hide); | |
| 69 | } | |
| 70 | ||
| 71 | function LintState(cm, options, hasGutter) { | |
| 72 | this.marked = []; | |
| 73 | this.options = options; | |
| 74 | this.timeout = null; | |
| 75 | this.hasGutter = hasGutter; | |
| 76 | this.onMouseOver = function(e) { onMouseOver(cm, e); }; | |
| 77 | this.waitingFor = 0 | |
| 78 | } | |
| 79 | ||
| 80 | function parseOptions(_cm, options) { | |
| 81 | if (options instanceof Function) return {getAnnotations: options}; | |
| 82 | if (!options || options === true) options = {}; | |
| 83 | return options; | |
| 84 | } | |
| 85 | ||
| 86 | function clearMarks(cm) { | |
| 87 | var state = cm.state.lint; | |
| 88 | if (state.hasGutter) cm.clearGutter(GUTTER_ID); | |
| 89 | for (var i = 0; i < state.marked.length; ++i) | |
| 90 | state.marked[i].clear(); | |
| 91 | state.marked.length = 0; | |
| 92 | } | |
| 93 | ||
| 94 | function makeMarker(labels, severity, multiple, tooltips) { | |
| 95 | var marker = document.createElement("div"), inner = marker; | |
| 96 | marker.className = "CodeMirror-lint-marker-" + severity; | |
| 97 | if (multiple) { | |
| 98 | inner = marker.appendChild(document.createElement("div")); | |
| 99 | inner.className = "CodeMirror-lint-marker-multiple"; | |
| 100 | } | |
| 101 | ||
| 102 | if (tooltips != false) CodeMirror.on(inner, "mouseover", function(e) { | |
| 103 | showTooltipFor(e, labels, inner); | |
| 104 | }); | |
| 105 | ||
| 106 | return marker; | |
| 107 | } | |
| 108 | ||
| 109 | function getMaxSeverity(a, b) { | |
| 110 | if (a == "error") return a; | |
| 111 | else return b; | |
| 112 | } | |
| 113 | ||
| 114 | function groupByLine(annotations) { | |
| 115 | var lines = []; | |
| 116 | for (var i = 0; i < annotations.length; ++i) { | |
| 117 | var ann = annotations[i], line = ann.from.line; | |
| 118 | (lines[line] || (lines[line] = [])).push(ann); | |
| 119 | } | |
| 120 | return lines; | |
| 121 | } | |
| 122 | ||
| 123 | function annotationTooltip(ann) { | |
| 124 | var severity = ann.severity; | |
| 125 | if (!severity) severity = "error"; | |
| 126 | var tip = document.createElement("div"); | |
| 127 | tip.className = "CodeMirror-lint-message-" + severity; | |
| 128 | tip.appendChild(document.createTextNode(ann.message)); | |
| 129 | return tip; | |
| 130 | } | |
| 131 | ||
| 132 | function lintAsync(cm, getAnnotations, passOptions) { | |
| 133 | var state = cm.state.lint | |
| 134 | var id = ++state.waitingFor | |
| 135 | function abort() { | |
| 136 | id = -1 | |
| 137 | cm.off("change", abort) | |
| 138 | } | |
| 139 | cm.on("change", abort) | |
| 140 | getAnnotations(cm.getValue(), function(annotations, arg2) { | |
| 141 | cm.off("change", abort) | |
| 142 | if (state.waitingFor != id) return | |
| 143 | if (arg2 && annotations instanceof CodeMirror) annotations = arg2 | |
| 144 | updateLinting(cm, annotations) | |
| 145 | }, passOptions, cm); | |
| 146 | } | |
| 147 | ||
| 148 | function startLinting(cm) { | |
| 149 | var state = cm.state.lint, options = state.options; | |
| 150 | var passOptions = options.options || options; // Support deprecated passing of `options` property in options | |
| 151 | var getAnnotations = options.getAnnotations || cm.getHelper(CodeMirror.Pos(0, 0), "lint"); | |
| 152 | if (!getAnnotations) return; | |
| 153 | if (options.async || getAnnotations.async) { | |
| 154 | lintAsync(cm, getAnnotations, passOptions) | |
| 155 | } else { | |
| 156 | updateLinting(cm, getAnnotations(cm.getValue(), passOptions, cm)); | |
| 157 | } | |
| 158 | } | |
| 159 | ||
| 160 | function updateLinting(cm, annotationsNotSorted) { | |
| 161 | clearMarks(cm); | |
| 162 | var state = cm.state.lint, options = state.options; | |
| 163 | ||
| 164 | var annotations = groupByLine(annotationsNotSorted); | |
| 165 | ||
| 166 | for (var line = 0; line < annotations.length; ++line) { | |
| 167 | var anns = annotations[line]; | |
| 168 | if (!anns) continue; | |
| 169 | ||
| 170 | var maxSeverity = null; | |
| 171 | var tipLabel = state.hasGutter && document.createDocumentFragment(); | |
| 172 | ||
| 173 | for (var i = 0; i < anns.length; ++i) { | |
| 174 | var ann = anns[i]; | |
| 175 | var severity = ann.severity; | |
| 176 | if (!severity) severity = "error"; | |
| 177 | maxSeverity = getMaxSeverity(maxSeverity, severity); | |
| 178 | ||
| 179 | if (options.formatAnnotation) ann = options.formatAnnotation(ann); | |
| 180 | if (state.hasGutter) tipLabel.appendChild(annotationTooltip(ann)); | |
| 181 | ||
| 182 | if (ann.to) state.marked.push(cm.markText(ann.from, ann.to, { | |
| 183 | className: "CodeMirror-lint-mark-" + severity, | |
| 184 | __annotation: ann | |
| 185 | })); | |
| 186 | } | |
| 187 | ||
| 188 | if (state.hasGutter) | |
| 189 | cm.setGutterMarker(line, GUTTER_ID, makeMarker(tipLabel, maxSeverity, anns.length > 1, | |
| 190 | state.options.tooltips)); | |
| 191 | } | |
| 192 | if (options.onUpdateLinting) options.onUpdateLinting(annotationsNotSorted, annotations, cm); | |
| 193 | } | |
| 194 | ||
| 195 | function onChange(cm) { | |
| 196 | var state = cm.state.lint; | |
| 197 | if (!state) return; | |
| 198 | clearTimeout(state.timeout); | |
| 199 | state.timeout = setTimeout(function(){startLinting(cm);}, state.options.delay || 500); | |
| 200 | } | |
| 201 | ||
| 202 | function popupTooltips(annotations, e) { | |
| 203 | var target = e.target || e.srcElement; | |
| 204 | var tooltip = document.createDocumentFragment(); | |
| 205 | for (var i = 0; i < annotations.length; i++) { | |
| 206 | var ann = annotations[i]; | |
| 207 | tooltip.appendChild(annotationTooltip(ann)); | |
| 208 | } | |
| 209 | showTooltipFor(e, tooltip, target); | |
| 210 | } | |
| 211 | ||
| 212 | function onMouseOver(cm, e) { | |
| 213 | var target = e.target || e.srcElement; | |
| 214 | if (!/\bCodeMirror-lint-mark-/.test(target.className)) return; | |
| 215 | var box = target.getBoundingClientRect(), x = (box.left + box.right) / 2, y = (box.top + box.bottom) / 2; | |
| 216 | var spans = cm.findMarksAt(cm.coordsChar({left: x, top: y}, "client")); | |
| 217 | ||
| 218 | var annotations = []; | |
| 219 | for (var i = 0; i < spans.length; ++i) { | |
| 220 | annotations.push(spans[i].__annotation); | |
| 221 | } | |
| 222 | if (annotations.length) popupTooltips(annotations, e); | |
| 223 | } | |
| 224 | ||
| 225 | CodeMirror.defineOption("lint", false, function(cm, val, old) { | |
| 226 | if (old && old != CodeMirror.Init) { | |
| 227 | clearMarks(cm); | |
| 228 | if (cm.state.lint.options.lintOnChange !== false) | |
| 229 | cm.off("change", onChange); | |
| 230 | CodeMirror.off(cm.getWrapperElement(), "mouseover", cm.state.lint.onMouseOver); | |
| 231 | clearTimeout(cm.state.lint.timeout); | |
| 232 | delete cm.state.lint; | |
| 233 | } | |
| 234 | ||
| 235 | if (val) { | |
| 236 | var gutters = cm.getOption("gutters"), hasLintGutter = false; | |
| 237 | for (var i = 0; i < gutters.length; ++i) if (gutters[i] == GUTTER_ID) hasLintGutter = true; | |
| 238 | var state = cm.state.lint = new LintState(cm, parseOptions(cm, val), hasLintGutter); | |
| 239 | if (state.options.lintOnChange !== false) | |
| 240 | cm.on("change", onChange); | |
| 241 | if (state.options.tooltips != false) | |
| 242 | CodeMirror.on(cm.getWrapperElement(), "mouseover", state.onMouseOver); | |
| 243 | ||
| 244 | startLinting(cm); | |
| 245 | } | |
| 246 | }); | |
| 247 | ||
| 248 | CodeMirror.defineExtension("performLint", function() { | |
| 249 | if (this.state.lint) startLinting(this); | |
| 250 | }); | |
| 251 | }); | |
