FlashTA is a WYSIWYG replacement text area for html forms. While there are various implementations done in javascript, most of them don´t work in this/that browser/os combo, and every time a browser vendor makes a change, they need to update the editor so it doesn´t break on every possible combination of browsers.
FlashTA tries to overcome that problem by using flash. It also tries to adhere stricty to the (x)html specification. No presentation code is generated (so say bye bye to your idea of selecting text color, font face, etc).
FlashTA features an easy integration and multiple browser support (Mozilla, MSIE, FireFox, Opera & Safari).
FlashTA comes with 4 files:
Copy that files where your html files resides (or any other folder, it doesn´t matter). You must call the fTAR.js script on any page that will be replacing text areas. The following line in the <head> should do the trick:
<script type="text/javascript" src="fTAR.js"></script>
also, you need to “mark” by adding the “textareaReplace” attribute with a value of “true” each textarea you want to be replaced:
<textarea name="nameOfThisField" textareaReplace="true" ></textarea>
The editor configuration is handled on the javascript file. For this, you should modify the lines that read:
fTAR.setFilemanager("fileManager.php");
fTAR.setBaseURL("http://localhost");
fTAR.setButtons(0x1ffff);
fTAR.setBackColor("#E9EBEE");
fTAR.setup("FlashTA.swf", "FlashFB.swf", true);
fTAR.setFilemanager(filemanager); fTAR.setBaseURL(baseImagePath); fTAR.setButtons(buttons); fTAR.setBackColor(backgroundColor); fTAR.setup( editor, filebrowser, autoUpdate);
Parameters:
If you want to also use the filemanager, you should also configure the file “fileManager.php”. You should change the $startPath ($startPath = 'c:/AppServ/www/';) to the folder on your site that will hold the images/files accesibles by the editor. This is a disk path, not an URL.
Here you have a table of correspondences:
BOLD:1 ITALIC:2 UNDERLINE:4 ALIGNLEFT:8 ALIGNCENTER:16 ALIGNRIGHT:32 ALIGNJUSTIFY:64 HEADER1:128 HEADER2:256 HEADER3:512 HEADER4:1024 HEADER5:2048 HEADER6:4096 BULLETS:8192 QUOTES:16384 LINKS:32768 IMAGES:65536
If you don´t want to remember each bit, you can just use as following as a parameter:
fTAR.BOLD || fTAR.ITALIC || fTAR.UNDERLINE || fTAR.LINKS
to enable only the bold, italic, underline and links buttons.
There are also a bunch of CSS styles that you can play with. Take a look at the source code.
If you don´t have PHP, but have enought knowledge of other language (ASP, JSP), here you have a little description of what the file “fileManager.php” do:
action is used to recognize other commands (uploadFile, createDir, deleteFile) images is a boolean value used to list only images (true) or all files (false).
The file returns via POST a list of items in the following format: name#=name of the file&kind#=filetype[&size#=size of the file]&[next file]
Where # is a number that goes from 0 to the number of items listed-1 filetype could be: folder|sound|image|video|generic
for example, a valid return could be:
name0=HtmlEditor&kind0=folder&name1=javascript_cheat_sheet.png&kind1=image&size1=94582&name2=Test&kind2=folder&name3=mysql_cheat_sheet.png&kind3=image&size3=107543&name4=no_image.jpg&kind4=image&size4=5998
Then the file is sent using the encoding type “multipart/form-data”
All paths are relative to the one configured in the file.
Current version : 1.11
Version 1.2
(* fixed, + added, - removed)
1.11 * Fixed some small bugs. * Ported to use MM components. Now you can compile it without missing any library.
1.1 + Added a “delete” button in the insert image window. * Buttons config now works as expected. * Fixed some problems with unicode chars under Opera 8.5+ - Removed the scrollbar - Now the editor resizes itself as needed.
1.0 - First launch
FlashTA is released under the GNU GPL Licence