Code

Overview

The Code component holds the whole code and provides ways to modify it. This also holds the Lines instance that contains all tokenized lines.

Properties

`lines`

get

Returns the latest Lines instance. This is an alias of Code#Lines.

`i18n`

get

Returns the i18n collection. This is an alias of this.options.i18n.

`Lines`

Lines: Lines

The Lines instance.

`value`

get

Returns the current code.

set

Sets a new value.

`size`

get

Returns the number of lines by counting line breaks.

Methods

`before()`

before( row: number ): string

Returns a text before the specified row index, including the row itself.

Params

`row`	A row index.

Return

A sliced text.

`after()`

after( row: number ): string

Returns a text after the specified row index, including the row itself.

Params

`row`	A row index.

Return

A sliced text.

`getLine()`

getLine( row: number ): string

Returns the code at the row index. Although the Lines[ row ] also returns the code at the row, which is much faster than this method, it may not be the latest before the Sync finishes syncing process.

Params

`row`	A row index.

Return

The text of the line at the specified row.

`sliceLines()`

sliceLines( startRow: number, endRow: number ): string

Slices the code by the specified row range.

// Gets lines from 1 to 9:
const code = Code.sliceLines( 2, 10 );
TypeScript

// Gets lines from 1 to 9:
const code = Code.sliceLines( 2, 10 );

Params

`startRow`	A start row index to start slicing a text.
`endRow`	An end row index to end slicing a text.

Return

A sliced text.

`sliceRange()`

sliceRange( start: Position, end?: Position ): string

Slices the code by the specified position range.

const code = Code.sliceLines( [ 0, 1 ], [ 2, 9 ] );
TypeScript

const code = Code.sliceLines( [ 0, 1 ], [ 2, 9 ] );

Params

`start`	A start position to start slicing a text.
`end`	Optional. An end position to end slicing a text.

Return

A sliced text.

`replaceLines()`

replaceLines( startRow: number, endRow: number, replacement: string ): void

Replaces lines by the replacement text. This method only modifies the raw value, and you need to call Sync#sync() to apply the change to the editor.

Consider the following HTML as an example:

<pre>
function message() {
  console.log( 'Hi!' );
}
</pre>
HTML

<pre>
function message() {
  console.log( 'Hi!' );
}
</pre>

The following code replaces line 2 (the row index is 1), and syncs the change with the editor.

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );

const { Code, Sync } = ryuseiCode.Editor.Components;

setTimeout( () => {
  Code.replaceLines( 1, 1, `  console.log( 'Bye!' );\n` );
  Sync.sync( 1, 1 );
}, 2000 );
TypeScript

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );


const { Code, Sync } = ryuseiCode.Editor.Components;


setTimeout( () => {
  Code.replaceLines( 1, 1, `  console.log( 'Bye!' );\n` );
  Sync.sync( 1, 1 );
}, 2000 );

Params

`startRow`	A start row index.
`endRow`	An end row index.
`replacement`	A replacement text.

`replaceRange()`

replaceRange( start: Position, end: Position, replacement: string ): void

Replaces the code in a specified range by the replacement text. This method only modifies the raw value, and you need to call Sync#sync() to apply the change to the editor.

Params

`start`	A start position.
`end`	An end position.
`replacement`	A replacement text.

`replaceLinesBy()`

replaceLinesBy( startRow: number, endRow: number, iteratee: () => string ): void

Replaces lines by the iteratee function invoked for each line. The returning string of the function will be used as a new line.

This method only modifies the raw value, and you need to call Sync#sync() to apply the change to the editor.

Consider the following HTML as an example:

<pre>
1
2
3
</pre>
HTML

<pre>
1
2
3
</pre>

The following code replaces lines from 0 to 2 by an iteratee function:

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );

const { Code, Sync } = ryuseiCode.Editor.Components;

setTimeout( () => {
  Code.replaceLinesBy( 0, 2, line => `Line: ${ line }` );
  Sync.sync( 0, 2 );
}, 2000 );
TypeScript

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );


const { Code, Sync } = ryuseiCode.Editor.Components;


setTimeout( () => {
  Code.replaceLinesBy( 0, 2, line => `Line: ${ line }` );
  Sync.sync( 0, 2 );
}, 2000 );

The result will be:

Line: 1
Line: 2
Line: 3

Line: 1
Line: 2
Line: 3

Params

`startRow`	A start row index.
`endRow`	An end row index.
`iteratee`	An iteratee function invoked for each line.

`search()`

search( search: string | RegExp, ignoreCase?: boolean, wholeWord?: boolean, limit?: number ): Range[]

Searches the provided word or regexp and returns matched ranges.

<pre>
foo
bar
foo
</pre>
HTML

<pre>
foo
bar
foo
</pre>

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );

const { Code } = ryuseiCode.Editor.Components;
const ranges = Code.search( 'foo' );

// The ranges will contain 2 results:
// { start: [ 0, 0 ], end: [ 0, 3 ] }
// { start: [ 2, 0 ], end: [ 2, 3 ] }
TypeScript

const ryuseiCode = new RyuseiCode();
ryuseiCode.apply( 'pre' );


const { Code } = ryuseiCode.Editor.Components;
const ranges = Code.search( 'foo' );


// The ranges will contain 2 results:
// { start: [ 0, 0 ], end: [ 0, 3 ] }
// { start: [ 2, 0 ], end: [ 2, 3 ] }

Params

`search`	A string or a regexp object.
`ignoreCase`	Optional. Whether to perform case-insensitive search or not.
`wholeWord`	Optional. Whether to only match a whole word or not.
`limit`	Optional. Limits the number of matched results.

Return

An array with Range objects.