Mercurial
diff .cms/lib/codemirror/demo/complete.html @ 0:78edf6b517a0 draft
24.10
author | Coffee CMS <info@coffee-cms.ru> |
---|---|
date | Fri, 11 Oct 2024 22:40:23 +0000 |
parents | |
children |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/.cms/lib/codemirror/demo/complete.html Fri Oct 11 22:40:23 2024 +0000 @@ -0,0 +1,126 @@ +<!doctype html> + +<title>CodeMirror: Autocomplete Demo</title> +<meta charset="utf-8"/> +<link rel=stylesheet href="../doc/docs.css"> + +<link rel="stylesheet" href="../lib/codemirror.css"> +<link rel="stylesheet" href="../addon/hint/show-hint.css"> +<script src="../lib/codemirror.js"></script> +<script src="../addon/hint/show-hint.js"></script> +<script src="../addon/hint/javascript-hint.js"></script> +<script src="../mode/javascript/javascript.js"></script> +<script src="../mode/markdown/markdown.js"></script> + +<div id=nav> + <a href="https://codemirror.net/5"><h1>CodeMirror</h1><img id=logo src="../doc/logo.png"></a> + + <ul> + <li><a href="../index.html">Home</a> + <li><a href="../doc/manual.html">Manual</a> + <li><a href="https://github.com/codemirror/codemirror5">Code</a> + </ul> + <ul> + <li><a class=active href="#">Autocomplete</a> + </ul> +</div> + +<article> +<h2>Autocomplete Demo</h2> +<form><textarea id="code" name="code"> +function getCompletions(token, context) { + var found = [], start = token.string; + function maybeAdd(str) { + if (str.indexOf(start) == 0) found.push(str); + } + function gatherCompletions(obj) { + if (typeof obj == "string") forEach(stringProps, maybeAdd); + else if (obj instanceof Array) forEach(arrayProps, maybeAdd); + else if (obj instanceof Function) forEach(funcProps, maybeAdd); + for (var name in obj) maybeAdd(name); + } + + if (context) { + // If this is a property, see if it belongs to some object we can + // find in the current environment. + var obj = context.pop(), base; + if (obj.className == "js-variable") + base = window[obj.string]; + else if (obj.className == "js-string") + base = ""; + else if (obj.className == "js-atom") + base = 1; + while (base != null && context.length) + base = base[context.pop().string]; + if (base != null) gatherCompletions(base); + } + else { + // If not, just look in the window object and any local scope + // (reading into JS mode internals to get at the local variables) + for (var v = token.state.localVars; v; v = v.next) maybeAdd(v.name); + gatherCompletions(window); + forEach(keywords, maybeAdd); + } + return found; +} +</textarea></form> + +<p>Press <strong>ctrl-space</strong> to activate autocompletion. Built +on top of the <a href="../doc/manual.html#addon_show-hint"><code>show-hint</code></a> +and <a href="../doc/manual.html#addon_javascript-hint"><code>javascript-hint</code></a> +addons.</p> + +<form><textarea style="display: none" id="synonyms" name="synonyms"> +Here, the completion use an asynchronous hinting function to provide +synonyms for each words. If your browser support `Promises`, the +hinting function can also return one. +</textarea></form> + +<script> +var editor = CodeMirror.fromTextArea(document.getElementById("code"), { + lineNumbers: true, + extraKeys: {"Ctrl-Space": "autocomplete"}, + mode: {name: "javascript", globalVars: true} +}); + +if (typeof Promise !== "undefined") { + var comp = [ + ["here", "hither"], + ["asynchronous", "nonsynchronous"], + ["completion", "achievement", "conclusion", "culmination", "expirations"], + ["hinting", "advise", "broach", "imply"], + ["function","action"], + ["provide", "add", "bring", "give"], + ["synonyms", "equivalents"], + ["words", "token"], + ["each", "every"], + ] + + function synonyms(cm, option) { + return new Promise(function(accept) { + setTimeout(function() { + var cursor = cm.getCursor(), line = cm.getLine(cursor.line) + var start = cursor.ch, end = cursor.ch + while (start && /\w/.test(line.charAt(start - 1))) --start + while (end < line.length && /\w/.test(line.charAt(end))) ++end + var word = line.slice(start, end).toLowerCase() + for (var i = 0; i < comp.length; i++) if (comp[i].indexOf(word) != -1) + return accept({list: comp[i], + from: CodeMirror.Pos(cursor.line, start), + to: CodeMirror.Pos(cursor.line, end)}) + return accept(null) + }, 100) + }) + } + + var editor2 = CodeMirror.fromTextArea(document.getElementById("synonyms"), { + extraKeys: {"Ctrl-Space": "autocomplete"}, + lineNumbers: true, + lineWrapping: true, + mode: "text/x-markdown", + hintOptions: {hint: synonyms} + }) +} +</script> + +</article>