Jason Barnabe

It’s All Text! is an extension that lets the user edit textboxes with their favourite editor. As was the case with Rainbowpicker, it has sensible default behaviour - it applies to all HTML text areas. Unlike Rainbowpicker, It’s All Text! has a well-defined, simple API to extend its functionality into other areas.

We must load the It’s All Text! API JavaScript. Ideally, wecould do it like so:

<script type="application/javascript" src="chrome://itsalltext/content/API.js"/>

but that’s affected by a bug in Firefox 2 where if that file isn’t available (It’s All Text isn’t installed) and the XUL cache is enabled (which it is by default), it causes the dialog/window/overlay to never load. (I don’t have a bug number, if someone can find it, I’d love to know). Instead, we do this in the global scope in a JavaScript file:

//load it's all text, if available
try {
	Components.classes["@mozilla.org/moz/jssubscript-loader;1"].getService(Components.interfaces.mozIJSSubScriptLoader).loadSubScript('chrome://itsalltext/content/API.js');
} catch(e) {}

We then create an element like a button that will launch the editor.

<button label="It's All Text" itsalltext-control="textarea-id" itsalltext-extension=".css" style="display: none;"/>

itsalltext-control is the id of the control that will be updated when the file is saved in the editor. itsalltext-extension is an optional attribute that defines the extension that the file will have. This is useful because the editor may have file extension-based syntax highlighting. It’s All Text also offers users the option to define per-file-extension editors. The style="display: none" ensures that the button will not be displayed if It’s All Text isn’t installed. If it is installed, the API will change the display style property appropriately.

And that’s all there is to it. Three extra lines of JavaScript and an additional button are all that’s needed to bring the power of an external editor to your extension.

This entry was posted Tuesday, March 13th, 2007 at 8:48 pm and is filed under Extension Development. You can leave a response, or trackback from your own site.