remove codemirror docs from tracking
This commit is contained in:
@ -1,57 +0,0 @@
|
||||
// Kludge in HTML5 tag recognition in IE8
|
||||
document.createElement("section");
|
||||
document.createElement("article");
|
||||
|
||||
(function() {
|
||||
if (!window.addEventListener) return;
|
||||
var pending = false, prevVal = null;
|
||||
|
||||
function updateSoon() {
|
||||
if (!pending) {
|
||||
pending = true;
|
||||
setTimeout(update, 250);
|
||||
}
|
||||
}
|
||||
|
||||
function update() {
|
||||
pending = false;
|
||||
var marks = document.getElementById("nav").getElementsByTagName("a"), found;
|
||||
for (var i = 0; i < marks.length; ++i) {
|
||||
var mark = marks[i], m;
|
||||
if (mark.getAttribute("data-default")) {
|
||||
if (found == null) found = i;
|
||||
} else if (m = mark.href.match(/#(.*)/)) {
|
||||
var ref = document.getElementById(m[1]);
|
||||
if (ref && ref.getBoundingClientRect().top < 50)
|
||||
found = i;
|
||||
}
|
||||
}
|
||||
if (found != null && found != prevVal) {
|
||||
prevVal = found;
|
||||
var lis = document.getElementById("nav").getElementsByTagName("li");
|
||||
for (var i = 0; i < lis.length; ++i) lis[i].className = "";
|
||||
for (var i = 0; i < marks.length; ++i) {
|
||||
if (found == i) {
|
||||
marks[i].className = "active";
|
||||
for (var n = marks[i]; n; n = n.parentNode)
|
||||
if (n.nodeName == "LI") n.className = "active";
|
||||
} else {
|
||||
marks[i].className = "";
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener("scroll", updateSoon);
|
||||
window.addEventListener("load", updateSoon);
|
||||
window.addEventListener("hashchange", function() {
|
||||
setTimeout(function() {
|
||||
var hash = document.location.hash, found = null, m;
|
||||
var marks = document.getElementById("nav").getElementsByTagName("a");
|
||||
for (var i = 0; i < marks.length; i++)
|
||||
if ((m = marks[i].href.match(/(#.*)/)) && m[1] == hash) { found = i; break; }
|
||||
if (found != null) for (var i = 0; i < marks.length; i++)
|
||||
marks[i].className = i == found ? "active" : "";
|
||||
}, 300);
|
||||
});
|
||||
})();
|
@ -1,303 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Compression Helper</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
<script src="../lib/codemirror.js"></script>
|
||||
<script src="../mode/javascript/javascript.js"></script>
|
||||
<link rel=stylesheet href="../lib/codemirror.css">
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#">Compression helper</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2>Script compression helper</h2>
|
||||
|
||||
<p>To optimize loading CodeMirror, especially when including a
|
||||
bunch of different modes, it is recommended that you combine and
|
||||
minify (and preferably also gzip) the scripts. This page makes
|
||||
those first two steps very easy. Simply select the version and
|
||||
scripts you need in the form below, and
|
||||
click <strong>Compress</strong> to download the minified script
|
||||
file.</p>
|
||||
|
||||
<form id="form" action="http://marijnhaverbeke.nl/uglifyjs" method="post" onsubmit="generateHeader();">
|
||||
<input type="hidden" id="download" name="download" value="codemirror-compressed.js"/>
|
||||
<p>Version: <select id="version" onchange="setVersion(this);" style="padding: 1px;">
|
||||
<option value="http://codemirror.net/">HEAD</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.10.0;f=">4.10</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.9.0;f=">4.9</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.8.0;f=">4.8</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.7.0;f=">4.7</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.6.0;f=">4.6</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.5.0;f=">4.5</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.4.0;f=">4.4</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.3.0;f=">4.3</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.2.1;f=">4.2</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.2.0;f=">4.2</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.1.0;f=">4.1</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=4.0.3;f=">4.0</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.23.0;f=">3.23</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.22.0;f=">3.22</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.21.0;f=">3.21</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.20.0;f=">3.20</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.19.0;f=">3.19</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.18.0;f=">3.18</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.16.0;f=">3.16</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.15.0;f=">3.15</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.14.0;f=">3.14</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=3.13.0;f=">3.13</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.12;f=">3.12</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.11;f=">3.11</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.1;f=">3.1</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.02;f=">3.02</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.01;f=">3.01</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v3.0;f=">3.0</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.38;f=">2.38</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.37;f=">2.37</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.36;f=">2.36</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.35;f=">2.35</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.34;f=">2.34</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.33;f=">2.33</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.32;f=">2.32</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.31;f=">2.31</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.3;f=">2.3</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.25;f=">2.25</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.24;f=">2.24</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.23;f=">2.23</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.22;f=">2.22</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.21;f=">2.21</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.2;f=">2.2</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.18;f=">2.18</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.16;f=">2.16</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.15;f=">2.15</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.13;f=">2.13</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.12;f=">2.12</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.11;f=">2.11</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.1;f=">2.1</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.02;f=">2.02</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.01;f=">2.01</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=v2.0;f=">2.0</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=beta2;f=">beta2</option>
|
||||
<option value="http://marijnhaverbeke.nl/git/codemirror?a=blob_plain;hb=beta1;f=">beta1</option>
|
||||
</select></p>
|
||||
|
||||
<select multiple="multiple" size="20" name="code_url" style="width: 40em;" class="field" id="files">
|
||||
<optgroup label="CodeMirror Library">
|
||||
<option value="http://codemirror.net/lib/codemirror.js" selected>codemirror.js</option>
|
||||
</optgroup>
|
||||
<optgroup label="Modes">
|
||||
<option value="http://codemirror.net/mode/apl/apl.js">apl.js</option>
|
||||
<option value="http://codemirror.net/mode/clike/clike.js">clike.js</option>
|
||||
<option value="http://codemirror.net/mode/clojure/clojure.js">clojure.js</option>
|
||||
<option value="http://codemirror.net/mode/cobol/cobol.js">cobol.js</option>
|
||||
<option value="http://codemirror.net/mode/coffeescript/coffeescript.js">coffeescript.js</option>
|
||||
<option value="http://codemirror.net/mode/commonlisp/commonlisp.js">commonlisp.js</option>
|
||||
<option value="http://codemirror.net/mode/css/css.js">css.js</option>
|
||||
<option value="http://codemirror.net/mode/cypher/cypher.js">cypher.js</option>
|
||||
<option value="http://codemirror.net/mode/d/d.js">d.js</option>
|
||||
<option value="http://codemirror.net/mode/dart/dart.js">dart.js</option>
|
||||
<option value="http://codemirror.net/mode/diff/diff.js">diff.js</option>
|
||||
<option value="http://codemirror.net/mode/django/django.js">django.js</option>
|
||||
<option value="http://codemirror.net/mode/dockerfile/dockerfile.js">dockerfile.js</option>
|
||||
<option value="http://codemirror.net/mode/dtd/dtd.js">dtd.js</option>
|
||||
<option value="http://codemirror.net/mode/dylan/dylan.js">dylan.js</option>
|
||||
<option value="http://codemirror.net/mode/ebnf/ebnf.js">ebnf.js</option>
|
||||
<option value="http://codemirror.net/mode/ecl/ecl.js">ecl.js</option>
|
||||
<option value="http://codemirror.net/mode/eiffel/eiffel.js">eiffel.js</option>
|
||||
<option value="http://codemirror.net/mode/erlang/erlang.js">erlang.js</option>
|
||||
<option value="http://codemirror.net/mode/fortran/fortran.js">fortran.js</option>
|
||||
<option value="http://codemirror.net/mode/gfm/gfm.js">gfm.js</option>
|
||||
<option value="http://codemirror.net/mode/gas/gas.js">gas.js</option>
|
||||
<option value="http://codemirror.net/mode/gherkin/gherkin.js">gherkin.js</option>
|
||||
<option value="http://codemirror.net/mode/go/go.js">go.js</option>
|
||||
<option value="http://codemirror.net/mode/groovy/groovy.js">groovy.js</option>
|
||||
<option value="http://codemirror.net/mode/haml/haml.js">haml.js</option>
|
||||
<option value="http://codemirror.net/mode/haskell/haskell.js">haskell.js</option>
|
||||
<option value="http://codemirror.net/mode/haxe/haxe.js">haxe.js</option>
|
||||
<option value="http://codemirror.net/mode/htmlembedded/htmlembedded.js">htmlembedded.js</option>
|
||||
<option value="http://codemirror.net/mode/htmlmixed/htmlmixed.js">htmlmixed.js</option>
|
||||
<option value="http://codemirror.net/mode/http/http.js">http.js</option>
|
||||
<option value="http://codemirror.net/mode/idl/idl.js">idl.js</option>
|
||||
<option value="http://codemirror.net/mode/jade/jade.js">jade.js</option>
|
||||
<option value="http://codemirror.net/mode/javascript/javascript.js">javascript.js</option>
|
||||
<option value="http://codemirror.net/mode/jinja2/jinja2.js">jinja2.js</option>
|
||||
<option value="http://codemirror.net/mode/julia/julia.js">julia.js</option>
|
||||
<option value="http://codemirror.net/mode/kotlin/kotlin.js">kotlin.js</option>
|
||||
<option value="http://codemirror.net/mode/livescript/livescript.js">livescript.js</option>
|
||||
<option value="http://codemirror.net/mode/lua/lua.js">lua.js</option>
|
||||
<option value="http://codemirror.net/mode/markdown/markdown.js">markdown.js</option>
|
||||
<option value="http://codemirror.net/mode/mirc/mirc.js">mirc.js</option>
|
||||
<option value="http://codemirror.net/mode/mllike/mllike.js">mllike.js</option>
|
||||
<option value="http://codemirror.net/mode/modelica/modelica.js">modelica.js</option>
|
||||
<option value="http://codemirror.net/mode/nginx/nginx.js">nginx.js</option>
|
||||
<option value="http://codemirror.net/mode/ntriples/ntriples.js">ntriples.js</option>
|
||||
<option value="http://codemirror.net/mode/octave/octave.js">octave.js</option>
|
||||
<option value="http://codemirror.net/mode/pascal/pascal.js">pascal.js</option>
|
||||
<option value="http://codemirror.net/mode/pegjs/pegjs.js">pegjs.js</option>
|
||||
<option value="http://codemirror.net/mode/perl/perl.js">perl.js</option>
|
||||
<option value="http://codemirror.net/mode/php/php.js">php.js</option>
|
||||
<option value="http://codemirror.net/mode/pig/pig.js">pig.js</option>
|
||||
<option value="http://codemirror.net/mode/properties/properties.js">properties.js</option>
|
||||
<option value="http://codemirror.net/mode/python/python.js">python.js</option>
|
||||
<option value="http://codemirror.net/mode/puppet/puppet.js">puppet.js</option>
|
||||
<option value="http://codemirror.net/mode/q/q.js">q.js</option>
|
||||
<option value="http://codemirror.net/mode/r/r.js">r.js</option>
|
||||
<option value="http://codemirror.net/mode/rpm/rpm.js">rpm.js</option>
|
||||
<option value="http://codemirror.net/mode/rst/rst.js">rst.js</option>
|
||||
<option value="http://codemirror.net/mode/ruby/ruby.js">ruby.js</option>
|
||||
<option value="http://codemirror.net/mode/rust/rust.js">rust.js</option>
|
||||
<option value="http://codemirror.net/mode/sass/sass.js">sass.js</option>
|
||||
<option value="http://codemirror.net/mode/scala/scala.js">scala.js</option>
|
||||
<option value="http://codemirror.net/mode/scheme/scheme.js">scheme.js</option>
|
||||
<option value="http://codemirror.net/mode/shell/shell.js">shell.js</option>
|
||||
<option value="http://codemirror.net/mode/sieve/sieve.js">sieve.js</option>
|
||||
<option value="http://codemirror.net/mode/slim/slim.js">slim.js</option>
|
||||
<option value="http://codemirror.net/mode/smalltalk/smalltalk.js">smalltalk.js</option>
|
||||
<option value="http://codemirror.net/mode/smarty/smarty.js">smarty.js</option>
|
||||
<option value="http://codemirror.net/mode/smartymixed/smartymixed.js">smartymixed.js</option>
|
||||
<option value="http://codemirror.net/mode/solr/solr.js">solr.js</option>
|
||||
<option value="http://codemirror.net/mode/soy/soy.js">soy.js</option>
|
||||
<option value="http://codemirror.net/mode/sparql/sparql.js">sparql.js</option>
|
||||
<option value="http://codemirror.net/mode/spreadsheet/spreadsheet.js">spreadsheet.js</option>
|
||||
<option value="http://codemirror.net/mode/sql/sql.js">sql.js</option>
|
||||
<option value="http://codemirror.net/mode/stex/stex.js">stex.js</option>
|
||||
<option value="http://codemirror.net/mode/tcl/tcl.js">tcl.js</option>
|
||||
<option value="http://codemirror.net/mode/textile/textile.js">textile.js</option>
|
||||
<option value="http://codemirror.net/mode/tiddlywiki/tiddlywiki.js">tiddlywiki.js</option>
|
||||
<option value="http://codemirror.net/mode/tiki/tiki.js">tiki.js</option>
|
||||
<option value="http://codemirror.net/mode/toml/toml.js">toml.js</option>
|
||||
<option value="http://codemirror.net/mode/tornado/tornado.js">tornado.js</option>
|
||||
<option value="http://codemirror.net/mode/turtle/turtle.js">turtle.js</option>
|
||||
<option value="http://codemirror.net/mode/vb/vb.js">vb.js</option>
|
||||
<option value="http://codemirror.net/mode/vbscript/vbscript.js">vbscript.js</option>
|
||||
<option value="http://codemirror.net/mode/velocity/velocity.js">velocity.js</option>
|
||||
<option value="http://codemirror.net/mode/verilog/verilog.js">verilog.js</option>
|
||||
<option value="http://codemirror.net/mode/xml/xml.js">xml.js</option>
|
||||
<option value="http://codemirror.net/mode/xquery/xquery.js">xquery.js</option>
|
||||
<option value="http://codemirror.net/mode/yaml/yaml.js">yaml.js</option>
|
||||
<option value="http://codemirror.net/mode/z80/z80.js">z80.js</option>
|
||||
</optgroup>
|
||||
<optgroup label="Add-ons">
|
||||
<option value="http://codemirror.net/addon/selection/active-line.js">active-line.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/anyword-hint.js">anyword-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/brace-fold.js">brace-fold.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/closebrackets.js">closebrackets.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/closetag.js">closetag.js</option>
|
||||
<option value="http://codemirror.net/addon/runmode/colorize.js">colorize.js</option>
|
||||
<option value="http://codemirror.net/addon/comment/comment.js">comment.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/comment-fold.js">comment-fold.js</option>
|
||||
<option value="http://codemirror.net/addon/comment/continuecomment.js">continuecomment.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/continuelist.js">continuelist.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/css-hint.js">css-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/dialog/dialog.js">dialog.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/foldcode.js">foldcode.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/foldgutter.js">foldgutter.js</option>
|
||||
<option value="http://codemirror.net/addon/display/fullscreen.js">fullscreen.js</option>
|
||||
<option value="http://codemirror.net/addon/wrap/hardwrap.js">hardwrap.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/html-hint.js">html-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/indent-fold.js">indent-fold.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/javascript-hint.js">javascript-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/lint/javascript-lint.js">javascript-lint.js</option>
|
||||
<option value="http://codemirror.net/addon/lint/json-lint.js">json-lint.js</option>
|
||||
<option value="http://codemirror.net/addon/lint/lint.js">lint.js</option>
|
||||
<option value="http://codemirror.net/addon/mode/loadmode.js">loadmode.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/markdown-fold.js">markdown-fold.js</option>
|
||||
<option value="http://codemirror.net/addon/selection/mark-selection.js">mark-selection.js</option>
|
||||
<option value="http://codemirror.net/addon/search/match-highlighter.js">match-highlighter.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/matchbrackets.js">matchbrackets.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/matchtags.js">matchtags.js</option>
|
||||
<option value="http://codemirror.net/addon/merge/merge.js">merge.js</option>
|
||||
<option value="http://codemirror.net/addon/mode/multiplex.js">multiplex.js</option>
|
||||
<option value="http://codemirror.net/addon/mode/overlay.js">overlay.js</option>
|
||||
<option value="http://codemirror.net/addon/display/placeholder.js">placeholder.js</option>
|
||||
<option value="http://codemirror.net/addon/display/rulers.js">rulers.js</option>
|
||||
<option value="http://codemirror.net/addon/runmode/runmode.js">runmode.js</option>
|
||||
<option value="http://codemirror.net/addon/runmode/runmode.node.js">runmode.node.js</option>
|
||||
<option value="http://codemirror.net/addon/runmode/runmode-standalone.js">runmode-standalone.js</option>
|
||||
<option value="http://codemirror.net/addon/search/search.js">search.js</option>
|
||||
<option value="http://codemirror.net/addon/search/searchcursor.js">searchcursor.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/show-hint.js">show-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/mode/simple.js">simple.js</option>
|
||||
<option value="http://codemirror.net/addon/scroll/simplescrollbars.js">simplescrollbars.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/sql-hint.js">sql-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/edit/trailingspace.js">trailingspace.js</option>
|
||||
<option value="http://codemirror.net/addon/tern/tern.js">tern.js</option>
|
||||
<option value="http://codemirror.net/addon/fold/xml-fold.js">xml-fold.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/xml-hint.js">xml-hint.js</option>
|
||||
<option value="http://codemirror.net/addon/hint/yaml-lint.js">yaml-lint.js</option>
|
||||
</optgroup>
|
||||
<optgroup label="Keymaps">
|
||||
<option value="http://codemirror.net/keymap/emacs.js">emacs.js</option>
|
||||
<option value="http://codemirror.net/keymap/sublime.js">sublime.js</option>
|
||||
<option value="http://codemirror.net/keymap/vim.js">vim.js</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
|
||||
<p>
|
||||
<button type="submit">Compress</button> with <a href="http://github.com/mishoo/UglifyJS/">UglifyJS</a>
|
||||
</p>
|
||||
<input type="hidden" id="header" name="header">
|
||||
<p>Custom code to add to the compressed file:<textarea name="js_code" style="width: 100%; height: 15em;" class="field" id="js_code"></textarea></p>
|
||||
</form>
|
||||
|
||||
<script type="text/javascript">
|
||||
CodeMirror.fromTextArea(document.getElementById("js_code")).getWrapperElement().className += " field";
|
||||
|
||||
function setVersion(ver) {
|
||||
var urlprefix = ver.options[ver.selectedIndex].value;
|
||||
var select = document.getElementById("files"), m;
|
||||
for (var optgr = select.firstChild; optgr; optgr = optgr.nextSibling)
|
||||
for (var opt = optgr.firstChild; opt; opt = opt.nextSibling) {
|
||||
if (opt.nodeName != "OPTION")
|
||||
continue;
|
||||
else if (m = opt.value.match(/^http:\/\/codemirror.net\/(.*)$/))
|
||||
opt.value = urlprefix + m[1];
|
||||
else if (m = opt.value.match(/http:\/\/marijnhaverbeke.nl\/git\/codemirror\?a=blob_plain;hb=[^;]+;f=(.*)$/))
|
||||
opt.value = urlprefix + m[1];
|
||||
}
|
||||
}
|
||||
|
||||
function generateHeader() {
|
||||
var versionNode = document.getElementById("version");
|
||||
var version = versionNode.options[versionNode.selectedIndex].label
|
||||
var filesNode = document.getElementById("files");
|
||||
var optGroupHeaderIncluded;
|
||||
|
||||
// Generate the comment
|
||||
var str = "/* CodeMirror - Minified & Bundled\n";
|
||||
str += " Generated on " + new Date().toLocaleDateString() + " with http://codemirror.net/doc/compress.html\n";
|
||||
str += " Version: " + version + "\n\n";
|
||||
|
||||
for (var group = filesNode.firstChild; group; group = group.nextSibling) {
|
||||
optGroupHeaderIncluded = false;
|
||||
for (var option = group.firstChild; option; option = option.nextSibling) {
|
||||
if (option.nodeName !== "OPTION") {
|
||||
continue;
|
||||
} else if (option.selected) {
|
||||
if (!optGroupHeaderIncluded) {
|
||||
str += " " + group.label + ":\n";
|
||||
optGroupHeaderIncluded = true;
|
||||
}
|
||||
str += " - " + option.label + "\n";
|
||||
}
|
||||
}
|
||||
}
|
||||
str += " */\n\n";
|
||||
|
||||
document.getElementById("header").value = str;
|
||||
}
|
||||
</script>
|
||||
|
||||
</article>
|
@ -1,241 +0,0 @@
|
||||
@font-face {
|
||||
font-family: 'Source Sans Pro';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(//themes.googleusercontent.com/static/fonts/sourcesanspro/v5/ODelI1aHBYDBqgeIAH2zlBM0YzuT7MdOe03otPbuUS0.woff) format('woff');
|
||||
}
|
||||
|
||||
body, html { margin: 0; padding: 0; height: 100%; }
|
||||
section, article { display: block; padding: 0; }
|
||||
|
||||
body {
|
||||
background: #f8f8f8;
|
||||
font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
p { margin-top: 0; }
|
||||
|
||||
h2, h3, h1 {
|
||||
font-weight: normal;
|
||||
margin-bottom: .7em;
|
||||
}
|
||||
h1 { font-size: 140%; }
|
||||
h2 { font-size: 120%; }
|
||||
h3 { font-size: 110%; }
|
||||
article > h2:first-child, section:first-child > h2 { margin-top: 0; }
|
||||
|
||||
#nav h1 {
|
||||
margin-right: 12px;
|
||||
margin-top: 0;
|
||||
margin-bottom: 2px;
|
||||
color: #d30707;
|
||||
letter-spacing: .5px;
|
||||
}
|
||||
|
||||
a, a:visited, a:link, .quasilink {
|
||||
color: #A21313;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
em {
|
||||
padding-right: 2px;
|
||||
}
|
||||
|
||||
.quasilink {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
article {
|
||||
max-width: 700px;
|
||||
margin: 0 0 0 160px;
|
||||
border-left: 2px solid #E30808;
|
||||
border-right: 1px solid #ddd;
|
||||
padding: 30px 50px 100px 50px;
|
||||
background: white;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
min-height: 100%;
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
}
|
||||
|
||||
#nav {
|
||||
position: fixed;
|
||||
padding-top: 30px;
|
||||
max-height: 100%;
|
||||
box-sizing: -moz-border-box;
|
||||
box-sizing: border-box;
|
||||
overflow-y: auto;
|
||||
left: 0; right: none;
|
||||
width: 160px;
|
||||
text-align: right;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1000px) {
|
||||
article {
|
||||
margin: 0 auto;
|
||||
}
|
||||
#nav {
|
||||
right: 50%;
|
||||
width: auto;
|
||||
border-right: 349px solid transparent;
|
||||
}
|
||||
}
|
||||
|
||||
#nav ul {
|
||||
display: block;
|
||||
margin: 0; padding: 0;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
#nav li {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
#nav li ul {
|
||||
font-size: 80%;
|
||||
margin-bottom: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#nav li.active ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#nav li li a {
|
||||
padding-right: 20px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#nav ul a {
|
||||
color: black;
|
||||
padding: 0 7px 1px 11px;
|
||||
}
|
||||
|
||||
#nav ul a.active, #nav ul a:hover {
|
||||
border-bottom: 1px solid #E30808;
|
||||
margin-bottom: -1px;
|
||||
color: #E30808;
|
||||
}
|
||||
|
||||
#logo {
|
||||
border: 0;
|
||||
margin-right: 12px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
section {
|
||||
border-top: 1px solid #E30808;
|
||||
margin: 1.5em 0;
|
||||
}
|
||||
|
||||
section.first {
|
||||
border: none;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#demo {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#demolist {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 5px;
|
||||
z-index: 25;
|
||||
}
|
||||
|
||||
.bankinfo {
|
||||
text-align: left;
|
||||
display: none;
|
||||
padding: 0 .5em;
|
||||
position: absolute;
|
||||
border: 2px solid #aaa;
|
||||
border-radius: 5px;
|
||||
background: #eee;
|
||||
top: 10px;
|
||||
left: 30px;
|
||||
}
|
||||
|
||||
.bankinfo_close {
|
||||
position: absolute;
|
||||
top: 0; right: 6px;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bigbutton {
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
padding: 0 1em;
|
||||
display: inline-block;
|
||||
color: white;
|
||||
position: relative;
|
||||
line-height: 1.9;
|
||||
color: white !important;
|
||||
background: #A21313;
|
||||
}
|
||||
|
||||
.bigbutton.right {
|
||||
border-bottom-left-radius: 100px;
|
||||
border-top-left-radius: 100px;
|
||||
}
|
||||
|
||||
.bigbutton.left {
|
||||
border-bottom-right-radius: 100px;
|
||||
border-top-right-radius: 100px;
|
||||
}
|
||||
|
||||
.bigbutton:hover {
|
||||
background: #E30808;
|
||||
}
|
||||
|
||||
th {
|
||||
text-decoration: underline;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
#features ul {
|
||||
list-style: none;
|
||||
margin: 0 0 1em;
|
||||
padding: 0 0 0 1.2em;
|
||||
}
|
||||
|
||||
#features li:before {
|
||||
content: "-";
|
||||
width: 1em;
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
margin-left: -1em;
|
||||
}
|
||||
|
||||
.rel {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.rel-note {
|
||||
margin-top: 0;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding-left: 15px;
|
||||
border-left: 2px solid #ddd;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0 2px;
|
||||
}
|
||||
|
||||
strong {
|
||||
text-decoration: underline;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.field {
|
||||
border: 1px solid #A21313;
|
||||
}
|
@ -1,503 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Internals</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
<style>dl dl {margin: 0;} .update {color: #d40 !important}</style>
|
||||
<script src="activebookmark.js"></script>
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a href="#top">Introduction</a></li>
|
||||
<li><a href="#approach">General Approach</a></li>
|
||||
<li><a href="#input">Input</a></li>
|
||||
<li><a href="#selection">Selection</a></li>
|
||||
<li><a href="#update">Intelligent Updating</a></li>
|
||||
<li><a href="#parse">Parsing</a></li>
|
||||
<li><a href="#summary">What Gives?</a></li>
|
||||
<li><a href="#btree">Content Representation</a></li>
|
||||
<li><a href="#keymap">Key Maps</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2 id=top>(Re-) Implementing A Syntax-Highlighting Editor in JavaScript</h2>
|
||||
|
||||
<p style="font-size: 85%" id="intro">
|
||||
<strong>Topic:</strong> JavaScript, code editor implementation<br>
|
||||
<strong>Author:</strong> Marijn Haverbeke<br>
|
||||
<strong>Date:</strong> March 2nd 2011 (updated November 13th 2011)
|
||||
</p>
|
||||
|
||||
<p style="padding: 0 3em 0 2em"><strong>Caution</strong>: this text was written briefly after
|
||||
version 2 was initially written. It no longer (even including the
|
||||
update at the bottom) fully represents the current implementation. I'm
|
||||
leaving it here as a historic document. For more up-to-date
|
||||
information, look at the entries
|
||||
tagged <a href="http://marijnhaverbeke.nl/blog/#cm-internals">cm-internals</a>
|
||||
on my blog.</p>
|
||||
|
||||
<p>This is a followup to
|
||||
my <a href="http://codemirror.net/story.html">Brutal Odyssey to the
|
||||
Dark Side of the DOM Tree</a> story. That one describes the
|
||||
mind-bending process of implementing (what would become) CodeMirror 1.
|
||||
This one describes the internals of CodeMirror 2, a complete rewrite
|
||||
and rethink of the old code base. I wanted to give this piece another
|
||||
Hunter Thompson copycat subtitle, but somehow that would be out of
|
||||
place—the process this time around was one of straightforward
|
||||
engineering, requiring no serious mind-bending whatsoever.</p>
|
||||
|
||||
<p>So, what is wrong with CodeMirror 1? I'd estimate, by mailing list
|
||||
activity and general search-engine presence, that it has been
|
||||
integrated into about a thousand systems by now. The most prominent
|
||||
one, since a few weeks,
|
||||
being <a href="http://googlecode.blogspot.com/2011/01/make-quick-fixes-quicker-on-google.html">Google
|
||||
code's project hosting</a>. It works, and it's being used widely.</p>
|
||||
|
||||
<p>Still, I did not start replacing it because I was bored. CodeMirror
|
||||
1 was heavily reliant on <code>designMode</code>
|
||||
or <code>contentEditable</code> (depending on the browser). Neither of
|
||||
these are well specified (HTML5 tries
|
||||
to <a href="http://www.w3.org/TR/html5/editing.html#contenteditable">specify</a>
|
||||
their basics), and, more importantly, they tend to be one of the more
|
||||
obscure and buggy areas of browser functionality—CodeMirror, by using
|
||||
this functionality in a non-typical way, was constantly running up
|
||||
against browser bugs. WebKit wouldn't show an empty line at the end of
|
||||
the document, and in some releases would suddenly get unbearably slow.
|
||||
Firefox would show the cursor in the wrong place. Internet Explorer
|
||||
would insist on linkifying everything that looked like a URL or email
|
||||
address, a behaviour that can't be turned off. Some bugs I managed to
|
||||
work around (which was often a frustrating, painful process), others,
|
||||
such as the Firefox cursor placement, I gave up on, and had to tell
|
||||
user after user that they were known problems, but not something I
|
||||
could help.</p>
|
||||
|
||||
<p>Also, there is the fact that <code>designMode</code> (which seemed
|
||||
to be less buggy than <code>contentEditable</code> in Webkit and
|
||||
Firefox, and was thus used by CodeMirror 1 in those browsers) requires
|
||||
a frame. Frames are another tricky area. It takes some effort to
|
||||
prevent getting tripped up by domain restrictions, they don't
|
||||
initialize synchronously, behave strangely in response to the back
|
||||
button, and, on several browsers, can't be moved around the DOM
|
||||
without having them re-initialize. They did provide a very nice way to
|
||||
namespace the library, though—CodeMirror 1 could freely pollute the
|
||||
namespace inside the frame.</p>
|
||||
|
||||
<p>Finally, working with an editable document means working with
|
||||
selection in arbitrary DOM structures. Internet Explorer (8 and
|
||||
before) has an utterly different (and awkward) selection API than all
|
||||
of the other browsers, and even among the different implementations of
|
||||
<code>document.selection</code>, details about how exactly a selection
|
||||
is represented vary quite a bit. Add to that the fact that Opera's
|
||||
selection support tended to be very buggy until recently, and you can
|
||||
imagine why CodeMirror 1 contains 700 lines of selection-handling
|
||||
code.</p>
|
||||
|
||||
<p>And that brings us to the main issue with the CodeMirror 1
|
||||
code base: The proportion of browser-bug-workarounds to real
|
||||
application code was getting dangerously high. By building on top of a
|
||||
few dodgy features, I put the system in a vulnerable position—any
|
||||
incompatibility and bugginess in these features, I had to paper over
|
||||
with my own code. Not only did I have to do some serious stunt-work to
|
||||
get it to work on older browsers (as detailed in the
|
||||
previous <a href="http://codemirror.net/story.html">story</a>), things
|
||||
also kept breaking in newly released versions, requiring me to come up
|
||||
with <em>new</em> scary hacks in order to keep up. This was starting
|
||||
to lose its appeal.</p>
|
||||
|
||||
<section id=approach>
|
||||
<h2>General Approach</h2>
|
||||
|
||||
<p>What CodeMirror 2 does is try to sidestep most of the hairy hacks
|
||||
that came up in version 1. I owe a lot to the
|
||||
<a href="http://ace.ajax.org">ACE</a> editor for inspiration on how to
|
||||
approach this.</p>
|
||||
|
||||
<p>I absolutely did not want to be completely reliant on key events to
|
||||
generate my input. Every JavaScript programmer knows that key event
|
||||
information is horrible and incomplete. Some people (most awesomely
|
||||
Mihai Bazon with <a href="http://ymacs.org">Ymacs</a>) have been able
|
||||
to build more or less functioning editors by directly reading key
|
||||
events, but it takes a lot of work (the kind of never-ending, fragile
|
||||
work I described earlier), and will never be able to properly support
|
||||
things like multi-keystoke international character
|
||||
input. <a href="#keymap" class="update">[see below for caveat]</a></p>
|
||||
|
||||
<p>So what I do is focus a hidden textarea, and let the browser
|
||||
believe that the user is typing into that. What we show to the user is
|
||||
a DOM structure we built to represent his document. If this is updated
|
||||
quickly enough, and shows some kind of believable cursor, it feels
|
||||
like a real text-input control.</p>
|
||||
|
||||
<p>Another big win is that this DOM representation does not have to
|
||||
span the whole document. Some CodeMirror 1 users insisted that they
|
||||
needed to put a 30 thousand line XML document into CodeMirror. Putting
|
||||
all that into the DOM takes a while, especially since, for some
|
||||
reason, an editable DOM tree is slower than a normal one on most
|
||||
browsers. If we have full control over what we show, we must only
|
||||
ensure that the visible part of the document has been added, and can
|
||||
do the rest only when needed. (Fortunately, the <code>onscroll</code>
|
||||
event works almost the same on all browsers, and lends itself well to
|
||||
displaying things only as they are scrolled into view.)</p>
|
||||
</section>
|
||||
<section id="input">
|
||||
<h2>Input</h2>
|
||||
|
||||
<p>ACE uses its hidden textarea only as a text input shim, and does
|
||||
all cursor movement and things like text deletion itself by directly
|
||||
handling key events. CodeMirror's way is to let the browser do its
|
||||
thing as much as possible, and not, for example, define its own set of
|
||||
key bindings. One way to do this would have been to have the whole
|
||||
document inside the hidden textarea, and after each key event update
|
||||
the display DOM to reflect what's in that textarea.</p>
|
||||
|
||||
<p>That'd be simple, but it is not realistic. For even medium-sized
|
||||
document the editor would be constantly munging huge strings, and get
|
||||
terribly slow. What CodeMirror 2 does is put the current selection,
|
||||
along with an extra line on the top and on the bottom, into the
|
||||
textarea.</p>
|
||||
|
||||
<p>This means that the arrow keys (and their ctrl-variations), home,
|
||||
end, etcetera, do not have to be handled specially. We just read the
|
||||
cursor position in the textarea, and update our cursor to match it.
|
||||
Also, copy and paste work pretty much for free, and people get their
|
||||
native key bindings, without any special work on my part. For example,
|
||||
I have emacs key bindings configured for Chrome and Firefox. There is
|
||||
no way for a script to detect this. <a class="update"
|
||||
href="#keymap">[no longer the case]</a></p>
|
||||
|
||||
<p>Of course, since only a small part of the document sits in the
|
||||
textarea, keys like page up and ctrl-end won't do the right thing.
|
||||
CodeMirror is catching those events and handling them itself.</p>
|
||||
</section>
|
||||
<section id="selection">
|
||||
<h2>Selection</h2>
|
||||
|
||||
<p>Getting and setting the selection range of a textarea in modern
|
||||
browsers is trivial—you just use the <code>selectionStart</code>
|
||||
and <code>selectionEnd</code> properties. On IE you have to do some
|
||||
insane stuff with temporary ranges and compensating for the fact that
|
||||
moving the selection by a 'character' will treat \r\n as a single
|
||||
character, but even there it is possible to build functions that
|
||||
reliably set and get the selection range.</p>
|
||||
|
||||
<p>But consider this typical case: When I'm somewhere in my document,
|
||||
press shift, and press the up arrow, something gets selected. Then, if
|
||||
I, still holding shift, press the up arrow again, the top of my
|
||||
selection is adjusted. The selection remembers where its <em>head</em>
|
||||
and its <em>anchor</em> are, and moves the head when we shift-move.
|
||||
This is a generally accepted property of selections, and done right by
|
||||
every editing component built in the past twenty years.</p>
|
||||
|
||||
<p>But not something that the browser selection APIs expose.</p>
|
||||
|
||||
<p>Great. So when someone creates an 'upside-down' selection, the next
|
||||
time CodeMirror has to update the textarea, it'll re-create the
|
||||
selection as an 'upside-up' selection, with the anchor at the top, and
|
||||
the next cursor motion will behave in an unexpected way—our second
|
||||
up-arrow press in the example above will not do anything, since it is
|
||||
interpreted in exactly the same way as the first.</p>
|
||||
|
||||
<p>No problem. We'll just, ehm, detect that the selection is
|
||||
upside-down (you can tell by the way it was created), and then, when
|
||||
an upside-down selection is present, and a cursor-moving key is
|
||||
pressed in combination with shift, we quickly collapse the selection
|
||||
in the textarea to its start, allow the key to take effect, and then
|
||||
combine its new head with its old anchor to get the <em>real</em>
|
||||
selection.</p>
|
||||
|
||||
<p>In short, scary hacks could not be avoided entirely in CodeMirror
|
||||
2.</p>
|
||||
|
||||
<p>And, the observant reader might ask, how do you even know that a
|
||||
key combo is a cursor-moving combo, if you claim you support any
|
||||
native key bindings? Well, we don't, but we can learn. The editor
|
||||
keeps a set known cursor-movement combos (initialized to the
|
||||
predictable defaults), and updates this set when it observes that
|
||||
pressing a certain key had (only) the effect of moving the cursor.
|
||||
This, of course, doesn't work if the first time the key is used was
|
||||
for extending an inverted selection, but it works most of the
|
||||
time.</p>
|
||||
</section>
|
||||
<section id="update">
|
||||
<h2>Intelligent Updating</h2>
|
||||
|
||||
<p>One thing that always comes up when you have a complicated internal
|
||||
state that's reflected in some user-visible external representation
|
||||
(in this case, the displayed code and the textarea's content) is
|
||||
keeping the two in sync. The naive way is to just update the display
|
||||
every time you change your state, but this is not only error prone
|
||||
(you'll forget), it also easily leads to duplicate work on big,
|
||||
composite operations. Then you start passing around flags indicating
|
||||
whether the display should be updated in an attempt to be efficient
|
||||
again and, well, at that point you might as well give up completely.</p>
|
||||
|
||||
<p>I did go down that road, but then switched to a much simpler model:
|
||||
simply keep track of all the things that have been changed during an
|
||||
action, and then, only at the end, use this information to update the
|
||||
user-visible display.</p>
|
||||
|
||||
<p>CodeMirror uses a concept of <em>operations</em>, which start by
|
||||
calling a specific set-up function that clears the state and end by
|
||||
calling another function that reads this state and does the required
|
||||
updating. Most event handlers, and all the user-visible methods that
|
||||
change state are wrapped like this. There's a method
|
||||
called <code>operation</code> that accepts a function, and returns
|
||||
another function that wraps the given function as an operation.</p>
|
||||
|
||||
<p>It's trivial to extend this (as CodeMirror does) to detect nesting,
|
||||
and, when an operation is started inside an operation, simply
|
||||
increment the nesting count, and only do the updating when this count
|
||||
reaches zero again.</p>
|
||||
|
||||
<p>If we have a set of changed ranges and know the currently shown
|
||||
range, we can (with some awkward code to deal with the fact that
|
||||
changes can add and remove lines, so we're dealing with a changing
|
||||
coordinate system) construct a map of the ranges that were left
|
||||
intact. We can then compare this map with the part of the document
|
||||
that's currently visible (based on scroll offset and editor height) to
|
||||
determine whether something needs to be updated.</p>
|
||||
|
||||
<p>CodeMirror uses two update algorithms—a full refresh, where it just
|
||||
discards the whole part of the DOM that contains the edited text and
|
||||
rebuilds it, and a patch algorithm, where it uses the information
|
||||
about changed and intact ranges to update only the out-of-date parts
|
||||
of the DOM. When more than 30 percent (which is the current heuristic,
|
||||
might change) of the lines need to be updated, the full refresh is
|
||||
chosen (since it's faster to do than painstakingly finding and
|
||||
updating all the changed lines), in the other case it does the
|
||||
patching (so that, if you scroll a line or select another character,
|
||||
the whole screen doesn't have to be
|
||||
re-rendered). <span class="update">[the full-refresh
|
||||
algorithm was dropped, it wasn't really faster than the patching
|
||||
one]</span></p>
|
||||
|
||||
<p>All updating uses <code>innerHTML</code> rather than direct DOM
|
||||
manipulation, since that still seems to be by far the fastest way to
|
||||
build documents. There's a per-line function that combines the
|
||||
highlighting, <a href="manual.html#markText">marking</a>, and
|
||||
selection info for that line into a snippet of HTML. The patch updater
|
||||
uses this to reset individual lines, the refresh updater builds an
|
||||
HTML chunk for the whole visible document at once, and then uses a
|
||||
single <code>innerHTML</code> update to do the refresh.</p>
|
||||
</section>
|
||||
<section id="parse">
|
||||
<h2>Parsers can be Simple</h2>
|
||||
|
||||
<p>When I wrote CodeMirror 1, I
|
||||
thought <a href="http://codemirror.net/story.html#parser">interruptable
|
||||
parsers</a> were a hugely scary and complicated thing, and I used a
|
||||
bunch of heavyweight abstractions to keep this supposed complexity
|
||||
under control: parsers
|
||||
were <a href="http://bob.pythonmac.org/archives/2005/07/06/iteration-in-javascript/">iterators</a>
|
||||
that consumed input from another iterator, and used funny
|
||||
closure-resetting tricks to copy and resume themselves.</p>
|
||||
|
||||
<p>This made for a rather nice system, in that parsers formed strictly
|
||||
separate modules, and could be composed in predictable ways.
|
||||
Unfortunately, it was quite slow (stacking three or four iterators on
|
||||
top of each other), and extremely intimidating to people not used to a
|
||||
functional programming style.</p>
|
||||
|
||||
<p>With a few small changes, however, we can keep all those
|
||||
advantages, but simplify the API and make the whole thing less
|
||||
indirect and inefficient. CodeMirror
|
||||
2's <a href="manual.html#modeapi">mode API</a> uses explicit state
|
||||
objects, and makes the parser/tokenizer a function that simply takes a
|
||||
state and a character stream abstraction, advances the stream one
|
||||
token, and returns the way the token should be styled. This state may
|
||||
be copied, optionally in a mode-defined way, in order to be able to
|
||||
continue a parse at a given point. Even someone who's never touched a
|
||||
lambda in his life can understand this approach. Additionally, far
|
||||
fewer objects are allocated in the course of parsing now.</p>
|
||||
|
||||
<p>The biggest speedup comes from the fact that the parsing no longer
|
||||
has to touch the DOM though. In CodeMirror 1, on an older browser, you
|
||||
could <em>see</em> the parser work its way through the document,
|
||||
managing some twenty lines in each 50-millisecond time slice it got. It
|
||||
was reading its input from the DOM, and updating the DOM as it went
|
||||
along, which any experienced JavaScript programmer will immediately
|
||||
spot as a recipe for slowness. In CodeMirror 2, the parser usually
|
||||
finishes the whole document in a single 100-millisecond time slice—it
|
||||
manages some 1500 lines during that time on Chrome. All it has to do
|
||||
is munge strings, so there is no real reason for it to be slow
|
||||
anymore.</p>
|
||||
</section>
|
||||
<section id="summary">
|
||||
<h2>What Gives?</h2>
|
||||
|
||||
<p>Given all this, what can you expect from CodeMirror 2?</p>
|
||||
|
||||
<ul>
|
||||
|
||||
<li><strong>Small.</strong> the base library is
|
||||
some <span class="update">45k</span> when minified
|
||||
now, <span class="update">17k</span> when gzipped. It's smaller than
|
||||
its own logo.</li>
|
||||
|
||||
<li><strong>Lightweight.</strong> CodeMirror 2 initializes very
|
||||
quickly, and does almost no work when it is not focused. This means
|
||||
you can treat it almost like a textarea, have multiple instances on a
|
||||
page without trouble.</li>
|
||||
|
||||
<li><strong>Huge document support.</strong> Since highlighting is
|
||||
really fast, and no DOM structure is being built for non-visible
|
||||
content, you don't have to worry about locking up your browser when a
|
||||
user enters a megabyte-sized document.</li>
|
||||
|
||||
<li><strong>Extended API.</strong> Some things kept coming up in the
|
||||
mailing list, such as marking pieces of text or lines, which were
|
||||
extremely hard to do with CodeMirror 1. The new version has proper
|
||||
support for these built in.</li>
|
||||
|
||||
<li><strong>Tab support.</strong> Tabs inside editable documents were,
|
||||
for some reason, a no-go. At least six different people announced they
|
||||
were going to add tab support to CodeMirror 1, none survived (I mean,
|
||||
none delivered a working version). CodeMirror 2 no longer removes tabs
|
||||
from your document.</li>
|
||||
|
||||
<li><strong>Sane styling.</strong> <code>iframe</code> nodes aren't
|
||||
really known for respecting document flow. Now that an editor instance
|
||||
is a plain <code>div</code> element, it is much easier to size it to
|
||||
fit the surrounding elements. You don't even have to make it scroll if
|
||||
you do not <a href="../demo/resize.html">want to</a>.</li>
|
||||
|
||||
</ul>
|
||||
|
||||
<p>On the downside, a CodeMirror 2 instance is <em>not</em> a native
|
||||
editable component. Though it does its best to emulate such a
|
||||
component as much as possible, there is functionality that browsers
|
||||
just do not allow us to hook into. Doing select-all from the context
|
||||
menu, for example, is not currently detected by CodeMirror.</p>
|
||||
|
||||
<p id="changes" style="margin-top: 2em;"><span style="font-weight:
|
||||
bold">[Updates from November 13th 2011]</span> Recently, I've made
|
||||
some changes to the codebase that cause some of the text above to no
|
||||
longer be current. I've left the text intact, but added markers at the
|
||||
passages that are now inaccurate. The new situation is described
|
||||
below.</p>
|
||||
</section>
|
||||
<section id="btree">
|
||||
<h2>Content Representation</h2>
|
||||
|
||||
<p>The original implementation of CodeMirror 2 represented the
|
||||
document as a flat array of line objects. This worked well—splicing
|
||||
arrays will require the part of the array after the splice to be
|
||||
moved, but this is basically just a simple <code>memmove</code> of a
|
||||
bunch of pointers, so it is cheap even for huge documents.</p>
|
||||
|
||||
<p>However, I recently added line wrapping and code folding (line
|
||||
collapsing, basically). Once lines start taking up a non-constant
|
||||
amount of vertical space, looking up a line by vertical position
|
||||
(which is needed when someone clicks the document, and to determine
|
||||
the visible part of the document during scrolling) can only be done
|
||||
with a linear scan through the whole array, summing up line heights as
|
||||
you go. Seeing how I've been going out of my way to make big documents
|
||||
fast, this is not acceptable.</p>
|
||||
|
||||
<p>The new representation is based on a B-tree. The leaves of the tree
|
||||
contain arrays of line objects, with a fixed minimum and maximum size,
|
||||
and the non-leaf nodes simply hold arrays of child nodes. Each node
|
||||
stores both the amount of lines that live below them and the vertical
|
||||
space taken up by these lines. This allows the tree to be indexed both
|
||||
by line number and by vertical position, and all access has
|
||||
logarithmic complexity in relation to the document size.</p>
|
||||
|
||||
<p>I gave line objects and tree nodes parent pointers, to the node
|
||||
above them. When a line has to update its height, it can simply walk
|
||||
these pointers to the top of the tree, adding or subtracting the
|
||||
difference in height from each node it encounters. The parent pointers
|
||||
also make it cheaper (in complexity terms, the difference is probably
|
||||
tiny in normal-sized documents) to find the current line number when
|
||||
given a line object. In the old approach, the whole document array had
|
||||
to be searched. Now, we can just walk up the tree and count the sizes
|
||||
of the nodes coming before us at each level.</p>
|
||||
|
||||
<p>I chose B-trees, not regular binary trees, mostly because they
|
||||
allow for very fast bulk insertions and deletions. When there is a big
|
||||
change to a document, it typically involves adding, deleting, or
|
||||
replacing a chunk of subsequent lines. In a regular balanced tree, all
|
||||
these inserts or deletes would have to be done separately, which could
|
||||
be really expensive. In a B-tree, to insert a chunk, you just walk
|
||||
down the tree once to find where it should go, insert them all in one
|
||||
shot, and then break up the node if needed. This breaking up might
|
||||
involve breaking up nodes further up, but only requires a single pass
|
||||
back up the tree. For deletion, I'm somewhat lax in keeping things
|
||||
balanced—I just collapse nodes into a leaf when their child count goes
|
||||
below a given number. This means that there are some weird editing
|
||||
patterns that may result in a seriously unbalanced tree, but even such
|
||||
an unbalanced tree will perform well, unless you spend a day making
|
||||
strangely repeating edits to a really big document.</p>
|
||||
</section>
|
||||
<section id="keymap">
|
||||
<h2>Keymaps</h2>
|
||||
|
||||
<p><a href="#approach">Above</a>, I claimed that directly catching key
|
||||
events for things like cursor movement is impractical because it
|
||||
requires some browser-specific kludges. I then proceeded to explain
|
||||
some awful <a href="#selection">hacks</a> that were needed to make it
|
||||
possible for the selection changes to be detected through the
|
||||
textarea. In fact, the second hack is about as bad as the first.</p>
|
||||
|
||||
<p>On top of that, in the presence of user-configurable tab sizes and
|
||||
collapsed and wrapped lines, lining up cursor movement in the textarea
|
||||
with what's visible on the screen becomes a nightmare. Thus, I've
|
||||
decided to move to a model where the textarea's selection is no longer
|
||||
depended on.</p>
|
||||
|
||||
<p>So I moved to a model where all cursor movement is handled by my
|
||||
own code. This adds support for a goal column, proper interaction of
|
||||
cursor movement with collapsed lines, and makes it possible for
|
||||
vertical movement to move through wrapped lines properly, instead of
|
||||
just treating them like non-wrapped lines.</p>
|
||||
|
||||
<p>The key event handlers now translate the key event into a string,
|
||||
something like <code>Ctrl-Home</code> or <code>Shift-Cmd-R</code>, and
|
||||
use that string to look up an action to perform. To make keybinding
|
||||
customizable, this lookup goes through
|
||||
a <a href="manual.html#option_keyMap">table</a>, using a scheme that
|
||||
allows such tables to be chained together (for example, the default
|
||||
Mac bindings fall through to a table named 'emacsy', which defines
|
||||
basic Emacs-style bindings like <code>Ctrl-F</code>, and which is also
|
||||
used by the custom Emacs bindings).</p>
|
||||
|
||||
<p>A new
|
||||
option <a href="manual.html#option_extraKeys"><code>extraKeys</code></a>
|
||||
allows ad-hoc keybindings to be defined in a much nicer way than what
|
||||
was possible with the
|
||||
old <a href="manual.html#option_onKeyEvent"><code>onKeyEvent</code></a>
|
||||
callback. You simply provide an object mapping key identifiers to
|
||||
functions, instead of painstakingly looking at raw key events.</p>
|
||||
|
||||
<p>Built-in commands map to strings, rather than functions, for
|
||||
example <code>"goLineUp"</code> is the default action bound to the up
|
||||
arrow key. This allows new keymaps to refer to them without
|
||||
duplicating any code. New commands can be defined by assigning to
|
||||
the <code>CodeMirror.commands</code> object, which maps such commands
|
||||
to functions.</p>
|
||||
|
||||
<p>The hidden textarea now only holds the current selection, with no
|
||||
extra characters around it. This has a nice advantage: polling for
|
||||
input becomes much, much faster. If there's a big selection, this text
|
||||
does not have to be read from the textarea every time—when we poll,
|
||||
just noticing that something is still selected is enough to tell us
|
||||
that no new text was typed.</p>
|
||||
|
||||
<p>The reason that cheap polling is important is that many browsers do
|
||||
not fire useful events on IME (input method engine) input, which is
|
||||
the thing where people inputting a language like Japanese or Chinese
|
||||
use multiple keystrokes to create a character or sequence of
|
||||
characters. Most modern browsers fire <code>input</code> when the
|
||||
composing is finished, but many don't fire anything when the character
|
||||
is updated <em>during</em> composition. So we poll, whenever the
|
||||
editor is focused, to provide immediate updates of the display.</p>
|
||||
|
||||
</article>
|
Binary file not shown.
Before Width: | Height: | Size: 9.1 KiB |
@ -1,181 +0,0 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
id="svg2"
|
||||
version="1.1"
|
||||
inkscape:version="0.48.4 r9939"
|
||||
width="640"
|
||||
height="640"
|
||||
xml:space="preserve"
|
||||
sodipodi:docname="logo.svg"
|
||||
inkscape:export-filename="/home/marijn/src/js/codemirror/doc/logo.png"
|
||||
inkscape:export-xdpi="16.601332"
|
||||
inkscape:export-ydpi="16.601332"><metadata
|
||||
id="metadata8"><rdf:RDF><cc:Work
|
||||
rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
|
||||
id="defs6"><clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath16"><path
|
||||
d="M 0,512 512,512 512,0 0,0 0,512 z"
|
||||
id="path18" /></clipPath><clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath40"><path
|
||||
d="m 435.607,369.899 31.242,0 0,-64.782 -31.242,0 0,64.782 z"
|
||||
id="path42" /></clipPath><clipPath
|
||||
clipPathUnits="userSpaceOnUse"
|
||||
id="clipPath56"><path
|
||||
d="m 421.796,349.477 39.074,0 0,-88.423 -39.074,0 0,88.423 z"
|
||||
id="path58" /></clipPath></defs><sodipodi:namedview
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1"
|
||||
objecttolerance="10"
|
||||
gridtolerance="10"
|
||||
guidetolerance="10"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:window-width="1600"
|
||||
inkscape:window-height="875"
|
||||
id="namedview4"
|
||||
showgrid="false"
|
||||
showguides="true"
|
||||
inkscape:guide-bbox="true"
|
||||
inkscape:zoom="0.52149125"
|
||||
inkscape:cx="303.572"
|
||||
inkscape:cy="574.48012"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="25"
|
||||
inkscape:window-maximized="0"
|
||||
inkscape:current-layer="g10" /><g
|
||||
id="g10"
|
||||
inkscape:groupmode="layer"
|
||||
inkscape:label="2014-10_codeMirror_logo_vectors"
|
||||
transform="matrix(1.25,0,0,-1.25,0,640)"><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path22"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 233.97976,469.37438 c 0,0 7.01353,-14.94848 -2.94916,-31.42373 -4.97925,-8.23417 -130.50847,-34.94915 -179.50847,-102.94915 -30,-47 -76,-183 71,-273 66,-34 94,-33 94,-33 0,0 -44,31 -16,52 28,21 69,31 80,60 13,-10 34,-31 54,-29 -2,13 -7,18 9,20 16,2 24,2 24,2 0,0 -15,12 -32,13 -17,1 -49,34 -48,48 21,12 48,32 64,26 16,-6 32,-16 35,-25 0,-6 -3,-16 10,-8 13,8 10,13 15,24 5,11 6,13 -5,22 -11,9 -37,30 -58,24 -21,-6 -65,-23 -87,-2 9,20 23,52 16,74 13,10 28,21 30,39 15,2 47,11 41,27 -6,16 -48.59322,87.16949 -113.59322,73.16949"
|
||||
sodipodi:nodetypes="cscccsccscscscsssscccsc" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path26"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 441.52213,306.0015 c 11,29 29,78 12,80 -17,2 -36,-44 -41,-56 -5,-12 -25,-72 -14,-80 11,-8 43,56 43,56" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path30"
|
||||
style="fill:#da687d;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 348.52213,384.0015 c 3.13,4.919 5.82086,0.64508 -7.67914,-0.35492 -13.5,-1 -29.62196,-5.18461 -32.38899,-11.04836 -5.19174,-11.00208 -6.93187,-38.09672 -26.43187,-44.09672 -1,-7 0,-23 27.5,-26 27.5,-3 28.5,15 44.5,14.5 16,-0.5 14.5,5.5 9,10 -5.5,4.5 -24.5,35 -24.5,45 0,10 6.5,6.5 10,12"
|
||||
sodipodi:nodetypes="csscssssc" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path34"
|
||||
style="fill:#da687d;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 103.02213,82.502 c 0,0 -8.5,22.5 16.5,34.5 25,12 47.5,2.5 52,-6 4.5,-8.5 -7.5,-42.5 -50.5,-43 -10.5,8.5 -18,14.5 -18,14.5" /><g
|
||||
id="g38"
|
||||
transform="translate(-21.47687,0)" /><g
|
||||
id="g44"
|
||||
transform="translate(-21.47687,0)"><g
|
||||
style="opacity:0.69999701"
|
||||
id="g46"
|
||||
clip-path="url(#clipPath40)"><g
|
||||
id="g48"
|
||||
transform="translate(466.2583,369.8384)"><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path50"
|
||||
style="fill:#da687d;fill-opacity:1;fill-rule:evenodd;stroke:none"
|
||||
d="M 0,0 C 0.423,-1.569 0.298,-3.199 0.255,-4.838 0.213,-6.452 0.062,-8.15 -0.349,-9.801 c 0.106,-0.377 -0.082,-0.814 -0.018,-1.201 -0.41,-0.515 -0.194,-0.903 -0.284,-1.354 0.661,-0.674 1.522,-1.313 1.152,-2.162 -0.259,-0.596 -0.874,-0.706 -1.464,-0.995 -0.389,-1.403 -0.709,-3.099 -1.028,-4.649 -0.097,-0.476 -0.044,-1.051 -0.187,-1.485 -0.334,-1.01 -0.691,-1.978 -0.971,-3.09 -0.237,-0.945 0.034,-2.689 -1.063,-2.811 -0.423,-1.049 -0.663,-1.841 -1.165,-2.83 -0.286,-0.163 -0.452,0.106 -0.692,0.009 -0.305,-0.348 -0.294,-0.823 -0.577,-1.114 -0.222,-0.229 -0.503,-0.163 -0.665,-0.385 -0.363,-0.5 -0.266,-1.24 -0.523,-1.902 -0.468,-0.4 -0.862,-0.905 -1.147,-1.478 -0.588,-1.179 -0.698,-2.681 -1.591,-3.593 -0.28,-0.286 -0.761,-0.365 -1.011,-0.647 -0.238,-0.269 -0.455,-0.665 -0.689,-0.98 -0.338,-0.452 -0.669,-1.045 -0.972,-1.583 -1.004,-1.787 -2.383,-3.71 -3.301,-5.664 -0.173,-0.369 -0.199,-0.805 -0.364,-1.165 -0.381,-0.827 -0.943,-1.579 -1.257,-2.333 -0.516,-1.239 -1.31,-3.339 -2.538,-4.42 -0.149,-0.131 -0.473,-0.254 -0.606,-0.414 -0.179,-0.215 -0.136,-0.568 -0.32,-0.808 -0.086,-0.113 -0.4,-0.164 -0.537,-0.302 -0.208,-0.211 -0.306,-0.481 -0.479,-0.639 -0.426,-0.388 -1.015,-0.555 -1.381,-0.959 -0.277,-0.306 -0.397,-0.743 -0.692,-1.127 -0.318,-0.413 -0.761,-0.784 -1.09,-1.202 -0.994,-1.264 -1.38,-2.8 -2.702,-3.396 -0.393,-0.178 -0.88,-0.12 -1.291,-0.241 -0.374,0.344 -0.078,0.818 -0.163,1.164 -0.055,0.222 -0.285,0.382 -0.346,0.583 -0.143,0.474 -0.347,1.336 -0.34,1.878 0.007,0.538 0.305,0.971 0.375,1.612 0.061,0.549 -0.137,1.246 -0.177,1.856 -0.021,0.306 0.064,0.624 0.059,0.956 -0.008,0.533 -0.066,0.801 0.008,1.442 0.086,0.743 -0.074,1.462 -0.171,2.152 0.342,1.705 0.531,3.008 1.09,4.919 0.258,0.881 0.721,2.367 1.18,3.346 0.886,1.895 1.64,3.964 2.6,5.945 0.319,0.656 0.825,1.196 1.139,1.852 0.182,0.381 0.211,0.828 0.395,1.215 1.617,3.398 3.877,6.233 5.565,9.731 1.399,2.859 2.88,5.418 4.745,8.545 0.842,1.415 1.568,2.917 2.434,4.086 0.66,0.891 1.632,2.413 2.334,3.916 0.278,0.596 0.269,1.073 1.005,1.102 0.758,0.948 1.326,2.018 2.119,2.824 0.2,0.202 0.51,0.303 0.733,0.498 0.26,0.228 0.383,0.57 0.638,0.778 0.541,0.441 1.432,0.832 2.035,1.659 0.16,0.22 0.229,0.451 0.406,0.682 0.414,0.539 1.191,1.866 1.81,2.013 C -0.241,0.085 -0.126,0.061 0,0" /></g></g></g><g
|
||||
id="g54"
|
||||
transform="translate(-21.47687,0)" /><g
|
||||
id="g60"
|
||||
transform="translate(-21.47687,0)"><g
|
||||
style="opacity:0.69999701"
|
||||
id="g62"
|
||||
clip-path="url(#clipPath56)"><g
|
||||
id="g64"
|
||||
transform="translate(459.8965,349.4487)"><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path66"
|
||||
style="fill:#da687d;fill-opacity:1;fill-rule:evenodd;stroke:none"
|
||||
d="m 0,0 c 0.688,-1.936 0.765,-4.106 0.935,-6.266 -0.019,-2.14 -0.168,-4.579 -0.715,-6.943 0.098,-0.492 -0.155,-1.108 -0.109,-1.623 -0.519,-0.752 -0.295,-1.25 -0.438,-1.876 0.718,-0.835 1.666,-1.609 1.155,-2.836 -0.37,-0.846 -1.118,-1.037 -1.845,-1.479 -0.64,-1.905 -1.226,-4.263 -1.846,-6.305 -0.187,-0.635 -0.212,-1.395 -0.447,-1.977 -0.547,-1.362 -1.111,-2.656 -1.597,-4.101 -0.416,-1.238 -0.356,-3.498 -1.652,-3.689 -0.61,-1.355 -0.978,-2.373 -1.674,-3.651 -0.35,-0.217 -0.512,0.119 -0.801,-0.013 -0.392,-0.456 -0.442,-1.063 -0.795,-1.445 -0.269,-0.298 -0.585,-0.226 -0.785,-0.514 -0.449,-0.651 -0.386,-1.58 -0.723,-2.425 -0.282,-0.266 -0.546,-0.564 -0.784,-0.888 -0.119,-0.162 -0.233,-0.33 -0.337,-0.505 l -0.153,-0.266 -0.072,-0.136 -0.034,-0.069 -0.003,-0.004 0,-10e-4 c 0.099,0.238 0.028,0.066 0.05,0.119 l -10e-4,-0.002 -0.001,-10e-4 -0.004,-0.01 -0.008,-0.019 -0.016,-0.037 c -0.697,-1.635 -0.851,-3.63 -1.895,-4.955 -0.335,-0.421 -0.872,-0.577 -1.142,-0.971 -0.259,-0.375 -0.491,-0.912 -0.746,-1.347 -0.366,-0.625 -0.722,-1.432 -1.046,-2.164 -1.085,-2.456 -2.571,-5.274 -3.572,-8.03 -0.188,-0.523 -0.205,-1.106 -0.385,-1.617 -0.422,-1.173 -1.022,-2.273 -1.394,-3.342 -0.626,-1.753 -1.474,-4.727 -3.01,-6.377 -0.182,-0.2 -0.567,-0.415 -0.732,-0.65 -0.22,-0.315 -0.191,-0.786 -0.42,-1.137 -0.106,-0.164 -0.475,-0.275 -0.642,-0.48 -0.254,-0.313 -0.383,-0.69 -0.594,-0.926 -0.503,-0.581 -1.23,-0.865 -1.714,-1.438 -0.365,-0.435 -0.562,-1.029 -0.958,-1.568 -0.426,-0.578 -0.991,-1.104 -1.428,-1.683 -0.65,-0.928 -1.251,-1.786 -1.828,-2.608 -0.592,-0.813 -1.215,-1.514 -2.047,-1.884 -0.495,-0.219 -1.042,-0.12 -1.539,-0.256 -0.353,0.473 0.086,1.071 0.061,1.524 -0.018,0.288 -0.25,0.504 -0.28,0.766 -0.07,0.615 -0.141,1.712 -0.035,2.387 0.099,0.676 0.548,1.191 0.712,2.005 0.125,0.708 -0.034,1.591 -0.025,2.359 0.004,0.387 0.13,0.791 0.153,1.206 0.038,0.668 -0.008,0.999 0.13,1.795 0.163,0.922 -0.034,1.854 -0.121,2.709 0.426,2.191 0.686,3.806 1.265,6.362 0.273,1.176 0.786,3.104 1.265,4.488 0.472,1.315 0.904,2.681 1.347,4.063 0.445,1.4 0.906,2.841 1.424,4.249 0.347,0.939 0.896,1.734 1.274,2.728 0.213,0.565 0.249,1.192 0.465,1.767 0.475,1.25 0.99,2.514 1.541,3.656 0.553,1.123 1.13,2.228 1.711,3.336 l 0.938,1.807 c 0.326,0.58 0.653,1.161 0.981,1.745 0.649,1.172 1.283,2.367 1.886,3.609 1.027,1.966 2.073,3.828 3.188,5.725 1.116,1.844 2.324,3.757 3.629,5.817 1.158,1.853 2.248,3.825 3.357,5.355 0.827,1.167 2.173,3.163 3.042,5.126 0.342,0.78 0.349,1.38 1.197,1.482 0.907,1.274 1.649,2.697 2.452,3.773 0.214,0.276 0.563,0.445 0.808,0.722 0.286,0.323 0.408,0.762 0.693,1.065 0.582,0.653 1.672,1.277 2.21,2.569 0.151,0.332 0.198,0.653 0.368,1.006 0.397,0.822 1.098,2.779 1.78,3.145 C -0.284,0.044 -0.151,0.044 0,0" /></g></g></g><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path70"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 416.68863,327.0015 c 0,0 -8,-30.667 -4.667,-56 0.667,8 4.667,56 4.667,56" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path74"
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 426.18913,347.7256 c -0.61,2.147 -4.597,-59.478 -3.432,-61.636 1.166,-2.159 7.147,48.575 3.432,61.636" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path78"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 235.24913,465.60369 c 0,0 4.667,-26.6198 -38.667,-40.6198 -43.333,-14 -103.0605,-25.98239 -147.0605,-78.64939 -44.0000004,-52.666 -52.0000004,-139.999 -22,-197.333 30,-57.333 103.333,-128.667 235.333,-128.667 132,0 236.85312,101.50582 236.85312,171.50582 0,36.667 -20.1469,28.4918 -27.11433,-5.90828 C 466.30468,154.88286 408.18863,39.0015 262.18863,39.0015 c -146,0 -220.667,88.667 -230,164.667 -9.334,76 11.898969,141.46925 88.56597,180.80225 76.667,39.334 125.32039,23.66435 114.65339,80.99735"
|
||||
sodipodi:nodetypes="cssssssscsc" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path82"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 198.85713,260.335 c 0,0 -8.667,-40.001 -50.667,-59.333 -42,-19.334 -60,-30 -66,-63.334 16,26.666 62.667,32 88.667,58 26,26 28,64.667 28,64.667" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path86"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 210.19013,353.0015 c 0,0 36,-46.667 78.667,-24 42.666,22.667 20.667,75.333 20,78.667 -0.667,3.333 4.666,-58.667 -27.334,-69.334 -32,-10.666 -71.333,14.667 -71.333,14.667" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path90"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 116.18913,74.3359 c 0,0 22.666,-1.334 39.333,17.332 16.667,18.668 7.334,48 34.667,58.668 27.333,10.666 46,4 46,4 0,0 -48.667,-6.668 -52.667,-34.668 -4,-28 -10.666,-40.666 -21.333,-49.332 -10.667,-8.668 -24.667,-10 -24.667,-10 l -21.333,14 z" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path94"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 219.02213,219.502 c 0,0 40.523,6.783 59,48 15.167,33.833 5,63 5,63 l -20.5,-3 c 0,0 8.5,-24.5 2,-46.5 -6.5,-22 -21.5,-47.5 -45.5,-61.5" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path98"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 437.13303,313.1621 c -14.461,-36.13 -35.773,-62.068 -38.265,-60.674 -4.494,2.513 -0.358,34.036 14.104,70.166 14.46,36.13 32.432,63.635 39.104,61.014 6.672,-2.621 -0.483,-34.376 -14.943,-70.506 m 20.999,72.506 c -16.442,8.934 -36.644,-24.449 -53.276,-63.334 -16.633,-38.885 -18.542,-70.229 -5.759,-75.836 17.092,-7.496 33.127,22.285 49.759,61.17 16.632,38.885 24,70 9.276,78" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path102"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 159.52163,189.668 c 0,0 10.331,-31.037 62,-24.666 48.667,6 69.59,24.744 99.333,43.334 21.334,13.332 20,7.332 22.667,6.666 2.667,-0.666 14.667,-8 27.333,-6.666 0.667,-6.668 -5.999,-1.334 -8.666,-7.334 -1.333,-4 10.12,-22.824 26.666,-20 27.334,4.666 19.667,16 25.001,28.666 5.333,12.666 9,19.334 -17.667,37.334 -20.667,18.666 -32,13.999 -42,13.999 -10,0 -36,-13.999 -54,-10.666 -18,3.333 -29.334,10 -29.334,10 l -11.999,-13.333 c 0,0 21.999,-16.666 47.333,-10.666 25.333,6 44.001,25.332 66.001,15.332 22,-10 26.282,-16.701 32.999,-21.666 7.667,-5.668 8.333,-11.666 3,-17 -5.334,-5.334 0.001,-9.334 -3.332,-15.334 -3.334,-6 -20,-8.666 -20,-8.666 0,0 18.273,23.477 -4,25.332 -16,1.334 -26,22.668 -48.667,11.334 -32.55,-16.277 -78.668,-44 -110.668,-47.332 -31.193,-3.248 -42.667,6.666 -50.667,25.332 -9.333,-8 -11.333,-14 -11.333,-14" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path106"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 274.18863,183.002 c 0,0 22.667,-12 16,-38 -6.667,-26 -36.667,-44 -56,-52.668 -19.333,-8.666 -33.743,-20.127 -19.333,-27.332 12,-6 18.667,9.334 36,12 17.333,2.666 32.667,-4 34,-14 -7.334,4 -12.667,4 -12.667,4 0,0 6,-4 6.667,-10.668 0.666,-6.666 -0.667,-3.332 -4.667,-3.332 -10,0 -11.333,8.666 -20,7.332 -22,-2 -23.333,-11.334 -35.333,-12.666 -12,-1.334 -32,5.334 -29.334,20.666 2.667,15.334 23.334,26 42.667,34 19.333,8 48.667,33.334 44.667,56 -4,22.668 -21.334,18 -21.334,18 l 18.667,6.668 z" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path110"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 331.02213,371.7515 c 0,0 9.5,-4.75 15.5,-28.75 4,-8.667 9.333,-15.667 14,-17.667 4.667,-2 -2,-4 -5.333,-3.333 -3.334,0.667 -10.334,3.667 -15,-0.333 -4.667,-4 -16,-14.667 -32,-12 -16,2.666 -29.667,12.833 -29.667,12.833 0,0 6,-26.5 41.667,-24.833 24.721,1.155 19.333,14 36,16.666 16.666,2.667 14.893,11.089 11.333,18 -5.667,11 -23.333,13.667 -25.333,45.834 -2,3.333 -14.5,-0.417 -11.167,-6.417" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path114"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 388.01383,204.4707 c 1.506,-1.477 -11.825,-31.469 -11.825,-31.469 0,0 -2.667,-7.334 -9.814,-4.75 -7.311,2.645 -5.413,7.948 -5.413,7.948 l 17.026,30.837 c 0,0 9.353,-1.906 10.026,-2.566" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path118"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 406.74623,247.168 c -0.667,-2 -3.333,-10 -3.333,-10 l -10.891,8.334 2.891,6.332 11.333,-4.666 z" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path122"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 284.85563,189.002 c -2,-7.334 23.333,-50.002 40.667,-47.334 17.333,2.666 19.999,-2.668 14.666,-6 -5.333,-3.334 -14.666,-4.668 -13.333,-9.334 1.333,-4.666 5,-9.334 -3.667,-8 -8.666,1.334 -26.333,10.668 -37,28.668 -3.333,-10.668 -4.666,-14 -4.666,-14 0,0 34,-35.334 68.666,-20.668 -6,4.668 -22.666,3.334 -8.666,11.334 14,8 24.666,10.666 31.333,-2 3.333,0.666 3.333,30 -40.667,28 -15.333,2 -36,32 -36,47.334 -4,-4 -9.333,-0.666 -11.333,-8" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path126"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 420.44553,336.5015 c 0,0 -8.75,-26.286 -5.104,-48 0.729,6.857 5.104,48 5.104,48" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path130"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 429.40543,352.0503 c -0.444,1.66 -4.07,-45.761 -3.203,-47.435 0.868,-1.673 5.909,37.339 3.203,47.435" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path134"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 312.85513,378.335 c 0,0 37.667,3.333 31,18.333 -20.105,45.239 -58.333,71.667 -129,69 40,16 74.00021,14.00025 106.667,-14 16.33311,-13.99988 23.89324,-31.04069 29.74979,-44.08296 9.34044,-20.80074 6.58914,-22.74696 -3.74979,-28.58304 -12.56847,-7.0946 -34.191,-2.57 -34.667,-0.667"
|
||||
sodipodi:nodetypes="cccsssc" /><path
|
||||
inkscape:connector-curvature="0"
|
||||
id="path138"
|
||||
style="fill:#2d2b2c;fill-opacity:1;fill-rule:nonzero;stroke:none"
|
||||
d="m 316.7084,372.58242 c 0,0 10.36415,-7.13802 18.50215,-1.32602 3.74086,3.84884 6.23323,5.95026 -4.37137,5.51213 l -12.90479,0.52875 c -8.94116,1.82452 -8.7647,-0.93753 -1.22599,-4.71486 z"
|
||||
sodipodi:nodetypes="ccccc" /></g></svg>
|
Before Width: | Height: | Size: 17 KiB |
File diff suppressed because it is too large
Load Diff
@ -1,172 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Real-world Uses</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#">Real-world uses</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2>CodeMirror real-world uses</h2>
|
||||
|
||||
<p>Create a <a href="https://github.com/codemirror/codemirror">pull
|
||||
request</a> or <a href="mailto:marijnh@gmail.com">email me</a> if
|
||||
you'd like your project to be added to this list.</p>
|
||||
|
||||
<ul>
|
||||
<li><a href="http://brackets.io">Adobe Brackets</a> (code editor)</li>
|
||||
<li><a href="http://amber-lang.net/">Amber</a> (JavaScript-based Smalltalk system)</li>
|
||||
<li><a href="http://apachegui.ca/">Apache GUI</a></li>
|
||||
<li><a href="http://apeye.org/">APEye</a> (tool for testing & documenting APIs)</li>
|
||||
<li><a href="https://chrome.google.com/webstore/detail/better-text-viewer/lcaidopdffhfemoefoaadecppnjdknkc">Better Text Viewer</a> (plain text reader app for Chrome)</li>
|
||||
<li><a href="http://blog.bitbucket.org/2013/05/14/edit-your-code-in-the-cloud-with-bitbucket/">Bitbucket</a> (code hosting)</li>
|
||||
<li><a href="http://buzz.blogger.com/2013/04/improvements-to-blogger-template-html.html">Blogger's template editor</a></li>
|
||||
<li><a href="http://bluegriffon.org/">BlueGriffon</a> (HTML editor)</li>
|
||||
<li><a href="http://cargocollective.com/">Cargo Collective</a> (creative publishing platform)</li>
|
||||
<li><a href="https://developers.google.com/chrome-developer-tools/">Chrome DevTools</a></li>
|
||||
<li><a href="http://clickhelp.co/">ClickHelp</a> (technical writing tool)</li>
|
||||
<li><a href="http://codeworld.info/">CodeWorld</a> (Haskell playground)</li>
|
||||
<li><a href="http://complete-ly.appspot.com/playground/code.playground.html">Complete.ly playground</a></li>
|
||||
<li><a href="https://codeanywhere.com/">Codeanywhere</a> (multi-platform cloud editor)</li>
|
||||
<li><a href="http://drupal.org/project/cpn">Code per Node</a> (Drupal module)</li>
|
||||
<li><a href="http://www.codebugapp.com/">Codebug</a> (PHP Xdebug front-end)</li>
|
||||
<li><a href="https://github.com/angelozerr/CodeMirror-Eclipse">CodeMirror Eclipse</a> (embed CM in Eclipse)</li>
|
||||
<li><a href="http://emmet.io/blog/codemirror-movie/">CodeMirror movie</a> (scripted editing demos)</li>
|
||||
<li><a href="http://code.google.com/p/codemirror2-gwt/">CodeMirror2-GWT</a> (Google Web Toolkit wrapper)</li>
|
||||
<li><a href="http://www.crunchzilla.com/code-monster">Code Monster</a> & <a href="http://www.crunchzilla.com/code-maven">Code Maven</a> (learning environment)</li>
|
||||
<li><a href="http://codepen.io">Codepen</a> (gallery of animations)</li>
|
||||
<li><a href="https://coderpad.io/">Coderpad</a> (interviewing tool)</li>
|
||||
<li><a href="http://sasstwo.codeschool.com/levels/1/challenges/1">Code School</a> (online tech learning environment)</li>
|
||||
<li><a href="http://code-snippets.bungeshea.com/">Code Snippets</a> (WordPress snippet management plugin)</li>
|
||||
<li><a href="http://antonmi.github.io/code_together/">Code together</a> (collaborative editing)</li>
|
||||
<li><a href="http://codev.it/">Codev</a> (collaborative IDE)</li>
|
||||
<li><a href="http://www.codezample.com">CodeZample</a> (code snippet sharing)</li>
|
||||
<li><a href="http://codio.com">Codio</a> (Web IDE)</li>
|
||||
<li><a href="http://ot.substance.io/demo/">Collaborative CodeMirror demo</a> (CodeMirror + operational transforms)</li>
|
||||
<li><a href="http://www.communitycodecamp.com/">Community Code Camp</a> (code snippet sharing)</li>
|
||||
<li><a href="http://www.compilejava.net/">compilejava.net</a> (online Java sandbox)</li>
|
||||
<li><a href="http://www.ckwnc.com/">CKWNC</a> (UML editor)</li>
|
||||
<li><a href="http://www.crossui.com/">CrossUI</a> (cross-platform UI builder)</li>
|
||||
<li><a href="http://rsnous.com/cruncher/">Cruncher</a> (notepad with calculation features)</li>
|
||||
<li><a href="http://www.crudzilla.com/">Crudzilla</a> (self-hosted web IDE)</li>
|
||||
<li><a href="http://cssdeck.com/">CSSDeck</a> (CSS showcase)</li>
|
||||
<li><a href="http://ireneros.com/deck/deck.js-codemirror/introduction/#textarea-code">Deck.js integration</a> (slides with editors)</li>
|
||||
<li><a href="http://www.dbninja.com">DbNinja</a> (MySQL access interface)</li>
|
||||
<li><a href="https://chat.echoplex.us/">Echoplexus</a> (chat and collaborative coding)</li>
|
||||
<li><a href="http://www.ecsspert.com/">eCSSpert</a> (CSS demos and experiments)</li>
|
||||
<li><a href="http://elm-lang.org/Examples.elm">Elm language examples</a></li>
|
||||
<li><a href="http://eloquentjavascript.net/chapter1.html">Eloquent JavaScript</a> (book)</li>
|
||||
<li><a href="http://emmet.io">Emmet</a> (fast XML editing)</li>
|
||||
<li><a href="https://github.com/espruino/EspruinoWebIDE">Espruino Web IDE</a> (Chrome App for writing code on Espruino devices)</li>
|
||||
<li><a href="http://www.fastfig.com/">Fastfig</a> (online computation/math tool)</li>
|
||||
<li><a href="https://metacpan.org/module/Farabi">Farabi</a> (modern Perl IDE)</li>
|
||||
<li><a href="http://blog.pamelafox.org/2012/02/interactive-html5-slides-with-fathomjs.html">FathomJS integration</a> (slides with editors, again)</li>
|
||||
<li><a href="https://phantomus.com/">Phantomus</a> (blogging platform)</li>
|
||||
<li><a href="http://fiddlesalad.com/">Fiddle Salad</a> (web development environment)</li>
|
||||
<li><a href="https://github.com/simogeo/Filemanager">Filemanager</a></li>
|
||||
<li><a href="https://hacks.mozilla.org/2013/11/firefox-developer-tools-episode-27-edit-as-html-codemirror-more/">Firefox Developer Tools</a></li>
|
||||
<li><a href="http://www.firepad.io">Firepad</a> (collaborative text editor)</li>
|
||||
<li><a href="https://code.google.com/p/gerrit/">Gerrit</a>'s diff view</li>
|
||||
<li><a href="https://github.com/maks/git-crx">Git Crx</a> (Chrome App for browsing local git repos)</li>
|
||||
<li><a href="http://tour.golang.org">Go language tour</a></li>
|
||||
<li><a href="https://github.com/github/android">GitHub's Android app</a></li>
|
||||
<li><a href="https://script.google.com/">Google Apps Script</a></li>
|
||||
<li><a href="http://web.uvic.ca/~siefkenj/graphit/graphit.html">Graphit</a> (function graphing)</li>
|
||||
<li><a href="http://www.handcraft.com/">Handcraft</a> (HTML prototyping)</li>
|
||||
<li><a href="http://hawkee.com/">Hawkee</a></li>
|
||||
<li><a href="http://try.haxe.org">Haxe</a> (Haxe Playground) </li>
|
||||
<li><a href="http://haxpad.com/">HaxPad</a> (editor for Win RT)</li>
|
||||
<li><a href="http://megafonweblab.github.com/histone-javascript/">Histone template engine playground</a></li>
|
||||
<li><a href="http://icecoder.net">ICEcoder</a> (web IDE)</li>
|
||||
<li><a href="http://ipython.org/">IPython</a> (interactive computing shell)</li>
|
||||
<li><a href="http://i-mos.org/imos/">i-MOS</a> (modeling and simulation platform)</li>
|
||||
<li><a href="http://www.janvas.com/">Janvas</a> (vector graphics editor)</li>
|
||||
<li><a href="http://extensions.joomla.org/extensions/edition/editors/8723">Joomla plugin</a></li>
|
||||
<li><a href="http://jqfundamentals.com/">jQuery fundamentals</a> (interactive tutorial)</li>
|
||||
<li><a href="http://jsbin.com">jsbin.com</a> (JS playground)</li>
|
||||
<li><a href="http://tool.jser.com/preprocessor">JSER preprocessor</a></li>
|
||||
<li><a href="https://github.com/kucherenko/jscpd">jscpd</a> (code duplication detector)</li>
|
||||
<li><a href="http://jsfiddle.com">jsfiddle.com</a> (another JS playground)</li>
|
||||
<li><a href="http://www.jshint.com/">JSHint</a> (JS linter)</li>
|
||||
<li><a href="http://jumpseller.com/">Jumpseller</a> (online store builder)</li>
|
||||
<li><a href="http://kl1p.com/cmtest/1">kl1p</a> (paste service)</li>
|
||||
<li><a href="http://kodtest.com/">Kodtest</a> (HTML/JS/CSS playground)</li>
|
||||
<li><a href="https://laborate.io/">Laborate</a> (collaborative coding)</li>
|
||||
<li><a href="http://lighttable.com/">Light Table</a> (experimental IDE)</li>
|
||||
<li><a href="http://liveweave.com/">Liveweave</a> (HTML/CSS/JS scratchpad)</li>
|
||||
<li><a href="http://marklighteditor.com/">Marklight editor</a> (lightweight markup editor)</li>
|
||||
<li><a href="http://www.mergely.com/">Mergely</a> (interactive diffing)</li>
|
||||
<li><a href="http://www.iunbug.com/mihtool">MIHTool</a> (iOS web-app debugging tool)</li>
|
||||
<li><a href="http://mongo-mapreduce-webbrowser.opensagres.cloudbees.net/">Mongo MapReduce WebBrowser</a></li>
|
||||
<li><a href="http://montagestudio.com/">Montage Studio</a> (web app creator suite)</li>
|
||||
<li><a href="http://mvcplayground.apphb.com/">MVC Playground</a></li>
|
||||
<li><a href="https://www.my2ndgeneration.com/">My2ndGeneration</a> (social coding)</li>
|
||||
<li><a href="http://www.navigatecms.com">Navigate CMS</a></li>
|
||||
<li><a href="https://github.com/soliton4/nodeMirror">nodeMirror</a> (IDE project)</li>
|
||||
<li><a href="https://notex.ch">NoTex</a> (rST authoring)</li>
|
||||
<li><a href="http://oakoutliner.com">Oak</a> (online outliner)</li>
|
||||
<li><a href="http://clrhome.org/asm/">ORG</a> (z80 assembly IDE)</li>
|
||||
<li><a href="https://github.com/mamacdon/orion-codemirror">Orion-CodeMirror integration</a> (running CodeMirror modes in Orion)</li>
|
||||
<li><a href="http://paperjs.org/">Paper.js</a> (graphics scripting)</li>
|
||||
<li><a href="http://prinbit.com/">PrinBit</a> (collaborative coding tool)</li>
|
||||
<li><a href="http://prose.io/">Prose.io</a> (github content editor)</li>
|
||||
<li><a href="https://pypi.python.org/pypi/PubliForge/">PubliForge</a> (online publishing system)</li>
|
||||
<li><a href="http://www.puzzlescript.net/">Puzzlescript</a> (puzzle game engine)</li>
|
||||
<li><a href="http://ql.io/">ql.io</a> (http API query helper)</li>
|
||||
<li><a href="http://qyapp.com">QiYun web app platform</a></li>
|
||||
<li><a href="http://ariya.ofilabs.com/2011/09/hybrid-webnative-desktop-codemirror.html">Qt+Webkit integration</a> (building a desktop CodeMirror app)</li>
|
||||
<li><a href="http://www.quivive-file-manager.com">Quivive File Manager</a></li>
|
||||
<li><a href="http://rascalmicro.com/docs/basic-tutorial-getting-started.html">Rascal</a> (tiny computer)</li>
|
||||
<li><a href="https://www.realtime.io/">RealTime.io</a> (Internet-of-Things infrastructure)</li>
|
||||
<li><a href="https://cloud.sagemath.com/">SageMathCloud</a> (interactive mathematical software environment)</li>
|
||||
<li><a href="https://chrome.google.com/webstore/detail/servephp/mnpikomdchjhkhbhmbboehfdjkobbfpo">ServePHP</a> (PHP code testing in Chrome dev tools)</li>
|
||||
<li><a href="https://www.shadertoy.com/">Shadertoy</a> (shader sharing)</li>
|
||||
<li><a href="http://www.sketchpatch.net/labs/livecodelabIntro.html">sketchPatch Livecodelab</a></li>
|
||||
<li><a href="http://www.skulpt.org/">Skulpt</a> (in-browser Python environment)</li>
|
||||
<li><a href="http://snaptomato.appspot.com/editor.html">Snap Tomato</a> (HTML editing/testing page)</li>
|
||||
<li><a href="http://snippets.pro/">Snippets.pro</a> (code snippet sharing)</li>
|
||||
<li><a href="http://www.solidshops.com/">SolidShops</a> (hosted e-commerce platform)</li>
|
||||
<li><a href="http://sqlfiddle.com">SQLFiddle</a> (SQL playground)</li>
|
||||
<li><a href="http://www.subte.org/page/programar-ta-te-ti-online/">SubTe</a> (AI bot programming environment)</li>
|
||||
<li><a href="http://xuanji.appspot.com/isicp/">Structure and Interpretation of Computer Programs</a>, Interactive Version</li>
|
||||
<li><a href="http://syframework.alwaysdata.net">SyBox</a> (PHP playground)</li>
|
||||
<li><a href="http://www.tagspaces.org/">TagSpaces</a> (personal data manager)</li>
|
||||
<li><a href="https://thefiletree.com">The File Tree</a> (collab editor)</li>
|
||||
<li><a href="http://www.mapbox.com/tilemill/">TileMill</a> (map design tool)</li>
|
||||
<li><a href="http://doc.tiki.org/Syntax+Highlighter">Tiki</a> (wiki CMS groupware)</li>
|
||||
<li><a href="http://www.toolsverse.com/products/data-explorer/">Toolsverse Data Explorer</a> (database management)</li>
|
||||
<li><a href="http://enjalot.com/tributary/2636296/sinwaves.js">Tributary</a> (augmented editing)</li>
|
||||
<li><a href="http://blog.englard.net/post/39608000629/codeintumblr">Tumblr code highlighting shim</a></li>
|
||||
<li><a href="http://turbopy.com/">TurboPY</a> (web publishing framework)</li>
|
||||
<li><a href="http://uicod.com/">uiCod</a> (animation demo gallery and sharing)</li>
|
||||
<li><a href="http://cruise.eecs.uottawa.ca/umpleonline/">UmpleOnline</a> (model-oriented programming tool)</li>
|
||||
<li><a href="https://upsource.jetbrains.com/#idea/view/923f30395f2603cd9f42a32bcafd13b6c28de0ff/plugins/groovy/src/org/jetbrains/plugins/groovy/intentions/style/ReplaceAbstractClassInstanceByMapIntention.java">Upsource</a> (code viewer)</li>
|
||||
<li><a href="https://github.com/mgaitan/waliki">Waliki</a> (wiki engine)</li>
|
||||
<li><a href="http://wamer.net/">Wamer</a> (web application builder)</li>
|
||||
<li><a href="https://github.com/brettz9/webappfind">webappfind</a> (windows file bindings for webapps)</li>
|
||||
<li><a href="http://www.webglacademy.com/">WebGL academy</a> (learning WebGL)</li>
|
||||
<li><a href="http://webglplayground.net/">WebGL playground</a></li>
|
||||
<li><a href="https://www.webkit.org/blog/2518/state-of-web-inspector/#source-code">WebKit Web inspector</a></li>
|
||||
<li><a href="http://www.wescheme.org/">WeScheme</a> (learning tool)</li>
|
||||
<li><a href="https://github.com/b3log/wide">Wide</a> (golang web IDE)</li>
|
||||
<li><a href="http://wordpress.org/extend/plugins/codemirror-for-codeeditor/">WordPress plugin</a></li>
|
||||
<li><a href="https://www.writelatex.com">writeLaTeX</a> (Collaborative LaTeX Editor)</li>
|
||||
<li><a href="http://www.xosystem.org/home/applications_websites/xosystem_website/xoside_EN.php">XOSide</a> (online editor)</li>
|
||||
<li><a href="http://videlibri.sourceforge.net/cgi-bin/xidelcgi">XQuery tester</a></li>
|
||||
<li><a href="http://q42jaap.github.io/xsd2codemirror/">xsd2codemirror</a> (convert XSD to CM XML completion info)</li>
|
||||
</ul>
|
||||
|
||||
</article>
|
||||
|
File diff suppressed because it is too large
Load Diff
@ -1,61 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Reporting Bugs</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#">Reporting bugs</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2>Reporting bugs effectively</h2>
|
||||
|
||||
<div class="left">
|
||||
|
||||
<p>So you found a problem in CodeMirror. By all means, report it! Bug
|
||||
reports from users are the main drive behind improvements to
|
||||
CodeMirror. But first, please read over these points:</p>
|
||||
|
||||
<ol>
|
||||
<li>CodeMirror is maintained by volunteers. They don't owe you
|
||||
anything, so be polite. Reports with an indignant or belligerent
|
||||
tone tend to be moved to the bottom of the pile.</li>
|
||||
|
||||
<li>Include information about <strong>the browser in which the
|
||||
problem occurred</strong>. Even if you tested several browsers, and
|
||||
the problem occurred in all of them, mention this fact in the bug
|
||||
report. Also include browser version numbers and the operating
|
||||
system that you're on.</li>
|
||||
|
||||
<li>Mention which release of CodeMirror you're using. Preferably,
|
||||
try also with the current development snapshot, to ensure the
|
||||
problem has not already been fixed.</li>
|
||||
|
||||
<li>Mention very precisely what went wrong. "X is broken" is not a
|
||||
good bug report. What did you expect to happen? What happened
|
||||
instead? Describe the exact steps a maintainer has to take to make
|
||||
the problem occur. We can not fix something that we can not
|
||||
observe.</li>
|
||||
|
||||
<li>If the problem can not be reproduced in any of the demos
|
||||
included in the CodeMirror distribution, please provide an HTML
|
||||
document that demonstrates the problem. The best way to do this is
|
||||
to go to <a href="http://jsbin.com/ihunin/1/edit">jsbin.com</a>, enter
|
||||
it there, press save, and include the resulting link in your bug
|
||||
report.</li>
|
||||
</ol>
|
||||
|
||||
</div>
|
||||
|
||||
</article>
|
@ -1,96 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Version 2.2 upgrade guide</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#">2.2 upgrade guide</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2>Upgrading to v2.2</h2>
|
||||
|
||||
<p>There are a few things in the 2.2 release that require some care
|
||||
when upgrading.</p>
|
||||
|
||||
<h3>No more default.css</h3>
|
||||
|
||||
<p>The default theme is now included
|
||||
in <a href="../lib/codemirror.css"><code>codemirror.css</code></a>, so
|
||||
you do not have to included it separately anymore. (It was tiny, so
|
||||
even if you're not using it, the extra data overhead is negligible.)
|
||||
|
||||
<h3>Different key customization</h3>
|
||||
|
||||
<p>CodeMirror has moved to a system
|
||||
where <a href="manual.html#option_keyMap">keymaps</a> are used to
|
||||
bind behavior to keys. This means <a href="../demo/emacs.html">custom
|
||||
bindings</a> are now possible.</p>
|
||||
|
||||
<p>Three options that influenced key
|
||||
behavior, <code>tabMode</code>, <code>enterMode</code>,
|
||||
and <code>smartHome</code>, are no longer supported. Instead, you can
|
||||
provide custom bindings to influence the way these keys act. This is
|
||||
done through the
|
||||
new <a href="manual.html#option_extraKeys"><code>extraKeys</code></a>
|
||||
option, which can hold an object mapping key names to functionality. A
|
||||
simple example would be:</p>
|
||||
|
||||
<pre> extraKeys: {
|
||||
"Ctrl-S": function(instance) { saveText(instance.getValue()); },
|
||||
"Ctrl-/": "undo"
|
||||
}</pre>
|
||||
|
||||
<p>Keys can be mapped either to functions, which will be given the
|
||||
editor instance as argument, or to strings, which are mapped through
|
||||
functions through the <code>CodeMirror.commands</code> table, which
|
||||
contains all the built-in editing commands, and can be inspected and
|
||||
extended by external code.</p>
|
||||
|
||||
<p>By default, the <code>Home</code> key is bound to
|
||||
the <code>"goLineStartSmart"</code> command, which moves the cursor to
|
||||
the first non-whitespace character on the line. You can set do this to
|
||||
make it always go to the very start instead:</p>
|
||||
|
||||
<pre> extraKeys: {"Home": "goLineStart"}</pre>
|
||||
|
||||
<p>Similarly, <code>Enter</code> is bound
|
||||
to <code>"newlineAndIndent"</code> by default. You can bind it to
|
||||
something else to get different behavior. To disable special handling
|
||||
completely and only get a newline character inserted, you can bind it
|
||||
to <code>false</code>:</p>
|
||||
|
||||
<pre> extraKeys: {"Enter": false}</pre>
|
||||
|
||||
<p>The same works for <code>Tab</code>. If you don't want CodeMirror
|
||||
to handle it, bind it to <code>false</code>. The default behaviour is
|
||||
to indent the current line more (<code>"indentMore"</code> command),
|
||||
and indent it less when shift is held (<code>"indentLess"</code>).
|
||||
There are also <code>"indentAuto"</code> (smart indent)
|
||||
and <code>"insertTab"</code> commands provided for alternate
|
||||
behaviors. Or you can write your own handler function to do something
|
||||
different altogether.</p>
|
||||
|
||||
<h3>Tabs</h3>
|
||||
|
||||
<p>Handling of tabs changed completely. The display width of tabs can
|
||||
now be set with the <code>tabSize</code> option, and tabs can
|
||||
be <a href="../demo/visibletabs.html">styled</a> by setting CSS rules
|
||||
for the <code>cm-tab</code> class.</p>
|
||||
|
||||
<p>The default width for tabs is now 4, as opposed to the 8 that is
|
||||
hard-wired into browsers. If you are relying on 8-space tabs, make
|
||||
sure you explicitly set <code>tabSize: 8</code> in your options.</p>
|
||||
|
||||
</article>
|
@ -1,230 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Version 3 upgrade guide</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
<script src="../lib/codemirror.js"></script>
|
||||
<link rel="stylesheet" href="../lib/codemirror.css">
|
||||
<script src="../addon/runmode/runmode.js"></script>
|
||||
<script src="../addon/runmode/colorize.js"></script>
|
||||
<script src="../mode/javascript/javascript.js"></script>
|
||||
<script src="../mode/xml/xml.js"></script>
|
||||
<script src="../mode/css/css.js"></script>
|
||||
<script src="../mode/htmlmixed/htmlmixed.js"></script>
|
||||
<script src="activebookmark.js"></script>
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#upgrade">Upgrade guide</a>
|
||||
<li><a href="#dom">DOM structure</a></li>
|
||||
<li><a href="#gutters">Gutter model</a></li>
|
||||
<li><a href="#events">Event handling</a></li>
|
||||
<li><a href="#marktext">markText method arguments</a></li>
|
||||
<li><a href="#folding">Line folding</a></li>
|
||||
<li><a href="#lineclass">Line CSS classes</a></li>
|
||||
<li><a href="#positions">Position properties</a></li>
|
||||
<li><a href="#matchbrackets">Bracket matching</a></li>
|
||||
<li><a href="#modes">Mode management</a></li>
|
||||
<li><a href="#new">New features</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2 id=upgrade>Upgrading to version 3</h2>
|
||||
|
||||
<p>Version 3 does not depart too much from 2.x API, and sites that use
|
||||
CodeMirror in a very simple way might be able to upgrade without
|
||||
trouble. But it does introduce a number of incompatibilities. Please
|
||||
at least skim this text before upgrading.</p>
|
||||
|
||||
<p>Note that <strong>version 3 drops full support for Internet
|
||||
Explorer 7</strong>. The editor will mostly work on that browser, but
|
||||
it'll be significantly glitchy.</p>
|
||||
|
||||
<section id=dom>
|
||||
<h2>DOM structure</h2>
|
||||
|
||||
<p>This one is the most likely to cause problems. The internal
|
||||
structure of the editor has changed quite a lot, mostly to implement a
|
||||
new scrolling model.</p>
|
||||
|
||||
<p>Editor height is now set on the outer wrapper element (CSS
|
||||
class <code>CodeMirror</code>), not on the scroller element
|
||||
(<code>CodeMirror-scroll</code>).</p>
|
||||
|
||||
<p>Other nodes were moved, dropped, and added. If you have any code
|
||||
that makes assumptions about the internal DOM structure of the editor,
|
||||
you'll have to re-test it and probably update it to work with v3.</p>
|
||||
|
||||
<p>See the <a href="manual.html#styling">styling section</a> of the
|
||||
manual for more information.</p>
|
||||
</section>
|
||||
<section id=gutters>
|
||||
<h2>Gutter model</h2>
|
||||
|
||||
<p>In CodeMirror 2.x, there was a single gutter, and line markers
|
||||
created with <code>setMarker</code> would have to somehow coexist with
|
||||
the line numbers (if present). Version 3 allows you to specify an
|
||||
array of gutters, <a href="manual.html#option_gutters">by class
|
||||
name</a>,
|
||||
use <a href="manual.html#setGutterMarker"><code>setGutterMarker</code></a>
|
||||
to add or remove markers in individual gutters, and clear whole
|
||||
gutters
|
||||
with <a href="manual.html#clearGutter"><code>clearGutter</code></a>.
|
||||
Gutter markers are now specified as DOM nodes, rather than HTML
|
||||
snippets.</p>
|
||||
|
||||
<p>The gutters no longer horizontally scrolls along with the content.
|
||||
The <code>fixedGutter</code> option was removed (since it is now the
|
||||
only behavior).</p>
|
||||
|
||||
<pre data-lang="text/html">
|
||||
<style>
|
||||
/* Define a gutter style */
|
||||
.note-gutter { width: 3em; background: cyan; }
|
||||
</style>
|
||||
<script>
|
||||
// Create an instance with two gutters -- line numbers and notes
|
||||
var cm = new CodeMirror(document.body, {
|
||||
gutters: ["note-gutter", "CodeMirror-linenumbers"],
|
||||
lineNumbers: true
|
||||
});
|
||||
// Add a note to line 0
|
||||
cm.setGutterMarker(0, "note-gutter", document.createTextNode("hi"));
|
||||
</script>
|
||||
</pre>
|
||||
</section>
|
||||
<section id=events>
|
||||
<h2>Event handling</h2>
|
||||
|
||||
<p>Most of the <code>onXYZ</code> options have been removed. The same
|
||||
effect is now obtained by calling
|
||||
the <a href="manual.html#on"><code>on</code></a> method with a string
|
||||
identifying the event type. Multiple handlers can now be registered
|
||||
(and individually unregistered) for an event, and objects such as line
|
||||
handlers now also expose events. See <a href="manual.html#events">the
|
||||
full list here</a>.</p>
|
||||
|
||||
<p>(The <code>onKeyEvent</code> and <code>onDragEvent</code> options,
|
||||
which act more as hooks than as event handlers, are still there in
|
||||
their old form.)</p>
|
||||
|
||||
<pre data-lang="javascript">
|
||||
cm.on("change", function(cm, change) {
|
||||
console.log("something changed! (" + change.origin + ")");
|
||||
});
|
||||
</pre>
|
||||
</section>
|
||||
<section id=marktext>
|
||||
<h2>markText method arguments</h2>
|
||||
|
||||
<p>The <a href="manual.html#markText"><code>markText</code></a> method
|
||||
(which has gained some interesting new features, such as creating
|
||||
atomic and read-only spans, or replacing spans with widgets) no longer
|
||||
takes the CSS class name as a separate argument, but makes it an
|
||||
optional field in the options object instead.</p>
|
||||
|
||||
<pre data-lang="javascript">
|
||||
// Style first ten lines, and forbid the cursor from entering them
|
||||
cm.markText({line: 0, ch: 0}, {line: 10, ch: 0}, {
|
||||
className: "magic-text",
|
||||
inclusiveLeft: true,
|
||||
atomic: true
|
||||
});
|
||||
</pre>
|
||||
</section>
|
||||
<section id=folding>
|
||||
<h2>Line folding</h2>
|
||||
|
||||
<p>The interface for hiding lines has been
|
||||
removed. <a href="manual.html#markText"><code>markText</code></a> can
|
||||
now be used to do the same in a more flexible and powerful way.</p>
|
||||
|
||||
<p>The <a href="../demo/folding.html">folding script</a> has been
|
||||
updated to use the new interface, and should now be more robust.</p>
|
||||
|
||||
<pre data-lang="javascript">
|
||||
// Fold a range, replacing it with the text "??"
|
||||
var range = cm.markText({line: 4, ch: 2}, {line: 8, ch: 1}, {
|
||||
replacedWith: document.createTextNode("??"),
|
||||
// Auto-unfold when cursor moves into the range
|
||||
clearOnEnter: true
|
||||
});
|
||||
// Get notified when auto-unfolding
|
||||
CodeMirror.on(range, "clear", function() {
|
||||
console.log("boom");
|
||||
});
|
||||
</pre>
|
||||
</section>
|
||||
<section id=lineclass>
|
||||
<h2>Line CSS classes</h2>
|
||||
|
||||
<p>The <code>setLineClass</code> method has been replaced
|
||||
by <a href="manual.html#addLineClass"><code>addLineClass</code></a>
|
||||
and <a href="manual.html#removeLineClass"><code>removeLineClass</code></a>,
|
||||
which allow more modular control over the classes attached to a line.</p>
|
||||
|
||||
<pre data-lang="javascript">
|
||||
var marked = cm.addLineClass(10, "background", "highlighted-line");
|
||||
setTimeout(function() {
|
||||
cm.removeLineClass(marked, "background", "highlighted-line");
|
||||
});
|
||||
</pre>
|
||||
</section>
|
||||
<section id=positions>
|
||||
<h2>Position properties</h2>
|
||||
|
||||
<p>All methods that take or return objects that represent screen
|
||||
positions now use <code>{left, top, bottom, right}</code> properties
|
||||
(not always all of them) instead of the <code>{x, y, yBot}</code> used
|
||||
by some methods in v2.x.</p>
|
||||
|
||||
<p>Affected methods
|
||||
are <a href="manual.html#cursorCoords"><code>cursorCoords</code></a>, <a href="manual.html#charCoords"><code>charCoords</code></a>, <a href="manual.html#coordsChar"><code>coordsChar</code></a>,
|
||||
and <a href="manual.html#getScrollInfo"><code>getScrollInfo</code></a>.</p>
|
||||
</section>
|
||||
<section id=matchbrackets>
|
||||
<h2>Bracket matching no longer in core</h2>
|
||||
|
||||
<p>The <a href="manual.html#addon_matchbrackets"><code>matchBrackets</code></a>
|
||||
option is no longer defined in the core editor.
|
||||
Load <code>addon/edit/matchbrackets.js</code> to enable it.</p>
|
||||
</section>
|
||||
<section id=modes>
|
||||
<h2>Mode management</h2>
|
||||
|
||||
<p>The <code>CodeMirror.listModes</code>
|
||||
and <code>CodeMirror.listMIMEs</code> functions, used for listing
|
||||
defined modes, are gone. You are now encouraged to simply
|
||||
inspect <code>CodeMirror.modes</code> (mapping mode names to mode
|
||||
constructors) and <code>CodeMirror.mimeModes</code> (mapping MIME
|
||||
strings to mode specs).</p>
|
||||
</section>
|
||||
<section id=new>
|
||||
<h2>New features</h2>
|
||||
|
||||
<p>Some more reasons to upgrade to version 3.</p>
|
||||
|
||||
<ul>
|
||||
<li>Bi-directional text support. CodeMirror will now mostly do the
|
||||
right thing when editing Arabic or Hebrew text.</li>
|
||||
<li>Arbitrary line heights. Using fonts with different heights
|
||||
inside the editor (whether off by one pixel or fifty) is now
|
||||
supported and handled gracefully.</li>
|
||||
<li>In-line widgets. See <a href="../demo/widget.html">the demo</a>
|
||||
and <a href="manual.html#addLineWidget">the docs</a>.</li>
|
||||
<li>Defining custom options
|
||||
with <a href="manual.html#defineOption"><code>CodeMirror.defineOption</code></a>.</li>
|
||||
</ul>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<script>setTimeout(function(){CodeMirror.colorize();}, 20);</script>
|
@ -1,144 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: Version 4 upgrade guide</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="docs.css">
|
||||
<script src="activebookmark.js"></script>
|
||||
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><h1>CodeMirror</h1><img id=logo src="logo.png"></a>
|
||||
|
||||
<ul>
|
||||
<li><a href="../index.html">Home</a>
|
||||
<li><a href="manual.html">Manual</a>
|
||||
<li><a href="https://github.com/codemirror/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a class=active href="#upgrade">Upgrade guide</a>
|
||||
<li><a href="#multisel">Multiple selections</a>
|
||||
<li><a href="#beforeSelectionChange">The beforeSelectionChange event</a>
|
||||
<li><a href="#replaceSelection">replaceSelection and collapsing</a>
|
||||
<li><a href="#changeEvent">change event data</a>
|
||||
<li><a href="#showIfHidden">showIfHidden option to line widgets</a>
|
||||
<li><a href="#module">Module loaders</a>
|
||||
<li><a href="#shareddata">Mutating shared data structures</a></li>
|
||||
<li><a href="#deprecated">Deprecated interfaces dropped</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
|
||||
<h2 id=upgrade>Upgrading to version 4</h2>
|
||||
|
||||
<p>CodeMirror 4's interface is <em>very</em> close version 3, but it
|
||||
does fix a few awkward details in a backwards-incompatible ways. At
|
||||
least skim the text below before upgrading.</p>
|
||||
|
||||
<section id=multisel><h2>Multiple selections</h2>
|
||||
|
||||
<p>The main new feature in version 4 is multiple selections. The
|
||||
single-selection variants of methods are still there, but now
|
||||
typically act only on the <em>primary</em> selection (usually the last
|
||||
one added).</p>
|
||||
|
||||
<p>The exception to this
|
||||
is <a href="manual.html#getSelection"><strong><code>getSelection</code></strong></a>,
|
||||
which will now return the content of <em>all</em> selections
|
||||
(separated by newlines, or whatever <code>lineSep</code> parameter you passed
|
||||
it).</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=beforeSelectionChange><h2>The beforeSelectionChange event</h2>
|
||||
|
||||
<p>This event still exists, but the object it is passed has
|
||||
a <a href="manual.html#event_beforeSelectionChange">completely new
|
||||
interface</a>, because such changes now concern multiple
|
||||
selections.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=replaceSelection><h2>replaceSelection's collapsing behavior</h2>
|
||||
|
||||
<p>By
|
||||
default, <a href="manual.html#replaceSelection"><code>replaceSelection</code></a>
|
||||
would leave the newly inserted text selected. This is only rarely what
|
||||
you want, and also (slightly) more expensive in the new model, so the
|
||||
default was changed to <code>"end"</code>, meaning the old behavior
|
||||
must be explicitly specified by passing a second argument
|
||||
of <code>"around"</code>.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=changeEvent><h2>change event data</h2>
|
||||
|
||||
<p>Rather than forcing client code to follow <code>next</code>
|
||||
pointers from one change object to the next, the library will now
|
||||
simply fire
|
||||
multiple <a href="manual.html#event_change"><code>"change"</code></a>
|
||||
events. Existing code will probably continue to work unmodified.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=showIfHidden><h2>showIfHidden option to line widgets</h2>
|
||||
|
||||
<p>This option, which conceptually caused line widgets to be visible
|
||||
even if their line was hidden, was never really well-defined, and was
|
||||
buggy from the start. It would be a rather expensive feature, both in
|
||||
code complexity and run-time performance, to implement properly. It
|
||||
has been dropped entirely in 4.0.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=module><h2>Module loaders</h2>
|
||||
|
||||
<p>All modules in the CodeMirror distribution are now wrapped in a
|
||||
shim function to make them compatible with both AMD
|
||||
(<a href="http://requirejs.org">requirejs</a>) and CommonJS (as used
|
||||
by <a href="http://nodejs.org/">node</a>
|
||||
and <a href="http://browserify.org/">browserify</a>) module loaders.
|
||||
When neither of these is present, they fall back to simply using the
|
||||
global <code>CodeMirror</code> variable.</p>
|
||||
|
||||
<p>If you have a module loader present in your environment, CodeMirror
|
||||
will attempt to use it, and you might need to change the way you load
|
||||
CodeMirror modules.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=shareddata><h2>Mutating shared data structures</h2>
|
||||
|
||||
<p>Data structures produced by the library should not be mutated
|
||||
unless explicitly allowed, in general. This is slightly more strict in
|
||||
4.0 than it was in earlier versions, which copied the position objects
|
||||
returned by <a href="manual.html#getCursor"><code>getCursor</code></a>
|
||||
for nebulous, historic reasons. In 4.0, mutating these
|
||||
objects <em>will</em> corrupt your editor's selection.</p>
|
||||
|
||||
</section>
|
||||
|
||||
<section id=deprecated><h2>Deprecated interfaces dropped</h2>
|
||||
|
||||
<p>A few properties and methods that have been deprecated for a while
|
||||
are now gone. Most notably, the <code>onKeyEvent</code>
|
||||
and <code>onDragEvent</code> options (use the
|
||||
corresponding <a href="manual.html#event_dom">events</a> instead).</p>
|
||||
|
||||
<p>Two silly methods, which were mostly there to stay close to the 0.x
|
||||
API, <code>setLine</code> and <code>removeLine</code> are now gone.
|
||||
Use the more
|
||||
flexible <a href="manual.html#replaceRange"><code>replaceRange</code></a>
|
||||
method instead.</p>
|
||||
|
||||
<p>The long names for folding and completing functions
|
||||
(<code>CodeMirror.braceRangeFinder</code>, <code>CodeMirror.javascriptHint</code>,
|
||||
etc) are also gone
|
||||
(use <code>CodeMirror.fold.brace</code>, <code>CodeMirror.hint.javascript</code>).</p>
|
||||
|
||||
<p>The <code>className</code> property in the return value
|
||||
of <a href="manual.html#getTokenAt"><code>getTokenAt</code></a>, which
|
||||
has been superseded by the <code>type</code> property, is also no
|
||||
longer present.</p>
|
||||
|
||||
</section>
|
||||
</article>
|
290
public/js/lib/codemirror/mode/idl/idl.js
vendored
290
public/js/lib/codemirror/mode/idl/idl.js
vendored
@ -1,290 +0,0 @@
|
||||
// CodeMirror, copyright (c) by Marijn Haverbeke and others
|
||||
// Distributed under an MIT license: http://codemirror.net/LICENSE
|
||||
|
||||
(function(mod) {
|
||||
if (typeof exports == "object" && typeof module == "object") // CommonJS
|
||||
mod(require("../../lib/codemirror"));
|
||||
else if (typeof define == "function" && define.amd) // AMD
|
||||
define(["../../lib/codemirror"], mod);
|
||||
else // Plain browser env
|
||||
mod(CodeMirror);
|
||||
})(function(CodeMirror) {
|
||||
"use strict";
|
||||
|
||||
function wordRegexp(words) {
|
||||
return new RegExp('^((' + words.join(')|(') + '))\\b', 'i');
|
||||
};
|
||||
|
||||
var builtinArray = [
|
||||
'a_correlate', 'abs', 'acos', 'adapt_hist_equal', 'alog',
|
||||
'alog2', 'alog10', 'amoeba', 'annotate', 'app_user_dir',
|
||||
'app_user_dir_query', 'arg_present', 'array_equal', 'array_indices',
|
||||
'arrow', 'ascii_template', 'asin', 'assoc', 'atan',
|
||||
'axis', 'axis', 'bandpass_filter', 'bandreject_filter', 'barplot',
|
||||
'bar_plot', 'beseli', 'beselj', 'beselk', 'besely',
|
||||
'beta', 'biginteger', 'bilinear', 'bin_date', 'binary_template',
|
||||
'bindgen', 'binomial', 'bit_ffs', 'bit_population', 'blas_axpy',
|
||||
'blk_con', 'boolarr', 'boolean', 'boxplot', 'box_cursor',
|
||||
'breakpoint', 'broyden', 'bubbleplot', 'butterworth', 'bytarr',
|
||||
'byte', 'byteorder', 'bytscl', 'c_correlate', 'calendar',
|
||||
'caldat', 'call_external', 'call_function', 'call_method',
|
||||
'call_procedure', 'canny', 'catch', 'cd', 'cdf', 'ceil',
|
||||
'chebyshev', 'check_math', 'chisqr_cvf', 'chisqr_pdf', 'choldc',
|
||||
'cholsol', 'cindgen', 'cir_3pnt', 'clipboard', 'close',
|
||||
'clust_wts', 'cluster', 'cluster_tree', 'cmyk_convert', 'code_coverage',
|
||||
'color_convert', 'color_exchange', 'color_quan', 'color_range_map',
|
||||
'colorbar', 'colorize_sample', 'colormap_applicable',
|
||||
'colormap_gradient', 'colormap_rotation', 'colortable',
|
||||
'comfit', 'command_line_args', 'common', 'compile_opt', 'complex',
|
||||
'complexarr', 'complexround', 'compute_mesh_normals', 'cond', 'congrid',
|
||||
'conj', 'constrained_min', 'contour', 'contour', 'convert_coord',
|
||||
'convol', 'convol_fft', 'coord2to3', 'copy_lun', 'correlate',
|
||||
'cos', 'cosh', 'cpu', 'cramer', 'createboxplotdata',
|
||||
'create_cursor', 'create_struct', 'create_view', 'crossp', 'crvlength',
|
||||
'ct_luminance', 'cti_test', 'cursor', 'curvefit', 'cv_coord',
|
||||
'cvttobm', 'cw_animate', 'cw_animate_getp', 'cw_animate_load',
|
||||
'cw_animate_run', 'cw_arcball', 'cw_bgroup', 'cw_clr_index',
|
||||
'cw_colorsel', 'cw_defroi', 'cw_field', 'cw_filesel', 'cw_form',
|
||||
'cw_fslider', 'cw_light_editor', 'cw_light_editor_get',
|
||||
'cw_light_editor_set', 'cw_orient', 'cw_palette_editor',
|
||||
'cw_palette_editor_get', 'cw_palette_editor_set', 'cw_pdmenu',
|
||||
'cw_rgbslider', 'cw_tmpl', 'cw_zoom', 'db_exists',
|
||||
'dblarr', 'dcindgen', 'dcomplex', 'dcomplexarr', 'define_key',
|
||||
'define_msgblk', 'define_msgblk_from_file', 'defroi', 'defsysv',
|
||||
'delvar', 'dendro_plot', 'dendrogram', 'deriv', 'derivsig',
|
||||
'determ', 'device', 'dfpmin', 'diag_matrix', 'dialog_dbconnect',
|
||||
'dialog_message', 'dialog_pickfile', 'dialog_printersetup',
|
||||
'dialog_printjob', 'dialog_read_image',
|
||||
'dialog_write_image', 'dictionary', 'digital_filter', 'dilate', 'dindgen',
|
||||
'dissolve', 'dist', 'distance_measure', 'dlm_load', 'dlm_register',
|
||||
'doc_library', 'double', 'draw_roi', 'edge_dog', 'efont',
|
||||
'eigenql', 'eigenvec', 'ellipse', 'elmhes', 'emboss',
|
||||
'empty', 'enable_sysrtn', 'eof', 'eos', 'erase',
|
||||
'erf', 'erfc', 'erfcx', 'erode', 'errorplot',
|
||||
'errplot', 'estimator_filter', 'execute', 'exit', 'exp',
|
||||
'expand', 'expand_path', 'expint', 'extrac', 'extract_slice',
|
||||
'f_cvf', 'f_pdf', 'factorial', 'fft', 'file_basename',
|
||||
'file_chmod', 'file_copy', 'file_delete', 'file_dirname',
|
||||
'file_expand_path', 'file_gunzip', 'file_gzip', 'file_info',
|
||||
'file_lines', 'file_link', 'file_mkdir', 'file_move',
|
||||
'file_poll_input', 'file_readlink', 'file_same',
|
||||
'file_search', 'file_tar', 'file_test', 'file_untar', 'file_unzip',
|
||||
'file_which', 'file_zip', 'filepath', 'findgen', 'finite',
|
||||
'fix', 'flick', 'float', 'floor', 'flow3',
|
||||
'fltarr', 'flush', 'format_axis_values', 'forward_function', 'free_lun',
|
||||
'fstat', 'fulstr', 'funct', 'function', 'fv_test',
|
||||
'fx_root', 'fz_roots', 'gamma', 'gamma_ct', 'gauss_cvf',
|
||||
'gauss_pdf', 'gauss_smooth', 'gauss2dfit', 'gaussfit',
|
||||
'gaussian_function', 'gaussint', 'get_drive_list', 'get_dxf_objects',
|
||||
'get_kbrd', 'get_login_info',
|
||||
'get_lun', 'get_screen_size', 'getenv', 'getwindows', 'greg2jul',
|
||||
'grib', 'grid_input', 'grid_tps', 'grid3', 'griddata',
|
||||
'gs_iter', 'h_eq_ct', 'h_eq_int', 'hanning', 'hash',
|
||||
'hdf', 'hdf5', 'heap_free', 'heap_gc', 'heap_nosave',
|
||||
'heap_refcount', 'heap_save', 'help', 'hilbert', 'hist_2d',
|
||||
'hist_equal', 'histogram', 'hls', 'hough', 'hqr',
|
||||
'hsv', 'i18n_multibytetoutf8',
|
||||
'i18n_multibytetowidechar', 'i18n_utf8tomultibyte',
|
||||
'i18n_widechartomultibyte',
|
||||
'ibeta', 'icontour', 'iconvertcoord', 'idelete', 'identity',
|
||||
'idl_base64', 'idl_container', 'idl_validname',
|
||||
'idlexbr_assistant', 'idlitsys_createtool',
|
||||
'idlunit', 'iellipse', 'igamma', 'igetcurrent', 'igetdata',
|
||||
'igetid', 'igetproperty', 'iimage', 'image', 'image_cont',
|
||||
'image_statistics', 'image_threshold', 'imaginary', 'imap', 'indgen',
|
||||
'int_2d', 'int_3d', 'int_tabulated', 'intarr', 'interpol',
|
||||
'interpolate', 'interval_volume', 'invert', 'ioctl', 'iopen',
|
||||
'ir_filter', 'iplot', 'ipolygon', 'ipolyline', 'iputdata',
|
||||
'iregister', 'ireset', 'iresolve', 'irotate', 'isa',
|
||||
'isave', 'iscale', 'isetcurrent', 'isetproperty', 'ishft',
|
||||
'isocontour', 'isosurface', 'isurface', 'itext', 'itranslate',
|
||||
'ivector', 'ivolume', 'izoom', 'journal', 'json_parse',
|
||||
'json_serialize', 'jul2greg', 'julday', 'keyword_set', 'krig2d',
|
||||
'kurtosis', 'kw_test', 'l64indgen', 'la_choldc', 'la_cholmprove',
|
||||
'la_cholsol', 'la_determ', 'la_eigenproblem', 'la_eigenql', 'la_eigenvec',
|
||||
'la_elmhes', 'la_gm_linear_model', 'la_hqr', 'la_invert',
|
||||
'la_least_square_equality', 'la_least_squares', 'la_linear_equation',
|
||||
'la_ludc', 'la_lumprove', 'la_lusol',
|
||||
'la_svd', 'la_tridc', 'la_trimprove', 'la_triql', 'la_trired',
|
||||
'la_trisol', 'label_date', 'label_region', 'ladfit', 'laguerre',
|
||||
'lambda', 'lambdap', 'lambertw', 'laplacian', 'least_squares_filter',
|
||||
'leefilt', 'legend', 'legendre', 'linbcg', 'lindgen',
|
||||
'linfit', 'linkimage', 'list', 'll_arc_distance', 'lmfit',
|
||||
'lmgr', 'lngamma', 'lnp_test', 'loadct', 'locale_get',
|
||||
'logical_and', 'logical_or', 'logical_true', 'lon64arr', 'lonarr',
|
||||
'long', 'long64', 'lsode', 'lu_complex', 'ludc',
|
||||
'lumprove', 'lusol', 'm_correlate', 'machar', 'make_array',
|
||||
'make_dll', 'make_rt', 'map', 'mapcontinents', 'mapgrid',
|
||||
'map_2points', 'map_continents', 'map_grid', 'map_image', 'map_patch',
|
||||
'map_proj_forward', 'map_proj_image', 'map_proj_info',
|
||||
'map_proj_init', 'map_proj_inverse',
|
||||
'map_set', 'matrix_multiply', 'matrix_power', 'max', 'md_test',
|
||||
'mean', 'meanabsdev', 'mean_filter', 'median', 'memory',
|
||||
'mesh_clip', 'mesh_decimate', 'mesh_issolid',
|
||||
'mesh_merge', 'mesh_numtriangles',
|
||||
'mesh_obj', 'mesh_smooth', 'mesh_surfacearea',
|
||||
'mesh_validate', 'mesh_volume',
|
||||
'message', 'min', 'min_curve_surf', 'mk_html_help', 'modifyct',
|
||||
'moment', 'morph_close', 'morph_distance',
|
||||
'morph_gradient', 'morph_hitormiss',
|
||||
'morph_open', 'morph_thin', 'morph_tophat', 'multi', 'n_elements',
|
||||
'n_params', 'n_tags', 'ncdf', 'newton', 'noise_hurl',
|
||||
'noise_pick', 'noise_scatter', 'noise_slur', 'norm', 'obj_class',
|
||||
'obj_destroy', 'obj_hasmethod', 'obj_isa', 'obj_new', 'obj_valid',
|
||||
'objarr', 'on_error', 'on_ioerror', 'online_help', 'openr',
|
||||
'openu', 'openw', 'oplot', 'oploterr', 'orderedhash',
|
||||
'p_correlate', 'parse_url', 'particle_trace', 'path_cache', 'path_sep',
|
||||
'pcomp', 'plot', 'plot3d', 'plot', 'plot_3dbox',
|
||||
'plot_field', 'ploterr', 'plots', 'polar_contour', 'polar_surface',
|
||||
'polyfill', 'polyshade', 'pnt_line', 'point_lun', 'polarplot',
|
||||
'poly', 'poly_2d', 'poly_area', 'poly_fit', 'polyfillv',
|
||||
'polygon', 'polyline', 'polywarp', 'popd', 'powell',
|
||||
'pref_commit', 'pref_get', 'pref_set', 'prewitt', 'primes',
|
||||
'print', 'printf', 'printd', 'pro', 'product',
|
||||
'profile', 'profiler', 'profiles', 'project_vol', 'ps_show_fonts',
|
||||
'psafm', 'pseudo', 'ptr_free', 'ptr_new', 'ptr_valid',
|
||||
'ptrarr', 'pushd', 'qgrid3', 'qhull', 'qromb',
|
||||
'qromo', 'qsimp', 'query_*', 'query_ascii', 'query_bmp',
|
||||
'query_csv', 'query_dicom', 'query_gif', 'query_image', 'query_jpeg',
|
||||
'query_jpeg2000', 'query_mrsid', 'query_pict', 'query_png', 'query_ppm',
|
||||
'query_srf', 'query_tiff', 'query_video', 'query_wav', 'r_correlate',
|
||||
'r_test', 'radon', 'randomn', 'randomu', 'ranks',
|
||||
'rdpix', 'read', 'readf', 'read_ascii', 'read_binary',
|
||||
'read_bmp', 'read_csv', 'read_dicom', 'read_gif', 'read_image',
|
||||
'read_interfile', 'read_jpeg', 'read_jpeg2000', 'read_mrsid', 'read_pict',
|
||||
'read_png', 'read_ppm', 'read_spr', 'read_srf', 'read_sylk',
|
||||
'read_tiff', 'read_video', 'read_wav', 'read_wave', 'read_x11_bitmap',
|
||||
'read_xwd', 'reads', 'readu', 'real_part', 'rebin',
|
||||
'recall_commands', 'recon3', 'reduce_colors', 'reform', 'region_grow',
|
||||
'register_cursor', 'regress', 'replicate',
|
||||
'replicate_inplace', 'resolve_all',
|
||||
'resolve_routine', 'restore', 'retall', 'return', 'reverse',
|
||||
'rk4', 'roberts', 'rot', 'rotate', 'round',
|
||||
'routine_filepath', 'routine_info', 'rs_test', 's_test', 'save',
|
||||
'savgol', 'scale3', 'scale3d', 'scatterplot', 'scatterplot3d',
|
||||
'scope_level', 'scope_traceback', 'scope_varfetch',
|
||||
'scope_varname', 'search2d',
|
||||
'search3d', 'sem_create', 'sem_delete', 'sem_lock', 'sem_release',
|
||||
'set_plot', 'set_shading', 'setenv', 'sfit', 'shade_surf',
|
||||
'shade_surf_irr', 'shade_volume', 'shift', 'shift_diff', 'shmdebug',
|
||||
'shmmap', 'shmunmap', 'shmvar', 'show3', 'showfont',
|
||||
'signum', 'simplex', 'sin', 'sindgen', 'sinh',
|
||||
'size', 'skewness', 'skip_lun', 'slicer3', 'slide_image',
|
||||
'smooth', 'sobel', 'socket', 'sort', 'spawn',
|
||||
'sph_4pnt', 'sph_scat', 'spher_harm', 'spl_init', 'spl_interp',
|
||||
'spline', 'spline_p', 'sprsab', 'sprsax', 'sprsin',
|
||||
'sprstp', 'sqrt', 'standardize', 'stddev', 'stop',
|
||||
'strarr', 'strcmp', 'strcompress', 'streamline', 'streamline',
|
||||
'stregex', 'stretch', 'string', 'strjoin', 'strlen',
|
||||
'strlowcase', 'strmatch', 'strmessage', 'strmid', 'strpos',
|
||||
'strput', 'strsplit', 'strtrim', 'struct_assign', 'struct_hide',
|
||||
'strupcase', 'surface', 'surface', 'surfr', 'svdc',
|
||||
'svdfit', 'svsol', 'swap_endian', 'swap_endian_inplace', 'symbol',
|
||||
'systime', 't_cvf', 't_pdf', 't3d', 'tag_names',
|
||||
'tan', 'tanh', 'tek_color', 'temporary', 'terminal_size',
|
||||
'tetra_clip', 'tetra_surface', 'tetra_volume', 'text', 'thin',
|
||||
'thread', 'threed', 'tic', 'time_test2', 'timegen',
|
||||
'timer', 'timestamp', 'timestamptovalues', 'tm_test', 'toc',
|
||||
'total', 'trace', 'transpose', 'tri_surf', 'triangulate',
|
||||
'trigrid', 'triql', 'trired', 'trisol', 'truncate_lun',
|
||||
'ts_coef', 'ts_diff', 'ts_fcast', 'ts_smooth', 'tv',
|
||||
'tvcrs', 'tvlct', 'tvrd', 'tvscl', 'typename',
|
||||
'uindgen', 'uint', 'uintarr', 'ul64indgen', 'ulindgen',
|
||||
'ulon64arr', 'ulonarr', 'ulong', 'ulong64', 'uniq',
|
||||
'unsharp_mask', 'usersym', 'value_locate', 'variance', 'vector',
|
||||
'vector_field', 'vel', 'velovect', 'vert_t3d', 'voigt',
|
||||
'volume', 'voronoi', 'voxel_proj', 'wait', 'warp_tri',
|
||||
'watershed', 'wdelete', 'wf_draw', 'where', 'widget_base',
|
||||
'widget_button', 'widget_combobox', 'widget_control',
|
||||
'widget_displaycontextmenu', 'widget_draw',
|
||||
'widget_droplist', 'widget_event', 'widget_info',
|
||||
'widget_label', 'widget_list',
|
||||
'widget_propertysheet', 'widget_slider', 'widget_tab',
|
||||
'widget_table', 'widget_text',
|
||||
'widget_tree', 'widget_tree_move', 'widget_window',
|
||||
'wiener_filter', 'window',
|
||||
'window', 'write_bmp', 'write_csv', 'write_gif', 'write_image',
|
||||
'write_jpeg', 'write_jpeg2000', 'write_nrif', 'write_pict', 'write_png',
|
||||
'write_ppm', 'write_spr', 'write_srf', 'write_sylk', 'write_tiff',
|
||||
'write_video', 'write_wav', 'write_wave', 'writeu', 'wset',
|
||||
'wshow', 'wtn', 'wv_applet', 'wv_cwt', 'wv_cw_wavelet',
|
||||
'wv_denoise', 'wv_dwt', 'wv_fn_coiflet',
|
||||
'wv_fn_daubechies', 'wv_fn_gaussian',
|
||||
'wv_fn_haar', 'wv_fn_morlet', 'wv_fn_paul',
|
||||
'wv_fn_symlet', 'wv_import_data',
|
||||
'wv_import_wavelet', 'wv_plot3d_wps', 'wv_plot_multires',
|
||||
'wv_pwt', 'wv_tool_denoise',
|
||||
'xbm_edit', 'xdisplayfile', 'xdxf', 'xfont', 'xinteranimate',
|
||||
'xloadct', 'xmanager', 'xmng_tmpl', 'xmtool', 'xobjview',
|
||||
'xobjview_rotate', 'xobjview_write_image',
|
||||
'xpalette', 'xpcolor', 'xplot3d',
|
||||
'xregistered', 'xroi', 'xsq_test', 'xsurface', 'xvaredit',
|
||||
'xvolume', 'xvolume_rotate', 'xvolume_write_image',
|
||||
'xyouts', 'zlib_compress', 'zlib_uncompress', 'zoom', 'zoom_24'
|
||||
];
|
||||
var builtins = wordRegexp(builtinArray);
|
||||
|
||||
var keywordArray = [
|
||||
'begin', 'end', 'endcase', 'endfor',
|
||||
'endwhile', 'endif', 'endrep', 'endforeach',
|
||||
'break', 'case', 'continue', 'for',
|
||||
'foreach', 'goto', 'if', 'then', 'else',
|
||||
'repeat', 'until', 'switch', 'while',
|
||||
'do', 'pro', 'function'
|
||||
];
|
||||
var keywords = wordRegexp(keywordArray);
|
||||
|
||||
CodeMirror.registerHelper("hintWords", "idl", builtinArray.concat(keywordArray));
|
||||
|
||||
var identifiers = new RegExp('^[_a-z\xa1-\uffff][_a-z0-9\xa1-\uffff]*', 'i');
|
||||
|
||||
var singleOperators = /[+\-*&=<>\/@#~$]/;
|
||||
var boolOperators = new RegExp('(and|or|eq|lt|le|gt|ge|ne|not)', 'i');
|
||||
|
||||
function tokenBase(stream) {
|
||||
// whitespaces
|
||||
if (stream.eatSpace()) return null;
|
||||
|
||||
// Handle one line Comments
|
||||
if (stream.match(';')) {
|
||||
stream.skipToEnd();
|
||||
return 'comment';
|
||||
}
|
||||
|
||||
// Handle Number Literals
|
||||
if (stream.match(/^[0-9\.+-]/, false)) {
|
||||
if (stream.match(/^[+-]?0x[0-9a-fA-F]+/))
|
||||
return 'number';
|
||||
if (stream.match(/^[+-]?\d*\.\d+([EeDd][+-]?\d+)?/))
|
||||
return 'number';
|
||||
if (stream.match(/^[+-]?\d+([EeDd][+-]?\d+)?/))
|
||||
return 'number';
|
||||
}
|
||||
|
||||
// Handle Strings
|
||||
if (stream.match(/^"([^"]|(""))*"/)) { return 'string'; }
|
||||
if (stream.match(/^'([^']|(''))*'/)) { return 'string'; }
|
||||
|
||||
// Handle words
|
||||
if (stream.match(keywords)) { return 'keyword'; }
|
||||
if (stream.match(builtins)) { return 'builtin'; }
|
||||
if (stream.match(identifiers)) { return 'variable'; }
|
||||
|
||||
if (stream.match(singleOperators) || stream.match(boolOperators)) {
|
||||
return 'operator'; }
|
||||
|
||||
// Handle non-detected items
|
||||
stream.next();
|
||||
return 'error';
|
||||
};
|
||||
|
||||
CodeMirror.defineMode('idl', function() {
|
||||
return {
|
||||
token: function(stream) {
|
||||
return tokenBase(stream);
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
CodeMirror.defineMIME('text/x-idl', 'idl');
|
||||
});
|
64
public/js/lib/codemirror/mode/idl/index.html
vendored
64
public/js/lib/codemirror/mode/idl/index.html
vendored
@ -1,64 +0,0 @@
|
||||
<!doctype html>
|
||||
|
||||
<title>CodeMirror: IDL mode</title>
|
||||
<meta charset="utf-8"/>
|
||||
<link rel=stylesheet href="../../doc/docs.css">
|
||||
|
||||
<link rel="stylesheet" href="../../lib/codemirror.css">
|
||||
<script src="../../lib/codemirror.js"></script>
|
||||
<script src="idl.js"></script>
|
||||
<style type="text/css">.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
|
||||
<div id=nav>
|
||||
<a href="http://codemirror.net"><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/codemirror">Code</a>
|
||||
</ul>
|
||||
<ul>
|
||||
<li><a href="../index.html">Language modes</a>
|
||||
<li><a class=active href="#">IDL</a>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<article>
|
||||
<h2>IDL mode</h2>
|
||||
|
||||
<div><textarea id="code" name="code">
|
||||
;; Example IDL code
|
||||
FUNCTION mean_and_stddev,array
|
||||
;; This program reads in an array of numbers
|
||||
;; and returns a structure containing the
|
||||
;; average and standard deviation
|
||||
|
||||
ave = 0.0
|
||||
count = 0.0
|
||||
|
||||
for i=0,N_ELEMENTS(array)-1 do begin
|
||||
ave = ave + array[i]
|
||||
count = count + 1
|
||||
endfor
|
||||
|
||||
ave = ave/count
|
||||
|
||||
std = stddev(array)
|
||||
|
||||
return, {average:ave,std:std}
|
||||
|
||||
END
|
||||
|
||||
</textarea></div>
|
||||
<script>
|
||||
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
|
||||
mode: {name: "idl",
|
||||
version: 1,
|
||||
singleLineStringErrors: false},
|
||||
lineNumbers: true,
|
||||
indentUnit: 4,
|
||||
matchBrackets: true
|
||||
});
|
||||
</script>
|
||||
|
||||
<p><strong>MIME types defined:</strong> <code>text/x-idl</code>.</p>
|
||||
</article>
|
Reference in New Issue
Block a user