MoreMotion Face Elements |
![]() ![]() ![]() |
MoreMotion Face elements are designated with special "mo:" attributes attached to standard elements in a HTML document.
After the HTML document is loaded on the browser, OMgr.initialize() method of MoreMotion Face traverses all the DOM nodes of the document to find nodes marked with these special attributes. If a node has mo:needsInit attribute then MoreMotion Face instantiates the javascript function class associated with it and lets it initialize by calling its init() method. The special attributes that turns a standard HTML element into a MoreMotion Face Element are as follows: mo:type attribute Defines the type of the element. Usually there is a wrapper Javascript class with this type that extends MoreMotionObject base class. mo:name attribute The name of the element and the instantiated Javascript object. This attribute optional and if omitted the name of the instantiated object is taken from the name attribute of the HTML element. mo:needsInit attribute This attribute should be set to true if the init() method of the Javascript class needs to be called right after the document is loaded. mo:props attribute This attribute keeps the properties of the element in "propA: 'valueA', propB: 'valueB'" format. The properties of a MoreMotion object can also be supplied as Javascript objects or functions. In that case the first character of the attribute value must be "*" followed by the object of the function name. Example:
mo:iValue attribute The initial value of the element if applicable.
Example: Below is a MoreMotion Face element called UpperCaseBox. The purpose of this element is to convert the initial or changed value of a standard HTML INPUT element to uppercase. The element has only one property that defines whether only the first letters of the words or all the letters are to be converted to uppercase.
Note that there is a call to a static function repaint() in the onchange event of the element to reformat the updated value. See how this function instantiates the UpperCaseBox class and calls its repaint() method.
|