UNPKG

neutrinoscript

Version:
1,134 lines (1,077 loc) 128 kB
// All functions that need access to the editor's state live inside // the CodeMirror function. Below that, at the bottom of the file, // some utilities are defined. // CodeMirror is the only global var we claim var CodeMirror = (function() { // This is the function that produces an editor instance. Its // closure is used to store the editor state. function CodeMirror(place, givenOptions) { // Determine effective options based on given values and defaults. var options = {}, defaults = CodeMirror.defaults; for (var opt in defaults) if (defaults.hasOwnProperty(opt)) options[opt] = (givenOptions && givenOptions.hasOwnProperty(opt) ? givenOptions : defaults)[opt]; // The element in which the editor lives. var wrapper = document.createElement('div'); wrapper.className = 'CodeMirror' + (options.lineWrapping ? ' CodeMirror-wrap' : ''); // This mess creates the base DOM structure for the editor. wrapper.innerHTML = '<div style="overflow: hidden; position: relative; width: 3px; height: 0px;">' + // Wraps and hides input textarea '<textarea style="position: absolute; padding: 0; width: 1px; height: 1em" wrap="off" ' + 'autocorrect="off" autocapitalize="off"></textarea></div>' + '<div class="CodeMirror-scroll" tabindex="-1">' + '<div style="position: relative">' + // Set to the height of the text, causes scrolling '<div style="position: relative">' + // Moved around its parent to cover visible view '<div class="CodeMirror-gutter"><div class="CodeMirror-gutter-text"></div></div>' + // Provides positioning relative to (visible) text origin '<div class="CodeMirror-lines"><div style="position: relative; z-index: 0">' + '<div style="position: absolute; width: 100%; height: 0; overflow: hidden; visibility: hidden;"></div>' + '<pre class="CodeMirror-cursor">&#160;</pre>' + // Absolutely positioned blinky cursor '<div style="position: relative; z-index: -1"></div><div></div>' + // DIVs containing the selection and the actual code '</div></div></div></div></div>'; if (place.appendChild) place.appendChild(wrapper); else place(wrapper); // I've never seen more elegant code in my life. var inputDiv = wrapper.firstChild, input = inputDiv.firstChild, scroller = wrapper.lastChild, code = scroller.firstChild, mover = code.firstChild, gutter = mover.firstChild, gutterText = gutter.firstChild, lineSpace = gutter.nextSibling.firstChild, measure = lineSpace.firstChild, cursor = measure.nextSibling, selectionDiv = cursor.nextSibling, lineDiv = selectionDiv.nextSibling; themeChanged(); keyMapChanged(); // Needed to hide big blue blinking cursor on Mobile Safari if (ios) input.style.width = '0px'; if (!webkit) lineSpace.draggable = true; lineSpace.style.outline = 'none'; if (options.tabindex != null) input.tabIndex = options.tabindex; if (options.autofocus) focusInput(); if (!options.gutter && !options.lineNumbers) gutter.style.display = 'none'; // Needed to handle Tab key in KHTML if (khtml) inputDiv.style.height = '1px', inputDiv.style.position = 'absolute'; // Check for problem with IE innerHTML not working when we have a // P (or similar) parent node. try { stringWidth('x'); } catch (e) { if (e.message.match(/runtime/i)) e = new Error('A CodeMirror inside a P-style element does not work in Internet Explorer. (innerHTML bug)'); throw e; } // Delayed object wrap timeouts, making sure only one is active. blinker holds an interval. var poll = new Delayed(), highlight = new Delayed(), blinker; // mode holds a mode API object. doc is the tree of Line objects, // work an array of lines that should be parsed, and history the // undo history (instance of History constructor). var mode, doc = new BranchChunk([new LeafChunk([new Line('')])]), work, focused; loadMode(); // The selection. These are always maintained to point at valid // positions. Inverted is used to remember that the user is // selecting bottom-to-top. var sel = {from: {line: 0, ch: 0}, to: {line: 0, ch: 0}, inverted: false}; // Selection-related flags. shiftSelecting obviously tracks // whether the user is holding shift. var shiftSelecting, lastClick, lastDoubleClick, lastScrollPos = 0, draggingText, overwrite = false, suppressEdits = false; // Variables used by startOperation/endOperation to track what // happened during the operation. var updateInput, userSelChange, changes, textChanged, selectionChanged, leaveInputAlone, gutterDirty, callbacks; // Current visible range (may be bigger than the view window). var displayOffset = 0, showingFrom = 0, showingTo = 0, lastSizeC = 0; // bracketHighlighted is used to remember that a bracket has been // marked. var bracketHighlighted; // Tracks the maximum line length so that the horizontal scrollbar // can be kept static when scrolling. var maxLine = '', maxWidth; var tabCache = {}; // Initialize the content. operation(function(){setValue(options.value || ''); updateInput = false;})(); var history = new History(); // Register our event handlers. connect(scroller, 'mousedown', operation(onMouseDown)); connect(scroller, 'dblclick', operation(onDoubleClick)); connect(lineSpace, 'selectstart', e_preventDefault); // Gecko browsers fire contextmenu *after* opening the menu, at // which point we can't mess with it anymore. Context menu is // handled in onMouseDown for Gecko. if (!gecko) connect(scroller, 'contextmenu', onContextMenu); connect(scroller, 'scroll', function() { lastScrollPos = scroller.scrollTop; updateDisplay([]); if (options.fixedGutter) gutter.style.left = scroller.scrollLeft + 'px'; if (options.onScroll) options.onScroll(instance); }); connect(window, 'resize', function() {updateDisplay(true);}); connect(input, 'keyup', operation(onKeyUp)); connect(input, 'input', fastPoll); connect(input, 'keydown', operation(onKeyDown)); connect(input, 'keypress', operation(onKeyPress)); connect(input, 'focus', onFocus); connect(input, 'blur', onBlur); if (options.dragDrop) { connect(lineSpace, 'dragstart', onDragStart); function drag_(e) { if (options.onDragEvent && options.onDragEvent(instance, addStop(e))) return; e_stop(e); } connect(scroller, 'dragenter', drag_); connect(scroller, 'dragover', drag_); connect(scroller, 'drop', operation(onDrop)); } connect(scroller, 'paste', function(){focusInput(); fastPoll();}); connect(input, 'paste', fastPoll); connect(input, 'cut', operation(function(){ if (!options.readOnly) replaceSelection(''); })); // Needed to handle Tab key in KHTML if (khtml) connect(code, 'mouseup', function() { if (document.activeElement == input) input.blur(); focusInput(); }); // IE throws unspecified error in certain cases, when // trying to access activeElement before onload var hasFocus; try { hasFocus = (document.activeElement == input); } catch(e) { } if (hasFocus || options.autofocus) setTimeout(onFocus, 20); else onBlur(); function isLine(l) {return l >= 0 && l < doc.size;} // The instance object that we'll return. Mostly calls out to // local functions in the CodeMirror function. Some do some extra // range checking and/or clipping. operation is used to wrap the // call so that changes it makes are tracked, and the display is // updated afterwards. var instance = wrapper.CodeMirror = { getValue: getValue, setValue: operation(setValue), getSelection: getSelection, replaceSelection: operation(replaceSelection), focus: function(){window.focus(); focusInput(); onFocus(); fastPoll();}, setOption: function(option, value) { var oldVal = options[option]; options[option] = value; if (option == 'mode' || option == 'indentUnit') loadMode(); else if (option == 'readOnly' && value == 'nocursor') {onBlur(); input.blur();} else if (option == 'readOnly' && !value) {resetInput(true);} else if (option == 'theme') themeChanged(); else if (option == 'lineWrapping' && oldVal != value) operation(wrappingChanged)(); else if (option == 'tabSize') updateDisplay(true); else if (option == 'keyMap') keyMapChanged(); if (option == 'lineNumbers' || option == 'gutter' || option == 'firstLineNumber' || option == 'theme') { gutterChanged(); updateDisplay(true); } }, getOption: function(option) {return options[option];}, undo: operation(undo), redo: operation(redo), indentLine: operation(function(n, dir) { if (typeof dir != 'string') { if (dir == null) dir = options.smartIndent ? 'smart' : 'prev'; else dir = dir ? 'add' : 'subtract'; } if (isLine(n)) indentLine(n, dir); }), indentSelection: operation(indentSelected), historySize: function() {return {undo: history.done.length, redo: history.undone.length};}, clearHistory: function() {history = new History();}, matchBrackets: operation(function(){matchBrackets(true);}), getTokenAt: operation(function(pos) { pos = clipPos(pos); return getLine(pos.line).getTokenAt(mode, getStateBefore(pos.line), pos.ch); }), getStateAfter: function(line) { line = clipLine(line == null ? doc.size - 1: line); return getStateBefore(line + 1); }, cursorCoords: function(start, mode) { if (start == null) start = sel.inverted; return this.charCoords(start ? sel.from : sel.to, mode); }, charCoords: function(pos, mode) { pos = clipPos(pos); if (mode == 'local') return localCoords(pos, false); if (mode == 'div') return localCoords(pos, true); return pageCoords(pos); }, coordsChar: function(coords) { var off = eltOffset(lineSpace); return coordsChar(coords.x - off.left, coords.y - off.top); }, markText: operation(markText), setBookmark: setBookmark, findMarksAt: findMarksAt, setMarker: operation(addGutterMarker), clearMarker: operation(removeGutterMarker), setLineClass: operation(setLineClass), hideLine: operation(function(h) {return setLineHidden(h, true);}), showLine: operation(function(h) {return setLineHidden(h, false);}), onDeleteLine: function(line, f) { if (typeof line == 'number') { if (!isLine(line)) return null; line = getLine(line); } (line.handlers || (line.handlers = [])).push(f); return line; }, lineInfo: lineInfo, addWidget: function(pos, node, scroll, vert, horiz) { pos = localCoords(clipPos(pos)); var top = pos.yBot, left = pos.x; node.style.position = 'absolute'; code.appendChild(node); if (vert == 'over') top = pos.y; else if (vert == 'near') { var vspace = Math.max(scroller.offsetHeight, doc.height * textHeight()), hspace = Math.max(code.clientWidth, lineSpace.clientWidth) - paddingLeft(); if (pos.yBot + node.offsetHeight > vspace && pos.y > node.offsetHeight) top = pos.y - node.offsetHeight; if (left + node.offsetWidth > hspace) left = hspace - node.offsetWidth; } node.style.top = (top + paddingTop()) + 'px'; node.style.left = node.style.right = ''; if (horiz == 'right') { left = code.clientWidth - node.offsetWidth; node.style.right = '0px'; } else { if (horiz == 'left') left = 0; else if (horiz == 'middle') left = (code.clientWidth - node.offsetWidth) / 2; node.style.left = (left + paddingLeft()) + 'px'; } if (scroll) scrollIntoView(left, top, left + node.offsetWidth, top + node.offsetHeight); }, lineCount: function() {return doc.size;}, clipPos: clipPos, getCursor: function(start) { if (start == null) start = sel.inverted; return copyPos(start ? sel.from : sel.to); }, somethingSelected: function() {return !posEq(sel.from, sel.to);}, setCursor: operation(function(line, ch, user) { if (ch == null && typeof line.line == 'number') setCursor(line.line, line.ch, user); else setCursor(line, ch, user); }), setSelection: operation(function(from, to, user) { (user ? setSelectionUser : setSelection)(clipPos(from), clipPos(to || from)); }), getLine: function(line) {if (isLine(line)) return getLine(line).text;}, getLineHandle: function(line) {if (isLine(line)) return getLine(line);}, setLine: operation(function(line, text) { if (isLine(line)) replaceRange(text, {line: line, ch: 0}, {line: line, ch: getLine(line).text.length}); }), removeLine: operation(function(line) { if (isLine(line)) replaceRange('', {line: line, ch: 0}, clipPos({line: line+1, ch: 0})); }), replaceRange: operation(replaceRange), getRange: function(from, to) {return getRange(clipPos(from), clipPos(to));}, triggerOnKeyDown: operation(onKeyDown), execCommand: function(cmd) {return commands[cmd](instance);}, // Stuff used by commands, probably not much use to outside code. moveH: operation(moveH), deleteH: operation(deleteH), moveV: operation(moveV), toggleOverwrite: function() { if(overwrite){ overwrite = false; cursor.className = cursor.className.replace(' CodeMirror-overwrite', ''); } else { overwrite = true; cursor.className += ' CodeMirror-overwrite'; } }, posFromIndex: function(off) { var lineNo = 0, ch; doc.iter(0, doc.size, function(line) { var sz = line.text.length + 1; if (sz > off) { ch = off; return true; } off -= sz; ++lineNo; }); return clipPos({line: lineNo, ch: ch}); }, indexFromPos: function (coords) { if (coords.line < 0 || coords.ch < 0) return 0; var index = coords.ch; doc.iter(0, coords.line, function (line) { index += line.text.length + 1; }); return index; }, scrollTo: function(x, y) { if (x != null) scroller.scrollLeft = x; if (y != null) scroller.scrollTop = y; updateDisplay([]); }, operation: function(f){return operation(f)();}, compoundChange: function(f){return compoundChange(f);}, refresh: function(){ updateDisplay(true); if (scroller.scrollHeight > lastScrollPos) scroller.scrollTop = lastScrollPos; }, getInputField: function(){return input;}, getWrapperElement: function(){return wrapper;}, getScrollerElement: function(){return scroller;}, getGutterElement: function(){return gutter;} }; function getLine(n) { return getLineAt(doc, n); } function updateLineHeight(line, height) { gutterDirty = true; var diff = height - line.height; for (var n = line; n; n = n.parent) n.height += diff; } function setValue(code) { var top = {line: 0, ch: 0}; updateLines(top, {line: doc.size - 1, ch: getLine(doc.size-1).text.length}, splitLines(code), top, top); updateInput = true; } function getValue() { var text = []; doc.iter(0, doc.size, function(line) { text.push(line.text); }); return text.join('\n'); } function onMouseDown(e) { setShift(e_prop(e, 'shiftKey')); // Check whether this is a click in a widget for (var n = e_target(e); n != wrapper; n = n.parentNode) if (n.parentNode == code && n != mover) return; // See if this is a click in the gutter for (var n = e_target(e); n != wrapper; n = n.parentNode) if (n.parentNode == gutterText) { if (options.onGutterClick) options.onGutterClick(instance, indexOf(gutterText.childNodes, n) + showingFrom, e); return e_preventDefault(e); } var start = posFromMouse(e); switch (e_button(e)) { case 3: if (gecko && !mac) onContextMenu(e); return; case 2: if (start) setCursor(start.line, start.ch, true); setTimeout(focusInput, 20); return; } // For button 1, if it was clicked inside the editor // (posFromMouse returning non-null), we have to adjust the // selection. if (!start) {if (e_target(e) == scroller) e_preventDefault(e); return;} if (!focused) onFocus(); var now = +new Date; if (lastDoubleClick && lastDoubleClick.time > now - 400 && posEq(lastDoubleClick.pos, start)) { e_preventDefault(e); setTimeout(focusInput, 20); return selectLine(start.line); } else if (lastClick && lastClick.time > now - 400 && posEq(lastClick.pos, start)) { lastDoubleClick = {time: now, pos: start}; e_preventDefault(e); return selectWordAt(start); } else { lastClick = {time: now, pos: start}; } var last = start, going; if (options.dragDrop && dragAndDrop && !options.readOnly && !posEq(sel.from, sel.to) && !posLess(start, sel.from) && !posLess(sel.to, start)) { // Let the drag handler handle this. if (webkit) lineSpace.draggable = true; function dragEnd(e2) { if (webkit) lineSpace.draggable = false; draggingText = false; up(); drop(); if (Math.abs(e.clientX - e2.clientX) + Math.abs(e.clientY - e2.clientY) < 10) { e_preventDefault(e2); setCursor(start.line, start.ch, true); focusInput(); } } var up = connect(document, 'mouseup', operation(dragEnd), true); var drop = connect(scroller, 'drop', operation(dragEnd), true); draggingText = true; // IE's approach to draggable if (lineSpace.dragDrop) lineSpace.dragDrop(); return; } e_preventDefault(e); setCursor(start.line, start.ch, true); function extend(e) { var cur = posFromMouse(e, true); if (cur && !posEq(cur, last)) { if (!focused) onFocus(); last = cur; setSelectionUser(start, cur); updateInput = false; var visible = visibleLines(); if (cur.line >= visible.to || cur.line < visible.from) going = setTimeout(operation(function(){extend(e);}), 150); } } function done(e) { clearTimeout(going); var cur = posFromMouse(e); if (cur) setSelectionUser(start, cur); e_preventDefault(e); focusInput(); updateInput = true; move(); up(); } var move = connect(document, 'mousemove', operation(function(e) { clearTimeout(going); e_preventDefault(e); if (!ie && !e_button(e)) done(e); else extend(e); }), true); var up = connect(document, 'mouseup', operation(done), true); } function onDoubleClick(e) { for (var n = e_target(e); n != wrapper; n = n.parentNode) if (n.parentNode == gutterText) return e_preventDefault(e); var start = posFromMouse(e); if (!start) return; lastDoubleClick = {time: +new Date, pos: start}; e_preventDefault(e); selectWordAt(start); } function onDrop(e) { if (options.onDragEvent && options.onDragEvent(instance, addStop(e))) return; e.preventDefault(); var pos = posFromMouse(e, true), files = e.dataTransfer.files; if (!pos || options.readOnly) return; if (files && files.length && window.FileReader && window.File) { function loadFile(file, i) { var reader = new FileReader; reader.onload = function() { text[i] = reader.result; if (++read == n) { pos = clipPos(pos); operation(function() { var end = replaceRange(text.join(''), pos, pos); setSelectionUser(pos, end); })(); } }; reader.readAsText(file); } var n = files.length, text = Array(n), read = 0; for (var i = 0; i < n; ++i) loadFile(files[i], i); } else { try { var text = e.dataTransfer.getData('Text'); if (text) { compoundChange(function() { var curFrom = sel.from, curTo = sel.to; setSelectionUser(pos, pos); if (draggingText) replaceRange('', curFrom, curTo); replaceSelection(text); focusInput(); }); } } catch(e){} } } function onDragStart(e) { var txt = getSelection(); e.dataTransfer.setData('Text', txt); // Use dummy image instead of default browsers image. if (gecko || chrome) { var img = document.createElement('img'); img.scr = 'data:image/gif;base64,R0lGODdhAgACAIAAAAAAAP///ywAAAAAAgACAAACAoRRADs='; //1x1 image e.dataTransfer.setDragImage(img, 0, 0); } } function doHandleBinding(bound, dropShift) { if (typeof bound == 'string') { bound = commands[bound]; if (!bound) return false; } var prevShift = shiftSelecting; try { if (options.readOnly) suppressEdits = true; if (dropShift) shiftSelecting = null; bound(instance); } catch(e) { if (e != Pass) throw e; return false; } finally { shiftSelecting = prevShift; suppressEdits = false; } return true; } function handleKeyBinding(e) { // Handle auto keymap transitions var startMap = getKeyMap(options.keyMap), next = startMap.auto; clearTimeout(maybeTransition); if (next && !isModifierKey(e)) maybeTransition = setTimeout(function() { if (getKeyMap(options.keyMap) == startMap) { options.keyMap = (next.call ? next.call(null, instance) : next); } }, 50); var name = keyNames[e_prop(e, 'keyCode')], handled = false; if (name == null || e.altGraphKey) return false; if (e_prop(e, 'altKey')) name = 'Alt-' + name; if (e_prop(e, 'ctrlKey')) name = 'Ctrl-' + name; if (e_prop(e, 'metaKey')) name = 'Cmd-' + name; var stopped = false; function stop() { stopped = true; } if (e_prop(e, 'shiftKey')) { handled = lookupKey('Shift-' + name, options.extraKeys, options.keyMap, function(b) {return doHandleBinding(b, true);}, stop) || lookupKey(name, options.extraKeys, options.keyMap, function(b) { if (typeof b == 'string' && /^go[A-Z]/.test(b)) return doHandleBinding(b); }, stop); } else { handled = lookupKey(name, options.extraKeys, options.keyMap, doHandleBinding, stop); } if (stopped) handled = false; if (handled) { e_preventDefault(e); restartBlink(); if (ie) { e.oldKeyCode = e.keyCode; e.keyCode = 0; } } return handled; } function handleCharBinding(e, ch) { var handled = lookupKey('\'' + ch + '\'', options.extraKeys, options.keyMap, function(b) { return doHandleBinding(b, true); }); if (handled) { e_preventDefault(e); restartBlink(); } return handled; } var lastStoppedKey = null, maybeTransition; function onKeyDown(e) { if (!focused) onFocus(); if (ie && e.keyCode == 27) { e.returnValue = false; } if (pollingFast) { if (readInput()) pollingFast = false; } if (options.onKeyEvent && options.onKeyEvent(instance, addStop(e))) return; var code = e_prop(e, 'keyCode'); // IE does strange things with escape. setShift(code == 16 || e_prop(e, 'shiftKey')); // First give onKeyEvent option a chance to handle this. var handled = handleKeyBinding(e); if (window.opera) { lastStoppedKey = handled ? code : null; // Opera has no cut event... we try to at least catch the key combo if (!handled && code == 88 && e_prop(e, mac ? 'metaKey' : 'ctrlKey')) replaceSelection(''); } } function onKeyPress(e) { if (pollingFast) readInput(); if (options.onKeyEvent && options.onKeyEvent(instance, addStop(e))) return; var keyCode = e_prop(e, 'keyCode'), charCode = e_prop(e, 'charCode'); if (window.opera && keyCode == lastStoppedKey) {lastStoppedKey = null; e_preventDefault(e); return;} if (((window.opera && !e.which) || khtml) && handleKeyBinding(e)) return; var ch = String.fromCharCode(charCode == null ? keyCode : charCode); if (options.electricChars && mode.electricChars && options.smartIndent && !options.readOnly) { if (mode.electricChars.indexOf(ch) > -1) setTimeout(operation(function() {indentLine(sel.to.line, 'smart');}), 75); } if (handleCharBinding(e, ch)) return; fastPoll(); } function onKeyUp(e) { if (options.onKeyEvent && options.onKeyEvent(instance, addStop(e))) return; if (e_prop(e, 'keyCode') == 16) shiftSelecting = null; } function onFocus() { if (options.readOnly == 'nocursor') return; if (!focused) { if (options.onFocus) options.onFocus(instance); focused = true; if (wrapper.className.search(/\bCodeMirror-focused\b/) == -1) wrapper.className += ' CodeMirror-focused'; if (!leaveInputAlone) resetInput(true); } slowPoll(); restartBlink(); } function onBlur() { if (focused) { if (options.onBlur) options.onBlur(instance); focused = false; if (bracketHighlighted) operation(function(){ if (bracketHighlighted) { bracketHighlighted(); bracketHighlighted = null; } })(); wrapper.className = wrapper.className.replace(' CodeMirror-focused', ''); } clearInterval(blinker); setTimeout(function() {if (!focused) shiftSelecting = null;}, 150); } // Replace the range from from to to by the strings in newText. // Afterwards, set the selection to selFrom, selTo. function updateLines(from, to, newText, selFrom, selTo) { if (suppressEdits) return; if (history) { var old = []; doc.iter(from.line, to.line + 1, function(line) { old.push(line.text); }); history.addChange(from.line, newText.length, old); while (history.done.length > options.undoDepth) history.done.shift(); } updateLinesNoUndo(from, to, newText, selFrom, selTo); } function unredoHelper(from, to) { if (!from.length) return; var set = from.pop(), out = []; for (var i = set.length - 1; i >= 0; i -= 1) { var change = set[i]; var replaced = [], end = change.start + change.added; doc.iter(change.start, end, function(line) { replaced.push(line.text); }); out.push({start: change.start, added: change.old.length, old: replaced}); var pos = clipPos({line: change.start + change.old.length - 1, ch: editEnd(replaced[replaced.length-1], change.old[change.old.length-1])}); updateLinesNoUndo({line: change.start, ch: 0}, {line: end - 1, ch: getLine(end-1).text.length}, change.old, pos, pos); } updateInput = true; to.push(out); } function undo() {unredoHelper(history.done, history.undone);} function redo() {unredoHelper(history.undone, history.done);} function updateLinesNoUndo(from, to, newText, selFrom, selTo) { if (suppressEdits) return; var recomputeMaxLength = false, maxLineLength = maxLine.length; if (!options.lineWrapping) doc.iter(from.line, to.line + 1, function(line) { if (line.text.length == maxLineLength) {recomputeMaxLength = true; return true;} }); if (from.line != to.line || newText.length > 1) gutterDirty = true; var nlines = to.line - from.line, firstLine = getLine(from.line), lastLine = getLine(to.line); // First adjust the line structure, taking some care to leave highlighting intact. if (from.ch == 0 && to.ch == 0 && newText[newText.length - 1] == '') { // This is a whole-line replace. Treated specially to make // sure line objects move the way they are supposed to. var added = [], prevLine = null; if (from.line) { prevLine = getLine(from.line - 1); prevLine.fixMarkEnds(lastLine); } else lastLine.fixMarkStarts(); for (var i = 0, e = newText.length - 1; i < e; ++i) added.push(Line.inheritMarks(newText[i], prevLine)); if (nlines) doc.remove(from.line, nlines, callbacks); if (added.length) doc.insert(from.line, added); } else if (firstLine == lastLine) { if (newText.length == 1) firstLine.replace(from.ch, to.ch, newText[0]); else { lastLine = firstLine.split(to.ch, newText[newText.length-1]); firstLine.replace(from.ch, null, newText[0]); firstLine.fixMarkEnds(lastLine); var added = []; for (var i = 1, e = newText.length - 1; i < e; ++i) added.push(Line.inheritMarks(newText[i], firstLine)); added.push(lastLine); doc.insert(from.line + 1, added); } } else if (newText.length == 1) { firstLine.replace(from.ch, null, newText[0]); lastLine.replace(null, to.ch, ''); firstLine.append(lastLine); doc.remove(from.line + 1, nlines, callbacks); } else { var added = []; firstLine.replace(from.ch, null, newText[0]); lastLine.replace(null, to.ch, newText[newText.length-1]); firstLine.fixMarkEnds(lastLine); for (var i = 1, e = newText.length - 1; i < e; ++i) added.push(Line.inheritMarks(newText[i], firstLine)); if (nlines > 1) doc.remove(from.line + 1, nlines - 1, callbacks); doc.insert(from.line + 1, added); } if (options.lineWrapping) { var perLine = Math.max(5, scroller.clientWidth / charWidth() - 3); doc.iter(from.line, from.line + newText.length, function(line) { if (line.hidden) return; var guess = Math.ceil(line.text.length / perLine) || 1; if (guess != line.height) updateLineHeight(line, guess); }); } else { doc.iter(from.line, from.line + newText.length, function(line) { var l = line.text; if (l.length > maxLineLength) { maxLine = l; maxLineLength = l.length; maxWidth = null; recomputeMaxLength = false; } }); if (recomputeMaxLength) { maxLineLength = 0; maxLine = ''; maxWidth = null; doc.iter(0, doc.size, function(line) { var l = line.text; if (l.length > maxLineLength) { maxLineLength = l.length; maxLine = l; } }); } } // Add these lines to the work array, so that they will be // highlighted. Adjust work lines if lines were added/removed. var newWork = [], lendiff = newText.length - nlines - 1; for (var i = 0, l = work.length; i < l; ++i) { var task = work[i]; if (task < from.line) newWork.push(task); else if (task > to.line) newWork.push(task + lendiff); } var hlEnd = from.line + Math.min(newText.length, 500); highlightLines(from.line, hlEnd); newWork.push(hlEnd); work = newWork; startWorker(100); // Remember that these lines changed, for updating the display changes.push({from: from.line, to: to.line + 1, diff: lendiff}); var changeObj = {from: from, to: to, text: newText}; if (textChanged) { for (var cur = textChanged; cur.next; cur = cur.next) {} cur.next = changeObj; } else textChanged = changeObj; // Update the selection function updateLine(n) {return n <= Math.min(to.line, to.line + lendiff) ? n : n + lendiff;} setSelection(selFrom, selTo, updateLine(sel.from.line), updateLine(sel.to.line)); // Make sure the scroll-size div has the correct height. if (scroller.clientHeight) code.style.height = (doc.height * textHeight() + 2 * paddingTop()) + 'px'; } function replaceRange(code, from, to) { from = clipPos(from); if (!to) to = from; else to = clipPos(to); code = splitLines(code); function adjustPos(pos) { if (posLess(pos, from)) return pos; if (!posLess(to, pos)) return end; var line = pos.line + code.length - (to.line - from.line) - 1; var ch = pos.ch; if (pos.line == to.line) ch += code[code.length-1].length - (to.ch - (to.line == from.line ? from.ch : 0)); return {line: line, ch: ch}; } var end; replaceRange1(code, from, to, function(end1) { end = end1; return {from: adjustPos(sel.from), to: adjustPos(sel.to)}; }); return end; } function replaceSelection(code, collapse) { replaceRange1(splitLines(code), sel.from, sel.to, function(end) { if (collapse == 'end') return {from: end, to: end}; else if (collapse == 'start') return {from: sel.from, to: sel.from}; else return {from: sel.from, to: end}; }); } function replaceRange1(code, from, to, computeSel) { var endch = code.length == 1 ? code[0].length + from.ch : code[code.length-1].length; var newSel = computeSel({line: from.line + code.length - 1, ch: endch}); updateLines(from, to, code, newSel.from, newSel.to); } function getRange(from, to) { var l1 = from.line, l2 = to.line; if (l1 == l2) return getLine(l1).text.slice(from.ch, to.ch); var code = [getLine(l1).text.slice(from.ch)]; doc.iter(l1 + 1, l2, function(line) { code.push(line.text); }); code.push(getLine(l2).text.slice(0, to.ch)); return code.join('\n'); } function getSelection() { return getRange(sel.from, sel.to); } var pollingFast = false; // Ensures slowPoll doesn't cancel fastPoll function slowPoll() { if (pollingFast) return; poll.set(options.pollInterval, function() { startOperation(); readInput(); if (focused) slowPoll(); endOperation(); }); } function fastPoll() { var missed = false; pollingFast = true; function p() { startOperation(); var changed = readInput(); if (!changed && !missed) {missed = true; poll.set(60, p);} else {pollingFast = false; slowPoll();} endOperation(); } poll.set(20, p); } // Previnput is a hack to work with IME. If we reset the textarea // on every change, that breaks IME. So we look for changes // compared to the previous content instead. (Modern browsers have // events that indicate IME taking place, but these are not widely // supported or compatible enough yet to rely on.) var prevInput = ''; function readInput() { if (leaveInputAlone || !focused || hasSelection(input) || options.readOnly) return false; var text = input.value; if (text == prevInput) return false; shiftSelecting = null; var same = 0, l = Math.min(prevInput.length, text.length); while (same < l && prevInput[same] == text[same]) ++same; if (same < prevInput.length) sel.from = {line: sel.from.line, ch: sel.from.ch - (prevInput.length - same)}; else if (overwrite && posEq(sel.from, sel.to)) sel.to = {line: sel.to.line, ch: Math.min(getLine(sel.to.line).text.length, sel.to.ch + (text.length - same))}; replaceSelection(text.slice(same), 'end'); prevInput = text; return true; } function resetInput(user) { if (!posEq(sel.from, sel.to)) { prevInput = ''; input.value = getSelection(); selectInput(input); } else if (user) prevInput = input.value = ''; } function focusInput() { if (options.readOnly != 'nocursor') input.focus(); } function scrollEditorIntoView() { if (!cursor.getBoundingClientRect) return; var rect = cursor.getBoundingClientRect(); // IE returns bogus coordinates when the instance sits inside of an iframe and the cursor is hidden if (ie && rect.top == rect.bottom) return; var winH = window.innerHeight || Math.max(document.body.offsetHeight, document.documentElement.offsetHeight); if (rect.top < 0 || rect.bottom > winH) cursor.scrollIntoView(); } function scrollCursorIntoView() { var cursor = localCoords(sel.inverted ? sel.from : sel.to); var x = options.lineWrapping ? Math.min(cursor.x, lineSpace.offsetWidth) : cursor.x; return scrollIntoView(x, cursor.y, x, cursor.yBot); } function scrollIntoView(x1, y1, x2, y2) { var pl = paddingLeft(), pt = paddingTop(); y1 += pt; y2 += pt; x1 += pl; x2 += pl; var screen = scroller.clientHeight, screentop = scroller.scrollTop, scrolled = false, result = true; if (y1 < screentop) {scroller.scrollTop = Math.max(0, y1); scrolled = true;} else if (y2 > screentop + screen) {scroller.scrollTop = y2 - screen; scrolled = true;} var screenw = scroller.clientWidth, screenleft = scroller.scrollLeft; var gutterw = options.fixedGutter ? gutter.clientWidth : 0; var atLeft = x1 < gutterw + pl + 10; if (x1 < screenleft + gutterw || atLeft) { if (atLeft) x1 = 0; scroller.scrollLeft = Math.max(0, x1 - 10 - gutterw); scrolled = true; } else if (x2 > screenw + screenleft - 3) { scroller.scrollLeft = x2 + 10 - screenw; scrolled = true; if (x2 > code.clientWidth) result = false; } if (scrolled && options.onScroll) options.onScroll(instance); return result; } function visibleLines() { var lh = textHeight(), top = scroller.scrollTop - paddingTop(); var fromHeight = Math.max(0, Math.floor(top / lh)); var toHeight = Math.ceil((top + scroller.clientHeight) / lh); return {from: lineAtHeight(doc, fromHeight), to: lineAtHeight(doc, toHeight)}; } // Uses a set of changes plus the current scroll position to // determine which DOM updates have to be made, and makes the // updates. function updateDisplay(changes, suppressCallback) { if (!scroller.clientWidth) { showingFrom = showingTo = displayOffset = 0; return; } // Compute the new visible window var visible = visibleLines(); // Bail out if the visible area is already rendered and nothing changed. if (changes !== true && changes.length == 0 && visible.from > showingFrom && visible.to < showingTo) return; var from = Math.max(visible.from - 100, 0), to = Math.min(doc.size, visible.to + 100); if (showingFrom < from && from - showingFrom < 20) from = showingFrom; if (showingTo > to && showingTo - to < 20) to = Math.min(doc.size, showingTo); // Create a range of theoretically intact lines, and punch holes // in that using the change info. var intact = changes === true ? [] : computeIntact([{from: showingFrom, to: showingTo, domStart: 0}], changes); // Clip off the parts that won't be visible var intactLines = 0; for (var i = 0; i < intact.length; ++i) { var range = intact[i]; if (range.from < from) {range.domStart += (from - range.from); range.from = from;} if (range.to > to) range.to = to; if (range.from >= range.to) intact.splice(i--, 1); else intactLines += range.to - range.from; } if (intactLines == to - from && from == showingFrom && to == showingTo) return; intact.sort(function(a, b) {return a.domStart - b.domStart;}); var th = textHeight(), gutterDisplay = gutter.style.display; lineDiv.style.display = 'none'; patchDisplay(from, to, intact); lineDiv.style.display = gutter.style.display = ''; // Position the mover div to align with the lines it's supposed // to be showing (which will cover the visible display) var different = from != showingFrom || to != showingTo || lastSizeC != scroller.clientHeight + th; // This is just a bogus formula that detects when the editor is // resized or the font size changes. if (different) lastSizeC = scroller.clientHeight + th; showingFrom = from; showingTo = to; displayOffset = heightAtLine(doc, from); mover.style.top = (displayOffset * th) + 'px'; if (scroller.clientHeight) code.style.height = (doc.height * th + 2 * paddingTop()) + 'px'; // Since this is all rather error prone, it is honoured with the // only assertion in the whole file. if (lineDiv.childNodes.length != showingTo - showingFrom) throw new Error('BAD PATCH! ' + JSON.stringify(intact) + ' size=' + (showingTo - showingFrom) + ' nodes=' + lineDiv.childNodes.length); function checkHeights() { maxWidth = scroller.clientWidth; var curNode = lineDiv.firstChild, heightChanged = false; doc.iter(showingFrom, showingTo, function(line) { if (!line.hidden) { var height = Math.round(curNode.offsetHeight / th) || 1; if (line.height != height) { updateLineHeight(line, height); gutterDirty = heightChanged = true; } } curNode = curNode.nextSibling; }); if (heightChanged) code.style.height = (doc.height * th + 2 * paddingTop()) + 'px'; return heightChanged; } if (options.lineWrapping) { checkHeights(); } else { if (maxWidth == null) maxWidth = stringWidth(maxLine); if (maxWidth > scroller.clientWidth) { lineSpace.style.width = maxWidth + 'px'; // Needed to prevent odd wrapping/hiding of widgets placed in here. code.style.width = ''; code.style.width = scroller.scrollWidth + 'px'; } else { lineSpace.style.width = code.style.width = ''; } } gutter.style.display = gutterDisplay; if (different || gutterDirty) { // If the gutter grew in size, re-check heights. If those changed, re-draw gutter. updateGutter() && options.lineWrapping && checkHeights() && updateGutter(); } updateSelection(); if (!suppressCallback && options.onUpdate) options.onUpdate(instance); return true; } function computeIntact(intact, changes) { for (var i = 0, l = changes.length || 0; i < l; ++i) { var change = changes[i], intact2 = [], diff = change.diff || 0; for (var j = 0, l2 = intact.length; j < l2; ++j) { var range = intact[j]; if (change.to <= range.from && change.diff) intact2.push({from: range.from + diff, to: range.to + diff, domStart: range.domStart}); else if (change.to <= range.from || change.from >= range.to) intact2.push(range); else { if (change.from > range.from) intact2.push({from: range.from, to: change.from, domStart: range.domStart}); if (change.to < range.to) intact2.push({from: change.to + diff, to: range.to + diff, domStart: range.domStart + (change.to - range.from)}); } } intact = intact2; } return intact; } function patchDisplay(from, to, intact) { // The first pass removes the DOM nodes that aren't intact. if (!intact.length) lineDiv.innerHTML = ''; else { function killNode(node) { var tmp = node.nextSibling; node.parentNode.removeChild(node); return tmp; } var domPos = 0, curNode = lineDiv.firstChild, n; for (var i = 0; i < intact.length; ++i) { var cur = intact[i]; while (cur.domStart > domPos) {curNode = killNode(curNode); domPos++;} for (var j = 0, e = cur.to - cur.from; j < e; ++j) {curNode = curNode.nextSibling; domPos++;} } while (curNode) curNode = killNode(curNode); } // This pass fills in the lines that actually changed. var nextIntact = intact.shift(), curNode = lineDiv.firstChild, j = from; var scratch = document.createElement('div'); doc.iter(from, to, function(line) { if (nextIntact && nextIntact.to == j) nextIntact = intact.shift(); if (!nextIntact || nextIntact.from > j) { if (line.hidden) var html = scratch.innerHTML = '<pre></pre>'; else { var html = '<pre' + (line.className ? ' class="' + line.className + '"' : '') + '>' + line.getHTML(makeTab) + '</pre>'; // Kludge to make sure the styled element lies behind the selection (by z-index) if (line.bgClassName) html = '<div style="position: relative"><pre class="' + line.bgClassName + '" style="position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: -2">&#160;</pre>' + html + '</div>'; } scratch.innerHTML = html; lineDiv.insertBefore(scratch.firstChild, curNode); } else { curNode = curNode.nextSibling; } ++j; }); } function updateGutter() { if (!options.gutter && !options.lineNumbers) return; var hText = mover.offsetHeight, hEditor = scroller.clientHeight; gutter.style.height = (hText - hEditor < 2 ? hEditor : hText) + 'px'; var html = [], i = showingFrom, normalNode; doc.iter(showingFrom, Math.max(showingTo, showingFrom + 1), function(line) { if (line.hidden) { html.push('<pre></pre>'); } else { var marker = line.gutterMarker; var text = options.lineNumbers ? i + options.firstLineNumber : null; if (marker && marker.text) text = marker.text.replace('%N%', text != null ? text : ''); else if (text == null) text = '\u00a0'; html.push((marker && marker.style ? '<pre class="' + marker.style + '">' : '<pre>'), text); for (var j = 1; j < line.height; ++j) html.push('<br/>&#160;'); html.push('</pre>'); if (!marker) normalNode = i; } ++i; }); gutter.style.display = 'none'; gutterText.innerHTML = html.join(''); // Make sure scrolling doesn't cause number gutter size to pop if (normalNode != null) { var node = gutterText.childNodes[normalNode - showingFrom]; var minwidth = String(doc.size).length, val = eltText(node), pad = ''; while (val.length + pad.length < minwidth) pad += '\u00a0'; if (pad) node.insertBefore(document.createTextNode(pad), node.firstChild); } gutter.style.display = ''; var resized = Math.abs((parseInt(lineSpace.style.marginLeft) || 0) - gutter.offsetWidth) > 2; lineSpace.style.marginLeft = gutter.offsetWidth + 'px'; gutterDirty = false; return resized; } function updateSelection() { var collapsed = posEq(sel.from, sel.to); var fromPos = localCoords(sel.from, true); var toPos = collapsed ? fromPos : localCoords(sel.to, true); var headPos = sel.inverted ? fromPos : toPos, th = textHeight(); var wrapOff = eltOffset(wrapper), lineOff = eltOffset(lineDiv); inputDiv.style.top = Math.max(0, Math.min(scroller.offsetHeight, headPos.y + lineOff.top - wrapOff.top)) + 'px'; inputDiv.style.left = Math.max(0, Math.min(scroller.offsetWidth, headPos.x + lineOff.left - wrapOff.left)) + 'px'; if (collapsed) { cursor.style.top = headPos.y + 'px'; cursor.style.left = (options.lineWrapping ? Math.min(headPos.x, lineSpace.offsetWidth) : headPos.x) + 'px'; cursor.style.display = ''; selectionDiv.style.display = 'none'; } else { var sameLine = fromPos.y == toPos.y, html = ''; var clientWidth = lineSpace.clientWidth || lineSpace.offsetWidth; var clientHeight = lineSpace.clientHeight || lineSpace.offsetHeight; function add(left, top, right, height