Skip to content
forked from guardian/scribe

DEPRECATED: A rich text editor framework for the web platform

License

Notifications You must be signed in to change notification settings

positiondev/scribe

This branch is up to date with guardian/scribe:v4.0.0.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

af8a465 · Aug 25, 2017
Aug 24, 2017
Mar 2, 2017
Aug 22, 2017
Aug 22, 2017
Nov 13, 2013
Aug 24, 2017
Nov 13, 2013
Apr 26, 2016
Aug 22, 2017
Aug 22, 2017
Jun 26, 2015
Aug 25, 2017
Aug 22, 2017
Mar 10, 2014
Nov 27, 2013
Aug 24, 2017
Aug 22, 2017
Apr 27, 2016
Aug 25, 2017
Aug 25, 2017
Mar 13, 2016
Jun 26, 2015
Aug 22, 2017
Aug 25, 2017

Repository files navigation

Scribe

A rich text editor framework for the web platform, with patches for browser inconsistencies and sensible defaults.

Status

Build Status Join the chat at https://gitter.im/guardian/scribe

Description

For an introduction, you may want to read the blog post Inside the Guardian’s CMS: meet Scribe, an extensible rich text editor.

Please note: There is a lot of missing documentation for Scribe and many of its plugins. We plan to improve this, however in the meantime we encourage you to look at the code. Scribe is very small in comparison to other libraries of its kind.

You can join us on IRC at [#scribejs] on freenode, or via the Google Group.

See an example.

Scribe only actively supports a sub-set of browsers.

Core

At the core of Scribe we have:

Patches

Scribe patches many browser inconsistencies in the native command API.

Installation

npm install scribe-editor

Alternatively, you can access the distribution files through GitHub releases.

Usage Example

Scribe is an AMD module:

require(['scribe', 'scribe-plugin-blockquote-command', 'scribe-plugin-toolbar'],
  function (Scribe, scribePluginBlockquoteCommand, scribePluginToolbar) {
  var scribeElement = document.querySelector('.scribe');
  // Create an instance of Scribe
  var scribe = new Scribe(scribeElement);

  // Use some plugins
  scribe.use(scribePluginBlockquoteCommand());
  var toolbarElement = document.querySelector('.toolbar');
  scribe.use(scribePluginToolbar(toolbarElement));
});

You can see a live example here, or view the code here.

Also be sure to check the examples directory for an AMD syntax example as well as a CommonJS example.

Options

allowBlockElements
Enable/disable block element mode (enabled by default)
undo: { enabled: false }
Enable/disable Scribe's custom undo manager
defaultCommandPatches
Defines which command patches should be loaded by default
defaultPlugins
Defines which of Scribe's built-in plugins should be active
defaultFormatters
Defines which of Scribe's default formatters should be active

For detailed documentation see the wiki page on options.

Architecture

A plugin is simply a function that receives Scribe as an argument:

function myPlugin(scribe) {}

A consumer can then use your plugin with Scribe.use:

scribe.use(myPlugin);

Plugins may package whatever functionality you desire, and you are free to use native APIs to do so. However, you are required to wrap any DOM manipulation in a transaction, so that we can capture state changes for the history. For example:

function myPlugin(scribe) {
  scribe.transactionManager.run(function () {
    // Do some fancy DOM manipulation
  });
}

Browser Support

Moved to the Github Wiki

Plugins

Scribe has a rich plugin ecosystem that expands and customises what it can do.

See the wiki for a list of plugins and how to create new ones

FAQ

See the wiki's FAQ

About

DEPRECATED: A rich text editor framework for the web platform

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 98.5%
  • Shell 1.2%
  • HTML 0.3%