File:  [mozdev] / chameleon / www / documentation / cham-api.html
Revision 1.17: download - view: text, annotated - select for diffs - revision graph
Sat Mar 24 00:25:53 2001 UTC (19 years, 2 months ago) by petejc
Branches: MAIN
CVS tags: HEAD
--pete

<h1>Chameleon <abbr title="Aplication Programing Interface">API</abbr> 
Specification</h1>

<i style="font-size: small">Created: 28 February, 2001<br>
Status: incomplete<br>
Contributors: Pavol Vaskovic, Pete Collins</i>

<p>This specification describes the programing interface of Chameleon. It was
created in order to document program objects and methods for new programers
wanting to join this project, as well as for authors to keep track of code.</p>

<p>This specification is informative and is expected to evolve in time. Some 
objects and methods may be added, deleted or replaced. We will try to keep this
document up to date. </p>

<b>Content</b>
<ol>
<li><a href="#1">globals.js</a></li>
<li><a href="#2">palate.js</a></li>
  <ol>
      <li><a href="#2.1">Preview Control Class</a></li>
        <li><a href="#2.2">General Class</a></li>
        <li><a href="#2.3">"Style" Classes </a></li>
        <ol>
          <li><a href="#2.3.1">Size Class</a></li>
          <li><a href="#2.3.2">Font Class</a></li>
          <li><a href="#2.3.3">Color Class</a></li>
          <li><a href="#2.3.4">Padding Class</a></li>
          <li><a href="#2.3.5">Margin Class</a></li>
          <li><a href="#2.3.6">Border Class</a></li>
        </ol>
        <li><a href="#2.4">IO Class</a> <i>[missing]</i></li>
        <li><a href="#2.5">Top Level Fuctions</a> <i>[missing]</i></li>
    </ol>

</ol>


<dl><dt><h2><a name="1">1</a> globals.js</h2></dt>
<dd><p><code>globals.js</code> contains most of the reuseable string constants 
used by palate.js. The <abbr title='JavaScript'>JS</abbr> const type is used 
like a #define.</p>

<div class="code-block" style="padding: 0.5em;">
<pre style="font-size: 8pt;">

<?php include LXR_PATH."chameleon/theme_builder/theme_builder/content/js/globals.js"; ?>

</pre>
</div>
</dd>
</dl>

<dl><dt><h2><a name="2">2</a> palate.js</h2></dt>
<dd>The main js file for Chameleon is <code>palate.js</code>. It is broken down
into a number of javascript classes or objects. Most of these objects are based
on the UI.

<dl><dt><h3><a name="2.1">2.1</a> PreviewControl Class</h3></dt>
<dd><code>PreviewControl</code> 
<p> 
All of the methods and properties associated with this part of the UI 
such as 'Object Preview', 'Object Layers', 'State' etc.  should be in this class.
</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>doc</code></dt>
    <dd> <code>type=object</code></dd>
		<dd>Shorthand 'pointer' to <code>document</code> object.</dd>
    <dt><code class='attribute-name'>curState</code></dt>
    <dd> <code>type=object</code></dd>
				<dd>The current css psudo mode default object selected by the user which the class resides in 
				a <i>mode.js</i> file. 
				<br>For example: <code>hover.js</code>, <code>active.js</code> from this object the default css rules are stored as well as the curent changed or edited rule for the object being edited</dd>
    <dt><code class='attribute-name'>curObj</code></dt>
    <dd> <code>type=global string const</code></dd>
		<dd>The default <code>id</code> string of the current element object being edited</dd>
    <dt><code class='attribute-name'>objPre</code></dt>
    <dd> <code>type=global string const</code></dd>
		<dd>This is the <code>id</code> string of the container 'preview' box for the created element 		
		object that	is currently displayed.</dd>
    <dt><code class='attribute-name'>objId</code></dt>
    <dd> <code>type=global string const</code></dd>
		<dd>The default created element object's id</dd>
    <dt><code class='attribute-name'>bgImage</code></dt>
    <dd> <code>type=string</code></dd> 
		<dd>The path to the bg image so it is available when you deselect it, it is initialized when you choose the image checkbox</dd>
    <dt><code class='attribute-name'>fgImage</code></dt>
    <dd> <code>type=string</code></dd>
		<dd>The path to the fg image so it is available when you deselect it, it is initialized when you choose the image checkbox</dd>
    <dt><code class='attribute-name'>src</code></dt>
    <dd><code>type=object</code></dd>
		<dd>This is the loaded template document object [object XULDocument] in the edit area. 
		For example the current default document is <code>browser.xul</code> or 
		<code>frames[0].document</code> 
</dd>
    <dt><code class='attribute-name'>lastMode</code></dt>
    <dd><code>type=string</code></dd>
		<dd>The previous mode/state the user was using before switching to the current</dd>
    <dt><code class='attribute-name'>elementAtts</code></dt>
    <dd><code>type=array</code></dd> 
			<dd>Array of static element id's used in the text elements that display the edited 
				objects attribute list. These id's are needed to change the values displayed when an object is chosen 				for editing
    <div class="code-block"><pre>
    elementAtts :   new Array
             (ATT_EL,
              ATT_ID,
              ATT_CLASS,
              ATT_VALUE,
              ATT_EL_CUR_VAL,
              ATT_ID_CUR_VAL,
              ATT_CLASS_CUR_VALUE,
              ATT_VALUE_CUR_VALUE)
    </pre></div>
    </dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>init</code></dt>

    <dd><p>PreviewControl Class constructor. Initializes default member vars <code>curState</code> and 
		<code>src</code>.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>

    <dt><code class='method-name'>mode</code></dt>

    <dd><p>This method gets the current mode/state the user is editing in. This is simply a getAttribute call to the text element in the 'State' dropdown</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>string mode</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>exists</code></dt>
    <dd><p>Checks to see if there is an element in the preview box</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>returns the current object in the preview box</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setChecks</code></dt>
    <dd><p>Called from <code>syncImageChecks</code> method</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aCheck</code></dt>
          <dd>this arg is the id string of the check that is turned on</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>returns <code>PALATE_OK</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearChecks</code></dt>
    <dd><p>clears or resets the image check boxes</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>returns <code>PALATE_OK</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clear</code></dt>
    <dd><p>clears the UI in the Preview space</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>boolean</code> Returns <code>true</code> when the clear is 
      successfull.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setImage</code></dt>
    <dd><p>This set the member vars <code>bgImage</code> and <code>fgImage</code> with it's full css setting only and not the rule</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInRule</code> of type css rule</dt>
          <dd>either <code>background-image:</code> or <code>list-style-image:</code></dd>
        </dl></dd>
      <dt><code>void</code> no Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getImage</code></dt>
    <dd><p>this method is used to get the image stored in the member var based on the rule passed as arg</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInRule</code> of type css rule</dt>
          <dd>css rules <code>background-image:</code> or <code>list-style-image:</code></dd>
        </dl></dd>
      <dt>Return Value string</dt>
      <dd>Returns the css <code>image</code> setting.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>newImage</code></dt>
    <dd><p>primarily what this does is just format the inbound setting w/ a ';' and a <code>\n</code> character</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aImgRule</code> of type css image rule</dt>
          <dd>css image rule <code>background-image:</code> or <code>list-style-image:</code></dd>
          <dt><code class='parameter-name'>aUrl</code> of type css setting</dt>
          <dd>a css url setting</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean</code> returns true upon success or false if preview box is empty</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>layers</code></dt>
    <dd><p>called directly from the UI image check boxes. Primary function of this method is to call a bunch of routines associated with displaying the image in the preview window. </p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aId</code> of type <code>string</code> id</dt>
          <dd>passes the id of the image checkbox</dd>
          <dt><code class='parameter-name'>aImgRule</code> of type css <code>string</code> rule</dt>
          <dd>css rule for the image that the checkbox represents</dd>
       </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean true</code> upon success</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>update</code></dt>
    <dd><p>does the actual applying of style from the current array of css rules and settings to the object in the preview window</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>boolean true </code>whan update is successfull.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>reset</code></dt>
    <dd><p>restores the preview object to it's default state and sets the controls accordingly</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>boolean true </code>whan reset is successfull.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>syncImageChecks</code></dt>
    <dd><p>calls <code>setChecks</code> when an image rule is found and the image vars are null</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>returns <code>true</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>preview</code></dt>
    <dd><p>this is the main method for creating and loading an element into the preview box</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aObj</code> of type <code>element object</code></dt>
          <dd>the element object that was clicked on in</dd>
          <dt><code class='parameter-name'>aTag</code> of type <code>string</code></dt>
          <dd>this is the tage that is to be created in the preview box</dd>
          <dt><code class='parameter-name'>aValue</code> of type <code>string</code></dt>
          <dd>the value of the element if applicable</dd>
          <dt><code class='parameter-name'>aUseClass</code> of type <code>string</code></dt>
          <dd>the name of the class for the element</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean true </code>when successfull</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>postAtts</code></dt>
    <dd><p>this populates the values for the Attributes section of the UI</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInName</code> of type <code>string</code></dt>
          <dd>the name to be displayed in the left column</dd>
          <dt><code class='parameter-name'>aInValue</code> of type <code>string</code></dt>
          <dd>the value to be displayed</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean true </code>when successfull.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h3><a name="2.2">2.2</a> General Class</h3></dt>
<dd><p> This class takes care of generized functionality that is shared by all 
of the other classes.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>component</code></dt>
    <dd><code>type=string</code></dd>
		<dd>this is the display name of the component curently being edited ex: Browser</dd>
    <dt><code class='attribute-name'>type</code></dt>
    <dd><code>type=string</code></dd>
		<dd>this is the component curently being edited ex: navigator this name is used to create the skin dir</dd>
    <dt><code class='attribute-name'>outString</code></dt>
    <dd><code>type=string</code></dd>
    <dd>css rule for the element in preview as a string</dd>
    <dt><code class='attribute-name'>SysBeep</code></dt>
    <dd><code>type=object</code></dd>
    <dd><code>[xpconnect wrapped nsIXPCConstructor]</code></dd>
    <dt><code class='attribute-name'>beep</code></dt>
    <dd><code>type=object</code></dd>
    <dd><code>[xpconnect wrapped nsISound]</code></dd>
    <dt><code class='attribute-name'>pat</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat0</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat1</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat2</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat3</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat4</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>pat5</code></dt>
    <dd><code>type=regex patern</code></dd>
    <dd>regex used by member functions</dd>
    <dt><code class='attribute-name'>regId</code></dt>
    <dd><code>type=array</code></dd>
    <dd> Array of registred IDs pushed in to the array when an element has been edited</dd>
    <dt><code class='attribute-name'>curMatch</code></dt>
    <dd><code>type=int</code></dd>
    <dd>i think it is the array index of a current rule that has been matched?</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>initCurrent</code></dt>
    <dd><p>initializes <code>curRule</code> and <code>curSetting</code> as new arrays and populates the current element with the default rules and settings</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>returns <code>true</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>match</code></dt>
    <dd><p>matches a new rule if with an existing rule. this is so there is never a rule repeated in the generated css output</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInRule</code> of type <code>string</code> css rule</dt>
          <dd>a css rule like <code>height:</code></dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean</code> <code>true</code> if there is a match and <code>false</code> if not</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>replace</code></dt>
    <dd><p>used with match, if a rule is matched up, then we use replace to add the new setting</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInRule</code> of type <code>string</code></dt>
          <dd>an incoming rule</dd>
          <dt><code class='parameter-name'>aNewSetting</code> of type <code>string</code></dt>
          <dd>the new setting to be used if a match is made</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>PALATE_OK</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>remove</code></dt>
    <dd><p>removes a css rule and setting from the <code>curRule</code> array</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aInRule</code> of type <code>string</code></dt>
          <dd>css rule</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>PALATE_OK</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>append</code></dt>
    <dd><p>appends a new rule and setting to <code>curRule</code> and <code>curSetting</code></p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aNewRule</code> of type <code>string</code></dt>
          <dd>css rule</dd>
          <dt><code class='parameter-name'>aNewSetting</code> of type <code>string</code></dt>
          <dd>css setting</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>PALATE_OK</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getDefaultAsString</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>Returns default style as <code>string</code>.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getCurrentAsString</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>Returns current style as <code>string</code>.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean;</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>timeStamp</code></dt>
    <dd><p>Returns string time stamp consistring of actual date and time.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>string</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setModified</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aSet</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>checkForBgImg</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>image</code> if exists, else <code>false</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>checkForFgImg</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>image</code> if exists, else <code>false</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearImgNodes</code></dt>
    <dd><p>Removes G_NATIVE attribute from images. That means...</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>applyClassChanges</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aUseClass</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>Returns <code>matchedIDs</code> of type <code>Array</code>.</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>viewBorders</code></dt>
    <dd><p>Turns off borders so when we apply a change the borders are 
    removed.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>boolean;</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>applyChanges</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>boolean;</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>registerId</code></dt>
    <dd><p>Redisters <code>aId</code> in GlobalControl's <code>regId</code>.</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aId</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>returns <code>true</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControls</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aTab</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean;</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControls</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aTab</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getSelectedTab</code></dt>
    <dd><p>Returns currently selected tab. </p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd>.id atribute of selected tab</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>forceInteger</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aElementID</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>boolean;</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setDisplay</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aThemeName</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getProjects</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRefresh</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>Exception</dt>
      <dd><code>exception</code> **PETE**</dd>       
    </dl></dd>
    <dt><code class='method-name'>newTheme</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>getModeSettings</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aType</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aLastMode</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>Returns current mode setting. When no <code>aType</code> is provided 
      returns <code>false</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h3><a name="2.3">2.3</a> "Style" Classes</h3></dt>
<dd><p>Style Classes are used for storing and setting of style properties of
each element. They are broken into classes by the UI tabs.</p>

<dl><dt><h4><a name="2.3.1">2.3.1</a> Size Class</h4></dt>
<dd><p> This class handles all of the functionality for the size tab in the
palate section of the tool. This is where the css size style rules are stored.
The actual rules (width:, max-width:, etc) are stored in a member array and the
settings (1px, 2px, etc) are dynamically drawn from a hidden attribute pool in
the drop down menus.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>width</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>height</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>minWidth</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>minHeight</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>maxWidth</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>maxHeight</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>element</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>rules</code></dt>
    <dd> Rules array stores css style rules.
    <div class="code-block"><pre>
    this.rules  =   new Array(
         [this.width,      SIZE_WIDTH_NUM_ID,      SIZE_WIDTH_PX_NAME_ID],
         [this.height,     SIZE_HEIGHT_NUM_ID,     SIZE_HEIGHT_PX_NAME_ID],
         [this.minWidth,   SIZE_MIN_WIDTH_NUM_ID,  SIZE_MIN_WIDTH_PX_NAME_ID],
         [this.minHeight,  SIZE_MIN_HEIGHT_NUM_ID, SIZE_MIN_HEIGHT_PX_NAME_ID],
         [this.maxWidth,   SIZE_MAX_WIDTH_NUM_ID,  SIZE_MAX_WIDTH_PX_NAME_ID],
         [this.maxHeight,  SIZE_MAX_HEIGHT_NUM_ID, SIZE_MAX_HEIGHT_PX_NAME_ID]);
    </pre></div></dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
       </dl></dd>
      <dt>Return Value</dt>
      <dd><code>true</code> when rule is succesfully applied. When 
      <code>aInSetting</code> is empty string, deletes a rule and returns 
      <code>null</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>initArray</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aType</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h4><a name="2.3.2">2.3.2</a> Font Class</h4></dt>
<dd><p> This class handles all of the functionality for the font tab. This is 
where the css font style rules are stored.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>color</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>face</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>size</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>style</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>weight</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>variant</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>decoration</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>rules</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>description of return value</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>Return Value</dt>
      <dd><code>true</code> when ...</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h4><a name="2.3.3">2.3.3</a> Color Class</h4></dt>
<dd><p> This class handles all of the functionality for the color tab. This is 
where the css color and background style rules and images are stored.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>color</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bgimage</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bgrepeat</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bgposition</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>fgimage</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h4><a name="2.3.4">2.3.4</a> Padding Class</h4></dt>
<dd><p> This class handles all of the functionality for the padding tab. This is
where the css padding style rules are stored.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>padding</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>top</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>right</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bottom</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>left</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>element</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>true</code> when rule is succesfully applied. When 
      <code>aInSetting</code> is empty string, deletes a rule and returns 
      <code>null</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>initArray</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aType</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h4><a name="2.3.5">2.3.5</a> Margin Class</h4></dt>
<dd><p> This class handles all of the functionality for the margin tab. This is 
where the css margin style rules are stored.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>margin</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>top</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>right</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bottom</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>left</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>element</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>true</code> when rule is succesfully applied. When 
      <code>aInSetting</code> is empty string, deletes a rule and returns 
      <code>null</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>initArray</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aType</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h4><a name="2.3.6">2.3.6</a> Border Class</h4></dt>
<dd><p> This class handles all of the functionality for the border tab. This is 
where the css border style rules are stored.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>border</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>top</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>right</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>bottom</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>left</code></dt>
    <dd> attribute description</dd>
    <dt><code class='attribute-name'>element</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>apply</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aRule</code> of type TYPE</dt>
          <dd>description of parameter</dd>
          <dt><code class='parameter-name'>aInSetting</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd><code>true</code> when rule is succesfully applied. When 
      <code>aInSetting</code> is empty string, deletes a rule and returns 
      <code>null</code></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>init</code></dt>
    <dd><p>Class constructor, inintializes values eg. creates <code>rules</code>
    Array.</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>initArray</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>aType</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>setControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
    <dt><code class='method-name'>clearControl</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>No Parameters</dt>
      <dd></dd>
      <dt>No Return Value</dt>
      <dd></dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

</dd>
</dl>

<dl><dt><h3><a name="2.4">2.4</a> IO Class</h3></dt>
<dd><p> This class handles all I/O for the app. Things like "Save theme", 
"Preview", "Load" etc... This class relies heavily on io.js lib.</p>
<dl>
  <dt>Attributes</dt>
  <dd><dl>
    <dt><code class='attribute-name'>attribute</code></dt>
    <dd> attribute description</dd>
  </dl></dd>
    
  <dt>Methods</dt>
  <dd><dl>
    <dt><code class='method-name'>method</code></dt>
    <dd><p>method description</p>
    <dl>
      <dt>Parameters</dt>
        <dd><dl>
          <dt><code class='parameter-name'>param</code> of type TYPE</dt>
          <dd>description of parameter</dd>
        </dl></dd>
      <dt>Return Value</dt>
      <dd>description of return value</dd>
      <dt>No Exceptions</dt>
      <dd>&nbsp;</dd>       
    </dl></dd>
  </dl></dd>
</dl></dd>
</dl>

<dl><dt><h3><a name="2.5">2.5</a> Top Level Fuctions</h3></dt>
<dd></dd>
</dl>

</dd>
</dl>

FreeBSD-CVSweb <freebsd-cvsweb@FreeBSD.org>