- [**RStudio**](https://www.rstudio.com/products/RStudio "RStudio"): RStudio is an integrated development environment (IDE) for R.
- [**Terminal for Atom**](https://github.com/jsmecham/atom-terminal-tab): A simple terminal for the Atom text editor.
- [**Eclipse Orion**](https://orionhub.org): A modern, open source software development environment that runs in the cloud. Code, deploy and run in the cloud.
+- [**Gravitational Teleport**](https://github.com/gravitational/teleport): Gravitational Teleport is a modern SSH server for remotely accessing clusters of Linux servers via SSH or HTTPS.
Do you use xterm.js in your application as well? Please [open a Pull Request](https://github.com/sourcelair/xterm.js/pulls) to include it here. We would love to have it in our list.
selectionManager.selectWordAt([14, 0]);
assert.equal(selectionManager.selectionText, 'foo');
});
+ it('should select up to non-path characters that are commonly adjacent to paths', () => {
+ buffer.push(stringToRow(':ab:(cd)[ef]{gh}\'ij"'));
+ selectionManager.selectWordAt([0, 0]);
+ assert.equal(selectionManager.selectionText, ':ab');
+ selectionManager.selectWordAt([1, 0]);
+ assert.equal(selectionManager.selectionText, 'ab');
+ selectionManager.selectWordAt([2, 0]);
+ assert.equal(selectionManager.selectionText, 'ab');
+ selectionManager.selectWordAt([3, 0]);
+ assert.equal(selectionManager.selectionText, 'ab:');
+ selectionManager.selectWordAt([4, 0]);
+ assert.equal(selectionManager.selectionText, '(cd');
+ selectionManager.selectWordAt([5, 0]);
+ assert.equal(selectionManager.selectionText, 'cd');
+ selectionManager.selectWordAt([6, 0]);
+ assert.equal(selectionManager.selectionText, 'cd');
+ selectionManager.selectWordAt([7, 0]);
+ assert.equal(selectionManager.selectionText, 'cd)');
+ selectionManager.selectWordAt([8, 0]);
+ assert.equal(selectionManager.selectionText, '[ef');
+ selectionManager.selectWordAt([9, 0]);
+ assert.equal(selectionManager.selectionText, 'ef');
+ selectionManager.selectWordAt([10, 0]);
+ assert.equal(selectionManager.selectionText, 'ef');
+ selectionManager.selectWordAt([11, 0]);
+ assert.equal(selectionManager.selectionText, 'ef]');
+ selectionManager.selectWordAt([12, 0]);
+ assert.equal(selectionManager.selectionText, '{gh');
+ selectionManager.selectWordAt([13, 0]);
+ assert.equal(selectionManager.selectionText, 'gh');
+ selectionManager.selectWordAt([14, 0]);
+ assert.equal(selectionManager.selectionText, 'gh');
+ selectionManager.selectWordAt([15, 0]);
+ assert.equal(selectionManager.selectionText, 'gh}');
+ selectionManager.selectWordAt([16, 0]);
+ assert.equal(selectionManager.selectionText, '\'ij');
+ selectionManager.selectWordAt([17, 0]);
+ assert.equal(selectionManager.selectionText, 'ij');
+ selectionManager.selectWordAt([18, 0]);
+ assert.equal(selectionManager.selectionText, 'ij');
+ selectionManager.selectWordAt([19, 0]);
+ assert.equal(selectionManager.selectionText, 'ij"');
+ });
});
describe('_selectLineAt', () => {
*/
const CLEAR_MOUSE_DISTANCE = 10;
+/**
+ * A string containing all characters that are considered word separated by the
+ * double click to select work logic.
+ */
+const WORD_SEPARATORS = ' ()[]{}:\'"';
+
// TODO: Move these constants elsewhere, they belong in a buffer or buffer
// data/line class.
const LINE_DATA_CHAR_INDEX = 1;
const NON_BREAKING_SPACE_CHAR = String.fromCharCode(160);
const ALL_NON_BREAKING_SPACE_REGEX = new RegExp(NON_BREAKING_SPACE_CHAR, 'g');
+/**
+ * Represents a position of a word on a line.
+ */
+interface IWordPosition {
+ start: number;
+ length: number;
+}
+
+/**
+ * A selection mode, this drives how the selection behaves on mouse move.
+ */
+enum SelectionMode {
+ NORMAL,
+ WORD,
+ LINE
+}
+
/**
* A class that manages the selection of the terminal. With help from
* SelectionModel, SelectionManager handles with all logic associated with
private _clickCount: number;
/**
- * Whether line select mode is active, this occurs after a triple click.
+ * The current selection mode.
*/
- private _isLineSelectModeActive: boolean;
+ private _activeSelectionMode: SelectionMode;
/**
* A setInterval timer that is active while the mouse is down whose callback
this._model = new SelectionModel(_terminal);
this._lastMouseDownTime = 0;
- this._isLineSelectModeActive = false;
+ this._activeSelectionMode = SelectionMode.NORMAL;
}
/**
* @param event The mouse event.
*/
private _getMouseBufferCoords(event: MouseEvent): [number, number] {
- const coords = Mouse.getCoords(event, this._rowContainer, this._charMeasure, this._terminal.cols, this._terminal.rows);
+ const coords = Mouse.getCoords(event, this._rowContainer, this._charMeasure, this._terminal.cols, this._terminal.rows, true);
// Convert to 0-based
coords[0]--;
coords[1]--;
private _onSingleClick(event: MouseEvent): void {
this._model.selectionStartLength = 0;
this._model.isSelectAllActive = false;
- this._isLineSelectModeActive = false;
+ this._activeSelectionMode = SelectionMode.NORMAL;
this._model.selectionStart = this._getMouseBufferCoords(event);
if (this._model.selectionStart) {
this._model.selectionEnd = null;
private _onDoubleClick(event: MouseEvent): void {
const coords = this._getMouseBufferCoords(event);
if (coords) {
+ this._activeSelectionMode = SelectionMode.WORD;
this._selectWordAt(coords);
}
}
private _onTripleClick(event: MouseEvent): void {
const coords = this._getMouseBufferCoords(event);
if (coords) {
- this._isLineSelectModeActive = true;
+ this._activeSelectionMode = SelectionMode.LINE;
this._selectLineAt(coords[1]);
}
}
this._model.selectionEnd = this._getMouseBufferCoords(event);
// Select the entire line if line select mode is active.
- if (this._isLineSelectModeActive) {
+ if (this._activeSelectionMode === SelectionMode.LINE) {
if (this._model.selectionEnd[1] < this._model.selectionStart[1]) {
this._model.selectionEnd[0] = 0;
} else {
this._model.selectionEnd[0] = this._terminal.cols;
}
+ } else if (this._activeSelectionMode === SelectionMode.WORD) {
+ this._selectToWordAt(this._model.selectionEnd);
}
// Determine the amount of scrolling that will happen.
}
/**
- * Selects the word at the coordinates specified. Words are defined as all
- * non-whitespace characters.
+ * Gets positional information for the word at the coordinated specified.
* @param coords The coordinates to get the word at.
*/
- protected _selectWordAt(coords: [number, number]): void {
+ private _getWordAt(coords: [number, number]): IWordPosition {
const bufferLine = this._buffer.get(coords[1]);
const line = translateBufferLineToString(bufferLine, false);
endCol++;
}
// Expand the string in both directions until a space is hit
- while (startIndex > 0 && line.charAt(startIndex - 1) !== ' ') {
+ while (startIndex > 0 && !this._isCharWordSeparator(line.charAt(startIndex - 1))) {
if (bufferLine[startCol - 1][LINE_DATA_WIDTH_INDEX] === 0) {
// If the next character is a wide char, record it and skip the column
leftWideCharCount++;
startIndex--;
startCol--;
}
- while (endIndex + 1 < line.length && line.charAt(endIndex + 1) !== ' ') {
+ while (endIndex + 1 < line.length && !this._isCharWordSeparator(line.charAt(endIndex + 1))) {
if (bufferLine[endCol + 1][LINE_DATA_WIDTH_INDEX] === 2) {
// If the next character is a wide char, record it and skip the column
rightWideCharCount++;
}
}
- // Record the resulting selection
- this._model.selectionStart = [startIndex + charOffset - leftWideCharCount, coords[1]];
- this._model.selectionStartLength = Math.min(endIndex - startIndex + leftWideCharCount + rightWideCharCount + 1/*include endIndex char*/, this._terminal.cols);
+ const start = startIndex + charOffset - leftWideCharCount;
+ const length = Math.min(endIndex - startIndex + leftWideCharCount + rightWideCharCount + 1/*include endIndex char*/, this._terminal.cols);
+ return {start, length};
+ }
+
+ /**
+ * Selects the word at the coordinates specified.
+ * @param coords The coordinates to get the word at.
+ */
+ protected _selectWordAt(coords: [number, number]): void {
+ const wordPosition = this._getWordAt(coords);
+ this._model.selectionStart = [wordPosition.start, coords[1]];
+ this._model.selectionStartLength = wordPosition.length;
+ }
+
+ /**
+ * Sets the selection end to the word at the coordinated specified.
+ * @param coords The coordinates to get the word at.
+ */
+ private _selectToWordAt(coords: [number, number]): void {
+ const wordPosition = this._getWordAt(coords);
+ this._model.selectionEnd = [this._model.areSelectionValuesReversed() ? wordPosition.start : (wordPosition.start + wordPosition.length), coords[1]];
+ }
+
+ /**
+ * Gets whether the character is considered a word separator by the select
+ * word logic.
+ * @param char The character to check.
+ */
+ private _isCharWordSeparator(char: string): boolean {
+ return WORD_SEPARATORS.indexOf(char) >= 0;
}
/**
) {
super(terminal);
}
-
- public areSelectionValuesReversed(): boolean { return this._areSelectionValuesReversed(); }
}
describe('SelectionManager', () => {
});
});
- describe('_areSelectionValuesReversed', () => {
+ describe('areSelectionValuesReversed', () => {
it('should return true when the selection end is before selection start', () => {
model.selectionStart = [1, 0];
model.selectionEnd = [0, 0];
return this.selectionStart;
}
- return this._areSelectionValuesReversed() ? this.selectionEnd : this.selectionStart;
+ return this.areSelectionValuesReversed() ? this.selectionEnd : this.selectionStart;
}
/**
}
// Use the selection start if the end doesn't exist or they're reversed
- if (!this.selectionEnd || this._areSelectionValuesReversed()) {
+ if (!this.selectionEnd || this.areSelectionValuesReversed()) {
return [this.selectionStart[0] + this.selectionStartLength, this.selectionStart[1]];
}
/**
* Returns whether the selection start and end are reversed.
*/
- protected _areSelectionValuesReversed(): boolean {
+ public areSelectionValuesReversed(): boolean {
const start = this.selectionStart;
const end = this.selectionEnd;
return start[1] > end[1] || (start[1] === end[1] && start[0] > end[0]);
* @param event The mouse event.
* @param rowContainer The terminal's row container.
* @param charMeasure The char measure object used to determine character sizes.
+ * @param colCount The number of columns in the terminal.
+ * @param rowCount The number of rows n the terminal.
+ * @param isSelection Whether the request is for the selection or not. This will
+ * apply an offset to the x value such that the left half of the cell will
+ * select that cell and the right half will select the next cell.
*/
-export function getCoords(event: MouseEvent, rowContainer: HTMLElement, charMeasure: CharMeasure, colCount: number, rowCount: number): [number, number] {
+export function getCoords(event: MouseEvent, rowContainer: HTMLElement, charMeasure: CharMeasure, colCount: number, rowCount: number, isSelection?: boolean): [number, number] {
const coords = getCoordsRelativeToElement(event, rowContainer);
- // Convert to cols/rows
- coords[0] = Math.ceil(coords[0] / charMeasure.width);
+ // Convert to cols/rows.
+ coords[0] = Math.ceil((coords[0] + (isSelection ? charMeasure.width / 2 : 0)) / charMeasure.width);
coords[1] = Math.ceil(coords[1] / charMeasure.height);
// Ensure coordinates are within the terminal viewport.