The Rich Text Editor is a UI control that replaces a standard HTML textarea; it allows for the rich formatting of text content, including common structural treatments like lists, formatting treatments like bold and italic text, and drag-and-drop inclusion and sizing of images. The Rich Text Editor's toolbar is extensible via a plugin architecture so that advanced implementations can achieve a high degree of customization.
Constructor
YAHOO.widget.Editor
(
el
,
attrs
)
- Parameters:
-
el
<String/HTMLElement>
The textarea element to turn into an editor.
-
attrs
<Object>
Object liternal containing configuration parameters.
Properties
The Toolbar items that should ALWAYS be disabled event if there is a selection present in the editor.
The Toolbar items that should ALWAYS be enabled event if there isn't a selection present in the editor.
The Toolbar items that should be disabled if there is no selection present in the editor.
An Array hash of the Undo Levels.
The index of the current undo state.
CSS class applied to the body when the hiddenelements button is pressed.
CSS class applied to an element when it's found to have a local url.
HTML id to give the properties window in the DOM.
The accessibility string for the element before the iFrame
The Title of the close button in the Editor Window
A note appearing in the Editor Window to tell the user that the Escape key will close the window
The label string for the image border.
The label string for the image border size.
The label string for the image border type.
The label string for the image copy and paste message for Opera and Safari
The label string for Original Image Size
The label string for the image padding.
The title for the Image Property Editor Window
The label string for Image Size
The label string for the image text flow.
The label string for Image Description
The string for the open in a new window label.
The label string for the Remove link from text link inside the property editor.
The label string for the Link Property Editor Window.
The string for the link description.
The label string for the local file warning.
The string for the word none.
_alwaysDisabled,
_alwaysEnabled,
_baseHREF,
_blankImageLoaded,
_contentTimer,
_contentTimerCounter,
_defaultCSS,
_defaultToolbar,
_disabled,
_docType,
_fixNodesTimer,
_focused,
_formButtonClicked,
_formButtons,
_keyMap,
_lastButton,
_lastCommand,
_lastImage,
_lastNodeChange,
_lastNodeChangeEvent,
_mask,
_nodeChangeTimer,
_rendered,
_resizeConfig,
_selection,
_semantic,
_showingHiddenElements,
_tag2cmd,
_textarea,
afterElement,
beforeElement,
browser,
CLASS_CONTAINER,
CLASS_EDITABLE,
CLASS_EDITABLE_CONT,
CLASS_NOEDIT,
CLASS_PREFIX,
currentElement,
currentEvent,
currentFont,
currentWindow,
dd,
dompath,
DOMReady,
editorDirty,
invalidHTML,
operaEvent,
resize,
SEP_DOMPATH,
STOP_EXEC_COMMAND,
STOP_NODE_CHANGE,
STR_BEFORE_EDITOR,
STR_IMAGE_HERE,
STR_IMAGE_URL,
STR_LEAVE_EDITOR,
STR_LINK_URL,
STR_TITLE,
toolbar
Methods
private
void
_checkUndo
(
)
Prunes the undo cache when it reaches the maxUndo config
private
void
_closeWindow
(
ev
)
Close the currently open EditorWindow with the Escape key.
- Parameters:
-
ev
<Event>
The keypress Event that we are trapping
- Returns:
void
private
void
_defaultImageToolbar
(
)
A reference to the Toolbar Object inside Image Editor Window.
private
void
_defaultImageToolbarConfig
(
)
Config to be used for the default Image Editor Window.
private
void
_fixNodes
(
)
Fix href and imgs as well as remove invalid HTML.
private
String
_getUndo
(
index
)
Get's a level from the undo cache.
- Parameters:
-
index
<Number>
The index of the undo level we want to get.
- Returns:
String
private
void
_handleCreateLinkWindowClose
(
)
Handles the closing of the Link Properties Window.
private
void
_handleInsertImageClick
(
)
Opens the Image Properties Window when the insert Image button is clicked or an Image is Double Clicked.
private
void
_handleInsertImageWindowClose
(
)
Handles the closing of the Image Properties Window.
private
void
_handleKeyDown
(
ev
)
Override method that handles some new keydown events inside the iFrame document.
- Parameters:
-
ev
<Event>
The event we are working on.
- Returns:
void
void
_handleWindowInputs
(
disable
)
Disables/Enables all fields inside Editor windows. Used in show/hide events to keep window fields from submitting when the parent form is submitted.
- Parameters:
-
disable
<Boolean>
The state to set all inputs in all Editor windows to. Defaults to: false.
- Returns:
void
private
_hasUndoLevel
(
)
Checks to see if we have an undo level available
private
void
_putUndo
(
str
)
Puts the content of the Editor into the _undoCache.
//TODO Convert the hash to a series of TEXTAREAS to store state in.
- Parameters:
-
str
<String>
The content of the Editor
- Returns:
void
private
void
_renderCreateLinkWindow
(
)
Pre renders the CreateLink window so we get faster window opening.
private
void
_renderInsertImageWindow
(
)
Pre renders the InsertImage window so we get faster window opening.
private
YAHOO.widget.Overlay
_renderPanel
(
)
Renders the panel used for Editor Windows to the document so we can start using it..
private
void
_storeUndo
(
)
Method to call when you want to store an undo state. Currently called from nodeChange and _handleKeyUp
private
void
_undoNodeChange
(
)
nodeChange listener for undo processing
private
void
_windows
(
)
A reference to the HTML elements used for the body of Editor Windows.
void
closeWindow
(
)
Close the currently open EditorWindow.
void
cmd_heading
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('heading') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_hiddenelements
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('hiddenelements') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_indent
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('indent') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_justify
(
dir
)
This is a factory method for the justify family of commands.
- Parameters:
-
dir
<object>
The direction to justify
- Returns:
void
void
cmd_justifycenter
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('justifycenter') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_justifyleft
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('justifyleft') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_justifyright
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('justifyright') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_outdent
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('outdent') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_redo
(
value
)
Pulls an item from the Undo stack and updates the Editor
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_removeformat
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('removeformat') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_script
(
action
,
value
)
This is a combined execCommand override method. It is called from the cmd_superscript and cmd_subscript methods.
- Parameters:
-
action
<object>
action passed from the execCommand method
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_subscript
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('subscript') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_superscript
(
value
)
This is an execCommand override method. It is called from execCommand when the execCommand('superscript') is used.
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
cmd_undo
(
value
)
Pulls an item from the Undo stack and updates the Editor
- Parameters:
-
value
<object>
Value passed from the execCommand method
- Returns:
void
void
init
(
)
The Editor class' initialization method
void
initAttributes
(
attr
)
Initializes all of the configuration attributes used to create
the editor.
- Parameters:
-
attr
<Object>
Object literal specifying a set of
configuration attributes used to create the editor.
- Returns:
void
void
moveWindow
(
force
)
Realign the window with the currentElement and reposition the knob above the panel.
- Parameters:
-
force
<Boolean>
Boolean to tell it to move but not use any animation (Usually done the first time the window is loaded.)
- Returns:
void
void
openWindow
(
win
)
Opens a new "window/panel"
String
toString
(
)
Returns a string representing the editor.
_checkKey,
_checkLoaded,
_cleanClassName,
_cleanIncomingHTML,
_closeWindow,
_createCurrentElement,
_createIframe,
_createInsertElement,
_disableEditor,
_fixNodes,
_focusWindow,
_getBlankImage,
_getDoc,
_getDomPath,
_getRange,
_getSelectedElement,
_getSelection,
_getWindow,
_handleAfterNodeChange,
_handleAlign,
_handleAutoHeight,
_handleBlur,
_handleClick,
_handleColorPicker,
_handleCreateLinkClick,
_handleCreateLinkWindowClose,
_handleDoubleClick,
_handleFocus,
_handleFontSize,
_handleFormButtonClick,
_handleFormSubmit,
_handleInsertImageClick,
_handleInsertImageWindowClose,
_handleKeyDown,
_handleKeyPress,
_handleKeyUp,
_handleMouseDown,
_handleMouseUp,
_handleToolbarClick,
_hasParent,
_hasSelection,
_initEditor,
_initEditorEvents,
_isElement,
_isLocalFile,
_isNonEditable,
_listFix,
_nodeChange,
_removeEditorEvents,
_render,
_selectNode,
_setCurrentEvent,
_setDesignMode,
_setEditorStyle,
_setInitialContent,
_setMarkupType,
_setupAfterElement,
_setupDD,
_setupResize,
_swapEl,
_toggleDesignMode,
_updateMenuChecked,
_writeDomPath,
cleanHTML,
clearEditorDoc,
closeWindow,
cmd_backcolor,
cmd_bold,
cmd_createlink,
cmd_fontname,
cmd_fontsize,
cmd_forecolor,
cmd_inserthtml,
cmd_insertimage,
cmd_insertorderedlist,
cmd_insertunorderedlist,
cmd_italic,
cmd_list,
cmd_underline,
cmd_unlink,
destroy,
execCommand,
filter_all_rgb,
filter_internals,
filter_invalid_lists,
filter_msword,
filter_rgb,
filter_safari,
focus,
getEditorHTML,
hide,
init,
initAttributes,
moveWindow,
nodeChange,
openWindow,
post_filter_linebreaks,
pre_filter_linebreaks,
render,
saveHTML,
setEditorHTML,
show,
toString
_setHTMLAttrConfig,
addClass,
addListener,
appendChild,
appendTo,
fireQueue,
getElementsByClassName,
getElementsByTagName,
getStyle,
hasChildNodes,
hasClass,
initAttributes,
insertBefore,
on,
removeChild,
removeClass,
removeListener,
replaceChild,
replaceClass,
setStyle,
subscribe
configureAttribute,
fireBeforeChangeEvent,
fireChangeEvent,
get,
getAttributeConfig,
getAttributeKeys,
refresh,
register,
resetAttributeConfig,
resetValue,
set,
setAttributeConfig,
setAttributes
Events
afterOpenWindow
(
win
,
panel
)
Event fires after an Editor Window is opened. See
Element.addListener for more information on listening for this event.
- Parameters:
-
win
<EditorWindow>
The EditorWindow object
-
panel
<Overlay>
The Overlay object that is used to create the window.
beforeHiddencssChange
(
event
)
Fires before the value for the configuration attribute 'hiddencss' changes. Return false to cancel the attribute change.
- Parameters:
-
event
<{oldValue: any, newValue: any}>
An object containing the previous attribute value and the new value.
beforeLocalFileWarningChange
(
event
)
Fires before the value for the configuration attribute 'localFileWarning' changes. Return false to cancel the attribute change.
- Parameters:
-
event
<{oldValue: any, newValue: any}>
An object containing the previous attribute value and the new value.
beforeOpenWindow
(
win
,
panel
)
Event fires before an Editor Window is opened. See
Element.addListener for more information on listening for this event.
- Parameters:
-
win
<EditorWindow>
The EditorWindow object
-
panel
<Overlay>
The Overlay object that is used to create the window.
closeWindow
(
win
)
Event fires after an Editor Window is closed. See
Element.addListener for more information on listening for this event.
hiddencssChange
(
event
)
Fires when the value for the configuration attribute 'hiddencss' changes.
- Parameters:
-
event
<{oldValue: any, newValue: any}>
An object containing the previous attribute value and the new value.
localFileWarningChange
(
event
)
Fires when the value for the configuration attribute 'localFileWarning' changes.
- Parameters:
-
event
<{oldValue: any, newValue: any}>
An object containing the previous attribute value and the new value.
windowCMDClose
(
win
,
panel
)
Dynamic event fired when an
EditorWindow is closed.. The dynamic event is based on the name of the window. Example Window: createlink, opening this window would fire the windowcreatelinkClose event. See
Element.addListener for more information on listening for this event.
- Parameters:
-
win
<EditorWindow>
The EditorWindow object
-
panel
<Overlay>
The Overlay object that is used to create the window.
windowCMDOpen
(
win
,
panel
)
Dynamic event fired when an
EditorWindow is opened.. The dynamic event is based on the name of the window. Example Window: createlink, opening this window would fire the windowcreatelinkOpen event. See
Element.addListener for more information on listening for this event.
- Parameters:
-
win
<EditorWindow>
The EditorWindow object
-
panel
<Overlay>
The Overlay object that is used to create the window.
windowCreateLinkRender
(
panel
,
body
)
Event fired when the pre render of the Create Link window has finished.
- Parameters:
-
panel
<Overlay>
The Overlay object that is used to create the window.
-
body
<HTMLElement>
The HTML element used as the body of the window..
windowInsertImageRender
(
panel
,
body
,
toolbar
)
Event fired when the pre render of the Insert Image window has finished.
- Parameters:
-
panel
<Overlay>
The Overlay object that is used to create the window.
-
body
<HTMLElement>
The HTML element used as the body of the window..
-
toolbar
<Toolbar>
A reference to the toolbar object used inside this window.
windowRender
(
win
,
panel
)
Event fired when the initial Overlay is rendered. Can be used to manipulate the content of the panel.
- Parameters:
-
win
<EditorWindow>
The EditorWindow object
-
panel
<Overlay>
The Overlay object that is used to create the window.
afterExecCommand,
afterNodeChange,
afterRender,
animateChange,
beforeAnimateChange,
beforeBlankimageChange,
beforeCssChange,
beforeDisabledChange,
beforeDompathChange,
beforeEditorClick,
beforeEditorDoubleClick,
beforeEditorKeyDown,
beforeEditorKeyPress,
beforeEditorKeyUp,
beforeEditorMouseDown,
beforeEditorMouseUp,
beforeExecCommand,
beforeExtracssChange,
beforeFocusAtStartChange,
beforeHandleSubmitChange,
beforeHeightChange,
beforeHtmlChange,
beforeMarkupChange,
beforeNodeChange,
beforeRemoveLineBreaksChange,
beforeToolbarChange,
beforeWidthChange,
blankimageChange,
cleanHTML,
cssChange,
disabledChange,
dompathChange,
editorClick,
editorContentLoaded,
editorDoubleClick,
editorKeyDown,
editorKeyPress,
editorKeyUp,
editorMouseDown,
editorMouseUp,
editorWindowBlur,
editorWindowFocus,
extracssChange,
focusAtStartChange,
handleSubmitChange,
heightChange,
htmlChange,
markupChange,
removeLineBreaksChange,
toolbarChange,
toolbarLoaded,
widthChange
Configuration Attributes
The CSS used to show/hide hidden elements on the page, these rules must be prefixed with the class provided in this.CLASS_HIDDEN
Default Value:
.yui-hidden font, .yui-hidden strong, .yui-hidden b, .yui-hidden em, .yui-hidden i, .yui-hidden u,
.yui-hidden div, .yui-hidden p, .yui-hidden span, .yui-hidden img, .yui-hidden ul, .yui-hidden ol,
.yui-hidden li, .yui-hidden table {
border: 1px dotted #ccc;
}
.yui-hidden .yui-non {
border: none;
}
.yui-hidden img {
padding: 2px;
}
Should we throw the warning if we detect a file that is local to their machine?
Default Value: true
allowNoEdit,
animate,
autoHeight,
blankimage,
container,
css,
disabled,
dompath,
drag,
editor_wrapper,
element_cont,
extracss,
filterWord,
focusAtStart,
handleSubmit,
height,
html,
iframe,
insert,
limitCommands,
markup,
maxUndo,
nodeChangeDelay,
nodeChangeThreshold,
panel,
plainText,
ptags,
removeLineBreaks,
resize,
saveEl,
textarea,
toolbar,
toolbar_cont,
width,