80 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			80 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!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>
 | |
| 
 | |
| <div id=nav>
 | |
|   <a href="http://codemirror.net"><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/marijnh/codemirror">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>
 | |
| 
 | |
|     <script>
 | |
|       var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
 | |
|         lineNumbers: true,
 | |
|         extraKeys: {"Ctrl-Space": "autocomplete"},
 | |
|         mode: {name: "javascript", globalVars: true}
 | |
|       });
 | |
|     </script>
 | |
|   </article>
 | 
