Editor2 Widget in dojo provides a WYSIWYG editor for HTML content. The core is compact and lightweight, while a plugin framework ensures that any functionality can be achieved by plugins.
Basic html editing capacity is implemented in the core, which is the RichText widget. Currently keyboard shortcuts are also hardcoded in this widget (TODO: generalize this, or use KeyRouter instead?).
Editor2 is a subclass of RichText Widget which adds a toolbar (Editor2Toolbar Widget) to the top of the editing area.
In order to have an extensible structure, the new Editor2 introduced several new concepts.
The first and most fundamental one is call Command, which executes a specific function on the editing area. It also provides the API to retrieve the current state of the command. The base class for Command is dojo.widget.Editor2Command (defined in Editor2.js).
Each command should have a unique name and each command is a singleton object per page: no matter how many Editor2 instances there are in one page, they share the same command objects.
The toolbar (defined in Editor2Toolbar.js) for the editor2 contains serveral toolbar items. The basic class for toolbar item is dojo.widget.Editor2ToolbarButton (defined in Editor2Toolbar.js), which essentially is a simplified version of dojo widget.
Toolbar item can be of any type, besides buttons, you can have more complex items, such as a dojo combobox like item with a dropdown (see dojo.widget.Editor2ToolbarFormatBlockSelect in Editor2Toolbar.js).
| Name | Description | Features | ||
|---|---|---|---|---|
| ContextMenu | Command | ToolbarItem | ||
| ContextMenu | Context Menu Core, with menu items for builtin commands | Cut/Copy/Paste, Link/Unlink, Image properties | - | - |
| FindReplace | Implement find and replace functionalities | - | Find/Replace | Find/Replace |
| TableOperation | Support for table related operation | Insert/Delete Table | Insert/Delete Table | Insert Table |
| AlwaysShowToolbar | Ensure the toolbar is visible when scrolling the page | - | - | - |
| ToolbarDndSupport | Toolbar Set/Item drag and drop support | - | - | - |
| SimpleSignalCommands | Add simple signals to Editor2, such as save() and createLink() | - | - | - |