When developing large JavaScript project you need a way to document the API for the end users of your project. We have been using a Wiki based documentation for the TinyMCE project for a while but it had some drawbacks one of them it that it’s hard to maintain inline documentation and synchronize that with your wiki and it’s also very tricky update the wiki documentation if refactor your API then you need to change lots of referring links and a wiki doesn’t handle that in a elegant way.

So we started to look for existing documentation generation tools for JavaScript and there are a few out there but they all had drawbacks. For example YUIDoc was written in Python and our build process uses Java so mixing these together wasn’t really ideal. We also looked at JsDoc Toolkit but it tries to be smart and parse the JS code and since it’s such a dynamic language it mostly fails. There is also the Ext API documentation but I think their tool is closed and written in PHP so we couldn’t use that. And none of these wouldn’t handle all the things we use in the TinyMCE project it was always something that couldn’t be documented properly.

Since we didn’t find any existing tool that matched our needs we decided to develop our own. We developed a new documentation tool called Moxiedoc and it’s part of the JS Build Tools project that we are using for all our JS development. This documentation tool will only parse the JavaDoc style comments so it will not try to figure out what your logic is doing. The comments will generate an XML structure this structure will then be processed to HTML files using XSLT templates. It will also generate an intellisense JS stub file for usage in Visual Studio.

Here is a example of how the documentation might look for a class in a project:

The intellisense generator for Visual Studio enables you to auto complete all classes, methods and properties within your JS project.

So if you want to play with it you can find the Moxiedoc ant tasks and other tools in JS Build Tools package. Feedback to this project is very welcome since it’s our first release there is probably lots of things that could be added in the future.

Before the summer we added a new jQuery plugin and a special jQuery build for TinyMCE but we haven’t displayed or documented until now. The new jQuery plugin enables you to more easily interact with TinyMCE using the standard jQuery functions. This improves compatibility with other jQuery plugins such as validators and we think this is a must have if you use jQuery and TinyMCE together.

The jQuery plugin also adds a special tinymce function that enables you to initialize editors and get the editor instance by using selectors. This function will also enable you to lazy load the core script when it’s needed this is useful where you have a global script in a CMS or site and you want to load and apply TinyMCE only to specific pages and textareas. The plugin also adds a tinymce pseudo selector so that you can select only the textareas that got converted.

Here is an example of lazy loading TinyMCE only for textareas with a specific tinymce class.

// Initializes all textareas with the tinymce class
$().ready(function() {
   $('textarea.tinymce').tinymce({
      script_url : '../js/tinymce/jscripts/tiny_mce/tiny_mce.js',
      theme : "advanced",
      ...
   });
});

We also made a special jQuery build of TinyMCE this build excludes the Sizzle engine since it’s already in jQuery so it was redundant to have the same logic added twice it also uses the jQuery versions of some functions but currently only some of the basic ones. Stefan Petre contributed some logic for this jQuery adapter however these patches wasn’t introduced in this first release due to some compatibility issues. Also we don’t want to replace to much logic since it isn’t a major gain in size and it doubles the testing time and possible bugs.

It’s also important to say that we have plans for similar adapters and packages for other common libraries but our time and also our knowledge of these are limited so if someone is willing to help out please let us know. We would also be interested in your feedback regarding the jQuery plugin might be things we should improve.

Another thing that’s important is that TinyMCE will remain library independent so even if we release this special jQuery version the main build still works without jQuery and can be used with any library out there.

You can read more about the specifics of the jQuery plugin at the jQuery plugin reference page in the Wiki. The jQuery version and it’s plugin can be found at the download page.

Well actually we have been back for a week already but we are taking it slow.

We still have a few large projects we need to finish before moving along this fall with big updates to the file and imagemanager, I also know there are some new things for TinyMCE as well, but as usual, mostly on the backend bit.

Hope summer treated you as well as it did us.

/Moxiecode