Views

From JSpell

JSpell Evolution - JavaScript Ajax Spell Checker lets you spell check the contents of virtually any input control on a web page that a user can type into, this includes HTML text input fields, HTML textarea fields, IFrame, contentEditable DIV controls and designmode WYSIWYG editors from third parties.

The spell checker can operate in two modes, spell check as you type, or spell check on demand (traditional popup approach). There are advanced features in the spell checker: you can specify your own regular expressions to ignore; obtain the number of incorrect words in the document; customize the appearance of the spell checker; and much more.

JSpell Evolution uses its own lightweight failsafe AJAX communication mechanism which we have found to be much more stable than any other commercial or open-source offering. The internal AJAX framework is not accessible from outside JSpell and it will not interfere with any existing AJAX framework that you may already be using.

JSpell Evolution comes with two installation files, one for Microsoft IIS based installations and the other for Java based installations. Using either of these two installers it is possible to make JSpell operate with ANY server side page generation technology, including CGI, PHP, CFML, ASP and ASP.NET, Oracle, Domino, etc. The Ajax Spell Checker is compatible with virtually all servers since it relies upon the platform independent Java(tm) language to provide spell checking services.

1 Requirements
2 Quick Start
- 2.1 Deploying JSpell to Your Web Server
- 2.2 Adding JSpell to Your Web Page
3 Server Installation
4 Client Installation
5 Appendix C - 3rd Party Editor Integration Notes
6 Appendix D - Troubleshooting

Requirements

Client Side (Browser) - JSpell Evolution is designed for compatibility with all versions of Firefox from version 1.0 through 2.0. It is also compatible with Internet Explorer 5.5 through 7.0.

Server Side - If you are using a web server other than Microsoft IIS, you will need a Java(tm) Servlet Engine running on your web server. We recommend Tomcat from the Apache organization. Tomcat is a free open source plug-in that operates with most web servers including Apache and Netscape. JSpell is also compatible with any J2EE compatible web server or any web server that supports JSP pages. It is even possible to use JSpell in a proxied mode where spell check requests are handled by a second server, as long as the first server can handle JSP, Servlet or PHP requests.

Quick Start

JSpell Evolution is a client server application. As such, there are two main steps that you have to complete, Deploying JSpell to Your Web Server and Adding JSpell to Your Web Page. From start to finish, the installation of JSpell usually takes about fifteen minutes to one hour, including the time it takes to download files.

JSpell Evolution is distributed in two formats: if you are using Microsoft Windows with IIS then you received an executable installer named jspellevolution.exe; if you are using any other web server then you received a file in the J2EE compatible WAR file format, jspellEvolution.war.

In addition, you may have received dictionaries for languages other than U.S. English with the following naming convention, lex_enGB.jdx English (GB), lex_frFR.jdx French (FR) or lex_enUSMedical.jdx English (US) Medical. These files will need to be placed in a common directory accessible to JSpell.

If you are using the Windows installer version of JSpell Evolution then the location of the dictionaries defaults to C:\Program Files\JSpell Spell Checker\lexicons.

Otherwise, the directory is specified in the file web.xml using the J2EE configuration parameter jspellLexicons.

Deploying JSpell to Your Web Server

Microsoft Windows with IIS

To install under Windows IIS you typically just launch the installer, jspellevolution.exe.

View the JSpell Evolution Windows IIS Installation Walkthrough for screen captures of an actual installation.

Apache PHP

The JSpell Evolution Linux, OS X and Windows installers support deploying to Apache PHP based servers directly.

View the JSpell Evolution Linux Installation Walkthrough for an installation into a standard CentOS LAMP web server.

J2EE Compatible Server

Deploy the jspellEvolution.war file to your web server using the deployment techniques standard to your web server. For example, on Tomcat, this involves copying the jspellEvolution.war file into the Tomcat webapps directory. You may need to restart the server process depending on your server configuration.

Test the spell checker: http://localhost/jspellEvolution/test.html.

If you can't get the spell checker to work at this point then please visit the Troubleshooting section for additional steps which may help diagnose and solve the installation problem.

Adding JSpell to Your Web Page

Copy the following two lines of JavaScript code onto every page that needs to use JSpell Evolution. Note, it is standard practice to place these lines in the HEAD section of your HTML document:

<script TYPE="text/javascript" SRC="/jspellEvolution/jspellSettings.js"  CHARSET="ISO-8859-1"></script>
<script TYPE="text/javascript" SRC="/jspellEvolution/jspellEvolution.js" CHARSET="ISO-8859-1"></script>

You may need to modify the URLs to the JavaScript files depending on your environment (note, these JavaScript files *MUST* be on the same server AND port as your web pages otherwise the spell checker will not work correctly).

That's it for Quick Start. By placing the above two lines of JavaScript code onto your web page, JSpell will load and will automatically attach to any editable text input or textarea on your web page. Please continue with the remainder of the documentation to customize the spell checker behavior and specify the exact fields that you want to spell check.

Server Installation

The Quick Start section of the documentation should be enough to get up and running but this section gives more detailed information about the types of server installations that are available so you can customize the deployment to suit your needs and requirements.

Background

There are two components to the JSpell spell checker; these are the client portion and the server portion. The client portion of the spell checker is the JavaScript code that is included on each web page. The server portion is the part of the spell checker that actually performs the spell check.

The normal flow of operation to use JSpell is to install the server component and attach JavaScript code to your web page. When the JSpell JavaScript code is attached to your web page (and which fields to spell check are optionally configured) then JSpell will parse the contents of the text fields on the page and submit them to the server for spell checking. The server side spell checker will return the results to the client for handling by the client-side code.

Windows IIS

To install on IIS start setup program jspellevolution.exe obtained from your trial or purchase. The installer will ask for the location to install the JSpell Evolution software and it will ask for the location of your IIS document root.

View the JSpell Evolution Windows IIS Installation Walkthrough for screen captures of an actual installation.

After a successful Windows installation JSpell will be installed as a Windows Service. This can be confirmed by checking the Windows Services control panel. The JSpell Windows Service runs on port 53170 and is accessed server side only via the file jspell_proxy.asp or jspell_proxy.aspx which was placed in a subdirectory of the document root that you specified during the installation procedure. This port is never exposed outside the server and there is no need to open this port to your firewall.

The installer contains a troubleshooting checklist which can also be accessed here JSpell Evolution Windows Troubleshooting Checklist.

Java (Tomcat, Domino, Oracle, WebSphere, etc.)

To install on a Java based server you must copy the Java .war jspellEvolution.war into your server webapps directory. For Tomcat this is the webapps folder.

By default, JSpell will look in the /jspell/ directory for JSpell dictionaries. The directory is relative to the ROOT of the drive on your machine. If you want to change the location of the dictionaries then you must modify the variable indexDirectory in the file web.xml and specify where you want JSpell to look for its dictionary files (the ones ending in .jdx). This is also the directory where the block lists would be located.

For example, if you have placed the JSpell dictionary files in the following directory C:\myfiles\jspellfiles\jdx\ then the indexDirectory variable should be set to: C:\\myfiles\\jspellfiles\\jdx\\ Note the double-backslashes and the trailing backslashes. Relative paths will NOT work due to an inconsistent implementation of relative pathing by application server providers.

Note, Domino does not support Java JSP so you must setup a separate web server running Tomcat, or follow the IIS installation directions to create a JSpell service for spell checking. Then, you will need to install the jspellProxyServlet package into your Domino Servlet Manager and configure the jspellProxyServlet to forward the spell check requests to the proper location.

Client Installation

For many users the Quick Start section which explains copying the two lines of JavaScript code to your web page will be sufficient to add spell checking to a web page both quickly and easily. However, further customization of the spell checker client is available and this section will server to explain some of the items that may be customized.

Specifying the Fields to Spell Check

To specify which elements to spell check you need to create a JavaScript function called getSpellCheckArray and place this function on each web page you are customizing. For example:

function getSpellCheckArray() {
  var fieldsToCheck=new Array();
  fieldsToCheck[fieldsToCheck.length]=[document,"ELEMENTID"]; 
  fieldsToCheck[fieldsToCheck.length]=[document,"ELEMENTID2"]; // repeat as necessary
  return fieldsToCheck;
}

Replace ELEMENTID with the JavaScript DOM id of the element you want to spell check. You must also specify the document element that the spell check element belongs to. For most cases you will just specify 'document' as the first parameter, but you could have an internal IFrame containing controls that need to be spell checked as well. In this case you need to specify the document element of the IFrame. Also, you must explicitly name every element that you want to spell check. You can specify as many elements as you care to. For example, let's say you have a couple of HTML elements defined as follows:

<TEXTAREA id="myField">JSpell is awesome</TEXTAREA>
<INPUT type="TEXT" id="myOtherField" value="AJAX rocks!">

Then, your getSpellCheckArray function would look like this:

function getSpellCheckArray() {
  var fieldsToCheck=new Array();
  fieldsToCheck[fieldsToCheck.length]=[document,"myField"]; 
  fieldsToCheck[fieldsToCheck.length]=[document,"myOtherField"];
  return fieldsToCheck;
}

When spell checking IFrame controls or controls created using third party WYSIWYG editors you must specify the internal IFrame element id that is used by these editors. This is not always easy to determine as these editors do not expose an easy way to obtain the internal IFrame id, so in this case it is often a good idea to use a browser tool like DOM inspector for FireFox or DebugBar for Internet Explorer to highlight and inspect the WYSIWYG editable area to determine the actual internal IFrame id. For example, TinyMCE will make the internal IFrame id 'mce_editor_0' for the first textarea that it 'converts' to a TinyMCE editor region.

Important Note

When using JSpell Evolution to attach to regular HTML text input and textarea types you are no longer directly editing your text areas. Instead, JSpell Evolution creates a virtually identical looking replacement JSpell editor area which retains the same colors, fonts and sizes. Because of this, when you are editing your text you are NOT directly editing the contents of the your text fields. Before submitting your form to the server you need to synchronize the contents of the JSpell editor with the original text elements. You can do this in one of two ways, the first is to call the method jspellSync before submitting your form. For example:

<input type="submit" onclick="jspellSync();">

The second method is more appropriate for IFrame controls, even though your IFrame editor areas will be in sync automatically (as JSpell simply attaches to the existing IFrame control instead of creating a new one as in a textarea) they may include JSpell formatting tags (SPAN tags) which are unsuitable to have within your saved documents. In this case, you should call the jspellDetach method before saving your WYSIWYG editor form. The jspellDetach method removes JSpell from your WYSIWYG editor and removes all JSpell internal formatting code.

Did You Mean?

JSpell Evolution allows you to implement a "did you mean" type of functionality. This functionality is similar to what most search engines, for example, Google Suggest allow you to do. To use this feature simply pass a string of text to the function jspellDidYouMean. You will get back a 'corrected' string of text. The corrections will include automatic capitalizations, removal of repeated words and replacement of incorrect/unknown words with the first suggestion that would normally be returned if you were performing an interactive spell check. If JSpell does not have a suggestion for an incorrect word then the word will not be replaced.

Customizing the Spell Checker User Interface

The entire JSpell Evolution spell checker appearance, from the wavy red underlines to the drop down menu and DHTML popup dialog can be changed to suit your overall site design.

Text Styles

JSpell uses css styles to control the appearance of the text in an editor region that is actively checked by JSpell. The styles are as follows:

span.j1 - Normal text
span.j2 - Correct text
span.j3 - Incorrect text
span.j4 - Ignored text
span.j5 - Other
span.j6 - Repeated text

These styles are stored in an array named jspellStyles and a default initialization is provided internally. For example, the default appearance of an error in the text is a wavy red underline. You can modify this default appearance by simply changing jspellStyles. For example, to make JSpell display a yellow background for incorrect words and a pink background for repeated words you would use the following in jspellSettings.js:

var jspellStyles = [["span.j1", ""],
 ["span.j2", ""],
 ["span.j3", "background: url(\"/jspellEvolution/jspellimages/yellow.gif\") repeat center "],
 ["span.j4", ""],
 ["span.j5", ""],
 ["span.j6", "background: pink"]];

Note, a graphic file is used for the yellow background as some WYSIWYG editors have the bad habit of converting background colors to FONT tags which can impair the spell check behavior.

In the next section we will show how to modify the appearance of the drop down menus and popup dialog.

Dropdown Menu Styles and Popup Dialog Styles

To protect our intellectual property, which includes the visual appearance of the software, the style information is considered source code and is only available to registered purchasers of the JSpell Evolution product. Please send your request for the style documentation to support@jspell.com along with a copy of your proof of purchase (electronic receipt showing amount paid and purchase date). We apologize for the inconvenience but our competitors; both open-source and commercial will have to figure this stuff out the hard way instead of copying it!

Customizing the Spell Checker Behavior

The spell checker can be customized by modifying the file jspellSettings.js. This file is where all JSpell customizations are performed. You can inspect this file and determine what settings are possible and experiment freely. This section will explain the various options, their settings and the effect of those settings.

Changing the Location of Server Side Features

The variables jspellServerPath and jspellImagePath can be modified to change the location of the JSpell server side installation and the location of the JSpell image files. For example, on an IIS installation the jspellServerPath variable is /jspellEvolution/jspell_proxy.asp but on a standard Java installation the variable is /jspellEvolution/abc.

Changing the Number of Suggestions Shown

The default number of suggestions displayed to the user is 5. You can change this by setting the variable jspellMaxSuggestions to any value from 1-10.

Changing the Spell Check Update Interval

You can modify the speed of the spell checker by changing the value of the variable jspellTimeout. A lower value will cause more frequent spell checks and a higher value will cause less frequent spell checks. There are tradeoffs that will need to be made in either case. You should experiment to find the value that is most suitable for your application and network environment.

Specifying a Custom Regular Expression

If you have a specific requirement to ignore certain words for purposes of spell check validation then you can create a regular expression that represents the custom ignore rule. The variable that you need to set is jspellCustomRegExp. For example, to create a custom regular expression that treats all words between eight and ninety-nine characters long as 'correct' you would use this regular expression:

var jspellCustomRegExp=/^.{8,99}$/;

Personal and Supplemental Dictionaries

JSpell supports the ability to maintain personal dictionaries which contain words the user has specified should be learned. You can disable the ability of a user to learn words by changing the value of the variable jspellDisableLearn to true. The default is to allow a user to learn words.

When we say that a word is learned it does not mean that the word becomes part of the central server side dictionary, rather, the word becomes part of the users semi-permanent ignore list. This means the word will not appear in the suggested words list, nor does it allow the central dictionary to become corrupted by a user incorrectly learning a word.

Please inquire about the JSpell Console utility which will let you build a JSpell compatible dictionary from a word list text file.

The learned words can be stored client side or server side (again with the restriction that the primary central server dictionary is not updated). To specify that words should be stored client side then set the value of the variable jspellPersonalDictionaryType to LOCAL. This saves the words in a cookie on the users browser. To persist the words at the server set the value of the variable to SERVER or ROAMING (the actual value does not matter as long as it is not LOCAL or empty).

If you are using server based storage for the users word list then you need to specify the name of the file containing the users words. This variable is jspellPersonalDictionary. For example you might set this variable to mary.txt or john.txt. Likewise, you can have a shared word list for users that may be in the same department by setting the variable to sales.txt or support.txt. It is up to you to set the variable based on your criteria. JSpell does not provide any server side user management other than this hook into the server side dictionary.

Spell Check Options (repeated words, UPPERCASE, etc.)

Traditional spell checker options can be customized by setting the following variables either true or false:

jspellIgnoreNumbers - Ignore any word containing numbers
jspellIgnoreDouble - Ignore repeated words
jspellIgnoreUpper - Ignore words in UPPERCASE
jspellForceUpperCase - FORCE UPPERCASE WORDS
jspellCapitalizeSentences - Enforce sentence capitalization

Spell Checker Language and Internationalization

JSpell is a multilingual spell checker and can detect errors in multiple languages. Dictionaries for popular languages are provided and you can create your own custom dictionaries in other languages using our tool JSpell Console. Please contact us for more information on support for languages which are not shown on our web site.

By default JSpell performs spell checks in US English. The language in which spell checks are performed is specified by the variable jspellTextLanguage. The format of this variable is the two letter ISO language code followed by the two letter ISO country code. For example, US English is specified as enUS. If you specify another language then you must have a corresponding lex_????.jdx file located on your server. For example, the Canadian English dictionary would be contained in a file named lex_enCA.jdx and to specify that dictionary on the client side you would set the variable jspellTextLanguage to enCA.

A Language menu will also appear on the spell checker popup window for all installed language files. The user can change the language of the text area that they are spell checking by selecting a different language. If a different language is specified then all of the words in the text area will be rechecked.

Word Filtering

JSpell supports the concept of a word filter that is maintained at the server. This word filter allows you to create a block list which can be used as a 'naughty word filter' or for other specialized tasks in your application. The word filter may be used by placing a file called block.lst in your JSpell dictionary directory.

The file is a standard text file which can be edited with any text based editor such as notepad or vi. Each word that you want to block should appear on its own line with an optional replacement word next to it.

[word to block] [replacement word]

When the user types a word in the block list it will be flagged as an error and asterisks will be shown as a suggested replacement. They will also not be able to use the Ignore, Ignore All, or Learn buttons. If a replacement word is specified then these buttons will be enabled. You can use the word filter functionality to expand acronyms used within your company, or to change internal secret project names to another value. An example block list is shown below:

NASA National_Aeronautics_and_Space_Administration
starfire classified_project_name
dummy
jerk
nincompoop

If a user tries to use the acronym NASA the suggested replacement will be National Aeronautics and Space Administration. Note that underscores are replaced by spaces.

If a user tries to use 'dummy', 'jerk', or 'nincompoop' then the suggested replacements will be a series of asterisks.

Determining the Number of Incorrect Words

JSpell Evolution allows you to determine the number of incorrect words that appear in the text. This allows you to force spell checking to occur before a user is permitted to submit a form. In actuality, the incorrect word count reflects the number of words that remain to be visited by the user. The user may choose to ignore a word that was marked incorrect however this feature still enforces the requirement that a user does something with a word that JSpell considers incorrect.

To use this capability simply call the function jspellGetErrorCount(). This will return the total number of unvisited words (usually the number of remaining incorrect minus ignored words). You can also implement a function jspellCallBack which will get called everytime there is a change in the number of incorrect words. An example is in the file test.html.

Traditional Spell Check Mode (Popup)

Due to user requirements and sometimes due to performance or compatibility concerns you may want to operate the spell checker in a more traditional manner where incorrect words appear in a popup window and the user steps through the incorrect words and fixes them.

The capability to do this is controlled by the variables: jspellShowSpellingMenu, jspellRealtime and jspellAutoAttach. There are also four functions which control the ability to perform a traditional spell check, the most important being jspellCheck(). The other functions are jspellAttach(), jspellDetach() and jspellDialog(). You should not normally need these last three functions.

To operate JSpell in a traditional spell check mode with NO real-time spell checking then set the variable jspellRealtime to false and call jspellCheck(). The jspellCheck function can be called from a toolbar button (e.g. inside a WYSIWYG editor) or from another button using a JavaScript onclick event. The jspellCheck function will handle the details of attaching, checking and detaching from the text.

Note: If operating in real-time mode you may trigger the display of the dialog by calling jspellDialog(). This function will use any previously detected to populate the dialog. The dialog can also be invoked by the user when they select the Spelling... option from the dropdown menu that appears when clicking on an incorrect word. To suppress the ability to invoke the spelling dialog from the dropdown menu then set the variable jspellShowSpellingMenu to false.

Disable the No Errors Found Message

The No Errors Found message that is displayed when using the Spell Check Popup can be disabled by setting the variable jspellDialogShowNoErrors to false.

Spell Check Complete Notification and Form Submission

When performing an interactive or manual spell check using the jspellDialog function it is oftentimes necessary to receive notification when the spell check is complete. You can receive notification via a callback mechanism by implementing the following function jspellDialogCallBack. When you implement this function you will receive notification that the spell check is complete for the following events: the user cancels the spell check by closing the popup, the user has no errors in their document, the user has corrected all the errors in their document.

When submitting a form you may want to spell check the form prior to submission and then, when the spell check is complete, submit the form. To do this, you need to call the jspellDialog() function from your submit button as follows:

<input type=submit onclick="jspellDialog(); return false;">

The "return false" prevents your form from being submitted before the spell check is complete. Then, implement the jspellDialogCallBack function as follows:

function jspellDialogCallBack()
{
myform.submit();
};

Positioning Dialog

The popup invoked by the jspellDialog or jspellCheck function defaults to a right justified and center of the page position. This default usually assures that the popup will not cover the text entry field. However, you may change the default position of the dialog by setting these variables in jspellSettings.js: jspellDialogHalign (controls horizontal alignment) and jspellDialogValign (controls vertical alignment) the valid values for jspellDialogHalign are "left", "center","right" and the valid values for jspellDialogValign are "top", "center", "bottom".

Event Handling

JSpell Evolution may change the event handling behavior of your input fields, particularly if you are using HTML <TEXTAREA> or <INPUT type=text> fields with the product. If you are using an IFrame or a 3rd party WYSIWYG editor then you should not need to change anything in your application.

If you are using HTML based text input fields or textareas and you have attached events such as onClick, onKeyPress, onKeyUp, etc. to your text element then you may need to change how you have implemented this logic.

Plain HTML text fields do not support the ability to underline text and perform other advanced features that JSpell Evolution makes use of. Therefore, when your page loads JSpell converts these plain HTML elements into IFrame controls.

You can get a handle to the IFrame control after the page loads by calling the function jspellAreaLookup and passing it an instance of the original HTML text element. For example, if you have a TEXTAREA defined as follows:

<TEXTAREA id="myField"></TEXTAREA>

Then you can obtain the actual JSpell IFrame element with this line of code:

jspellArea=jspellAreaLookup(document.getElementById("myField"));

The IFrame element returned by this function behaves just like any other IFrame element and contains properties and functions of its own. You can attach events to this element using the built-in JSpell helper methods jspellAddEventListener and jspellRemoveEventListener. For example, here is a code snippet showing how to properly add an onkeyup event handler to the JSpell editor. You might use this technique to verify that the contents of the editor component do not exceed a certain length, or contain information:

window.onload=jspellInit;
var jspellEditor;    // save reference to JSpell editor area... initialized in jspellPostInit
var ie=document.all; // check if running in Internet Explorer
 
/* Create a custom getSpellCheckArray since we're not attaching to ALL fields on the page. Only 
specify the specific fields we want to spell check. */
 
function getSpellCheckArray() {
  var spellCheckArray=new Array();
  spellCheckArray[spellCheckArray.length]=[document,"myField"];
  return spellCheckArray;
};
 
/* This function is called when JSpell is done initializing and attaching
to existing text or iframe elements. Post initialization logic should go here. */
function jspellPostInit()
{
// Attach our event handlers to listen to the JSpell editor
// First get the JSpell editor.
 
jspellEditor=jspellAreaLookup(document.getElementById("myField")).contentWindow.document;
 
// Then add an event listener, you can use the built-in JSpell provided helper functions
// jspellAddEventListener and jspellRemoveEventListener or use your own... onkeyup seems
// to be the most reliable way to detect when the text has changed. You can add events for
// any event type supported by the document object, including click, dblclick, blur, etc.
 
jspellAddEventListener(jspellEditor,"keyup",myKeyUpHandler);
 
// populate the current text length field by faking a call to myKeyDownHandler, this is
// not necessary but makes the GUI appear correctly when the page is first loaded and no
// key has been pressed.
 
myKeyUpHandler();
 
};
 
function myKeyUpHandler(_ev){
 
// as an example, get the length of the text in the editor and show it in the textlength field
var _currentTextLen=ie?jspellEditor.body.innerText.length:jspellEditor.body.textContent.length;
myForm.textLength.value=_currentTextLen;
};

Appendix A - Tomcat 3.x, 4.x and 5.x

If you already have Tomcat installed then you can install the JSpell Spell Checker by following these simple instructions.

Required Software

JSpell Evolution Spell Checker WAR file jspellEvolution.war

Installation

Copy the war file into the Tomcat webapps directory. For example, if you used the default settings and installed Tomcat 4.x on the Windows platform this will be: \Program Files\Apache Tomcat 4.0\webapps.

You MUST have the Java SDK installed. The Java JRE is not sufficient. If you are installing Java and Tomcat for the first time make sure to install the Java SDK first.

Check Tomcat Installation

Restart Tomcat

Access the test URL http://localhost:8080/jspellEvolution/test.html and verify that you can successfully perform a spell check. After you've verified the spell checker is working properly you can continue with the Getting Started section.

Appendix B - JRun

The JRun platform is one of the easiest platforms on which to install. You should be up and running in minutes.

Required Software

JSpell Evolution Spell Checker WAR file jspellEvolution.war

Installation

Start the JRun Management Console and login.

Select the correct server, usually 'default'.

Click on the J2EE Components link.

Click the 'Add' button in the Web Applications section.

Specify the path to the jspellEvolution.war file and click 'Deploy'.

Check JRun Installation

Access the test URL http://localhost:8100/jspellEvolution/test.html and verify that you can successfully perform a spell check. After you've verified the spell checker is working properly you can continue with the Getting Started section.

Appendix C - 3rd Party Editor Integration Notes

FCKEditor

FCKEditor is a popular open-source editor with a pay for support business model.

FCKEditor uses dynamically created IFrames to contain its WYSIWYG editor. JSpell can attach to these IFrame editable regions by specifying the proper document base. An example of the FCKeditor_OnComplete function that you must implement is shown below. Once the FCKEditor is created JSpell can attach to it. The FCKEditor OnComplete function accomplishes this

fieldsToCheck=new Array();
 
function FCKeditor_OnComplete( editorInstance ) {
 
  document.getElementById(editorInstance.Name+"___Frame").
  contentWindow.document.getElementById("xEditingArea").firstChild.id=editorInstance.Name+"jspell";
 
  fieldsToCheck[fieldsToCheck.length]=
   [document.getElementById(editorInstance.Name+"___Frame").contentWindow.document,
   editorInstance.Name+"jspell",
   document.getElementById(editorInstance.Name+"___Frame")];
 
  jspellInit();
 
}
 
function getSpellCheckArray() {
 
  return fieldsToCheck;
 
}

To remove the default FCKEditor spell check button you must modify the entry FCKConfig.ToolbarSets["Default"] in fckconfig.js. Remove the 'Spell Check' toolbar icon as it is no longer necessary.

To enable fullscreen editing using the "Maximize the editor size" toolbar button, edit fckconfig.js and reduce the FCKEditor z-index from 10,000 to 1,000:

FCKConfig.FloatingPanelsZIndex = 1000 ;

CKEditor

CKEditor is the next generation editor from the FCKEditor project

CKEditor uses dynamically created IFrames to contain its WYSIWYG editor. JSpell can attach to these IFrame editable regions by specifying the proper document base. An example of the CKEditor instance ready event handler that you must implement is shown below. Once the CKEditor is created JSpell can attach to it.

<script type="text/javascript">
	var fieldsToCheck = new Array();
 
	$(function() {
 
			CKEDITOR.replace('YourFieldName');
 
			CKEDITOR.on("instanceReady", function(event) {
 
				var frame = document.getElementById("cke_contents_" + e.editor.name).firstChild;
				frame.id = e.editor.name + "jspell";
				fieldsToCheck[fieldsToCheck.length] = [document, frame.id];
				jspellInit();
 
			});
 
	});
 
	function getSpellCheckArray() {	
		return fieldsToCheck;
	}
</script>

To remove the default CKEditor spell check button, you must create a custom tool bar in the config.js file. Instructions can be found on the CKEditor website http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar

To enable fullscreen editing using the "Maximize the editor size" toolbar button, edit config.js and reduce the CKEditor baseFloatZIndex property from 10,000 to 1,000:

config.baseFloatZIndex= 1000;

TinyMCE

TinyMCE is another popular open-source WYSIWYG editor that works with the JSpell Evolution Spell Checker. The integration is fairly straightforward. After TinyMCE is done initializing call jspellInit, this is accomplished using the oninit callback functionality in TinyMCE:

function postTinyMCEInit() {
 
  setTimeout(jspellInit,500);
 
};
 
tinyMCE.init({
 
  oninit : "postTinyMCEInit"
 
});

WYSIWYGPro

We've provided an example of integrating JSpell Evolution with WYSIWYGPro online at http://www.jspell.com/wysiwygprospellchecker.php.

To integrate JSpell with WYSIWYGPro simply call jspellInit using the window.onload function as in:

window.onload=jspellInit;

The following line will activate the Spell Check button on the WYSIWYGPro toolbar and trigger the JSpell Spell Checker popup.

$editor->addbutton("Spell Check", "after:smiley", "jspellDialog()", "/wysiwygpro/editor_files/images/spelling.gif",22,22);

Please note, at the present time you must remove the tabs at the bottom of the WYSIWYGPro editor as switching from Design mode to HTML code mode and/or Preview mode disables JSpell (it appears that WYSIWYGPro removes our event handlers). We are working with WYSIWYGPro to find a solution. In the meantime, to remove the bottom tabs simply use this command in your PHP file:

$editor->removebuttons("tab");

Appendix D - Troubleshooting

In our experience 99% of all installation problems occur because of path or file/folder permission related issues. If you are unable to resolve the problem after reviewing this troubleshooting section then please email support@jspell.com. It will be extremely helpful if you can provide an external URL that demonstrates the problem, and/or email a minimal example HTML file that demonstrates the problem.

General Issues

When first installing the software, especially on a non-Windows platform you will have to configure the location of the JSpell dictionary files. The location of the dictionaries is specified in the application web.xml file. Make sure to specify the absolute path from the root of your file system to the directory containing the JSpell dictionary files (ending in .jdx). Make sure to include the trailing slash.

Windows IIS

Make sure you have ASP pages enabled if running Windows Server 2003. Please see this Microsoft knowledgebase article: http://support.microsoft.com/default.aspx/kb/315122 This note applies to earlier versions of JSpell Evolution. JSpell Evolution 0811c supports ASP.NET as well as Classic ASP.

Error on line 3 in jspell_proxy.asp at Server.CreateObject means that you are using an old version of the software. This typically should only affect JSpell HTML or JSpell IFrame as JSpell Evolution was released after jspell_proxy.asp was changed. However, in case your jspell_proxy.asp file became corrupted or overwritten with another version of JSpell then you need to obtain the correct version of this file.

UNIX, Linux, Macintosh

File and directory permission problems can arise with this platform. Make sure that the folder containing the JSpell dictionary files has read/write permissions compatible with server process. Also, make sure that the individual jdx files have read/write permissions.

Retrieved from "http://www.jspell.com/wiki/index.php/JSpell_Evolution"

JSpell Evolution

Views

Contents

Requirements

Quick Start

Deploying JSpell to Your Web Server

Microsoft Windows with IIS

Apache PHP

J2EE Compatible Server

Adding JSpell to Your Web Page

Server Installation

Background

Windows IIS

Java (Tomcat, Domino, Oracle, WebSphere, etc.)

Client Installation

Specifying the Fields to Spell Check

Did You Mean?

Customizing the Spell Checker User Interface

Text Styles

Dropdown Menu Styles and Popup Dialog Styles

Customizing the Spell Checker Behavior

Changing the Location of Server Side Features

Changing the Number of Suggestions Shown

Changing the Spell Check Update Interval

Specifying a Custom Regular Expression

Personal and Supplemental Dictionaries

Spell Check Options (repeated words, UPPERCASE, etc.)

Spell Checker Language and Internationalization

Word Filtering

Determining the Number of Incorrect Words

Traditional Spell Check Mode (Popup)

Disable the No Errors Found Message

Spell Check Complete Notification and Form Submission

Positioning Dialog

Event Handling

Appendix C - 3rd Party Editor Integration Notes

FCKEditor

CKEditor

TinyMCE

WYSIWYGPro

Appendix D - Troubleshooting

General Issues

Windows IIS

UNIX, Linux, Macintosh

Navigation

Search

Toolbox

Personal tools