Sferyx JSyndrome HTMLEditor Applet Edition
 

Don't forget to read the FAQ!

Users Manual

The Sferyx JSyndrome HTMLEditor has been released in three versions Light, Professional and Enterprise. The differences between these versions could be found into the extended product documentation. All versions can run in two modes: embedded within the page or in a separate window with full resize and move behavior which increases the usability of the editor. For major details how to use the different modes consult the Installation section.

If you are a java developer and you are looking for a full featured HTMLEditor Java bean check out the Sferyx JSyndrome HTMLEditor Component Edition. It contains full API for development and deployment

________________________________________________________________________________________________________

________________________________________________________________________________________________________

________________________________________________________________________________________________________

________________________________________________________________________________________________________

 

On-line resources

________________________________________________________________________________________________________

 What's new in version 6.5 (Changelog history)

 

Basic Features Matrix:

Features

Light Professional  Enterprise
Open, save HTML/XHTML files Available Available Available
Remote file browser dialog - permits easily browsing of files on the server side with minimum adapting of your server scripts - saves a lot of work for javascripts etc. 
New
Different remote browse locations for images and links
Available Available Available
Two mode operation of the file browsing - local & remote - can be set easily via applet parameters. Available Available Available
Full Drag & Drop of formatted content directly into the edited document from external applications such as Word, Excel, Front Page etc. Available Available Available
Thawte signed applet provides full copy & paste operations from external applications such as Word, Excel, Front Page etc. Available Available Available
Loads & renders XHTML files, outputs transitional XHTML files. Available Available Available
Support for loading external CSS through the LINK tag, fixed the CSS behavior in the Professional versions. Available Available Available
Automatic detection of the page encoding and full rendering/editing both in WYSIWYG and HTML source modes of international char sets such as Greek, Cyrillic, Arabic, Chinese etc. Full list here Available Available Available
Support for setting of default char set if the page or the fragments of pages does not contain the char set information - setDefaultCharset(String char set). Available Available Available
Insert symbol dialog - support for inserting of all possible symbols & special characters. Available Available Available
Font size, family and foreground color Available Available Available
Font style (plain, italic, bold) Available Available Available
Extended Font chooser for adding underline, strikethrough, superscript, subscript font attributes. Available Available Available
Support for setting the page character encoding through the page properties dialog. Available Available Available
Improved image selection - the selected images are highlighted. Easy one click copy & paste Available Available Available
Improved table selection - through the CTRL + click - selecting/deselecting of table cells. Available Available Available
Insert hyperlink interface for inserting hyperlinks over the selected text through javascript. Available Available Available
Page properties: background color, background picture, title,  text color, hyperlink color etc. Available Available Available
Tables design and properties: background color, background picture, size, alignment, border etc. Available Available Available
Tables cell design and properties: background color, background picture, size, alignment etc. Available Available Available
Support for nested tables. Available Available Available
Invisible tables (with border 0) are shown as dashed lines. Available Available Available
Insert  table rows, insert table columns, split and merge table cells. Available Available Available
Insert images - from a remote location or using a file dialog. Available Available Available
Image properties: size, border, hyperlink,  alternative text, alignment, spacing etc. Available Available Available
Copy, paste of all document elements. Available Available Available
Create and modify HTML Forms: insert new forms and form elements, buttons, checkboxes, radio buttons, text fields, select fields (dropdown menus and lists), text area, image buttons etc. Available Available Available
Form boundaries are shown as a dashed line. Available Available Available
Creation of hyperlinks in the text or images. Available Available Available
Bulleted lists. Available Available Available
Numbered lists. Available Available Available
Increase / decrease indent of paragraphs. Available Available Available
Paragraph alignment: left, right, centered. Available Available Available
Full undo/redo support. Available Available Available
Printing support. Available Available Available
Adaptable popup menu on the basis of the underlying element. Available Available Available
Built-in toolbars, main menu, status bar etc. which can be enabled or disabled. Available Available Available
Search and replace functionalities, preserving the document formatting.   Available Available
Built-in HTML source editor with syntax highlighting. Available Available
Built-in preview section for previewing of the edited documents.   Available Available
Automatic upload of all local images and hyperlink targets to the server as multipart form data Available Available Available
Full Internationalization support Available Available Available
Possibility to adjust the font rendering size Available Available Available
MS Word paste / improved rendering  filter Available Available Available
Aligned images text wrapping Available Available Available
Ability to add javascript buttons to the editor toolbars to invoke javascript functions from the document Available Available Available
Heading selection for titles etc. Available Available Available
Copy formatting tool Available Available Available
Full backward compatibility with java 1.3 and all browsers on Mac OS X Available Available Available
Mixed mode Local & Remote Browsing and improved remote browsing Available Available Available
Full style sheet editing support - style classes can be applied through the property dialogs to each element - font, tables, images, all form elements etc. Available
Ability to specify external style sheet to be loaded through applet parameters     Available
Spellchecker component  Available
Replaceable dictionary functionality for the spellchecker     Available
Custom dictionary functionality (add new words to dictionary) for each user Available
Possibility to mark sections/elements of the document as readonly and not editable     Available
XML support - possibility to create custom grammar and provide own rendering rules for custom tags through style sheets     Available
XML support - possibility to create custom dialogs and associate actions with custom tags     Available
Javascript emulation engine - you can refer and manipulte document elements through emulated javascript calls     Available
Built-in full featured Visual MathML Equation Editor component (Sferyx Equation Editor)   Optional
Built-in full featured Visual FTP component (Sferyx FTP component) Optional
Built-in full featured Visual CSS Editor component (Sferyx CSS Editor) Optional

 

 

 

5. General Compatibility

The Sferyx JSyndrome HTMLEditor has been written and tested under JDK 1.3/1.4. It is recommended using these versions of the JDK or higher as it uses features not presented into the earlier versions of the JDK. It has been tested on various versions of Windows such as  Windows 98, Windows Me, Windows 2000 and Windows XP, Linux  with both the JRE 1.4 and JDK 1.4, Solaris and MacOS X 10.2.x with JRE 1.3.1, 1.4.1 . It has been tested with Netscape, Opera, Konqueror, Safari, Mozilla  and Internet Explorer as you can see from the matrix below:

 

 

6. Browser Compatibility Matrix

 

Platform Internet Explorer Netscape Mozilla Opera Safari Firefox  Galeon Konqueror

Windows 95/98 /ME/NT/ 2000/XP/ Vista
java 1.3 / 1.4 / 1.5 / 6.0
Available
java - javascript:yes
Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
n.a. Available
java- javascript: yes
n.a. n.a.

Mac OS X
java 1.3 / 1.4 / 1.5 / 6.0
Available
java- javascript:yes*
Available
java -javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
n.a. n.a.

Linux
java 1.4.2 / 1.5 / 6.0
n.a. Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
n.a. Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript:yes

Solaris (Sparc and x86)
java 1.4 / 1.5 / 6.0
n.a. Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
n.a. Available
java- javascript: yes
n.a. Available
java- javascript:yes

FreeBSD
java 1.4.x / 1.5 / 6.0
n.a. Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes
n.a. Available
java- javascript: yes
Available
java- javascript: yes
Available
java- javascript: yes

 

*- through the Sferyx LiveConnectProxy

 

 

7. Installation:

 

The installation is quite simple. All the classes needed are contained within the HTMLEditor.jar and if the Java Plug-in 1.3 or 1.4 is installed you will be able to see the applet opening the page which contains it. To include it within a page you have to include the following code inside the page. 

To use the embedded mode the class to be started is sferyx.administration.editors.HTMLEditor

<applet code=sferyx.administration.editors.HTMLEditor archive=HTMLEditor.jar width=800 height=600>
</applet>

To use the external window mode the class to be started is sferyx.administration.editors.HTMLEditorFrame. Inside the calling page will appear only one button for the invocation of the editor, thus the dimensions of the applet can be reduced to 150 x 30 or something similar

<applet code=sferyx.administration.editors.HTMLEditorFrame archive=HTMLEditor.jar width=150 height=30>
</applet>

In generally this code is sufficient to achieve the desired result, thought sometimes there could be problems with the browser using its embedded java environment instead of the Java Plug-in 1.4.x. In this cases it would be necessary to use the following code which is also included into the demo and the example files:

For Internet Explorer:

<OBJECT classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" WIDTH = "800" HEIGHT = "600" NAME = "htmleditor" codebase="http://java.sun.com/products/plugin/autodl/jinstall-1_4-win.cab#Version=1,4,0,0">
<PARAM NAME = CODE VALUE = "sferyx.administration.editors.HTMLEditor">
<PARAM NAME = ARCHIVE VALUE = "HTMLEditorAppletPro.jar">
<PARAM NAME = NAME VALUE = "htmleditor">
<PARAM NAME="type" VALUE="application/x-java-applet;version=1.4">
<PARAM NAME="scriptable" VALUE="true">
<COMMENT>
</COMMENT>
</OBJECT>

Consult the html source of the demo included for major details on the inclusion of the applet within web pages.

 

 

8. Applet Parameters

 

<PARAM NAME = "saveURL" VALUE="http://yourhost.com/your_script"> - Specifies the URL of the script which will receive the content of the HTMLEditor when the user presses the "Save remote" button on the File menu. It will do nothing if this variable is not specified. It sends all the content of the editor using the POST method.

<PARAM NAME = "variableName" VALUE="html_content">
- Specifies the name of the variable to be used for the content of the editor when using the POST method. If not specified the default name is html_content

<PARAM NAME = "parametersToSend" VALUE="Var1=1&Var2=2">
- Specifies any additional variables to be sent along the content of the editor if your server-side script may need any.

<PARAM NAME="addJavascriptButtons" VALUE="shortcutToolbar,helloFromJavascript(),null,Hello there|shortcutToolbar,helloFromJavascript2(),null,Hello here"> - Using this parameter can be added multiple javascript buttons using the delimiter "|" for the buttons and "," for the button parameters. See addJavascriptButtons() javascript function for parameter details.

(Enterprise Edition Only) <PARAM NAME = "sourceCodeModeOnly" VALUE="true|false"> - Specifies whether the editor should run only in source code editor mode or not. If true, the editor will display only the HTML source code editor with syntax highlighting.

<PARAM NAME = "wrapNewLineIntoBR" VALUE="true|false"> - Specifies whether the Enter key should generate new paragraph or a line break. The default value is false and pressing the Enter key new paragraph is generated. The default key assignments are as follows:

  • Enter or Ctrl + Enter - generates new paragraph <p>

  • Shift + Enter - generates line break <br> 

If wrapNewLineIntoBR is set to true then the Enter will generate line break <br> and for new paragraphs should be used Ctrl + Enter

<PARAM NAME ="absoluteDocumentTranslationURL" VALUE="http://yourhost/your_htmlfiles/"> - Specifies the translation path to be used to resolve the relative URLs of images, hyperlinks etc, if the content of the editor is set using javascript and the editor resides in a different directory than the one in which the edited documents are located. If this parameter is missing or not specified correctly some images may not be visualized correctly.

<PARAM NAME ="initialURL" VALUE="http://yourhost/anypage.htm">
- Specifies the initial page opened inside the editor if needed. If this parameter is not specified than blank page is created.

<PARAM NAME ="initialContent" VALUE="Hello, this is the initial content"> - Specifies simple initial content of the editor when the editor is started. If this parameter is not specified than blank page is created. For complex documents use initialURL instead of this one.

<PARAM NAME ="initialURLEncodedContent" VALUE="Hello%2c+this+is+the+initial+content"> - Specifies the initial content of the editor when the editor is started- it should be URLEncoded. The editor will decode it and visualize it for editing. This permits the loading of even very complicated pages, since all the tags are encoded and there is no interference with the rest of the page. This approach is very useful for loading of the initial content simply without javascripts etc.

<PARAM NAME ="uploadContentAsMultipartFormData" VALUE="true|false"> - if true, the content of the editor will be posted as multipart form data to the server when used the "Save Remote" menu item or the javascript function public boolean uploadMultipartContent(String saveLocation, boolean entireFile) . This will include all images, hyperlink targets etc. and everything will be packed and uploaded to the server. If this parameter is used in conjunction with uploadedObjectsTranslationPath the URLs of the images and hyperlinks will be converted automatically in order to be displayed correctly after uploading. See the javascript functions for major details on how to upload content to the server through javascript.

<PARAM NAME ="restrictedFontsList" VALUE="Sans Serif,Verdana,Arial,Comic Sans,Tahoma,..."> - Should contain a comma separated values of the fonts to be used. If specified, instead of using all system font, only the fonts specified by this parameter will be used.

<PARAM NAME ="defaultInitialFont" VALUE="Verdana"> - If specified the the editor will use this font as default font to be applied automatically upon typing.

<PARAM NAME ="fontSizes" VALUE="8,10,12,14,..."> - If specified the the editor will use this font sizes instead of the standard ones. 

 

When the applet runs as a separate window version you can specify with the parameters below the appearance of the button which launches the editor window:
<PARAM NAME ="buttonBgColor" VALUE="0xFFFFFF">
- Specifies the background color of the button
<PARAM NAME ="buttonFgColor" VALUE="0x000000">
- Specifies the background color of the button
<PARAM NAME ="buttonText" VALUE="Start the Visual Editor">
- Specifies the text on the button
If the applet runs in the embedded mode this parameters are simply ignored.

<PARAM NAME ="supressRemoteFileDialog" VALUE="true|false"> - Indicates whether the RemoteFileDialog should be disabled. If "true" the dialog will be disabled, if false the dialog will be active and will try to load the page indicated with the parameter remoteBrowseLocation. Must pay attention on the security restrictions when indicating the URL to load if not granted the additional privileges requested at startup.

<PARAM NAME ="supressLocalFileDialog" VALUE="true|false"> - Indicates whether the LocalFileDialog should be disabled. If "true" the dialog will be disabled, if false the dialog will be active and will be available for browsing local files if the security restrictions permit this. The signed applet will request additional privileges upon loading and if granted will be possible to open/browse/save files on the local machine. 

<PARAM NAME ="remoteBrowseLocation" VALUE="http://yourhost.com/YourFileBrowserScript"> - Indicates the URL of the page that should be loaded when using remote file browsing. If you want to be able to select and insert files through the remote file browser dialog, the output from the server should complain with only few requirements: There is absolutely no obligation of the type of the server side script since the editor display any page sent by the server inside the RemoteFileDialog. The only requirement for select & insert capability is that the links to the files are in the following format:
<input type="submit" name="anyName" value="files/taxi-3.jpg">
- that means that all buttons on the page passed will be treated as file entries and the value contains the URL of the image that should be inserted or the target for hyperlink depending on which operation we are executing - insert image, insert hyperlink or open file. You can see the example page here. You can find on-line demo demonstrating the remote file browsing in action here: http://www.sferyx.com/htmleditorapplet. If you encounter any difficulties to accomplish this task you can contact support@sferyx.com for assistance.

<PARAM NAME ="remoteLinksBrowseLocation" VALUE="http://yourhost.com/YourHyperlinkBrowserScript"> - Indicates the URL of the page that should be loaded when using remote hypelink browsing. If you want to be able to hyperlinks through the remote file browser dialog, the output from the server should complain with only few requirements: There is absolutely no obligation of the type of the server side script since the editor display any page sent by the server inside the RemoteFileDialog. The only requirement for select & insert capability is that the links to the files are in the following format:
<input type="submit" name="anyName" value="files/taxi-3.jpg">
- that means that all buttons on the page passed will be treated as file entries and the value contains the URL of the image that should be inserted or the target for hyperlink depending on which operation we are executing - insert image, insert hyperlink or open file. 

<PARAM NAME ="externalStyleSheetLocation" VALUE="http://yourhost/YourStyleSheetFile.css"> - Indicates the URL of the style sheet file (css) to be loaded. If this parameter is indicated, then the style sheet will be loaded and added to the document. All the class names will be parsed and will be available for browsing through the style combo boxes on all property dialogs. See the following CSS file format guidelines:

In order to achieve best rendering results please use only separate selectors such as the following:

body {color: #000; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
td  {color: #000; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }
p  {fcolor: #000; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-decoration: none }

.text {color: #000; font-size: 10px;}

 

(Enterprise Edition Only) <PARAM NAME ="externalDictionary" VALUE="http://yourhost/dictionary.dict"> - Indicates the URL of the dictionary to be used for spell checking. The dictionary should be plain text in the following semicolon delimited format:

A=;aa;aaaa;aaaaaa;.....etc;
B=;bb;bbb;bbbbb;bbbbbbb;......;
C=;ccc;cccc;ccccc;ccccc;....;

Each line contains all words for a given letter, for example the first line contains all the words beginning with A, the second with B etc.

All the words should be in lower case, note the initial and end delimiters. There shouldn't be any white spaces.

 

<PARAM NAME ="menuItemsToRemove" VALUE="insertBreakMenuItem,insertParagraphMenuItem,..."> - Indicates which menu items should be removed from the menus. This list contains comma separated names of the menu items contained within the editor to be removed. This allows the full customization of the dropdown menus inside the main menu. The full list is:

File Menu

newFileMenuItem - new file menu item on the "File" menu
openFileMenuItem - open file menu item on the "File" menu
openLocationMenuItem - open location menu item on the "File" menu
closeFileMenuItem - close file menu item on the "File" menu
saveFileMenuItem - save file menu item on the "File" menu
saveasFileMenuItem - save remote file menu item on the "File" menu
printFileMenuItem - print file menu item on the "File" menu
exitFileMenuItem - close file menu item on the "File" menu

Edit Menu

copyMenuItem -copy menu item on the "Edit" menu
cutMenuItem - cut menu item on the "Edit" menu
pasteMenuItem - paste menu item on the "Edit" menu
copyFormattedTextMenuItem
- copy formatted text menu item on the "Edit" menu
pasteFormattedTextMenuItem- paste formatted text menu item on the "Edit" menu
selectAllMenuItem - select all menu item on the "Edit" menu
findMenuItem - find menu item on the "Edit" menu - professional version
replaceMenuItem - replace menu item on the "Edit" menu - professional version

Insert Menu

insertBreakMenuItem - insert break menu item on the "Insert" menu
insertParagraphMenuItem
- insert paragraph menu item on the "Insert" menu
insertSpaceMenuItem
- insert space menu item on the "Insert" menu
horizontalLineMenuItem
- insert horizontal line menu item on the "Insert" menu
insertDateMenuItem
- insert date menu item on the "Insert" menu
insertSymbolMenuItem
- insert symbol menu item on the "Insert" menu
insertFormFieldTextBoxMenuItem
- insert text box menu item on the "Insert -> Form" menu
insertFormFieldTextAreaMenuItem
- insert text area menu item on the "Insert -> Form" menu
insertFormFieldCheckBoxMenuItem
- insert check box menu item on the "Insert -> Form" menu
insertFormFieldRadioButtonMenuItem
- insert radio button menu item on the "Insert -> Form" menu
insertFormFieldDropDownMenuItem
- insert drop down menuitem on the "Insert -> Form" menu
insertFormFieldPushButtonMenuItem
- insert push button menu item on the "Insert -> Form" menu
insertFormFieldImageButtonMenuItem
- insert image button menu item on the "Insert -> Form" menu
insertInsertImageMenuItem
- insert image menu item on the "Insert" menu
insertInsertHyperlinkMenuItem
- insert hyperlink menu item on the "Insert " menu

Table Menu

insertTableMainMenuItem - insert table menu item on the "Table" menu
insertTableRowMainMenuItem
- insert table row menu item on the "Table" menu
insertTableColumnMainMenuItem
- insert table column menu item on the "Table" menu
deleteTableCellsItem
- delete table column menu item on the "Table" menu
selectTableMenuItem
- select table menu item on the "Table" menu
selectTableColumnMenuItem
- select table column menu item on the "Table" menu
selectTableRowMenuItem
- select table row menu item on the "Table" menu
selectTableCellMenuItem
- select table cell menu item on the "Table" menu
splitTableCellMenuItem
- split table cell menu item on the "Table" menu
mergeTableCellMenuItem
- merge table cell menu item on the "Table" menu
tablePropertiesMainMenuItem
- table properties menu item on the "Table" menu
tableCellPropertiesMainMenuItem
- table cell properties menu item on the "Table" menu

Window Menu

newWindowMenuItem - new window menu item on the "Window" menu

Format Menu

fontPropertiesMainMenuItem - font properties menu item on the "Format" menu
pagePropertiesMainMenuItem
- page properties menu item on the "Format" menu
removeFormattingMainMenuItem - remove formatting menu item

View Menu

viewStatusBarMenuItem - view status bar menu item on the "View" menu
viewToolBarMenuItem
- view tool bar menu item on the "View" menu  - professional version 
viewSourceEditorMenuItem
- view source editor menu item on the "View" menu - professional version
viewPagePreviewMenuItem
- view preview menu item on the "View" menu  - professional version

Help Menu

aboutFileMenuItem - about menu item on the "Help" menu
 

<PARAM NAME ="menusToRemove" VALUE="menuTools,menuWindow,menuHelp,..."> - Indicates which menus should be removed from the main menu bar. This list contains comma separated names of the menus contained within the editor's main menu bar to be removed. This allows the full customization of the menus inside the main menu bar. The full list of the menus is:

Main Menus:

menuFile - the File menu on the main menu bar - will remove the entire menu;
menuEdit
- the Edit menu on the main menu bar - will remove the entire menu; 
menuView
- the View menu on the main menu bar - will remove the entire menu;
menuInsert
- the Insert menu on the main menu bar - will remove the entire menu;
menuFormat
- the Format menu on the main menu bar - will remove the entire menu;
menuTools
- the Tools menu on the main menu bar - will remove the entire menu;
menuTable
- the Table menu on the main menu bar - will remove the entire menu;
menuWindow
- the Window menu on the main menu bar - will remove the entire menu;
menuHelp
- the Help menu on the main menu bar - will remove the entire menu;

Submenus:

menuInsertTable - the Insert menu inside the Table main menu - will remove the entire menu;
menuSelectTable
- the Select menu inside the Table main menu - will remove the entire menu;
menuPropertiesTable
- the Properties menu inside the Table main menu - will remove the entire menu;
menuForm
-  the Form menu inside the Insert main menu - will remove the entire menu;

 

<PARAM NAME ="toolbarItemsToRemove" VALUE="tableBtn,decreaseIndentButton,fontsList,..."> - Indicates which toolbar items should be removed from the main tool bar. This list contains comma separated names of the toolbar items contained within the editor's main tool bar to be removed. This allows the full customization of the tools inside the main tool bar. The full list of the items is:

insertImageButton - the insert image toolbar button;
tableBtn - the insert table toolbar button;
undoButton - the undo toolbar button;
redoButton - the redo toolbar button;
insertHyperlinkButton - the insert hyperlink toolbar button;
increaseIndentButton - the increase indent toolbar button;
decreaseIndentButton - the decrease indent toolbar button;
fontSizeButton - the font properties button;
setForegroundButton - the font foreground toolbar button;
unorderedListButton - the unordered list toolbar button;
orderedListButton - the ordered list toolbar button;
newFileButton - the new file toolbar button;
openFileButton - the open file toolbar button;
saveFileButton - the save file button;
printFileButton - the print file button;
pasteButton - the paste toolbar button;
copyButton - the copy toolbar button;
cutButton - the cut toolbar button;
alignRightButton - the align right toolbar button;
alignCenterButton - the align center toolbar button;
alignLeftButton - the align left toolbar button;
fontUnderlineButton - the font underline toolbar button;
fontItalicButton - the font italic toolbar button;
fontBoldButton - the font bold toolbar button;
fontsList - the fonts list toolbar combo box;
fontSizes - the font sizes toolbar combo box;
headingStyles - the heading styles toolbar combo box;
copyFormattingButton
- the copy formatting brush toolbar button;

insertTableButton - insert table toolbar button
insertTableRowButton
- insert row toolbar button
insertTableColumnButton
- insert column toolbar button
deleteTableCellsButton
- delete table cells toolbar button
selectTableButton
- select table toolbar button
selectTableColumnButton
- select table column toolbar button
selectTableRowButton
- select table row toolbar button
selectTableCellButton
- select table cell toolbar button
splitTableCellButton
- split table cell toolbar button
mergeTableCellButton
- merge table cell toolbar button
tablePropertiesButton
- table properties toolbar button
tableCellPropertiesButton
- table cell properties toolbar button

styleClasses - the style classes toolbar combo box

showParagraphsButton - the button for revealing paragraphs
fontBackgroundButton - font background (text highlight) button
insertEquationButton -
the button for inserting mathematical equations through Sferyx EquationEditor

<PARAM NAME ="removedPopupMenuItems" VALUE="listPropertiesMenuItem,insertTableRowMenuItem..."> - Indicates which toolbar items should be removed from the main tool bar. This list contains comma separated names of the toolbar items contained within the editor's main tool bar to be removed. This allows the full customization of the tools inside the main tool bar. The full list of the items is:

listPropertiesMenuItem - list properties popup menu item, appears when the cursor is palced over a list
insertTableRowMenuItem
- insert table row popup menu item
insertTableCellMenuItem
- insert table cell popup menu item

insertTableMenuItem
- insert table row popup menu item
imagePropertiesMenuItem - image properties popup menu item, appears when there is an image selected
imageButtonFieldPropertiesMenuItem
- image button properties popup menu item, appears when there is an image button selected
formPropertiesMenuItem
- form button properties popup menu item, appears when there is a form
buttonFieldPropertiesMenuItem
- button properties popup menu item, appears when there is a button selected
radioButtonFieldPropertiesMenuItem
- radio button properties popup menu item, appears when there is a radio button selected
checkBoxFieldPropertiesMenuItem
- check box properties popup menu item, appears when there is a check box selected
textFieldPropertiesMenuItem
- text field properties popup menu item, appears when there is a text field selected
textAreaFieldPropertiesMenuItem
- text area properties popup menu item, appears when there is a text area selected
selectFieldPropertiesMenuItem
- select(list)  field properties popup menu item, appears when there is a select field(list) selected
tablePropertiesMenuItem - table properties popup menu item, appears when there is a table at the cursor position
tableCellPropertiesMenuItem
- table cell properties popup menu item, appears when there is a table at the cursor position
pagePropertiesMenuItem 
- page properties popup menu item
mergeItem
- merge table cells properties popup menu item, appears when there is a table at the cursor position
splitItem
- split table cell properties popup menu item, appears when there is a table at the cursor position
hyperlinkPropertiesPopupMenuItem
- hyperlink properties popup menu item
fontPropertiesMenuItem - font properties popup menu item
objectPropertiesMenuItem - object properties popup menu item
paragraphPropertiesPopupMenuItem
- paragraph properties popup menu item
copyItem - copy formatted text popup menu item
copyPlainTextMenuItem
- copy plain text popup menu item
pasteItem
- paste formatted text popup menu item
copyPopupMenuItem
- copy popup menu item
pastePopupMenuItem
- paste popup menu item
cutPopupMenuItem
- cut popup menu item
boldPopupMenuItem
- bold popup menu item
italicPopupMenuItem
- italic popup menu item
underlinePopupMenuItem
- underline popup menu item
alignLeftPopupMenuItem
- align left popup menu item
alignCenterPopupMenuItem
- align center popup menu item
alignRightPopupMenuItem
- align center popup menu item

 

<PARAM NAME ="mainMenuVisible" VALUE="true|false"> - Indicates if the entire main menu is visible or not. The default value is true 

<PARAM NAME ="statusbarVisible" VALUE="true|false"> - Indicates if the status bar is visible or not. The default value is true

<PARAM NAME ="toolbarVisible" VALUE="true|false"> - Indicates if the entire main toolbar is visible or not. The default value is true

<PARAM NAME ="formattingToolbarVisible" VALUE="true|false"> - Indicates if the formatting toolbar is visible or not. The default value is true

<PARAM NAME ="shortcutsToolbarVisible" VALUE="true|false"> - Indicates if the shortcuts toolbar is visible or not. The default value is true

(Pro/ Enterprise Only) <PARAM NAME ="previewVisible" VALUE="true|false"> - Indicates if the preview section is visible or not. The default value is true

(Pro/ Enterprise Only) <PARAM NAME ="sourceEditorVisible" VALUE="true|false"> - Indicates if the entire source editor is visible or not. The default value is true

(Pro/ Enterprise Only) <PARAM NAME="generatePlainHTML" VALUE="true"> - when this is specified then plain html will be generated, no xhtml closing slash will be added to the self closing tags.

<PARAM NAME="loadInterfaceLanguageFile"VALUE="http://yourhost/german.txt"> - If this parameter is specifed, the editor will load upon startup the language file and will initialize the entire user interface with the new language setting. This way the editor interface can be localized in any language as needed. See the supplied "sample-german-translation.txt" file as an example for the format of the UI language files.

<PARAM NAME="addJavascriptButtons" VALUE="shortcutToolbar,helloFromJavascript(),null,Hello there|shortcutToolbar,helloFromJavascript2(),null,Hello here"> Possibility to add javascript buttons from applet parameter

(Enterprise Only) <PARAM NAME = "sourceCodeModeOnly" VALUE="true|false"> - Specifies whether the editor should run only in source code editor mode or not. If true, the editor will display only the HTML source code editor with syntax highlighting.

(Pro/ Enterprise Only) <PARAM NAME="showBodyContentOnlyInSource" VALUE="true|false"> -if true, then only the body content will be shown in the html source editor. This should be used with care, because when editing entire pages, information such style sheets and meta tags contained outside the body may be lost when switching between source and visual editors.

<PARAM NAME="smartWordContentHanldingEnabled" VALUE="true|false"> -if true, then the import filter will be applied to all the pasted content and will clean proprietary MS tags and adjust the correct rendering of the documents. The default value is true.

<PARAM NAME="forceInlineCSSGeneration" VALUE="true|false"> - if true, then all the inline CSS definitions such as <div style="font-size:10pt">content</div> will be preserved. The default value is true. If this is disabled the inline style definitions will be converted into HTML 3.2 specifications and in some cases ignored.

<PARAM NAME="fontRenderingZoomLevel" VALUE="2"> - if specified, the rendering of all fonts will be increased/decreased by the specified value. You can specify positive or negative values in order to increase or decrease visibly the fonts. This is used only to change the rendering size, not the HTML generation. All the fonts will be relatively increased/decreased preserving all the formatting. This is useful for persons with visual impairments in order to help them read the content easily increasing the rendering fonts size as needed.

<PARAM NAME="alignedImagesWordWrapEnabled" VALUE="true|false"> - if specified, the rendering of aligned images will be as in any web browser - the text will be wrapped around and the images will be placed respectively on the left/right side of the current text block. Since this is a new feature in some cases it may be necessary to revert back to the default behavior. Just specifying false will return the default behavior of the editor which the alignment of the images is ignored.

<PARAM NAME="remoteFileDialogWidth" VALUE="800">  - specifies the width of the remote file dialog to be used

<PARAM NAME="remoteFileDialogHeight" VALUE="600"> - specifies the height of the remote file dialog to be used

<PARAM NAME="remoteFileDialogResizable" VALUE="true|false"> - specifies whether the Remote File dialog should be resizable or not 

<PARAM NAME="disableIndentingAndLineBreaks" VALUE="true|false"> - will disable the indenting and line breaks inside table cells. This may be useful to improve the rendering  in IE with content generated from the editor for table cells with small height.

<PARAM NAME="preserveComments" VALUE="true|false"> - this will cause the preservation of comments inside the HTML. This way the users will not be able to delete the inline comments when typing.

<PARAM NAME="popupMenuVisible" VALUE="true|false"> - if specified the popup menu will be enabled/disabled. The default value is true

<PARAM NAME="useSaveAsSaveRemote" VALUE="true|false"> - this will cause all buttons/menus for save to have the behavior of "Save Remote" functionality. This way also the shortcut on the toolbar ("the save floppy icon") can be used to save the content of the editor remotely. The default is false.

<PARAM NAME="saveEntireFile" VALUE="true|false"> - this parameter specifies whether the "Save Remote" functionality should send entire HTML files (including <html><head><body> tags) or should send only the body content as a page fragment.

<PARAM NAME="defaultCharset" VALUE="windows-1251"> - this parameter specifies which charset to be used as default one. It can be used as a replacement for the <meta http-equiv> directive for editing of international pages.

<PARAM NAME="forceInternalJSExecution" VALUE="true|false"> - this parameter defines the calling method for javscript functions invoked by custom JS buttons from inside the editor. This should be set to false for Mac OS X browsers which do not support the java-javascript communication directly. The default value is true.

<PARAM NAME="generateUniqueImageFilenames" VALUE="true|false"> - this parameter will force the generation of unique file name during the image uploads to server-side scripts. This allows preserving of images with the same names from being overwritten.

<PARAM NAME="transferFocusOnTAB" VALUE="true|false"> - if this parameter is set to false then upon pressing the TAB key will be inserted an non-breakable tabbed space inside the editor. If this parameter is set to true the editor will call a javascript function called "transferFocus()" in order to transfer the focus to the next form field component. The transferFocus() implementation is left to the webmaster in order to be able to decide to which field exactly should be transferred the focus to. This parameter can be used in conjunction with the new javascript function focus() in order to transfer the focus to the editor.

<PARAM NAME="publishContentUsingWebDAV" VALUE="true|false"> - if this parameter is set to true when using the save remote functionalities or the multipart upload functionalities, the entire content of the editor will be published using WebDAV specification. Obviously you server must be configured properly in order to be able to receive and save such a content. Please refer to the section Configuring of "Save Remote" functionality for majore details on how to publish content from the editor.

<PARAM NAME="callJavascriptFunctionOnLoad" VALUE="yourJavascriptFunction()"> - if this parameter is specified the editor will invoke the javascript function specified as a parameter value upon loading automatically.

<PARAM NAME="preferredPasteOperation" VALUE="PASTE_FORMATTED_TEXT|PASTE_PLAIN_TEXT| PASTE_FORMATTED_PARAGRAPHS_WITHOUT_STYLE |PASTE_FILTERED_FORMATTED_TEXT"> - if this parameter is specified the prefered paste operation will be used as a default paste opration for the editor. Allowed values are as follows:

PASTE_FORMATTED_TEXT
PASTE_PLAIN_TEXT
PASTE_FORMATTED_PARAGRAPHS_WITHOUT_STYLE
PASTE_FILTERED_FORMATTED_TEXT

(Enterprise Only) <PARAM NAME="asYouTypeSpellcheckingEnabled" VALUE="true|false"> - if this parameter is set to true then upon typing the spellchecking will performed. The default value is false.

<PARAM NAME="loadStyleClassesDescriptionFile" VALUE="http://your_style_descriptions_file_url"> -this parameter specifies the URL where the style descriptions file is located. When the style descriptions are loaded, in the toolbar quick style dropdown menu will be displayed the descriptions of the stlyes instead of the class names, resulting in a more user friendly diplay for the end user.

Example format of the style description file:

bold_title=Bold title on the main page
red_text=Customer notes text
yellow_caption=Section heading
....

(Enterprise Only) <PARAM NAME="enableEquationEditorIntegration" VALUE="true|false"> -if set to true this parameter will enable integration with the Sferyx Equation Editor. The Sferyx Equation Editor should be purchased with a separate license from Sferyx.

 

 

9. Accessing the HTMLEditor from javascript

 

The demo includes functional examples how to access the HTMLEditor content using javascript. 

There are available the following functions:

public void setContent(String htmlContent) - sets the content of the HTMLEditor. The content could be an html document, portion of html document or plain text

public void setURLEncodedContent(String htmlURLEncodedContent) - sets the content of the HTMLEditor. The content could be an html document which is URLEncoded - it will be decoded by the editor and rendered properly.

public String getContent() - returns the content of the html editor as entire html document (includes tags <html>, and <body>). 

public String getSelectedContent() - returns the content only within the selection. If there is no selection, empty string will be returned. 

public String getBodyContent() - returns the content of the html editor as a potion of  html document (without  tags <html>, and <body>). For use with content management systems is recommended using this function when editing single pieces of pages. If you have inserted portion of document using setContent method this will return what you need.