The Wahyudiharto's Blog

Couple times ago, some readers of this blog gave me questions by email about is there any better client side text editor or the best slide show picture thumbnails available to put into their web based application? A lots! But just a few which absolutely flexible and more customizable. After researching in a weeks, finally I choose nicEdit for the best text editor and Galleriffic for the best slide show picture thumbnails. Both are jQuery based libraries and I succeeded using it in my latest online project on http://www.picanto-indonesia.com.

nicEdit
So what is so special about it? First, it has modern UI look of text editor similar to any word processor softwares with complete iconic built-in on top of it.


Secondly, this library is easy to use (even for beginner programmer I tough) since all I need is only to copy-paste the code with less modification to fit in the page (for example: the image upload function). The default image upload function in it's code is using imageshack.us server to store the files. Hence, for anyone who desire to move the image destination to their own server, there's available PHP plug-in file to use named as nicUpload.php. Just fill the target owned directory, included it in nicEdit.js and vice versa!


There's about no worry to inject the word we type in the edit box into the database, because we only take a single finalized variable to use. No more any securing function needed for this. And ... it's all free to use :)

Galleriffic
Hundreds of slide show plug-ins available on the net. It offering the same features; showing images with some effects. But a slide show without thumbnails and pagination means useless, after all, it's not a gallery. Based on it's name, Galleriffic offering a luxury features I described before. Although it's designed for flickr.com (CMIIW), it's modifiable to use to any web based software.


A small problem found when I need to fit the image in a specified size. Since flickr has 3 different file sizes (large, medium & small) after a picture uploaded, so I need to modifying and add a line in galleriffic.css file to make it fit in size from 1 image source.


So, problem is now solved. This gallery module look nice to see (even I need an additional blank space in bottom of it to handling a portrait type picture). That's it and ... thanks for reading. Have a good day :)

Labels: AJAX, JavaScript, Web Programming

---

PS: If you've benefit from this blog, you can support it by making a small contribution.