index.html 3.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>CodeMirror: JavaScript mode</title>
  6. <link rel="stylesheet" href="../../lib/codemirror.css">
  7. <script src="../../lib/codemirror.js"></script>
  8. <script src="../../addon/edit/matchbrackets.js"></script>
  9. <script src="../../addon/edit/continuecomment.js"></script>
  10. <script src="../../addon/comment/comment.js"></script>
  11. <script src="javascript.js"></script>
  12. <link rel="stylesheet" href="../../doc/docs.css">
  13. <style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
  14. </head>
  15. <body>
  16. <h1>CodeMirror: JavaScript mode</h1>
  17. <div><textarea id="code" name="code">
  18. // Demo code (the actual new parser character stream implementation)
  19. function StringStream(string) {
  20. this.pos = 0;
  21. this.string = string;
  22. }
  23. StringStream.prototype = {
  24. done: function() {return this.pos >= this.string.length;},
  25. peek: function() {return this.string.charAt(this.pos);},
  26. next: function() {
  27. if (this.pos &lt; this.string.length)
  28. return this.string.charAt(this.pos++);
  29. },
  30. eat: function(match) {
  31. var ch = this.string.charAt(this.pos);
  32. if (typeof match == "string") var ok = ch == match;
  33. else var ok = ch &amp;&amp; match.test ? match.test(ch) : match(ch);
  34. if (ok) {this.pos++; return ch;}
  35. },
  36. eatWhile: function(match) {
  37. var start = this.pos;
  38. while (this.eat(match));
  39. if (this.pos > start) return this.string.slice(start, this.pos);
  40. },
  41. backUp: function(n) {this.pos -= n;},
  42. column: function() {return this.pos;},
  43. eatSpace: function() {
  44. var start = this.pos;
  45. while (/\s/.test(this.string.charAt(this.pos))) this.pos++;
  46. return this.pos - start;
  47. },
  48. match: function(pattern, consume, caseInsensitive) {
  49. if (typeof pattern == "string") {
  50. function cased(str) {return caseInsensitive ? str.toLowerCase() : str;}
  51. if (cased(this.string).indexOf(cased(pattern), this.pos) == this.pos) {
  52. if (consume !== false) this.pos += str.length;
  53. return true;
  54. }
  55. }
  56. else {
  57. var match = this.string.slice(this.pos).match(pattern);
  58. if (match &amp;&amp; consume !== false) this.pos += match[0].length;
  59. return match;
  60. }
  61. }
  62. };
  63. </textarea></div>
  64. <script>
  65. var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
  66. lineNumbers: true,
  67. matchBrackets: true,
  68. continueComments: "Enter",
  69. extraKeys: {"Ctrl-Q": "toggleComment"}
  70. });
  71. </script>
  72. <p>
  73. JavaScript mode supports a two configuration
  74. options:
  75. <ul>
  76. <li><code>json</code> which will set the mode to expect JSON
  77. data rather than a JavaScript program.</li>
  78. <li><code>typescript</code> which will activate additional
  79. syntax highlighting and some other things for TypeScript code
  80. (<a href="typescript.html">demo</a>).</li>
  81. <li><code>statementIndent</code> which (given a number) will
  82. determine the amount of indentation to use for statements
  83. continued on a new line.</li>
  84. </ul>
  85. </p>
  86. <p><strong>MIME types defined:</strong> <code>text/javascript</code>, <code>application/json</code>, <code>text/typescript</code>, <code>application/typescript</code>.</p>
  87. </body>
  88. </html>