« Text Editor Source 3.0.1

Source extension for Text Editor. This extension provides a set of key strokes to generate responses like in a typical source code editor.


Strokes

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)

Spawn an alert dialog box.

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

editor.confirm(hint, then)

Spawn a confirmation dialog box.

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

editor.insertBlock(value, mode = 0)

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

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

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

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

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

editor.prompt(hint, value, then)

Spawn 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.selectBlock(withSpaces = true)

Select the current line.

editor.selectBlock();

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

Toggle wrap and peel selection with open and close string.

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

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

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

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

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

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

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