Skip to content

Creating a Custom Module

fahimc edited this page Feb 11, 2013 · 1 revision

You can add your own modules by creating a function within the Module object.

1. Create a JS File
2. Create a function
3. Add Your Module to the XML

# 1. Create a JS File. create a blank js file and link it via the HTML page. Ensure it is below teabreak.js.

# 2. Create a function Add a function to the Module object. provide the following two parameters:

  • node: this will be the xml node associate with your new module. You can add attributes in the xml and use them in your module to set it up.
  • view: this will be the view element (div) in which the module will sit.

This function needs to return either the module element or null.

Also you can call Module.setup which will add the defaults to your module. You need to provide it the xml node and the element.

##Example

Module.custom= function(node,view)
{
   var div = document.createElement('div');
   div.style.width  ="100%";
   div.style.height  ="100%";
   div.style.backgroundColor="#f00";
   div.innerHTML = node.getAttribute('text');
   Module.setup(node, div);
return div;
}

# 3. Add Your Module to the XML Open site.xml,create a new view node or use an existing view node and add your custom node here. Add all your custom attributes to the node. The node name will be the same as the function name which you created above.

##Example

<site>
<view>
  <custom  text="hello world"/>
</view>
</site>
Clone this wiki locally