function computeThemeData(themeManager) {
var plugin = catalog.plugins['text_editor'];
var provides = plugin.provides;
var i = provides.length;
var themeData = {};
// If a themeManager was passed, try to access the themeData for the
// `text_editor` plugin.
if (themeManager) {
var themestyles = themeManager.themestyles;
if (themestyles.currentThemeVariables &&
themestyles.currentThemeVariables['text_editor']) {
themeData = themestyles.currentThemeVariables['text_editor'];
}
}
while (i--) {
if (provides[i].ep === 'themevariable') {
var value = util.mixin(util.clone(provides[i].defaultValue),
themeData[provides[i].name]);
switch (provides[i].name) {
case 'gutter':
case 'editor':
case 'scroller':
case 'highlighter':
editorThemeData[provides[i].name] = value;
}
}
}
}
mouseMove: function(evt) {
if (this._mouseIsDown) {
this._dragPoint = this.computeWithClippingFrame(evt.layerX, evt.layerY);
util.mixin(this._dragPoint, { layerX: evt.layerX, layerY: evt.layerY});
this._drag();
}
},
set: function(clippingFrame) {
clippingFrame = util.mixin(util.clone(this._clippingFrame), clippingFrame);
if (this._clippingFrame === null ||
!Rect.rectsEqual(clippingFrame, this._clippingFrame)) {
this._clippingFrame = clippingFrame;
this.clippingChanged();
}
}
exports.parseGlobalVariables = function() {
var globalObj = {};
var globalHeader = '';
var currentThemeVariables = exports.currentThemeVariables;
util.mixin(globalObj, defaultGlobalTheme);
if (currentThemeVariables && currentThemeVariables['global']) {
util.mixin(globalObj,
parseGlobalThemeVariables(currentThemeVariables['global']));
}
exports.globalThemeVariables = globalObj;
for (prop in globalObj) {
globalHeader += '@' + prop + ':' + globalObj[prop] + ';';
}
globalVariableHeader = globalHeader;
};
exports.LayoutManager = function(opts) {
this.changedTextAtRow = new Event();
this.invalidatedRects = new Event();
// Put the global variable on the instance.
this.fontDimension = fontDimension;
// There is no setter for textStorage so we have to change it to
// _textStorage to make things work with util.mixin().
if (opts.textStorage) {
opts._textStorage = opts.textStorage;
delete opts.textStorage;
} else {
this._textStorage = new TextStorage();
}
util.mixin(this, opts);
this._textStorage.changed.add(this.textStorageChanged.bind(this));
this.textLines = [
{
characters: '',
colors: [
{
start: 0,
end: 0,
color: 'plain'
}
]
}
];
var syntaxManager = new SyntaxManager(this);
this.syntaxManager = syntaxManager;
syntaxManager.attrsChanged.add(this._attrsChanged.bind(this));
this._size = { width: 0, height: 0 };
this.sizeChanged = new Event();
this._height = 0;
// Now that the syntax manager is set up, we can recompute the layout.
// (See comments in _textStorageChanged().)
this._recomputeEntireLayout();
};
util.mixin(exports.UndoManager.prototype, {
_redoStack: [],
_undoStack: [],
_undoOrRedo: function(method, stack, otherStack) {
if (stack.length === 0) {
return false;
}
var record = stack.pop();
if (!record.target[method](record.context)) {
this._redoStack = [];
this._undoStack = [];
return false;
}
otherStack.push(record);
return true;
},
/**
* Redo the last undone action.
* @return{boolean} True if the action was successfully redone, false
* otherwise.
*/
redo: function() {
return this._undoOrRedo('redo', this._redoStack, this._undoStack);
},
/**
* Notifies the undo manager that an action was performed. When the action
* is to be undone, the 'undo' message will be sent to the target with the
* given context. When the action is to be redone, the 'redo' message is
* sent in the same way.
*/
registerUndo: function(target, context) {
this._redoStack = [];
this._undoStack.push({ target: target, context: context });
},
/**
* Undoes the last action.
*
* @return{boolean} True if the action was successfully undone, false
* otherwise.
*/
undo: function() {
return this._undoOrRedo('undo', this._undoStack, this._redoStack);
}
});
util.mixin(exports.GutterView.prototype, {
_decorationSpacing: 2,
drawRect: function(rect, context) {
var theme = this.editor.themeData.gutter;
context.fillStyle = theme.backgroundColor;
context.fillRect(rect.x, rect.y, rect.width, rect.height);
context.save();
var paddingLeft = theme.paddingLeft;
context.translate(paddingLeft - 0.5, -0.5);
var layoutManager = this.editor.layoutManager;
var range = layoutManager.characterRangeForBoundingRect(rect);
var endRow = Math.min(range.end.row,
layoutManager.textLines.length - 1);
var lineAscent = layoutManager.fontDimension.lineAscent;
var decorations = this._loadedDecorations(true);
var decorationWidths = [];
for (var i = 0; i < decorations.length; i++) {
decorationWidths.push(decorations[i].computeWidth(this));
}
for (var row = range.start.row; row <= endRow; row++) {
context.save();
var rowY = layoutManager.lineRectForRow(row).y;
context.translate(0, rowY);
for (var i = 0; i < decorations.length; i++) {
decorations[i].drawDecoration(this, context, lineAscent, row);
context.translate(decorationWidths[i] + this._decorationSpacing, 0);
}
context.restore();
}
context.restore();
},
computeWidth: function() {
var theme = this.editor.themeData.gutter;
var width = theme.paddingLeft + theme.paddingRight;
var decorations = this._loadedDecorations(true);
for (var i = 0; i < decorations.length; i++) {
width += decorations[i].computeWidth(this);
}
width += (decorations.length - 1) * this._decorationSpacing;
return width;
},
_click: function(evt) {
var point = {x: evt.layerX || evt.offsetX, y: evt.layerY || evt.offsetY};
if (rect.pointInRect(point, this.frame)) {
var deco = this._decorationAtPoint(point);
if (deco && ('selected' in deco)) {
var computedPoint = this.computeWithClippingFrame(point.x, point.y);
var pos = this.editor.layoutManager.characterAtPoint(computedPoint);
deco.selected(this, pos.row);
}
}
},
_loadedDecorations: function(invalidateOnLoaded) {
var decorations = [];
var extensions = catalog.getExtensions('gutterDecoration');
for (var i = 0; i < extensions.length; i++) {
var promise = extensions[i].load();
if (promise.isResolved()) {
promise.then(decorations.push.bind(decorations));
} else if (invalidateOnLoaded) {
promise.then(this.invalidate.bind(this));
}
}
return decorations;
},
_decorationAtPoint: function(point) {
var theme = this.editor.themeData.gutter;
var width = theme.paddingLeft + theme.paddingRight;
if (point.x > theme.paddingLeft) {
var decorations = this._loadedDecorations(false);
var pos = theme.paddingLeft;
for (var i = 0; i < decorations.length; i++) {
var deco = decorations[i];
var w = deco.computeWidth(this);
if (point.x < pos + w) {
return deco;
}
pos += w + this._decorationSpacing;
}
}
return null;
}
});
mouseDown: function(evt) {
this.hasFocus = true;
this._mouseIsDown = true;
var point = this.computeWithClippingFrame(evt.layerX, evt.layerY);
util.mixin(point, { layerX: evt.layerX, layerY: evt.layerY});
switch (evt.detail) {
case 1:
var pos = this._selectionPositionForPoint(point);
this.moveCursorTo(pos, evt.shiftKey);
break;
// Select the word under the cursor.
case 2:
var pos = this._selectionPositionForPoint(point);
var line = this.editor.layoutManager.textStorage.lines[pos.row];
// If there is nothing to select in this line, then skip.
if (line.length === 0) {
return true;
}
pos.col -= (pos.col == line.length ? 1 : 0);
var skipOnDelimiter = !this.isDelimiter(line[pos.col]);
var thisTextView = this;
var searchForDelimiter = function(pos, dir) {
for (pos; pos > -1 && pos < line.length; pos += dir) {
if (thisTextView.isDelimiter(line[pos]) ===
skipOnDelimiter) {
break;
}
}
return pos + (dir == 1 ? 0 : 1);
};
var colFrom = searchForDelimiter(pos.col, -1);
var colTo = searchForDelimiter(pos.col, 1);
this.moveCursorTo({ row: pos.row, col: colFrom });
this.moveCursorTo({ row: pos.row, col: colTo }, true);
break;
case 3:
var lines = this.editor.layoutManager.textStorage.lines;
var pos = this._selectionPositionForPoint(point);
this.setSelection({
start: {
row: pos.row,
col: 0
},
end: {
row: pos.row,
col: lines[pos.row].length
}
});
break;
}
this._dragPoint = point;
this._dragTimer = setInterval(this._scrollWhileDragging.bind(this), 100);
},
_scrollWhileDragging: function() {
var point = this._dragPoint;
var newPoint = this.computeWithClippingFrame(point.layerX, point.layerY);
util.mixin(this._dragPoint, newPoint);
this._drag();
},
util.mixin(exports.TextView.prototype, {
_dragPoint: null,
_dragTimer: null,
_enclosingScrollView: null,
_inChangeGroup: false,
_insertionPointBlinkTimer: null,
_insertionPointVisible: true,
// FIXME: These should be public, not private.
_keyBuffer: '',
_keyMetaBuffer: '',
_keyState: 'start',
_hasFocus: false,
_mouseIsDown: false,
selectionChanged: null,
beganChangeGroup: null,
endedChangeGroup: null,
willReplaceRange: null,
replacedCharacters: null,
editorWillChangeBuffer: function(newBuffer) {
if (this.editor.layoutManager) {
// Remove events from the old layoutManager.
var layoutManager = this.editor.layoutManager;
layoutManager.invalidatedRects.remove(this);
layoutManager.changedTextAtRow.remove(this);
}
// Add the events to the new layoutManager.
layoutManager = newBuffer.layoutManager;
layoutManager.invalidatedRects.add(this,
this.layoutManagerInvalidatedRects.bind(this));
layoutManager.changedTextAtRow.add(this,
this.layoutManagerChangedTextAtRow.bind(this));
},
/**
* Called by the textInput whenever the textInput gained the focus.
*/
didFocus: function() {
// Call _setFocus and not this.hasFocus as we have to pass the
// 'isFromTextInput' flag.
this._setFocus(true, true /* fromTextInput */);
},
/**
* Called by the textInput whenever the textinput lost the focus.
*/
didBlur: function() {
// Call _setFocus and not this.hasFocus as we have to pass the
// 'isFromTextInput' flag.
this._setFocus(false, true /* fromTextInput */);
},
_drag: function() {
var point = this._dragPoint;
var offset = Rect.offsetFromRect(this.clippingFrame, point);
this.moveCursorTo(this._selectionPositionForPoint({
x: point.x - offset.x,
y: point.y - offset.y
}), true);
},
// Draws a single insertion point.
_drawInsertionPoint: function(rect, context) {
if (!this._insertionPointVisible) {
return;
}
var range = this.editor.buffer._selectedRange;
var characterRect = this.editor.layoutManager.
characterRectForPosition(range.start);
var x = Math.floor(characterRect.x), y = characterRect.y;
var width = Math.ceil(characterRect.width);
var height = characterRect.height;
context.save();
var theme = this.editor.themeData.editor;
if (this._hasFocus) {
context.strokeStyle = theme.cursorColor;
context.beginPath();
context.moveTo(x + 0.5, y);
context.lineTo(x + 0.5, y + height);
context.closePath();
context.stroke();
} else {
context.fillStyle = theme.unfocusedCursorBackgroundColor;
context.fillRect(x + 0.5, y, width - 0.5, height);
context.strokeStyle = theme.unfocusedCursorColor;
context.strokeRect(x + 0.5, y + 0.5, width - 1, height - 1);
}
context.restore();
},
_drawLines: function(rect, context) {
var editor = this.editor;
var layoutManager = editor.layoutManager;
var textLines = layoutManager.textLines;
var lineAscent = layoutManager.fontDimension.lineAscent;
var themeData = editor.themeData;
var fgColors = themeData.highlighterFG;
var bgColors = themeData.highlighterBG;
context.save();
context.font = this.editor.font;
var range = layoutManager.characterRangeForBoundingRect(rect);
var rangeStart = range.start, rangeEnd = range.end;
var startRow = rangeStart.row, endRow = rangeEnd.row;
for (var row = startRow; row <= endRow; row++) {
var textLine = textLines[row];
if (util.none(textLine)) {
continue;
}
// Clamp the start column and end column to fit within the line
// text.
var characters = textLine.characters;
var length = characters.length;
var endCol = Math.min(rangeEnd.col, length);
var startCol = rangeStart.col;
if (startCol >= length) {
continue;
}
// Get the color ranges, or synthesize one if it doesn't exist. We
// have to be tolerant of bad data, because we may be drawing ahead
// of the syntax highlighter.
var colorRanges = textLine.colors;
if (colorRanges == null) {
colorRanges = [];
}
// Figure out which color range to start in.
var colorIndex = 0;
while (colorIndex < colorRanges.length &&
startCol < colorRanges[colorIndex].start) {
colorIndex++;
}
var col = (colorIndex < colorRanges.length)
? colorRanges[colorIndex].start
: startCol;
// And finally draw the line.
while (col < endCol) {
var colorRange = colorRanges[colorIndex];
var end = colorRange != null ? colorRange.end : endCol;
var tag = colorRange != null ? colorRange.tag : 'plain';
var pos = { row: row, col: col };
var rect = layoutManager.characterRectForPosition(pos);
if (bgColors.hasOwnProperty(tag)) {
var endPos = { row: row, col: end - 1 };
var endRect = layoutManager.
characterRectForPosition(endPos);
var bg = bgColors[tag];
context.fillStyle = bg;
context.fillRect(rect.x, rect.y, endRect.x - rect.x +
endRect.width, endRect.height);
}
var fg = fgColors.hasOwnProperty(tag) ? fgColors[tag] : 'red';
var snippet = characters.substring(col, end);
context.fillStyle = fg;
context.fillText(snippet, rect.x, rect.y + lineAscent);
if (DEBUG_TEXT_RANGES) {
context.strokeStyle = color;
context.strokeRect(rect.x + 0.5, rect.y + 0.5,
rect.width * snippet.length - 1, rect.height - 1);
}
col = end;
colorIndex++;
}
}
context.restore();
},
// Draws the background highlight for selections.
_drawSelectionHighlight: function(rect, context) {
var theme = this.editor.themeData.editor;
var fillStyle = this._hasFocus ?
theme.selectedTextBackgroundColor :
theme.unfocusedCursorBackgroundColor;
var layoutManager = this.editor.layoutManager;
context.save();
var range = Range.normalizeRange(this.editor.buffer._selectedRange);
context.fillStyle = fillStyle;
layoutManager.rectsForRange(range).forEach(function(rect) {
context.fillRect(rect.x, rect.y, rect.width, rect.height);
});
context.restore();
},
// Draws either the selection or the insertion point.
_drawSelection: function(rect, context) {
if (this._rangeIsInsertionPoint(this.editor.buffer._selectedRange)) {
this._drawInsertionPoint(rect, context);
} else {
this._drawSelectionHighlight(rect, context);
}
},
_getVirtualSelection: function(startPropertyAsWell) {
var selectedRange = this.editor.buffer._selectedRange;
var selectedRangeEndVirtual = this.editor.buffer._selectedRangeEndVirtual;
return {
start: startPropertyAsWell && selectedRangeEndVirtual ?
selectedRangeEndVirtual : selectedRange.start,
end: selectedRangeEndVirtual || selectedRange.end
};
},
_invalidateSelection: function() {
var adjustRect = function(rect) {
return {
x: rect.x - 1,
y: rect.y,
width: rect.width + 2,
height: rect.height
};
};
var layoutManager = this.editor.layoutManager;
var range = Range.normalizeRange(this.editor.buffer._selectedRange);
if (!this._rangeIsInsertionPoint(range)) {
var rects = layoutManager.rectsForRange(range);
rects.forEach(function(rect) {
this.invalidateRect(adjustRect(rect));
}, this);
return;
}
var rect = layoutManager.characterRectForPosition(range.start);
this.invalidateRect(adjustRect(rect));
},
_isReadOnly: function() {
return this.editor.layoutManager.textStorage.readOnly;
},
_keymappingChanged: function() {
this._keyBuffer = '';
this._keyState = 'start';
},
_performVerticalKeyboardSelection: function(offset) {
var textStorage = this.editor.layoutManager.textStorage;
var selectedRangeEndVirtual = this.editor.buffer._selectedRangeEndVirtual;
var oldPosition = selectedRangeEndVirtual !== null ?
selectedRangeEndVirtual : this.editor.buffer._selectedRange.end;
var newPosition = Range.addPositions(oldPosition,
{ row: offset, col: 0 });
this.moveCursorTo(newPosition, true, true);
},
_rangeIsInsertionPoint: function(range) {
return Range.isZeroLength(range);
},
_rearmInsertionPointBlinkTimer: function() {
if (!this._insertionPointVisible) {
// Make sure it ends up visible.
this.blinkInsertionPoint();
}
if (this._insertionPointBlinkTimer !== null) {
clearInterval(this._insertionPointBlinkTimer);
}
this._insertionPointBlinkTimer = setInterval(
this.blinkInsertionPoint.bind(this),
750);
},
// Moves the selection, if necessary, to keep all the positions pointing to
// actual characters.
_repositionSelection: function() {
var textLines = this.editor.layoutManager.textLines;
var textLineLength = textLines.length;
var range = this.editor.buffer._selectedRange;
var newStartRow = Math.min(range.start.row, textLineLength - 1);
var newEndRow = Math.min(range.end.row, textLineLength - 1);
var startLine = textLines[newStartRow];
var endLine = textLines[newEndRow];
this.setSelection({
start: {
row: newStartRow,
col: Math.min(range.start.col, startLine.characters.length)
},
end: {
row: newEndRow,
col: Math.min(range.end.col, endLine.characters.length)
}
});
},
_scrollPage: function(scrollUp) {
var clippingFrame = this.clippingFrame;
var lineAscent = this.editor.layoutManager.fontDimension.lineAscent;
this.editor.scrollBy(0,
(clippingFrame.height + lineAscent) * (scrollUp ? -1 : 1));
},
_scrollWhileDragging: function() {
var point = this._dragPoint;
var newPoint = this.computeWithClippingFrame(point.layerX, point.layerY);
util.mixin(this._dragPoint, newPoint);
this._drag();
},
// Returns the character closest to the given point, obeying the selection
// rules (including the partialFraction field).
_selectionPositionForPoint: function(point) {
var position = this.editor.layoutManager.characterAtPoint(point);
return position.partialFraction < 0.5 ? position :
Range.addPositions(position, { row: 0, col: 1 });
},
_syntaxManagerUpdatedSyntaxForRows: function(startRow, endRow) {
if (startRow === endRow) {
return;
}
var layoutManager = this.editor.layoutManager;
layoutManager.updateTextRows(startRow, endRow);
layoutManager.rectsForRange({
start: { row: startRow, col: 0 },
end: { row: endRow, col: 0 }
}).forEach(this.invalidateRect, this);
},
/**
* Toggles the visible state of the insertion point.
*/
blinkInsertionPoint: function() {
this._insertionPointVisible = !this._insertionPointVisible;
this._invalidateSelection();
},
/**
* Returns the selected characters.
*/
copy: function() {
return this.getSelectedCharacters();
},
/**
* Removes the selected characters from the text buffer and returns them.
*/
cut: function() {
var cutData = this.getSelectedCharacters();
if (cutData != '') {
this.performBackspaceOrDelete(false);
}
return cutData;
},
/**
* Handles click events and sets the focus appropriately. This is needed
* now that Firefox focus is tightened down; see bugs 125282 and 588381.
*/
click: function(event) {
this.focus();
},
/**
* This is where the editor is painted from head to toe. Pitiful tricks are
* used to draw as little as possible.
*/
drawRect: function(rect, context) {
context.fillStyle = this.editor.themeData.editor.backgroundColor;
context.fillRect(rect.x, rect.y, rect.width, rect.height);
this._drawSelection(rect, context);
this._drawLines(rect, context);
},
/**
* Directs keyboard input to this text view.
*/
focus: function() {
this.textInput.focus();
},
/** Returns the location of the insertion point in pixels. */
getInsertionPointPosition: function() {
var editor = this.editor;
var range = editor.buffer._selectedRange;
var rect = editor.layoutManager.characterRectForPosition(range.start);
return { x: rect.x, y: rect.y };
},
/**
* Returns the characters that are currently selected as a string, or the
* empty string if none are selected.
*/
getSelectedCharacters: function() {
return this._rangeIsInsertionPoint(this.editor.buffer._selectedRange) ? '' :
this.editor.layoutManager.textStorage.getCharacters(Range.
normalizeRange(this.editor.buffer._selectedRange));
},
/*
* Returns the currently selected range.
*
* @param raw If true, the direction of the selection is preserved: the
* 'start' field will be the selection origin, and the 'end'
* field will always be the selection tail.
*/
getSelectedRange: function(raw) {
if (!raw) {
return Range.normalizeRange(this.editor.buffer._selectedRange);
} else {
return this.editor.buffer._selectedRange;
}
},
/**
* Groups all the changes in the callback into a single undoable action.
* Nested change groups are supported; one undoable action is created for
* the entire group of changes.
*/
groupChanges: function(performChanges) {
if (this._isReadOnly()) {
return false;
}
if (this._inChangeGroup) {
performChanges();
return true;
}
this._inChangeGroup = true;
this.beganChangeGroup(this, this.editor.buffer._selectedRange);
try {
performChanges();
} catch (e) {
console.error("Error in groupChanges(): " + e);
this._inChangeGroup = false;
this.endedChangeGroup(this, this.editor.buffer._selectedRange);
return false;
} finally {
this._inChangeGroup = false;
this.endedChangeGroup(this, this.editor.buffer._selectedRange);
return true;
}
},
/**
* Replaces the selection with the given text and updates the selection
* boundaries appropriately.
*
* @return True if the text view was successfully updated; false if the
* change couldn't be made because the text view is read-only.
*/
insertText: function(text) {
if (this._isReadOnly()) {
return false;
}
this.groupChanges(function() {
var textStorage = this.editor.layoutManager.textStorage;
var range = Range.normalizeRange(this.editor.buffer._selectedRange);
this.replaceCharacters(range, text);
// Update the selection to point immediately after the inserted
// text.
var lines = text.split('\n');
var destPosition;
if (lines.length > 1) {
destPosition = {
row: range.start.row + lines.length - 1,
col: lines[lines.length - 1].length
};
} else {
destPosition = Range.addPositions(range.start,
{ row: 0, col: text.length });
}
this.moveCursorTo(destPosition);
}.bind(this));
return true;
},
/**
* Returns true if the given character is a word separator.
*/
isDelimiter: function(character) {
return '"\',;.!~@#$%^&*?[]<>():/\\-+ \t'.indexOf(character) !== -1;
},
keyDown: function(evt) {
if (evt.charCode === 0 || evt._charCode === 0) { // hack for Fx
var preds = { isTextView: true };
return this.editor.processKeyEvent(evt, this, preds);
} else if (evt.keyCode === 9) {
// Stops the tab. Otherwise the editor can lose focus.
evt.preventDefault();
} else {
// This is a real keyPress event. This should not be handled,
// otherwise the textInput mixin can't detect the key events.
return false;
}
},
/**
* Runs the syntax highlighter from the given row to the end of the visible
* range, and repositions the selection.
*/
layoutManagerChangedTextAtRow: function(sender, row) {
this._repositionSelection();
},
/**
* Marks the given rectangles as invalid.
*/
layoutManagerInvalidatedRects: function(sender, rects) {
rects.forEach(this.invalidateRect, this);
},
mouseDown: function(evt) {
this.hasFocus = true;
this._mouseIsDown = true;
var point = this.computeWithClippingFrame(evt.layerX, evt.layerY);
util.mixin(point, { layerX: evt.layerX, layerY: evt.layerY});
switch (evt.detail) {
case 1:
var pos = this._selectionPositionForPoint(point);
this.moveCursorTo(pos, evt.shiftKey);
break;
// Select the word under the cursor.
case 2:
var pos = this._selectionPositionForPoint(point);
var line = this.editor.layoutManager.textStorage.lines[pos.row];
// If there is nothing to select in this line, then skip.
if (line.length === 0) {
return true;
}
pos.col -= (pos.col == line.length ? 1 : 0);
var skipOnDelimiter = !this.isDelimiter(line[pos.col]);
var thisTextView = this;
var searchForDelimiter = function(pos, dir) {
for (pos; pos > -1 && pos < line.length; pos += dir) {
if (thisTextView.isDelimiter(line[pos]) ===
skipOnDelimiter) {
break;
}
}
return pos + (dir == 1 ? 0 : 1);
};
var colFrom = searchForDelimiter(pos.col, -1);
var colTo = searchForDelimiter(pos.col, 1);
this.moveCursorTo({ row: pos.row, col: colFrom });
this.moveCursorTo({ row: pos.row, col: colTo }, true);
break;
case 3:
var lines = this.editor.layoutManager.textStorage.lines;
var pos = this._selectionPositionForPoint(point);
this.setSelection({
start: {
row: pos.row,
col: 0
},
end: {
row: pos.row,
col: lines[pos.row].length
}
});
break;
}
this._dragPoint = point;
this._dragTimer = setInterval(this._scrollWhileDragging.bind(this), 100);
},
mouseMove: function(evt) {
if (this._mouseIsDown) {
this._dragPoint = this.computeWithClippingFrame(evt.layerX, evt.layerY);
util.mixin(this._dragPoint, { layerX: evt.layerX, layerY: evt.layerY});
this._drag();
}
},
mouseUp: function(evt) {
this._mouseIsDown = false;
if (this._dragTimer !== null) {
clearInterval(this._dragTimer);
this._dragTimer = null;
}
},
/**
* Moves the cursor.
*
* @param position{Position} The position to move the cursor to.
*
* @param select{bool} Whether to preserve the selection origin. If this
* parameter is false, the selection is removed, and the insertion
* point moves to @position. Typically, this parameter is set when
* the mouse is being dragged or the shift key is held down.
*
* @param virtual{bool} Whether to save the current end position as the
* virtual insertion point. Typically, this parameter is set when
* moving vertically.
*/
moveCursorTo: function(position, select, virtual) {
var textStorage = this.editor.layoutManager.textStorage;
var positionToUse = textStorage.clampPosition(position);
this.setSelection({
start: select ? this.editor.buffer._selectedRange.start : positionToUse,
end: positionToUse
});
if (virtual) {
var lineCount = textStorage.lines.length;
var row = position.row, col = position.col;
if (row > 0 && row < lineCount) {
this.editor.buffer._selectedRangeEndVirtual = position;
} else {
this.editor.buffer._selectedRangeEndVirtual = {
row: row < 1 ? 0 : lineCount - 1,
col: col
};
}
} else {
this.editor.buffer._selectedRangeEndVirtual = null;
}
this.scrollToPosition(this.editor.buffer._selectedRange.end);
},
moveDown: function() {
var selection = this._getVirtualSelection();
var range = Range.normalizeRange(selection);
var position;
if (this._rangeIsInsertionPoint(this.editor.buffer._selectedRange)) {
position = range.end;
} else {
// Yes, this is actually what Cocoa does... weird, huh?
position = { row: range.end.row, col: range.start.col };
}
position = Range.addPositions(position, { row: 1, col: 0 });
this.moveCursorTo(position, false, true);
},
moveLeft: function() {
var range = Range.normalizeRange(this.editor.buffer._selectedRange);
if (this._rangeIsInsertionPoint(range)) {
this.moveCursorTo(this.editor.layoutManager.textStorage.
displacePosition(range.start, -1));
} else {
this.moveCursorTo(range.start);
}
},
moveRight: function() {
var range = Range.normalizeRange(this.editor.buffer._selectedRange);
if (this._rangeIsInsertionPoint(range)) {
this.moveCursorTo(this.editor.layoutManager.textStorage.
displacePosition(range.end, 1));
} else {
this.moveCursorTo(range.end);
}
},
moveUp: function() {
var range = Range.normalizeRange(this._getVirtualSelection(true));
position = Range.addPositions({
row: range.start.row,
col: this._getVirtualSelection().end.col
}, { row: -1, col: 0 });
this.moveCursorTo(position, false, true);
},
parentViewFrameChanged: function() {
arguments.callee.base.apply(this, arguments);
this._resize();
},
/**
* As an undoable action, replaces the characters within the old range with
* the supplied characters.
*
* TODO: Factor this out into the undo controller. The fact that commands
* have to go through the view in order to make undoable changes is
* counterintuitive.
*
* @param oldRange{Range} The range of characters to modify.
* @param characters{string} The string to replace the characters with.
*
* @return True if the changes were successfully made; false if the changes
* couldn't be made because the editor is read-only.
*/
replaceCharacters: function(oldRange, characters) {
if (this._isReadOnly()) {
return false;
}
this.groupChanges(function() {
oldRange = Range.normalizeRange(oldRange);
this.willReplaceRange(this, oldRange);
var textStorage = this.editor.layoutManager.textStorage;
textStorage.replaceCharacters(oldRange, characters);
this.replacedCharacters(this, oldRange, characters);
}.bind(this));
return true;
},
/**
* Performs a delete-backward or delete-forward operation.
*
* @param isBackspace{boolean} If true, the deletion proceeds backward (as if
* the backspace key were pressed); otherwise, deletion proceeds forward.
*
* @return True if the operation was successfully performed; false if the
* operation failed because the editor is read-only.
*/
performBackspaceOrDelete: function(isBackspace) {
if (this._isReadOnly()) {
return false;
}
var model = this.editor.layoutManager.textStorage;
var lines = model.lines;
var line = '', count = 0;
var tabstop = settings.get('tabstop');
var range = this.getSelectedRange();
if (Range.isZeroLength(range)) {
if (isBackspace) {
var start = range.start;
line = lines[start.row];
var preWhitespaces = line.substring(0, start.col).
match(/\s*$/)[0].length;
// If there are less then n-tabstop whitespaces in front, OR
// the current cursor position is not n times tabstop, THEN
// delete only 1 character.
if (preWhitespaces < tabstop
|| (start.col - tabstop) % tabstop != 0) {
count = 1;
} else {
// Otherwise delete tabstop whitespaces.
count = tabstop;
}
range = {
start: model.displacePosition(start, count * -1),
end: range.end
};
} else {
var end = range.end;
line = lines[end.row];
var trailingWhitespaces = line.substring(end.col).
match(/^\s*/)[0].length;
// If there are less then n-tabstop whitespaces after the cursor
// position, then delete only 1 character. Otherwise delete
// tabstop whitespaces.
if (trailingWhitespaces < tabstop) {
count = 1;
} else {
count = tabstop;
}
range = {
start: range.start,
end: model.displacePosition(range.end, count)
};
}
}
this.groupChanges(function() {
this.replaceCharacters(range, '');
// Position the insertion point at the start of all the ranges that
// were just deleted.
this.moveCursorTo(range.start);
}.bind(this));
return true;
},
/** Removes all buffered keys. */
resetKeyBuffers: function() {
this._keyBuffer = '';
this._keyMetaBuffer = '';
},
/**
* If the text view is inside a scrollable view, scrolls down by one page.
*/
scrollPageDown: function() {
this._scrollPage(false);
},
/**
* If the text view is inside a scrollable view, scrolls up by one page.
*/
scrollPageUp: function() {
this._scrollPage(true);
},
/**
* If this view is in a scrollable container, scrolls to the given
* character position.
*/
scrollToPosition: function(position) {
var rect = this.editor.layoutManager.characterRectForPosition(position);
var rectX = rect.x, rectY = rect.y;
var rectWidth = rect.width, rectHeight = rect.height;
var frame = this.clippingFrame;
var frameX = frame.x, frameY = frame.y;
var padding = this.padding;
var width = frame.width - padding.right;
var height = frame.height - padding.bottom;
var x;
if (rectX >= frameX + 30 /* This is a hack to allow dragging to the left */
&& rectX + rectWidth < frameX + width) {
x = frameX;
} else {
x = rectX - width / 2 + rectWidth / 2;
}
var y;
if (rectY >= frameY && rectY + rectHeight < frameY + height) {
y = frameY;
} else {
y = rectY - height / 2 + rectHeight / 2;
}
this.editor.scrollTo({ x: x, y: y });
},
/**
* Selects all characters in the buffer.
*/
selectAll: function() {
var lines = this.editor.layoutManager.textStorage.lines;
var lastRow = lines.length - 1;
this.setSelection({
start: { row: 0, col: 0 },
end: { row: lastRow, col: lines[lastRow].length }
});
},
selectDown: function() {
this._performVerticalKeyboardSelection(1);
},
selectLeft: function() {
this.moveCursorTo((this.editor.layoutManager.textStorage.
displacePosition(this.editor.buffer._selectedRange.end, -1)), true);
},
selectRight: function() {
this.moveCursorTo((this.editor.layoutManager.textStorage.
displacePosition(this.editor.buffer._selectedRange.end, 1)), true);
},
selectUp: function() {
this._performVerticalKeyboardSelection(-1);
},
/**
* Directly replaces the current selection with a new one.
*/
setSelection: function(newRange, ensureVisible) {
var textStorage = this.editor.layoutManager.textStorage;
newRange = textStorage.clampRange(newRange);
if (Range.equal(newRange, this.editor.buffer._selectedRange)) {
return;
}
// Invalidate the old selection.
this._invalidateSelection();
// Set the new selection and invalidate it.
this.editor.buffer._selectedRange = newRange =
textStorage.clampRange(newRange);
this._invalidateSelection();
if (this._hasFocus) {
this._rearmInsertionPointBlinkTimer();
}
if (ensureVisible) {
this.scrollToPosition(newRange.end);
}
this.selectionChanged(newRange);
catalog.publish(this.editor, 'editorChange', 'selection', newRange);
},
textInserted: function(text) {
// We don't handle the new line char at this point.
if (text === '\n') {
return;
}
var preds = { isTextView: true, isCommandKey: false };
if (!this.editor.processKeyEvent(text, this, preds)) {
this.insertText(text);
this.resetKeyBuffers();
}
},
/**
* Changes the internal hasFocus flag if the current hasFocus value is not
* equal to the parameter 'value'. If 'fromTextInput' is true, then
* the textInput.focus() and textInput.blur() is not called. This is
* necessary as otherwise the textInput detects the blur event, calls
* hasFocus = false and the _setFocus function calls textInput.blur() again.
* If the textInput was blured, because the entire page lost the focus, then
* the foucs is not reset to the textInput when the page gains the focus again.
*/
_setFocus: function(value, fromTextInput) {
if (value == this._hasFocus) {
return;
}
this._hasFocus = value;
if (this._hasFocus) {
this._rearmInsertionPointBlinkTimer();
this._invalidateSelection();
if (!fromTextInput) {
this.textInput.focus();
}
} else {
if (this._insertionPointBlinkTimer) {
clearInterval(this._insertionPointBlinkTimer);
this._insertionPointBlinkTimer = null;
}
this._insertionPointVisible = true;
this._invalidateSelection();
if (!fromTextInput) {
this.textInput.blur();
}
}
}
});
util.mixin(exports.GutterView.prototype, {
drawRect: function(rect, context) {
var theme = this.editor.themeData.gutter;
context.fillStyle = theme.backgroundColor;
context.fillRect(rect.x, rect.y, rect.width, rect.height);
context.save();
var paddingLeft = theme.paddingLeft;
context.translate(paddingLeft, 0);
var layoutManager = this.editor.layoutManager;
var range = layoutManager.characterRangeForBoundingRect(rect);
var endRow = Math.min(range.end.row,
layoutManager.textLines.length - 1);
var lineAscent = layoutManager.fontDimension.lineAscent;
context.fillStyle = theme.color;
context.font = this.editor.font;
for (var row = range.start.row; row <= endRow; row++) {
// TODO: breakpoints
context.fillText('' + (row + 1), -0.5,
layoutManager.lineRectForRow(row).y + lineAscent - 0.5);
}
context.restore();
},
computeWidth: function() {
var theme = this.editor.themeData.gutter;
var paddingWidth = theme.paddingLeft + theme.paddingRight;
var lineNumberFont = this.editor.font;
var layoutManager = this.editor.layoutManager;
var lineCount = layoutManager.textLines.length;
var lineCountStr = '' + lineCount;
var characterWidth = layoutManager.fontDimension.characterWidth;
var strWidth = characterWidth * lineCountStr.length;
return strWidth + paddingWidth;
}
});
util.mixin(KeyboardManager.prototype, {
_customKeymappingCache: { states: {} },
/**
* Searches through the command canon for an event matching the given flags
* with a key equivalent matching the given SproutCore event, and, if the
* command is found, sends a message to the appropriate target.
*
* This will get a couple of upgrades in the not-too-distant future:
* 1. caching in the Canon for fast lookup based on key
* 2. there will be an extra layer in between to allow remapping via
* user preferences and keyboard mapping plugins
*
* @return True if a matching command was found, false otherwise.
*/
processKeyEvent: function(evt, sender, flags) {
// Use our modified commandCodes function to detect the meta key in
// more circumstances than SproutCore alone does.
var symbolicName = keyutil.commandCodes(evt, true)[0];
if (util.none(symbolicName)) {
return false;
}
// TODO: Maybe it should be the job of our caller to do this?
exports.buildFlags(flags);
flags.isCommandKey = true;
return this._matchCommand(symbolicName, sender, flags);
},
_matchCommand: function(symbolicName, sender, flags) {
var match = this._findCommandExtension(symbolicName, sender, flags);
if (match && match.commandExt !== 'no command') {
if (flags.isTextView) {
sender.resetKeyBuffers();
}
var commandExt = match.commandExt;
commandExt.load(function(command) {
var request = new Request({
command: command,
commandExt: commandExt
});
history.execute(match.args, request);
});
return true;
}
// 'no command' is returned if a keyevent is handled but there is no
// command executed (for example when switchting the keyboard state).
if (match && match.commandExt === 'no command') {
return true;
} else {
return false;
}
},
_buildBindingsRegex: function(bindings) {
// Escape a given Regex string.
bindings.forEach(function(binding) {
if (!util.none(binding.key)) {
binding.key = new RegExp('^' + binding.key + '$');
} else if (Array.isArray(binding.regex)) {
binding.key = new RegExp('^' + binding.regex[1] + '$');
binding.regex = new RegExp(binding.regex.join('') + '$');
} else {
binding.regex = new RegExp(binding.regex + '$');
}
});
},
/**
* Build the RegExp from the keymapping as RegExp can't stored directly
* in the metadata JSON and as the RegExp used to match the keys/buffer
* need to be adapted.
*/
_buildKeymappingRegex: function(keymapping) {
for (state in keymapping.states) {
this._buildBindingsRegex(keymapping.states[state]);
}
keymapping._convertedRegExp = true;
},
/**
* Loop through the commands in the canon, looking for something that
* matches according to #_commandMatches, and return that.
*/
_findCommandExtension: function(symbolicName, sender, flags) {
// If the flags indicate that we handle the textView's input then take
// a look at keymappings as well.
if (flags.isTextView) {
var currentState = sender._keyState;
// Don't add the symbolic name to the key buffer if the alt_ key is
// part of the symbolic name. If it starts with alt_, this means
// that the user hit an alt keycombo and there will be a single,
// new character detected after this event, which then will be
// added to the buffer (e.g. alt_j will result in ∆).
if (!flags.isCommandKey || symbolicName.indexOf('alt_') === -1) {
sender._keyBuffer +=
symbolicName.replace(/ctrl_meta|meta/,'ctrl');
sender._keyMetaBuffer += symbolicName;
}
// List of all the keymappings to look at.
var ak = [ this._customKeymappingCache ];
// Get keymapping extension points.
ak = ak.concat(catalog.getExtensions('keymapping'));
for (var i = 0; i < ak.length; i++) {
// Check if the keymapping has the current state.
if (util.none(ak[i].states[currentState])) {
continue;
}
if (util.none(ak[i]._convertedRegExp)) {
this._buildKeymappingRegex(ak[i]);
}
// Try to match the current mapping.
var result = this._bindingsMatch(
symbolicName,
flags,
sender,
ak[i]);
if (!util.none(result)) {
return result;
}
}
}
var commandExts = catalog.getExtensions('command');
var reply = null;
var args = {};
symbolicName = symbolicName.replace(/ctrl_meta|meta/,'ctrl');
commandExts.some(function(commandExt) {
if (this._commandMatches(commandExt, symbolicName, flags)) {
reply = commandExt;
return true;
}
return false;
}.bind(this));
return util.none(reply) ? null : { commandExt: reply, args: args };
},
/**
* Checks if the given parameters fit to one binding in the given bindings.
* Returns the command and arguments if a command was matched.
*/
_bindingsMatch: function(symbolicName, flags, sender, keymapping) {
var match;
var commandExt = null;
var args = {};
var bufferToUse;
if (!util.none(keymapping.hasMetaKey)) {
bufferToUse = sender._keyBuffer;
} else {
bufferToUse = sender._keyMetaBuffer;
}
// Add the alt_key to the buffer as we don't want it to be in the buffer
// that is saved but for matching, it needs to be there.
if (symbolicName.indexOf('alt_') === 0 && flags.isCommandKey) {
bufferToUse += symbolicName;
}
// Loop over all the bindings of the keymapp until a match is found.
keymapping.states[sender._keyState].some(function(binding) {
// Check if the key matches.
if (binding.key && !binding.key.test(symbolicName)) {
return false;
}
// Check if the regex matches.
if (binding.regex && !(match = binding.regex.exec(bufferToUse))) {
return false;
}
// Check for disallowed matches.
if (binding.disallowMatches) {
for (var i = 0; i < binding.disallowMatches.length; i++) {
if (!!match[binding.disallowMatches[i]]) {
return true;
}
}
}
// Check predicates.
if (!exports.flagsMatch(binding.predicates, flags)) {
return false;
}
// If there is a command to execute, then figure out the
// comand and the arguments.
if (binding.exec) {
// Get the command.
commandExt = catalog.getExtensionByKey('command', binding.exec);
if (util.none(commandExt)) {
throw new Error('Can\'t find command ' + binding.exec +
' in state=' + sender._keyState +
', symbolicName=' + symbolicName);
}
// Bulid the arguments.
if (binding.params) {
var value;
binding.params.forEach(function(param) {
if (!util.none(param.match) && !util.none(match)) {
value = match[param.match] || param.defaultValue;
} else {
value = param.defaultValue;
}
if (param.type === 'number') {
value = parseInt(value);
}
args[param.name] = value;
});
}
sender.resetKeyBuffers();
}
// Handle the 'then' property.
if (binding.then) {
sender._keyState = binding.then;
sender.resetKeyBuffers();
}
// If there is no command matched now, then return a 'false'
// command to stop matching.
if (util.none(commandExt)) {
commandExt = 'no command';
}
return true;
});
if (util.none(commandExt)) {
return null;
}
return { commandExt: commandExt, args: args };
},
/**
* Check that the given command fits the given key name and flags.
*/
_commandMatches: function(commandExt, symbolicName, flags) {
var mappedKeys = commandExt.key;
if (!mappedKeys) {
return false;
}
// Check predicates
if (!exports.flagsMatch(commandExt.predicates, flags)) {
return false;
}
if (typeof(mappedKeys) === 'string') {
if (mappedKeys != symbolicName) {
return false;
}
return true;
}
if (!Array.isArray(mappedKeys)) {
mappedKeys = [mappedKeys];
commandExt.key = mappedKeys;
}
for (var i = 0; i < mappedKeys.length; i++) {
var keymap = mappedKeys[i];
if (typeof(keymap) === 'string') {
if (keymap == symbolicName) {
return true;
}
continue;
}
if (keymap.key != symbolicName) {
continue;
}
return exports.flagsMatch(keymap.predicates, flags);
}
return false;
},
/**
* Build a cache of custom keymappings whenever the associated setting
* changes.
*/
_customKeymappingChanged: function() {
var ckc = this._customKeymappingCache =
JSON.parse(settings.get('customKeymapping'));
ckc.states = ckc.states || {};
for (state in ckc.states) {
this._buildBindingsRegex(ckc.states[state]);
}
ckc._convertedRegExp = true;
}
});