An Open File Manager for CKEditor 3.0
CKEditor is the successor to FCKEditor, an open-source, embeddable HTML editor which adds WYSIWYG editing capabilities to countless content management systems, blogs, and other web-based applications. FCKEditor was extremely feature-rich compared to its competition, being one of the few of its kind to include its own file browser and upload mechanisms, along with an API which enabled developers to integrate it with their server-side language of choice. The final version of FCKEditor shipped with built-in connectors for a wide variety of languages and platforms, including ASP.NET, ColdFusion, Java, Lasso, PHP, and Python. (Core Five contributed the Lasso connector to the project.)
However, over time, and despite a highly configurable, pluggable architecture, the code base for FCKEditor, initially released in 2003, began showing its age. Markup and scripting were a patchwork quilt of outdated methods, and performance was suffering. Thus, a complete, ground-up rewrite was started, culminating in the release of the newly-dubbed CKEditor 3.0 in 2009.
Thus, we decided to write our own replacement file manager, which we are releasing today. We didn’t bother giving it a fancy name; we’re just calling it FileManager. FileManager is powered by jQuery, and incorporates a variety of plugins to provide various bits of functionality:
- The layout is handled with Dave Methvin’s Splitter plugin, which allows the user to adjust the width of the panes (http://methvin.com/splitter/).
- A slightly modified version of Cory S. N. LaViska’s FileTree plugin, used to create the tree view. (We added some additional callbacks.) (http://abeautifulsite.net/notebook/58)
- We also used Cory’s ContextMenu plugin for contextual menus (http://abeautifulsite.net/notebook/80).
- Alert dialogs and user prompts are presented via Trent Richardson’s Impromptu plugin (http://trentrichardson.com/Impromptu/).
- Tables are managed via Christian Bach’s TableSorter plugin (http://tablesorter.com/).
- Finally, uploads and other form submissions are handled with malsup’s ubiquitous Form plugin (http://malsup.com/jquery/form/).
The mini icons are from the venerable Silk icon library (http://www.famfamfam.com/lab/icons/silk/), and the large icons are based on the FineFiles collection (http://plainz.oh.land.to/download_icon.html), though we have created a handful of additional icons on our own.
FileManager integrates with both FCKEditor 2.x and CKEditor 3.x. For complete instructions, including how to download the project, see the project page.