My JavaScript book is out! Don't miss the opportunity to upgrade your beginner or average dev skills.

Thursday, February 05, 2009

Hunspell for JavaScript ? A quick and dirty one: BJSpell

Somebody asked me to implement a web based spell check without plug-ins or specific browsers requirement (we all know banks security policies, for example, every plug-in could be dangerous but maybe they are still using the most un-secure browser still available these days: Internet Explorer 6 ... )

My answer, straight on: Guys, there is nothing available in pure JavaScript, but I can investigate about it

That's it, a couple of searches via Google, and nothing as expected ... but hey, wait a minute: what's about FireFox spell checker plug in and Open Office project? Here we are, Hunspell is the answer!



BJSpell Project


In a full day of self brain storming, history background cases study, and code, plus debug and tests, I created BJSpell, a basic, fast, cross browser, and runtime implementation capable to underline bad words using a pre compiled Hunspell compatible dictionary (one or more).
The reason I avoided the usage of the classic "click here for the spell checker" is server stress, since the idea was to bring the spell check inside text-areas without polling with short of big texts the server and every N seconds or, the worst case scenario, on every "onkeyup" textarea event!

Pure JavaScript


To create the little speller I used JavaScript on both client and server side. In the project page you can browse the trunk branch and have a look to BJSpell.Jaxer.html page, based on Jaxer (ok, ok ... I know, just another excuse to test my PAMPA-J project ... )

A real world example page


I created a folder in my website with a BJSpell demonstration page ... wait for the cursor in the right area and try, for example, to write something like "... let's try some weirf word ..."

If you have FireFox spell check plugin with english dictionary, you will difficulty spot the difference between the left textarea and the produced output in the right div ... but what the plug-in does not do, is to show you a couple of alternatives, or close words, instead of the wrong one

What's next?


The project is in beta status, so I need your help to debug it and to understand if it has been worthy and if it is truly a good compromise between performances and result. The suggestion is not perfect, truly quick and dirty, just a basic and incomplete implementation, so we will see how and if the project will go on ;-)

11 comments:

Anonymous said...

Useful. How can I get additional dictionaries? For example, if I have ru_RU.dic.

Andrea Giammarchi said...

good question!
First of all, you should have Russian language installed.
Secondly, if you get the file BJSpell.Jaxer.html, you create a dictory dictionary, and a dir dictionary.js, and you put both ru_RU.dic and ru_RU.aff inside dictionary, and you run BJSpell.Jaxer.html via Jaxer and click into create ru_RU dictionary, you should obtain a file (russian dictionary ... 1.6Mb!!!) inside dictionary.js folder called ru_RU.js, which is the one to load (after changing headers for UTF-8) sith BJSpell("ru_RU.js", function(){
// your checs here
});

Please tell me if everything is ok, I cannot test now cause my PC does not speak russian :D

Anonymous said...

What a shame I knocked down my Russian version of Windows... How lovely it would have been to test on it :) Feel free to experiment with my lapa tho, I can test it when I get home ;)

Anonymous said...

Ho Andrea

I'm trying to create a local html
which does what the demo does, but I do not see errors in red.
Any idea what the problem could be

p.s. I've downloaded dictionary.php

Thanks

Anonymous said...

Can you provide a quick tutorial on how to use your BJSpell. (i.e. what to add on your html page, what files to get, etc.)

Thanks

Dunkel said...

Hey there! I generated the file ru_RU.js, but the script still does not work with this file. Already tried all possible encodings. Help please.

Andrea Giammarchi said...

This post is from Thursday, February 05, 2009 - I believe I haven't changed that library since but these days you should never need it for browsers out there since all of them have a native spell checker, right?

Dunkel said...

yes, but still I need this script. if you can please help generate the correct Russian library. or may be a bug in the script, and he does not know how to work with the Russian language? please help sort out.

Andrea Giammarchi said...

I don't think I want to maintain that script but I'll give it a try whenever I have time in order to see what's going on .. have you debugged at all and maybe spot the problem? Cause me having time for legacy won't happen that soon. Best Regards

Unknown said...

Hey Andrea,
I tinkered with your script i got it working except the piece i want the suggestions to right on the misspelled word in the text area not in the next HTML window how can i do it?

Andrea Giammarchi said...

this script is from 6 years ago and it's not maintained 'cause it's not needed anymore. Every browser has spellchecks and a native one, which is way faster and better.