How to Write a Celtx Extension

From CeltxWiki

A Celtx extension is just like a Firefox extension, so if you've already written an extension for Firefox, the process should be very familiar. More detailed information can be found at Mozilla's developer site. To start with, we'll look at the structure of an example Celtx extension file, which is a file ending with .cxext. In this case, it will be sample1.cxext, an extension that makes all the toolbar text bold.

A .cxext file is actually a zip file. The contents of sample1.cxext are:

<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:em="http://www.mozilla.org/2004/em-rdf#">

	<Description about="urn:mozilla:install-manifest">

		<em:id>sample1@celtx.com</em:id>
		<em:name>Sample Celtx Extension</em:name>
		<em:version>1.0</em:version>
		<em:description>Demonstrates how to change the appearance of Celtx.</em:description>
		<em:creator>Greyfirst Corp.</em:creator>
		<em:homepageURL>http://www.celtx.com/</em:homepageURL>

		<em:file>
			<Description about="urn:mozilla:extension:file:sample1.jar">
				<em:package>content/sample1/</em:package>
				<em:skin>skin/classic/sample1/</em:skin>
			</Description>
		</em:file>

		<em:targetApplication>
			<Description>
				<em:id>celtx@celtx.com</em:id>
				<em:minVersion>2.0</em:minVersion>
				<em:maxVersion>2.*</em:maxVersion>
			</Description>
		</em:targetApplication>

	</Description>

</RDF>

Contents

chrome/sample1.jar

This file is a zip file that, by convention, has the same name as the extension file itself, with .cxext replaced by .jar. This file contains the files that make up the actual extension. The contents of sample1.jar are:

Sample Jar

content/
   Sample 1/
      contents.rdf
      sampleOverlay.xul

skin/
   classic/
      Sample 1/
         contents.rdf
         sample1.css


content/sample1/contents.rdf

This file describes the files to be found under the content/sample1 directory. It also repeats some of the details found in install.rdf. One of the important things this does is identify XUL overlays and which components of Celtx those overlays be applied to.

<?xml version="1.0" encoding="UTF-8"?>

<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:chrome="http://www.mozilla.org/rdf/chrome#">

	<RDF:Seq RDF:about="urn:mozilla:package:root">
		<RDF:li RDF:resource="urn:mozilla:package:sample1"/>
	</RDF:Seq>

	<RDF:Seq RDF:about="urn:mozilla:overlays">
		<RDF:li RDF:resource="chrome://celtx/content/celtx.xul"/>
	</RDF:Seq>

	<RDF:Seq RDF:about="chrome://celtx/content/celtx.xul">
		<RDF:li>chrome://sample1/content/sampleOverlay.xul</RDF:li>
	</RDF:Seq>

	<RDF:Description RDF:about="urn:mozilla:package:sample1"
		chrome:displayname=%26quot%3BSample Celtx Theme"
		chrome:author="Greyfirst Corp."
		chrome:authorURL="mailto:info@celtx.com"
		chrome:name=%26quot%3Bsample1%26quot%3B
		chrome:extension="true"
		chrome:description="Demonstrates how to change the appearance of Celtx.">
	</RDF:Description>

</RDF:RDF>

In the above, the Celtx file celtx.xul (the project window) will be overlayed with the extension file sampleOverlay.xul.

Source(s): Source Code solutions

content/sample1/sampleOverlay.xul

<?xml-stylesheet href="chrome://sample1/skin/sample1.css"
                 type="text/css"?>

<overlay id="sampleOverlay"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <window id="celtx" />

</overlay>

In this example, no elements are actually being added to the project window, but it includes the sample1.css CSS stylesheet that will be applied to the window.

skin/classic/sample1/contents.rdf

Like the previous contents.rdf file, this file describes the files to be found under the skin/classic/sample1 directory.

<?xml version="1.0" encoding="UTF-8"?>

<RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
         xmlns:chrome="http://www.mozilla.org/rdf/chrome#">

  <RDF:Seq about="urn:mozilla:skin:root">
    <RDF:li resource="urn:mozilla:skin:classic/1.0" />
  </RDF:Seq>

  <RDF:Description about="urn:mozilla:skin:classic/1.0">
    <chrome:packages>
      <RDF:Seq about="urn:mozilla:skin:classic/1.0:packages">
        <RDF:li resource="urn:mozilla:skin:classic/1.0:sample1" />
      </RDF:Seq>
    </chrome:packages>
  </RDF:Description>

</RDF:RDF>

skin/classic/sample1/sample1.css

This file contains the CSS we want applied to the project window

toolbarbutton {
  font-weight: bold;
}

That's it! If you install this extension into Celtx, the Project Toolbar buttons in the project window will now have bold labels. air jordan shoes