complete.html 2.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879
  1. <!doctype html>
  2. <title>CodeMirror: Autocomplete Demo</title>
  3. <meta charset="utf-8"/>
  4. <link rel=stylesheet href="../doc/docs.css">
  5. <link rel="stylesheet" href="../lib/codemirror.css">
  6. <link rel="stylesheet" href="../addon/hint/show-hint.css">
  7. <script src="../lib/codemirror.js"></script>
  8. <script src="../addon/hint/show-hint.js"></script>
  9. <script src="../addon/hint/javascript-hint.js"></script>
  10. <script src="../mode/javascript/javascript.js"></script>
  11. <div id=nav>
  12. <a href="http://codemirror.net"><img id=logo src="../doc/logo.png"></a>
  13. <ul>
  14. <li><a href="../index.html">Home</a>
  15. <li><a href="../doc/manual.html">Manual</a>
  16. <li><a href="https://github.com/marijnh/codemirror">Code</a>
  17. </ul>
  18. <ul>
  19. <li><a class=active href="#">Autocomplete</a>
  20. </ul>
  21. </div>
  22. <article>
  23. <h2>Autocomplete Demo</h2>
  24. <form><textarea id="code" name="code">
  25. function getCompletions(token, context) {
  26. var found = [], start = token.string;
  27. function maybeAdd(str) {
  28. if (str.indexOf(start) == 0) found.push(str);
  29. }
  30. function gatherCompletions(obj) {
  31. if (typeof obj == "string") forEach(stringProps, maybeAdd);
  32. else if (obj instanceof Array) forEach(arrayProps, maybeAdd);
  33. else if (obj instanceof Function) forEach(funcProps, maybeAdd);
  34. for (var name in obj) maybeAdd(name);
  35. }
  36. if (context) {
  37. // If this is a property, see if it belongs to some object we can
  38. // find in the current environment.
  39. var obj = context.pop(), base;
  40. if (obj.className == "js-variable")
  41. base = window[obj.string];
  42. else if (obj.className == "js-string")
  43. base = "";
  44. else if (obj.className == "js-atom")
  45. base = 1;
  46. while (base != null && context.length)
  47. base = base[context.pop().string];
  48. if (base != null) gatherCompletions(base);
  49. }
  50. else {
  51. // If not, just look in the window object and any local scope
  52. // (reading into JS mode internals to get at the local variables)
  53. for (var v = token.state.localVars; v; v = v.next) maybeAdd(v.name);
  54. gatherCompletions(window);
  55. forEach(keywords, maybeAdd);
  56. }
  57. return found;
  58. }
  59. </textarea></form>
  60. <p>Press <strong>ctrl-space</strong> to activate autocompletion. Built
  61. on top of the <a href="../doc/manual.html#addon_show-hint"><code>show-hint</code></a>
  62. and <a href="../doc/manual.html#addon_javascript-hint"><code>javascript-hint</code></a>
  63. addons.</p>
  64. <script>
  65. var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
  66. lineNumbers: true,
  67. extraKeys: {"Ctrl-Space": "autocomplete"},
  68. mode: {name: "javascript", globalVars: true}
  69. });
  70. </script>
  71. </article>