workPage
| Research
Browser-based Editors (WYSIWYG and WYSITS (What You See Is The Source))
Mozilla Editor
XULPlanet XUL Reference
another XUL Reference
A Minimal Editor - Eric Hodel
Bugzilla:
allow page to make arbitrary elements user-editable in browser
Exposing HTML Editor commands to Browser Dom
HTML editor for <textarea> (HTMLArea)
embedding of editor (master tracking bug)
editor menu
TTW WYSIWYG Editor Widgets
The List
ComposIte
- a port of Eric Hodel's (aka DrBrain) LiveLizard editor (a chrome overlay which enables a streamlined Mozilla Editor for html composition in textareas. You'll be able to edit a textarea like the one below with the wysiwig Mozilla Composer module).
Click Ctrl-e inside this text box to edit it with ComposIte.
Install skyComposer (Mozilla only)
skyComposer
Files:
-
utils.js - gets preferences as constants
-
editor.js - defines the Editor function call and prototype
Variable 'DocumentStateListener' is also defined here. It seems to encapsulate some document state monitoring functions.
The prototype consists of the following functions and properties:
Function 'init' - performs the necessary editorShell initializations.
Function 'view' - toggles between wysiwyg (normal) and source modes.
Function 'clear' - returns the document to a blank state (an empty set of html, head, and body tags).
Function 'focus' - gives the editor the focus.
Property 'content' - get and set by string are available. The code that strips the head and foot tags as the code comes out of the editor is in the get case, but the code to add them is not in the set case.
Property 'paragraphFormat' - only set the selection's paragraph format (what is that?).
-
composite.js - defines global Editor object management functions
Function 'Init' - sets initial prefs, window title, and instantiates Editor object.
Function 'compositeSave' - pulls text from editor, runs some cleanup (correcting xhtml-style brs to html-style and removing extra CRLFs), and writes it to the originating textarea.
Function 'compositeClose' - closes the editor and its window.
-
compositeOverlay.js - defines global application management functions
Also adds event listener for the close command, which calls function checkOpen.
Function 'compositeInit' - sets initial prefs and adds keyPress event listeners that call spawnEditor to all textareas (in outermost document). Also optionally calls addCompositeButton to add composite button to each textarea.
Function 'addCompositeButton' - add composite button to the specified textarea.
Function 'spawnEditor' - fields keyPress events, spawns a new composite instance for a textarea if the key combination is right.
Function 'openWindowForTextarea' - open a new composite window for a textarea (added to an array for open/close tracking, and has dblClick event listener that calls focusCompositeWindow added). If it already is open, just focuses it.
Function 'closeWindowForTextarea' - closes the window, removes it from the array, and removes the event listener.
Function 'focusCompositeWindow' - focusses the composite window.
Function 'checkOpen' - prevents user dataloss by 'accidental' close. Opens confirmation dialog.
-
compositeOverlay.xul - the xul overlay file that loads compositeOverlay.js and util.js, adds a load event listener which calls function compositeInit, and sets default prefs. This file is probably loaded by default for every page the browser loads.
-
editorOverlay.xul - the xul overlay file that is probably the one loaded into the new window (which should be visible in the window functions - track this down), the originator of the editor interface itself.
Two external style sheets are loaded: chrome://communicator/skin/ and chrome://editor/skin/editorFormatToolbar.css
Microsoft Internet Explorer MSHTML Editor
MSHTML Editor Reference and Tutorials
DHTML vs. MSHTML Editor
MSHTML Editor Reference and Tutorials
