« Text Editor Source 3.0.5

Enable Source Editor

Test Toggle #1 Test Toggle #2

Test Toggle Line #1 Test Toggle Line #2

Test Select Current Line Test Select Current Line (Without the Space(s)) Test Insert After Line Test Insert Before Line Test Replace Current Line

Strokes

• (), [], {}, '', "", or <> then press Enter.
• (), [], {}, '', "", or <> then press Backspace.
• (), [], {}, '', "", or <> then press Space.
• (asdf), [asdf], {asdf}, 'asdf', "asdf", or <asdf>, then press Backspace.
• (asdf), [asdf], {asdf}, 'asdf', "asdf", or <asdf>, then press Delete.
• asdf asdf, then press Control + ArrowRight.
• asdf then press (, [, {, ', ", or <.
• asdf then press ), ], }, or >.
• asdf or asdf, then press Control + ArrowUp.
• asdf or asdf, then press Control + ArrowDown.
• asdf or asdf, then press Control + Enter.
• asdf or asdf, then press Control + Shift + Enter.
• asdf asdf, then press Control + ArrowLeft.
• Press (, [, {, ', ", or <.

Usage

Browser

<script src="./text-editor/index.min.js"></script>
<script src="./text-editor.history/index.min.js"></script>
<script src="./text-editor.key/index.min.js"></script>
<script src="./text-editor.source/index.min.js"></script>
<script>

  const editor = new TextEditor(document.querySelector('textarea'), {
      commands: {
          pull: function () {
              return this.pull().record(), false;
          },
          push: function () {
              return this.push().record(), false;
          },
          redo: function () {
              return this.redo(), false;
          },
          undo: function () {
              return this.undo(), false;
          }
      },
      keys: {
          'Control-[': 'pull',
          'Control-]': 'push',
          'Control-y': 'redo',
          'Control-z': 'undo'
      },
      tab: 4,
      with: [TextEditor.History, TextEditor.Key, TextEditor.Source]
  });

</script>

CommonJS

const TextEditor = require('@taufik-nurrohman/text-editor').default;
const TextEditorHistory = require('@taufik-nurrohman/text-editor.history').default;
const TextEditorKey = require('@taufik-nurrohman/text-editor.key').default;
const TextEditorSource = require('@taufik-nurrohman/text-editor.source').default;

const editor = new TextEditor(document.querySelector('textarea'), {
    commands: {
        pull: function () {
            return this.pull().record(), false;
        },
        push: function () {
            return this.push().record(), false;
        },
        redo: function () {
            return this.redo(), false;
        },
        undo: function () {
            return this.undo(), false;
        }
    },
    keys: {
        'Control-[': 'pull',
        'Control-]': 'push',
        'Control-y': 'redo',
        'Control-z': 'undo'
    },
    tab: 4,
    with: [TextEditorHistory, TextEditorKey, TextEditorSource]
});

ECMAScript

import TextEditor from '@taufik-nurrohman/text-editor';
import TextEditorHistory from '@taufik-nurrohman/text-editor.history';
import TextEditorKey from '@taufik-nurrohman/text-editor.key';
import TextEditorSource from '@taufik-nurrohman/text-editor.source';

const editor = new TextEditor(document.querySelector('textarea'), {
    commands: {
        pull: function () {
            return this.pull().record(), false;
        },
        push: function () {
            return this.push().record(), false;
        },
        redo: function () {
            return this.redo(), false;
        },
        undo: function () {
            return this.undo(), false;
        }
    },
    keys: {
        'Control-[': 'pull',
        'Control-]': 'push',
        'Control-y': 'redo',
        'Control-z': 'undo'
    },
    tab: 4,
    with: [TextEditorHistory, TextEditorKey, TextEditorSource]
});

Methods

Instance Methods

editor.alert(hint, then)

Spawns an alert dialog box.

editor.alert('Hello!', function (value) {
    console.log(value); // Here, `value` will always be `true`
});

editor.confirm(hint, then)

Spawns a confirmation dialog box.

editor.confirm('Are you sure?', function (value) {
    console.log(value); // Here, `value` can be `true` or `false`
});

editor.insertLine(value, mode = 0)

Inserts value above/below the current line, or replace the current line with value.

editor.insertLine('asdf'); // Replace the current line with `'asdf'`
editor.insertLine('asdf', -1); // Insert `'asdf'` above the current line
editor.insertLine('asdf', +1); // Insert `'asdf'` below the current line

editor.peelLine(open, close, wrap = false, withSpaces = false)

Selects the current line then perform the peel command on it.

editor.peelLine('<p>', '</p>');

editor.prompt(hint, value, then)

Spawns a prompt dialog box.

editor.prompt('URL:', 'http://', function (value) {
    console.log(value); // Here, `value` can be the text you have submitted or `false`
});

editor.selectLine(withSpaces = true)

Selects the current line.

editor.selectLine();

editor.toggle(open, close, wrap = false)

Toggles wrap and peel selection with open and close string.

editor.toggle('<b>', '</b>');

editor.toggleLine(open, close, wrap = false, withSpaces = false)

Selects the current line then perform the toggle command on it.

editor.toggleLine('<p>', '</p>');

editor.wrapLine(open, close, wrap = false, withSpaces = false)

Selects the current line then perform the wrap command on it.

editor.wrapLine('<p>', '</p>');