Merge branch 'master' of git@github.com:fnp/redakcja
[redakcja.git] / redakcja / static / js / lib / codemirror / editor.js
1 /* The Editor object manages the content of the editable frame. It
2  * catches events, colours nodes, and indents lines. This file also
3  * holds some functions for transforming arbitrary DOM structures into
4  * plain sequences of <span> and <br> elements
5  */
6
7 // Make sure a string does not contain two consecutive 'collapseable'
8 // whitespace characters.
9 function makeWhiteSpace(n) {
10   var buffer = [], nb = true;
11   for (; n > 0; n--) {
12     buffer.push((nb || n == 1) ? nbsp : " ");
13     nb = !nb;
14   }
15   return buffer.join("");
16 }
17
18 // Create a set of white-space characters that will not be collapsed
19 // by the browser, but will not break text-wrapping either.
20 function fixSpaces(string) {
21   if (string.charAt(0) == " ") string = nbsp + string.slice(1);
22   return string.replace(/\t/g, function(){return makeWhiteSpace(indentUnit);})
23     .replace(/[ \u00a0]{2,}/g, function(s) {return makeWhiteSpace(s.length);});
24 }
25
26 function cleanText(text) {
27   return text.replace(/\u00a0/g, " ").replace(/\u200b/g, "");
28 }
29
30 // Create a SPAN node with the expected properties for document part
31 // spans.
32 function makePartSpan(value, doc) {
33   var text = value;
34   if (value.nodeType == 3) text = value.nodeValue;
35   else value = doc.createTextNode(text);
36
37   var span = doc.createElement("SPAN");
38   span.isPart = true;
39   span.appendChild(value);
40   span.currentText = text;
41   return span;
42 }
43
44 // On webkit, when the last BR of the document does not have text
45 // behind it, the cursor can not be put on the line after it. This
46 // makes pressing enter at the end of the document occasionally do
47 // nothing (or at least seem to do nothing). To work around it, this
48 // function makes sure the document ends with a span containing a
49 // zero-width space character. The traverseDOM iterator filters such
50 // character out again, so that the parsers won't see them. This
51 // function is called from a few strategic places to make sure the
52 // zwsp is restored after the highlighting process eats it.
53 var webkitLastLineHack = webkit ?
54   function(container) {
55     var last = container.lastChild;
56     if (!last || !last.isPart || last.textContent != "\u200b")
57       container.appendChild(makePartSpan("\u200b", container.ownerDocument));
58   } : function() {};
59
60 var Editor = (function(){
61   // The HTML elements whose content should be suffixed by a newline
62   // when converting them to flat text.
63   var newlineElements = {"P": true, "DIV": true, "LI": true};
64
65   function asEditorLines(string) {
66     var tab = makeWhiteSpace(indentUnit);
67     return map(string.replace(/\t/g, tab).replace(/\u00a0/g, " ").replace(/\r\n?/g, "\n").split("\n"), fixSpaces);
68   }
69
70   // Helper function for traverseDOM. Flattens an arbitrary DOM node
71   // into an array of textnodes and <br> tags.
72   function simplifyDOM(root, atEnd) {
73     var doc = root.ownerDocument;
74     var result = [];
75     var leaving = true;
76
77     function simplifyNode(node, top) {
78       if (node.nodeType == 3) {
79         var text = node.nodeValue = fixSpaces(node.nodeValue.replace(/[\r\u200b]/g, "").replace(/\n/g, " "));
80         if (text.length) leaving = false;
81         result.push(node);
82       }
83       else if (node.nodeName == "BR" && node.childNodes.length == 0) {
84         leaving = true;
85         result.push(node);
86       }
87       else {
88         forEach(node.childNodes, simplifyNode);
89         if (!leaving && newlineElements.hasOwnProperty(node.nodeName)) {
90           leaving = true;
91           if (!atEnd || !top)
92             result.push(doc.createElement("BR"));
93         }
94       }
95     }
96
97     simplifyNode(root, true);
98     return result;
99   }
100
101   // Creates a MochiKit-style iterator that goes over a series of DOM
102   // nodes. The values it yields are strings, the textual content of
103   // the nodes. It makes sure that all nodes up to and including the
104   // one whose text is being yielded have been 'normalized' to be just
105   // <span> and <br> elements.
106   // See the story.html file for some short remarks about the use of
107   // continuation-passing style in this iterator.
108   function traverseDOM(start){
109     function yield(value, c){cc = c; return value;}
110     function push(fun, arg, c){return function(){return fun(arg, c);};}
111     function stop(){cc = stop; throw StopIteration;};
112     var cc = push(scanNode, start, stop);
113     var owner = start.ownerDocument;
114     var nodeQueue = [];
115
116     // Create a function that can be used to insert nodes after the
117     // one given as argument.
118     function pointAt(node){
119       var parent = node.parentNode;
120       var next = node.nextSibling;
121       return function(newnode) {
122         parent.insertBefore(newnode, next);
123       };
124     }
125     var point = null;
126
127     // Insert a normalized node at the current point. If it is a text
128     // node, wrap it in a <span>, and give that span a currentText
129     // property -- this is used to cache the nodeValue, because
130     // directly accessing nodeValue is horribly slow on some browsers.
131     // The dirty property is used by the highlighter to determine
132     // which parts of the document have to be re-highlighted.
133     function insertPart(part){
134       var text = "\n";
135       if (part.nodeType == 3) {
136         select.snapshotChanged();
137         part = makePartSpan(part, owner);
138         text = part.currentText;
139       }
140       part.dirty = true;
141       nodeQueue.push(part);
142       point(part);
143       return text;
144     }
145
146     // Extract the text and newlines from a DOM node, insert them into
147     // the document, and yield the textual content. Used to replace
148     // non-normalized nodes.
149     function writeNode(node, c, end) {
150       var toYield = [];
151       forEach(simplifyDOM(node, end), function(part) {
152         toYield.push(insertPart(part));
153       });
154       return yield(toYield.join(""), c);
155     }
156
157     // Check whether a node is a normalized <span> element.
158     function partNode(node){
159       if (node.isPart && node.childNodes.length == 1 && node.firstChild.nodeType == 3) {
160         node.currentText = node.firstChild.nodeValue;
161         return !/[\n\t\r]/.test(node.currentText);
162       }
163       return false;
164     }
165
166     // Handle a node. Add its successor to the continuation if there
167     // is one, find out whether the node is normalized. If it is,
168     // yield its content, otherwise, normalize it (writeNode will take
169     // care of yielding).
170     function scanNode(node, c){
171       if (node.nextSibling)
172         c = push(scanNode, node.nextSibling, c);
173
174       if (partNode(node)){
175         nodeQueue.push(node);
176         return yield(node.currentText, c);
177       }
178       else if (node.nodeName == "BR") {
179         nodeQueue.push(node);
180         return yield("\n", c);
181       }
182       else {
183         var end = !node.nextSibling;
184         point = pointAt(node);
185         removeElement(node);
186         return writeNode(node, c, end);
187       }
188     }
189
190     // MochiKit iterators are objects with a next function that
191     // returns the next value or throws StopIteration when there are
192     // no more values.
193     return {next: function(){return cc();}, nodes: nodeQueue};
194   }
195
196   // Determine the text size of a processed node.
197   function nodeSize(node) {
198     if (node.nodeName == "BR")
199       return 1;
200     else
201       return node.currentText.length;
202   }
203
204   // Search backwards through the top-level nodes until the next BR or
205   // the start of the frame.
206   function startOfLine(node) {
207     while (node && node.nodeName != "BR") node = node.previousSibling;
208     return node;
209   }
210   function endOfLine(node, container) {
211     if (!node) node = container.firstChild;
212     else if (node.nodeName == "BR") node = node.nextSibling;
213
214     while (node && node.nodeName != "BR") node = node.nextSibling;
215     return node;
216   }
217
218   function time() {return new Date().getTime();}
219
220   // Client interface for searching the content of the editor. Create
221   // these by calling CodeMirror.getSearchCursor. To use, call
222   // findNext on the resulting object -- this returns a boolean
223   // indicating whether anything was found, and can be called again to
224   // skip to the next find. Use the select and replace methods to
225   // actually do something with the found locations.
226   function SearchCursor(editor, string, fromCursor, regexp, case_sensitive) {
227
228     function casedIndexOf(hay, needle, case_sensitive) {
229         if (case_sensitive)
230             return hay.indexOf(needle);
231         else
232             return hay.toLowerCase().indexOf(needle.toLowerCase())
233     }
234
235     function casedLastIndexOf(hay, needle, case_sensitive) {
236         if (case_sensitive)
237             return hay.lastIndexOf(needle);
238         else
239             return hay.toLowerCase().lastIndexOf(needle.toLowerCase());
240     }
241
242     function casedEqual(a, b, case_sensitive) {
243         if (case_sensitive)
244             return a == b;
245         else
246             return a.toLowerCase() == b.toLowerCase();
247     }
248
249     this.editor = editor;
250     this.history = editor.history;
251     this.history.commit();
252
253     // Are we currently at an occurrence of the search string?
254     this.atOccurrence = false;
255     // The object stores a set of nodes coming after its current
256     // position, so that when the current point is taken out of the
257     // DOM tree, we can still try to continue.
258     this.fallbackSize = 15;
259     var cursor;
260     // Start from the cursor when specified and a cursor can be found.
261     if (fromCursor && (cursor = select.cursorPos(this.editor.container))) {
262       this.line = cursor.node;
263       this.offset = cursor.offset;
264     }
265     else {
266       this.line = null;
267       this.offset = 0;
268     }
269     this.valid = !!string;
270
271     // Create a matcher function based on the kind of string we have.
272     var target = string.split("\n"), self = this;
273     this.matches = (target.length == 1) ?
274       // For one-line strings, searching can be done simply by calling
275       // indexOf on the current line.
276       function() {
277         var match = casedIndexOf(cleanText(self.history.textAfter(self.line).slice(self.offset)),
278                 string, case_sensitive);
279         if (match > -1)
280           return {from: {node: self.line, offset: self.offset + match},
281                   to: {node: self.line, offset: self.offset + match + string.length}};
282       } :
283       // Multi-line strings require internal iteration over lines, and
284       // some clunky checks to make sure the first match ends at the
285       // end of the line and the last match starts at the start.
286       function() {
287         var firstLine = cleanText(self.history.textAfter(self.line).slice(self.offset));
288         var match = casedLastIndexOf(firstLine, target[0], case_sensitive);
289         if (match == -1 || match != firstLine.length - target[0].length)
290           return false;
291         var startOffset = self.offset + match;
292
293         var line = self.history.nodeAfter(self.line);
294         for (var i = 1; i < target.length - 1; i++) {
295           if (!casedEqual(cleanText(self.history.textAfter(line)), target[i], case_sensitive))
296             return false;
297           line = self.history.nodeAfter(line);
298         }
299
300         if (casedIndexOf(cleanText(self.history.textAfter(line)), target[target.length - 1], case_sensitive) != 0)
301           return false;
302
303         return {from: {node: self.line, offset: startOffset},
304                 to: {node: line, offset: target[target.length - 1].length}};
305       };
306   }
307
308   SearchCursor.prototype = {
309     findNext: function() {
310       if (!this.valid) return false;
311       this.atOccurrence = false;
312       var self = this;
313
314       // Go back to the start of the document if the current line is
315       // no longer in the DOM tree.
316       if (this.line && !this.line.parentNode) {
317         this.line = null;
318         this.offset = 0;
319       }
320
321       // Set the cursor's position one character after the given
322       // position.
323       function saveAfter(pos) {
324         if (self.history.textAfter(pos.node).length > pos.offset) {
325           self.line = pos.node;
326           self.offset = pos.offset + 1;
327         }
328         else {
329           self.line = self.history.nodeAfter(pos.node);
330           self.offset = 0;
331         }
332       }
333
334       while (true) {
335         var match = this.matches();
336         // Found the search string.
337         if (match) {
338           this.atOccurrence = match;
339           saveAfter(match.from);
340           return true;
341         }
342         this.line = this.history.nodeAfter(this.line);
343         this.offset = 0;
344         // End of document.
345         if (!this.line) {
346           this.valid = false;
347           return false;
348         }
349       }
350     },
351
352     select: function() {
353       if (this.atOccurrence) {
354         select.setCursorPos(this.editor.container, this.atOccurrence.from, this.atOccurrence.to);
355         select.scrollToCursor(this.editor.container);
356       }
357     },
358
359     replace: function(string) {
360       if (this.atOccurrence) {
361         var end = this.editor.replaceRange(this.atOccurrence.from, this.atOccurrence.to, string);
362         this.line = end.node;
363         this.offset = end.offset;
364         this.atOccurrence = false;
365       }
366     }
367   };
368
369   // The Editor object is the main inside-the-iframe interface.
370   function Editor(options) {
371     this.options = options;
372     window.indentUnit = options.indentUnit;
373     this.parent = parent;
374     this.doc = document;
375     var container = this.container = this.doc.body;
376     this.win = window;
377     this.history = new History(container, options.undoDepth, options.undoDelay,
378                                this, options.onChange);
379     var self = this;
380
381     if (!Editor.Parser)
382       throw "No parser loaded.";
383     if (options.parserConfig && Editor.Parser.configure)
384       Editor.Parser.configure(options.parserConfig);
385
386     if (!options.readOnly)
387       select.setCursorPos(container, {node: null, offset: 0});
388
389     this.dirty = [];
390     if (options.content)
391       this.importCode(options.content);
392     else // FF acts weird when the editable document is completely empty
393       container.appendChild(this.doc.createElement("BR"));
394
395     if (!options.readOnly) {
396       if (options.continuousScanning !== false) {
397         this.scanner = this.documentScanner(options.passTime);
398         this.delayScanning();
399       }
400
401       function setEditable() {
402         // In IE, designMode frames can not run any scripts, so we use
403         // contentEditable instead.
404         if (document.body.contentEditable != undefined && internetExplorer)
405           document.body.contentEditable = "true";
406         else
407           document.designMode = "on";
408
409         document.documentElement.style.borderWidth = "0";
410         if (!options.textWrapping)
411           container.style.whiteSpace = "nowrap";
412       }
413
414       // If setting the frame editable fails, try again when the user
415       // focus it (happens when the frame is not visible on
416       // initialisation, in Firefox).
417       try {
418         setEditable();
419       }
420       catch(e) {
421         var focusEvent = addEventHandler(document, "focus", function() {
422           focusEvent();
423           setEditable();
424         }, true);
425       }
426
427       addEventHandler(document, "keydown", method(this, "keyDown"));
428       addEventHandler(document, "keypress", method(this, "keyPress"));
429       addEventHandler(document, "keyup", method(this, "keyUp"));
430
431       function cursorActivity() {self.cursorActivity(false);}
432       addEventHandler(document.body, "mouseup", cursorActivity);
433       addEventHandler(document.body, "cut", cursorActivity);
434
435       addEventHandler(document.body, "paste", function(event) {
436         cursorActivity();
437         var text = null;
438         try {
439           var clipboardData = event.clipboardData || window.clipboardData;
440           if (clipboardData) text = clipboardData.getData('Text');
441         }
442         catch(e) {}
443         if (text !== null) {
444           self.replaceSelection(text);
445           event.stop();
446         }
447       });
448
449       addEventHandler(document.body, "beforepaste", method(this, "reroutePasteEvent"));
450
451       if (this.options.autoMatchParens)
452         addEventHandler(document.body, "click", method(this, "scheduleParenBlink"));
453     }
454     else if (!options.textWrapping) {
455       container.style.whiteSpace = "nowrap";
456     }
457   }
458
459   function isSafeKey(code) {
460     return (code >= 16 && code <= 18) || // shift, control, alt
461            (code >= 33 && code <= 40); // arrows, home, end
462   }
463
464   Editor.prototype = {
465     // Import a piece of code into the editor.
466     importCode: function(code) {
467       this.history.push(null, null, asEditorLines(code));
468       this.history.reset();
469     },
470
471     // Extract the code from the editor.
472     getCode: function() {
473       if (!this.container.firstChild)
474         return "";
475
476       var accum = [];
477       select.markSelection(this.win);
478       forEach(traverseDOM(this.container.firstChild), method(accum, "push"));
479       webkitLastLineHack(this.container);
480       select.selectMarked();
481       return cleanText(accum.join(""));
482     },
483
484     checkLine: function(node) {
485       if (node === false || !(node == null || node.parentNode == this.container))
486         throw parent.CodeMirror.InvalidLineHandle;
487     },
488
489     cursorPosition: function(start) {
490       if (start == null) start = true;
491       var pos = select.cursorPos(this.container, start);
492       if (pos) return {line: pos.node, character: pos.offset};
493       else return {line: null, character: 0};
494     },
495
496     firstLine: function() {
497       return null;
498     },
499
500     lastLine: function() {
501       if (this.container.lastChild) return startOfLine(this.container.lastChild);
502       else return null;
503     },
504
505     nextLine: function(line) {
506       this.checkLine(line);
507       var end = endOfLine(line, this.container);
508       return end || false;
509     },
510
511     prevLine: function(line) {
512       this.checkLine(line);
513       if (line == null) return false;
514       return startOfLine(line.previousSibling);
515     },
516
517     selectLines: function(startLine, startOffset, endLine, endOffset) {
518       this.checkLine(startLine);
519       var start = {node: startLine, offset: startOffset}, end = null;
520       if (endOffset !== undefined) {
521         this.checkLine(endLine);
522         end = {node: endLine, offset: endOffset};
523       }
524       select.setCursorPos(this.container, start, end);
525       select.scrollToCursor(this.container);
526     },
527
528     lineContent: function(line) {
529       this.checkLine(line);
530       var accum = [];
531       for (line = line ? line.nextSibling : this.container.firstChild;
532            line && line.nodeName != "BR"; line = line.nextSibling)
533         accum.push(nodeText(line));
534       return cleanText(accum.join(""));
535     },
536
537     setLineContent: function(line, content) {
538       this.history.commit();
539       this.replaceRange({node: line, offset: 0},
540                         {node: line, offset: this.history.textAfter(line).length},
541                         content);
542       this.addDirtyNode(line);
543       this.scheduleHighlight();
544     },
545
546     insertIntoLine: function(line, position, content) {
547       var before = null;
548       if (position == "end") {
549         before = endOfLine(line, this.container);
550       }
551       else {
552         for (var cur = line ? line.nextSibling : this.container.firstChild; cur; cur = cur.nextSibling) {
553           if (position == 0) {
554             before = cur;
555             break;
556           }
557           var text = (cur.innerText || cur.textContent || cur.nodeValue || "");
558           if (text.length > position) {
559             before = cur.nextSibling;
560             content = text.slice(0, position) + content + text.slice(position);
561             removeElement(cur);
562             break;
563           }
564           position -= text.length;
565         }
566       }
567
568       var lines = asEditorLines(content), doc = this.container.ownerDocument;
569       for (var i = 0; i < lines.length; i++) {
570         if (i > 0) this.container.insertBefore(doc.createElement("BR"), before);
571         this.container.insertBefore(makePartSpan(lines[i], doc), before);
572       }
573       this.addDirtyNode(line);
574       this.scheduleHighlight();
575     },
576
577     // Retrieve the selected text.
578     selectedText: function() {
579       var h = this.history;
580       h.commit();
581
582       var start = select.cursorPos(this.container, true),
583           end = select.cursorPos(this.container, false);
584       if (!start || !end) return "";
585
586       if (start.node == end.node)
587         return h.textAfter(start.node).slice(start.offset, end.offset);
588
589       var text = [h.textAfter(start.node).slice(start.offset)];
590       for (var pos = h.nodeAfter(start.node); pos != end.node; pos = h.nodeAfter(pos))
591         text.push(h.textAfter(pos));
592       text.push(h.textAfter(end.node).slice(0, end.offset));
593       return cleanText(text.join("\n"));
594     },
595
596     // Replace the selection with another p
597     // iece of text.
598     replaceSelection: function(text) {
599       this.history.commit();
600
601       var start = select.cursorPos(this.container, true),
602           end = select.cursorPos(this.container, false);
603       if (!start || !end) return;
604
605       end = this.replaceRange(start, end, text);
606       // select.setCursorPos(this.container, end);
607       webkitLastLineHack(this.container);
608     },
609
610     reroutePasteEvent: function() {
611       if (this.capturingPaste || window.opera) return;
612       this.capturingPaste = true;
613       var te = parent.document.createElement("TEXTAREA");
614       te.style.position = "absolute";
615       te.style.left = "-500px";
616       te.style.width = "10px";
617       te.style.top = nodeTop(frameElement) + "px";
618       parent.document.body.appendChild(te);
619       parent.focus();
620       te.focus();
621
622       var self = this;
623       this.parent.setTimeout(function() {
624         self.capturingPaste = false;
625         self.win.focus();
626         if (self.selectionSnapshot) // IE hack
627           self.win.select.selectCoords(self.win, self.selectionSnapshot);
628         var text = te.value;
629         if (text) self.replaceSelection(text);
630         removeElement(te);
631       }, 10);
632     },
633
634     replaceRange: function(from, to, text) {
635       var lines = asEditorLines(text);
636       lines[0] = this.history.textAfter(from.node).slice(0, from.offset) + lines[0];
637       var lastLine = lines[lines.length - 1];
638       lines[lines.length - 1] = lastLine + this.history.textAfter(to.node).slice(to.offset);
639       var end = this.history.nodeAfter(to.node);
640       this.history.push(from.node, end, lines);
641       return {node: this.history.nodeBefore(end),
642               offset: lastLine.length};
643     },
644
645     getSearchCursor: function(string, fromCursor, regexp, case_sensitive) {
646       return new SearchCursor(this, string, fromCursor, regexp, case_sensitive);
647     },
648
649     // Re-indent the whole buffer
650     reindent: function() {
651       if (this.container.firstChild)
652         this.indentRegion(null, this.container.lastChild);
653     },
654
655     reindentSelection: function(direction) {
656       if (!select.somethingSelected(this.win)) {
657         this.indentAtCursor(direction);
658       }
659       else {
660         var start = select.selectionTopNode(this.container, true),
661             end = select.selectionTopNode(this.container, false);
662         if (start === false || end === false) return;
663         this.indentRegion(start, end, direction);
664       }
665     },
666
667     grabKeys: function(eventHandler, filter) {
668       this.frozen = eventHandler;
669       this.keyFilter = filter;
670     },
671     ungrabKeys: function() {
672       this.frozen = "leave";
673       this.keyFilter = null;
674     },
675
676     setParser: function(name) {
677       Editor.Parser = window[name];
678       if (this.container.firstChild) {
679         forEach(this.container.childNodes, function(n) {
680           if (n.nodeType != 3) n.dirty = true;
681         });
682         this.addDirtyNode(this.firstChild);
683         this.scheduleHighlight();
684       }
685     },
686
687     // Intercept enter and tab, and assign their new functions.
688     keyDown: function(event) {
689       if (this.frozen == "leave") this.frozen = null;
690       if (this.frozen && (!this.keyFilter || this.keyFilter(event))) {
691         event.stop();
692         this.frozen(event);
693         return;
694       }
695
696       var code = event.keyCode;
697       // Don't scan when the user is typing.
698       this.delayScanning();
699       // Schedule a paren-highlight event, if configured.
700       if (this.options.autoMatchParens)
701         this.scheduleParenBlink();
702
703       // The various checks for !altKey are there because AltGr sets both
704       // ctrlKey and altKey to true, and should not be recognised as
705       // Control.
706       if (code == 13) { // enter
707         if (event.ctrlKey && !event.altKey) {
708           this.reparseBuffer();
709         }
710         else {
711           select.insertNewlineAtCursor(this.win);
712           this.indentAtCursor();
713           select.scrollToCursor(this.container);
714         }
715         event.stop();
716       }
717       else if (code == 9 && this.options.tabMode != "default") { // tab
718         this.handleTab(!event.ctrlKey && !event.shiftKey);
719         event.stop();
720       }
721       else if (code == 32 && event.shiftKey && this.options.tabMode == "default") { // space
722         this.handleTab(true);
723         event.stop();
724       }
725       else if (code == 36 && !event.shiftKey && !event.ctrlKey) { // home
726         if (this.home())
727           event.stop();
728       }
729       else if ((code == 219 || code == 221) && event.ctrlKey && !event.altKey) { // [, ]
730         this.blinkParens(event.shiftKey);
731         event.stop();
732       }
733       else if (event.metaKey && !event.shiftKey && (code == 37 || code == 39)) { // Meta-left/right
734         var cursor = select.selectionTopNode(this.container);
735         if (cursor === false || !this.container.firstChild) return;
736
737         if (code == 37) select.focusAfterNode(startOfLine(cursor), this.container);
738         else {
739           var end = endOfLine(cursor, this.container);
740           select.focusAfterNode(end ? end.previousSibling : this.container.lastChild, this.container);
741         }
742         event.stop();
743       }
744       else if ((event.ctrlKey || event.metaKey) && !event.altKey) {
745         if ((event.shiftKey && code == 90) || code == 89) { // shift-Z, Y
746           select.scrollToNode(this.history.redo());
747           event.stop();
748         }
749         else if (code == 90 || (safari && code == 8)) { // Z, backspace
750           select.scrollToNode(this.history.undo());
751           event.stop();
752         }
753         else if (code == 83 && this.options.saveFunction) { // S
754           this.options.saveFunction();
755           event.stop();
756         }
757       }
758     },
759
760     // Check for characters that should re-indent the current line,
761     // and prevent Opera from handling enter and tab anyway.
762     keyPress: function(event) {
763       var electric = Editor.Parser.electricChars, self = this;
764       // Hack for Opera, and Firefox on OS X, in which stopping a
765       // keydown event does not prevent the associated keypress event
766       // from happening, so we have to cancel enter and tab again
767       // here.
768       if ((this.frozen && (!this.keyFilter || this.keyFilter(event.keyCode))) ||
769           event.code == 13 || (event.code == 9 && this.options.tabMode != "default") ||
770           (event.keyCode == 32 && event.shiftKey && this.options.tabMode == "default"))
771         event.stop();
772       else if (electric && electric.indexOf(event.character) != -1)
773         this.parent.setTimeout(function(){self.indentAtCursor(null);}, 0);
774       else if ((event.character == "v" || event.character == "V")
775                && (event.ctrlKey || event.metaKey) && !event.altKey) // ctrl-V
776         this.reroutePasteEvent();
777     },
778
779     // Mark the node at the cursor dirty when a non-safe key is
780     // released.
781     keyUp: function(event) {
782       this.cursorActivity(isSafeKey(event.keyCode));
783     },
784
785     // Indent the line following a given <br>, or null for the first
786     // line. If given a <br> element, this must have been highlighted
787     // so that it has an indentation method. Returns the whitespace
788     // element that has been modified or created (if any).
789     indentLineAfter: function(start, direction) {
790       // whiteSpace is the whitespace span at the start of the line,
791       // or null if there is no such node.
792       var whiteSpace = start ? start.nextSibling : this.container.firstChild;
793       if (whiteSpace && !hasClass(whiteSpace, "whitespace"))
794         whiteSpace = null;
795
796       // Sometimes the start of the line can influence the correct
797       // indentation, so we retrieve it.
798       var firstText = whiteSpace ? whiteSpace.nextSibling : (start ? start.nextSibling : this.container.firstChild);
799       var nextChars = (start && firstText && firstText.currentText) ? firstText.currentText : "";
800
801       // Ask the lexical context for the correct indentation, and
802       // compute how much this differs from the current indentation.
803       var newIndent = 0, curIndent = whiteSpace ? whiteSpace.currentText.length : 0;
804       if (direction != null && this.options.tabMode == "shift")
805         newIndent = direction ? curIndent + indentUnit : Math.max(0, curIndent - indentUnit)
806       else if (start)
807         newIndent = start.indentation(nextChars, curIndent, direction);
808       else if (Editor.Parser.firstIndentation)
809         newIndent = Editor.Parser.firstIndentation(nextChars, curIndent, direction);
810       var indentDiff = newIndent - curIndent;
811
812       // If there is too much, this is just a matter of shrinking a span.
813       if (indentDiff < 0) {
814         if (newIndent == 0) {
815           if (firstText) select.snapshotMove(whiteSpace.firstChild, firstText.firstChild, 0);
816           removeElement(whiteSpace);
817           whiteSpace = null;
818         }
819         else {
820           select.snapshotMove(whiteSpace.firstChild, whiteSpace.firstChild, indentDiff, true);
821           whiteSpace.currentText = makeWhiteSpace(newIndent);
822           whiteSpace.firstChild.nodeValue = whiteSpace.currentText;
823         }
824       }
825       // Not enough...
826       else if (indentDiff > 0) {
827         // If there is whitespace, we grow it.
828         if (whiteSpace) {
829           whiteSpace.currentText = makeWhiteSpace(newIndent);
830           whiteSpace.firstChild.nodeValue = whiteSpace.currentText;
831         }
832         // Otherwise, we have to add a new whitespace node.
833         else {
834           whiteSpace = makePartSpan(makeWhiteSpace(newIndent), this.doc);
835           whiteSpace.className = "whitespace";
836           if (start) insertAfter(whiteSpace, start);
837           else this.container.insertBefore(whiteSpace, this.container.firstChild);
838         }
839         if (firstText) select.snapshotMove(firstText.firstChild, whiteSpace.firstChild, curIndent, false, true);
840       }
841       if (indentDiff != 0) this.addDirtyNode(start);
842       return whiteSpace;
843     },
844
845     // Re-highlight the selected part of the document.
846     highlightAtCursor: function() {
847       var pos = select.selectionTopNode(this.container, true);
848       var to = select.selectionTopNode(this.container, false);
849       if (pos === false || to === false) return;
850
851       select.markSelection(this.win);
852       if (this.highlight(pos, endOfLine(to, this.container), true, 20) === false)
853         return false;
854       select.selectMarked();
855       return true;
856     },
857
858     // When tab is pressed with text selected, the whole selection is
859     // re-indented, when nothing is selected, the line with the cursor
860     // is re-indented.
861     handleTab: function(direction) {
862       if (this.options.tabMode == "spaces")
863         select.insertTabAtCursor(this.win);
864       else
865         this.reindentSelection(direction);
866     },
867
868     home: function() {
869       var cur = select.selectionTopNode(this.container, true), start = cur;
870       if (cur === false || !(!cur || cur.isPart || cur.nodeName == "BR") || !this.container.firstChild)
871         return false;
872
873       while (cur && cur.nodeName != "BR") cur = cur.previousSibling;
874       var next = cur ? cur.nextSibling : this.container.firstChild;
875       if (next && next != start && next.isPart && hasClass(next, "whitespace"))
876         select.focusAfterNode(next, this.container);
877       else
878         select.focusAfterNode(cur, this.container);
879
880       select.scrollToCursor(this.container);
881       return true;
882     },
883
884     // Delay (or initiate) the next paren blink event.
885     scheduleParenBlink: function() {
886       if (this.parenEvent) this.parent.clearTimeout(this.parenEvent);
887       var self = this;
888       this.parenEvent = this.parent.setTimeout(function(){self.blinkParens();}, 300);
889     },
890
891     // Take the token before the cursor. If it contains a character in
892     // '()[]{}', search for the matching paren/brace/bracket, and
893     // highlight them in green for a moment, or red if no proper match
894     // was found.
895     blinkParens: function(jump) {
896       if (!window.select) return;
897       // Clear the event property.
898       if (this.parenEvent) this.parent.clearTimeout(this.parenEvent);
899       this.parenEvent = null;
900
901       // Extract a 'paren' from a piece of text.
902       function paren(node) {
903         if (node.currentText) {
904           var match = node.currentText.match(/^[\s\u00a0]*([\(\)\[\]{}])[\s\u00a0]*$/);
905           return match && match[1];
906         }
907       }
908       // Determine the direction a paren is facing.
909       function forward(ch) {
910         return /[\(\[\{]/.test(ch);
911       }
912
913       var ch, self = this, cursor = select.selectionTopNode(this.container, true);
914       if (!cursor || !this.highlightAtCursor()) return;
915       cursor = select.selectionTopNode(this.container, true);
916       if (!(cursor && ((ch = paren(cursor)) || (cursor = cursor.nextSibling) && (ch = paren(cursor)))))
917         return;
918       // We only look for tokens with the same className.
919       var className = cursor.className, dir = forward(ch), match = matching[ch];
920
921       // Since parts of the document might not have been properly
922       // highlighted, and it is hard to know in advance which part we
923       // have to scan, we just try, and when we find dirty nodes we
924       // abort, parse them, and re-try.
925       function tryFindMatch() {
926         var stack = [], ch, ok = true;;
927         for (var runner = cursor; runner; runner = dir ? runner.nextSibling : runner.previousSibling) {
928           if (runner.className == className && runner.nodeName == "SPAN" && (ch = paren(runner))) {
929             if (forward(ch) == dir)
930               stack.push(ch);
931             else if (!stack.length)
932               ok = false;
933             else if (stack.pop() != matching[ch])
934               ok = false;
935             if (!stack.length) break;
936           }
937           else if (runner.dirty || runner.nodeName != "SPAN" && runner.nodeName != "BR") {
938             return {node: runner, status: "dirty"};
939           }
940         }
941         return {node: runner, status: runner && ok};
942       }
943       // Temporarily give the relevant nodes a colour.
944       function blink(node, ok) {
945         node.style.fontWeight = "bold";
946         node.style.color = ok ? "#8F8" : "#F88";
947         self.parent.setTimeout(function() {node.style.fontWeight = ""; node.style.color = "";}, 500);
948       }
949
950       while (true) {
951         var found = tryFindMatch();
952         if (found.status == "dirty") {
953           this.highlight(found.node, endOfLine(found.node));
954           // Needed because in some corner cases a highlight does not
955           // reach a node.
956           found.node.dirty = false;
957           continue;
958         }
959         else {
960           blink(cursor, found.status);
961           if (found.node) {
962             blink(found.node, found.status);
963             if (jump) select.focusAfterNode(found.node.previousSibling, this.container);
964           }
965           break;
966         }
967       }
968     },
969
970     // Adjust the amount of whitespace at the start of the line that
971     // the cursor is on so that it is indented properly.
972     indentAtCursor: function(direction) {
973       if (!this.container.firstChild) return;
974       // The line has to have up-to-date lexical information, so we
975       // highlight it first.
976       if (!this.highlightAtCursor()) return;
977       var cursor = select.selectionTopNode(this.container, false);
978       // If we couldn't determine the place of the cursor,
979       // there's nothing to indent.
980       if (cursor === false)
981         return;
982       var lineStart = startOfLine(cursor);
983       var whiteSpace = this.indentLineAfter(lineStart, direction);
984       if (cursor == lineStart && whiteSpace)
985           cursor = whiteSpace;
986       // This means the indentation has probably messed up the cursor.
987       if (cursor == whiteSpace)
988         select.focusAfterNode(cursor, this.container);
989     },
990
991     // Indent all lines whose start falls inside of the current
992     // selection.
993     indentRegion: function(start, end, direction) {
994       var current = (start = startOfLine(start)), before = start && startOfLine(start.previousSibling);
995       if (end.nodeName != "BR") end = endOfLine(end, this.container);
996
997       do {
998         var next = endOfLine(current, this.container);
999         if (current) this.highlight(before, next, true);
1000         this.indentLineAfter(current, direction);
1001         before = current;
1002         current = next;
1003       } while (current != end);
1004       select.setCursorPos(this.container, {node: start, offset: 0}, {node: end, offset: 0});
1005     },
1006
1007     // Find the node that the cursor is in, mark it as dirty, and make
1008     // sure a highlight pass is scheduled.
1009     cursorActivity: function(safe) {
1010       if (internetExplorer) {
1011         this.container.createTextRange().execCommand("unlink");
1012         this.selectionSnapshot = select.selectionCoords(this.win);
1013       }
1014
1015       var activity = this.options.cursorActivity;
1016       if (!safe || activity) {
1017         var cursor = select.selectionTopNode(this.container, false);
1018         if (cursor === false || !this.container.firstChild) return;
1019         cursor = cursor || this.container.firstChild;
1020         if (activity) activity(cursor);
1021         if (!safe) {
1022           this.scheduleHighlight();
1023           this.addDirtyNode(cursor);
1024         }
1025       }
1026     },
1027
1028     reparseBuffer: function() {
1029       forEach(this.container.childNodes, function(node) {node.dirty = true;});
1030       if (this.container.firstChild)
1031         this.addDirtyNode(this.container.firstChild);
1032     },
1033
1034     // Add a node to the set of dirty nodes, if it isn't already in
1035     // there.
1036     addDirtyNode: function(node) {
1037       node = node || this.container.firstChild;
1038       if (!node) return;
1039
1040       for (var i = 0; i < this.dirty.length; i++)
1041         if (this.dirty[i] == node) return;
1042
1043       if (node.nodeType != 3)
1044         node.dirty = true;
1045       this.dirty.push(node);
1046     },
1047
1048     // Cause a highlight pass to happen in options.passDelay
1049     // milliseconds. Clear the existing timeout, if one exists. This
1050     // way, the passes do not happen while the user is typing, and
1051     // should as unobtrusive as possible.
1052     scheduleHighlight: function() {
1053       // Timeouts are routed through the parent window, because on
1054       // some browsers designMode windows do not fire timeouts.
1055       var self = this;
1056       this.parent.clearTimeout(this.highlightTimeout);
1057       this.highlightTimeout = this.parent.setTimeout(function(){self.highlightDirty();}, this.options.passDelay);
1058     },
1059
1060     // Fetch one dirty node, and remove it from the dirty set.
1061     getDirtyNode: function() {
1062       while (this.dirty.length > 0) {
1063         var found = this.dirty.pop();
1064         // IE8 sometimes throws an unexplainable 'invalid argument'
1065         // exception for found.parentNode
1066         try {
1067           // If the node has been coloured in the meantime, or is no
1068           // longer in the document, it should not be returned.
1069           while (found && found.parentNode != this.container)
1070             found = found.parentNode
1071           if (found && (found.dirty || found.nodeType == 3))
1072             return found;
1073         } catch (e) {}
1074       }
1075       return null;
1076     },
1077
1078     // Pick dirty nodes, and highlight them, until options.passTime
1079     // milliseconds have gone by. The highlight method will continue
1080     // to next lines as long as it finds dirty nodes. It returns
1081     // information about the place where it stopped. If there are
1082     // dirty nodes left after this function has spent all its lines,
1083     // it shedules another highlight to finish the job.
1084     highlightDirty: function(force) {
1085       // Prevent FF from raising an error when it is firing timeouts
1086       // on a page that's no longer loaded.
1087       if (!window.select) return;
1088
1089       if (!this.options.readOnly) select.markSelection(this.win);
1090       var start, endTime = force ? null : time() + this.options.passTime;
1091       while ((time() < endTime || force) && (start = this.getDirtyNode())) {
1092         var result = this.highlight(start, endTime);
1093         if (result && result.node && result.dirty)
1094           this.addDirtyNode(result.node);
1095       }
1096       if (!this.options.readOnly) select.selectMarked();
1097       if (start) this.scheduleHighlight();
1098       return this.dirty.length == 0;
1099     },
1100
1101     // Creates a function that, when called through a timeout, will
1102     // continuously re-parse the document.
1103     documentScanner: function(passTime) {
1104       var self = this, pos = null;
1105       return function() {
1106         // FF timeout weirdness workaround.
1107         if (!window.select) return;
1108         // If the current node is no longer in the document... oh
1109         // well, we start over.
1110         if (pos && pos.parentNode != self.container)
1111           pos = null;
1112         select.markSelection(self.win);
1113         var result = self.highlight(pos, time() + passTime, true);
1114         select.selectMarked();
1115         var newPos = result ? (result.node && result.node.nextSibling) : null;
1116         pos = (pos == newPos) ? null : newPos;
1117         self.delayScanning();
1118       };
1119     },
1120
1121     // Starts the continuous scanning process for this document after
1122     // a given interval.
1123     delayScanning: function() {
1124       if (this.scanner) {
1125         this.parent.clearTimeout(this.documentScan);
1126         this.documentScan = this.parent.setTimeout(this.scanner, this.options.continuousScanning);
1127       }
1128     },
1129
1130     // The function that does the actual highlighting/colouring (with
1131     // help from the parser and the DOM normalizer). Its interface is
1132     // rather overcomplicated, because it is used in different
1133     // situations: ensuring that a certain line is highlighted, or
1134     // highlighting up to X milliseconds starting from a certain
1135     // point. The 'from' argument gives the node at which it should
1136     // start. If this is null, it will start at the beginning of the
1137     // document. When a timestamp is given with the 'target' argument,
1138     // it will stop highlighting at that time. If this argument holds
1139     // a DOM node, it will highlight until it reaches that node. If at
1140     // any time it comes across two 'clean' lines (no dirty nodes), it
1141     // will stop, except when 'cleanLines' is true. maxBacktrack is
1142     // the maximum number of lines to backtrack to find an existing
1143     // parser instance. This is used to give up in situations where a
1144     // highlight would take too long and freeze the browser interface.
1145     highlight: function(from, target, cleanLines, maxBacktrack){
1146       var container = this.container, self = this, active = this.options.activeTokens;
1147       var endTime = (typeof target == "number" ? target : null);
1148
1149       if (!container.firstChild)
1150         return;
1151       // Backtrack to the first node before from that has a partial
1152       // parse stored.
1153       while (from && (!from.parserFromHere || from.dirty)) {
1154         if (maxBacktrack != null && from.nodeName == "BR" && (--maxBacktrack) < 0)
1155           return false;
1156         from = from.previousSibling;
1157       }
1158       // If we are at the end of the document, do nothing.
1159       if (from && !from.nextSibling)
1160         return;
1161
1162       // Check whether a part (<span> node) and the corresponding token
1163       // match.
1164       function correctPart(token, part){
1165         return !part.reduced && part.currentText == token.value && part.className == token.style;
1166       }
1167       // Shorten the text associated with a part by chopping off
1168       // characters from the front. Note that only the currentText
1169       // property gets changed. For efficiency reasons, we leave the
1170       // nodeValue alone -- we set the reduced flag to indicate that
1171       // this part must be replaced.
1172       function shortenPart(part, minus){
1173         part.currentText = part.currentText.substring(minus);
1174         part.reduced = true;
1175       }
1176       // Create a part corresponding to a given token.
1177       function tokenPart(token){
1178         var part = makePartSpan(token.value, self.doc);
1179         part.className = token.style;
1180         return part;
1181       }
1182
1183       function maybeTouch(node) {
1184         if (node) {
1185           var old = node.oldNextSibling;
1186           if (lineDirty || old === undefined || node.nextSibling != old)
1187             self.history.touch(node);
1188           node.oldNextSibling = node.nextSibling;
1189         }
1190         else {
1191           var old = self.container.oldFirstChild;
1192           if (lineDirty || old === undefined || self.container.firstChild != old)
1193             self.history.touch(null);
1194           self.container.oldFirstChild = self.container.firstChild;
1195         }
1196       }
1197
1198       // Get the token stream. If from is null, we start with a new
1199       // parser from the start of the frame, otherwise a partial parse
1200       // is resumed.
1201       var traversal = traverseDOM(from ? from.nextSibling : container.firstChild),
1202           stream = stringStream(traversal),
1203           parsed = from ? from.parserFromHere(stream) : Editor.Parser.make(stream);
1204
1205       // parts is an interface to make it possible to 'delay' fetching
1206       // the next DOM node until we are completely done with the one
1207       // before it. This is necessary because often the next node is
1208       // not yet available when we want to proceed past the current
1209       // one.
1210       var parts = {
1211         current: null,
1212         // Fetch current node.
1213         get: function(){
1214           if (!this.current)
1215             this.current = traversal.nodes.shift();
1216           return this.current;
1217         },
1218         // Advance to the next part (do not fetch it yet).
1219         next: function(){
1220           this.current = null;
1221         },
1222         // Remove the current part from the DOM tree, and move to the
1223         // next.
1224         remove: function(){
1225           container.removeChild(this.get());
1226           this.current = null;
1227         },
1228         // Advance to the next part that is not empty, discarding empty
1229         // parts.
1230         getNonEmpty: function(){
1231           var part = this.get();
1232           // Allow empty nodes when they are alone on a line, needed
1233           // for the FF cursor bug workaround (see select.js,
1234           // insertNewlineAtCursor).
1235           while (part && part.nodeName == "SPAN" && part.currentText == "") {
1236             var old = part;
1237             this.remove();
1238             part = this.get();
1239             // Adjust selection information, if any. See select.js for details.
1240             select.snapshotMove(old.firstChild, part && (part.firstChild || part), 0);
1241           }
1242           return part;
1243         }
1244       };
1245
1246       var lineDirty = false, prevLineDirty = true, lineNodes = 0;
1247
1248       // This forEach loops over the tokens from the parsed stream, and
1249       // at the same time uses the parts object to proceed through the
1250       // corresponding DOM nodes.
1251       forEach(parsed, function(token){
1252         var part = parts.getNonEmpty();
1253
1254         if (token.value == "\n"){
1255           // The idea of the two streams actually staying synchronized
1256           // is such a long shot that we explicitly check.
1257           if (part.nodeName != "BR")
1258             throw "Parser out of sync. Expected BR.";
1259
1260           if (part.dirty || !part.indentation) lineDirty = true;
1261           maybeTouch(from);
1262           from = part;
1263
1264           // Every <br> gets a copy of the parser state and a lexical
1265           // context assigned to it. The first is used to be able to
1266           // later resume parsing from this point, the second is used
1267           // for indentation.
1268           part.parserFromHere = parsed.copy();
1269           part.indentation = token.indentation;
1270           part.dirty = false;
1271
1272           // If the target argument wasn't an integer, go at least
1273           // until that node.
1274           if (endTime == null && part == target) throw StopIteration;
1275
1276           // A clean line with more than one node means we are done.
1277           // Throwing a StopIteration is the way to break out of a
1278           // MochiKit forEach loop.
1279           if ((endTime != null && time() >= endTime) || (!lineDirty && !prevLineDirty && lineNodes > 1 && !cleanLines))
1280             throw StopIteration;
1281           prevLineDirty = lineDirty; lineDirty = false; lineNodes = 0;
1282           parts.next();
1283         }
1284         else {
1285           if (part.nodeName != "SPAN")
1286             throw "Parser out of sync. Expected SPAN.";
1287           if (part.dirty)
1288             lineDirty = true;
1289           lineNodes++;
1290
1291           // If the part matches the token, we can leave it alone.
1292           if (correctPart(token, part)){
1293             part.dirty = false;
1294             parts.next();
1295           }
1296           // Otherwise, we have to fix it.
1297           else {
1298             lineDirty = true;
1299             // Insert the correct part.
1300             var newPart = tokenPart(token);
1301             container.insertBefore(newPart, part);
1302             if (active) active(newPart, token, self);
1303             var tokensize = token.value.length;
1304             var offset = 0;
1305             // Eat up parts until the text for this token has been
1306             // removed, adjusting the stored selection info (see
1307             // select.js) in the process.
1308             while (tokensize > 0) {
1309               part = parts.get();
1310               var partsize = part.currentText.length;
1311               select.snapshotReplaceNode(part.firstChild, newPart.firstChild, tokensize, offset);
1312               if (partsize > tokensize){
1313                 shortenPart(part, tokensize);
1314                 tokensize = 0;
1315               }
1316               else {
1317                 tokensize -= partsize;
1318                 offset += partsize;
1319                 parts.remove();
1320               }
1321             }
1322           }
1323         }
1324       });
1325       maybeTouch(from);
1326       webkitLastLineHack(this.container);
1327
1328       // The function returns some status information that is used by
1329       // hightlightDirty to determine whether and where it has to
1330       // continue.
1331       return {node: parts.getNonEmpty(),
1332               dirty: lineDirty};
1333     }
1334   };
1335
1336   return Editor;
1337 })();
1338
1339 addEventHandler(window, "load", function() {
1340   var CodeMirror = window.frameElement.CodeMirror;
1341   CodeMirror.editor = new Editor(CodeMirror.options);
1342   this.parent.setTimeout(method(CodeMirror, "init"), 0);
1343 });