|
|
<!doctype html>
|
|
|
<html>
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<title>CodeMirror: JavaScript mode</title>
|
|
|
<link rel="stylesheet" href="../../lib/codemirror.css">
|
|
|
<script src="../../lib/codemirror.js"></script>
|
|
|
<script src="../../addon/edit/matchbrackets.js"></script>
|
|
|
<script src="../../addon/edit/continuecomment.js"></script>
|
|
|
<script src="../../addon/comment/comment.js"></script>
|
|
|
<script src="javascript.js"></script>
|
|
|
<link rel="stylesheet" href="../../doc/docs.css">
|
|
|
<style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
|
|
|
</head>
|
|
|
<body>
|
|
|
<h1>CodeMirror: JavaScript mode</h1>
|
|
|
|
|
|
<div><textarea id="code" name="code">
|
|
|
// Demo code (the actual new parser character stream implementation)
|
|
|
|
|
|
function StringStream(string) {
|
|
|
this.pos = 0;
|
|
|
this.string = string;
|
|
|
}
|
|
|
|
|
|
StringStream.prototype = {
|
|
|
done: function() {return this.pos >= this.string.length;},
|
|
|
peek: function() {return this.string.charAt(this.pos);},
|
|
|
next: function() {
|
|
|
if (this.pos < this.string.length)
|
|
|
return this.string.charAt(this.pos++);
|
|
|
},
|
|
|
eat: function(match) {
|
|
|
var ch = this.string.charAt(this.pos);
|
|
|
if (typeof match == "string") var ok = ch == match;
|
|
|
else var ok = ch && match.test ? match.test(ch) : match(ch);
|
|
|
if (ok) {this.pos++; return ch;}
|
|
|
},
|
|
|
eatWhile: function(match) {
|
|
|
var start = this.pos;
|
|
|
while (this.eat(match));
|
|
|
if (this.pos > start) return this.string.slice(start, this.pos);
|
|
|
},
|
|
|
backUp: function(n) {this.pos -= n;},
|
|
|
column: function() {return this.pos;},
|
|
|
eatSpace: function() {
|
|
|
var start = this.pos;
|
|
|
while (/\s/.test(this.string.charAt(this.pos))) this.pos++;
|
|
|
return this.pos - start;
|
|
|
},
|
|
|
match: function(pattern, consume, caseInsensitive) {
|
|
|
if (typeof pattern == "string") {
|
|
|
function cased(str) {return caseInsensitive ? str.toLowerCase() : str;}
|
|
|
if (cased(this.string).indexOf(cased(pattern), this.pos) == this.pos) {
|
|
|
if (consume !== false) this.pos += str.length;
|
|
|
return true;
|
|
|
}
|
|
|
}
|
|
|
else {
|
|
|
var match = this.string.slice(this.pos).match(pattern);
|
|
|
if (match && consume !== false) this.pos += match[0].length;
|
|
|
return match;
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
</textarea></div>
|
|
|
|
|
|
<script>
|
|
|
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
|
|
|
lineNumbers: true,
|
|
|
matchBrackets: true,
|
|
|
continueComments: "Enter",
|
|
|
extraKeys: {"Ctrl-Q": "toggleComment"}
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
<p>
|
|
|
JavaScript mode supports a two configuration
|
|
|
options:
|
|
|
<ul>
|
|
|
<li><code>json</code> which will set the mode to expect JSON
|
|
|
data rather than a JavaScript program.</li>
|
|
|
<li><code>typescript</code> which will activate additional
|
|
|
syntax highlighting and some other things for TypeScript code
|
|
|
(<a href="typescript.html">demo</a>).</li>
|
|
|
<li><code>statementIndent</code> which (given a number) will
|
|
|
determine the amount of indentation to use for statements
|
|
|
continued on a new line.</li>
|
|
|
</ul>
|
|
|
</p>
|
|
|
|
|
|
<p><strong>MIME types defined:</strong> <code>text/javascript</code>, <code>application/json</code>, <code>text/typescript</code>, <code>application/typescript</code>.</p>
|
|
|
</body>
|
|
|
</html>
|
|
|
|
