NodeFire Library

core  1.0.6

NodeFire Library > core > NF.replicator
Search:
 
Filters

Class NF.replicator

The replicator produces clones consisting of content, animations, or inline styles. When a replicator object is added to a widget such as the menu, new clones are automatically created and removed during activation and structural edits. The replicator helps...
  • Reduce HTML weight and redundancy errors.
  • Simplify complex inline style requirements for browser which do not support the full CSS3 spec (e.g. pseudo:last-child)
  • Clone objects to specific node types based on custom className targeting rules.
  • Automate menu rendering updates when moddifying the structure (adding, moving, removing nodes, etc.) after activation.

When added to a menu widget, the replicator can automatically add bullets or other content, wrap subs and items in custom containers (tabs, rounding, drop shadows, etc.), apply timeline animation effects, and tweak inline styles for any type of node.

Replicators can target cloned nodes created by a different replicator, (e.g. add animation effects to bullets cloned by a replicator).

Constructor

NF.replicator ( type , config )
Parameters:
type <string> The type of object to replicate. Valid settings include... "content", "inlineStyle", "animation".
config <Object> Object literal containing configuration properties for the replicator...
  • {master:Object | String} The master object to replicate. The type of object to use depends upon the type of replicator defined with the type paramater. The following are appropriate objects for each replicator type...
    • "content" - A string containing the HTML to replicate. Clone Nodes are produced from the HTML string and added to the document.
    • "inlineStyle" - An object literal containing script style name and value pairs, e.g. {borderWidth:1px,color:#00f}
    • "animation" - A NF.anim.timeline or NF.anim.clip object. Widget clones play the timeline or clip based on the hooks you define.
  • {widgetClass:String} Widgets with added replicators will create clones for Nodes with the same class name. The node to target may be futher specified using the 'targetClass' property. To target menu links ('nfLink') set the widgetClass property to 'nfItem' and the targetClass property to 'nfLink'. The target can be an array of strings with different search options allowing for complex targeting, see the targetClass property below for more delails. Valid widgetClass names for the menu widget include...
    • "nfSubC" - A sub menu container.
    • "nfItem" - A menu item.
  • {widgetLevel:Int | String} Target specific levels for widgets using hierarchial structures such as the menu. Use an int value representing the level to target or an expression to evaluate which includes the keyword 'level'...
    • widgetLevel:0 - Targets the main menu or main items.
    • widgetLevel:1 - Targets all level 1 subs or items.
    • widgetLevel:"level>0" - Targets all subs or sub items.
    • widgetLevel:"level==2 && level==3" - Targets level 2 and 3 subs or items.
  • {targetClass:String | String Array} Target child Nodes with matching classNames. When using the replicators addNode method, the child search starts at the supplied parent Node. When the replicator is added to a widget the child search starts at the matching widgetClass Node.

    Multiple searches may be combined by using an array of classNames and nested Array objects which specify special search features. The search is performed in order starting with the first item in the Array. Each array item may include one of the following...
    • String - className: Targets the root or first descendant Node with a matching className.
    • 1-3 Item Array - [1 - type: (string | int), 2 - className: (string | string Array), 3 - matchAll: (boolean)]: - Array containing 1-3 items. 1 - Type: The type may be "first-child", "last-child", or a number (N'th child). 2 - ClassName: The optional className specifies the child className filter to use, this may be a single class or an Array of classes. 3 - matchAll: The optional third item specifies how to filter multiple classNames, match them all, or match one.
  • {excludeClass:String} Use in conjunction with the 'targetClass' property to exclude target nodes with a specific class name. A popular use with the menu widget is to set the targetClass to 'nfLink' and the excludeClass to 'nfParentLink'. This example would replicate clones on all menu items except for items with child sub menus.
  • {addWhere:String} With a 'content' type replicator this property specifies where the new cloned Nodes will be added relative to the supplied Node (when using addClone), the targeted widgetClass Node, or targeted targetClass Node. Valid setting options include... "first-child", "last-child", "replace-child", "before", "after", "replace", "wrap"
  • {wrapTargetClass:String} When using an 'addWhere' value of 'wrap' this property specifies a specific container within your content to use as the wrapper. Specify a className string value which matches a unique className for the node.

Methods

addClone

Array addClone ( Node )
Add a new clone to the Node. This method returns an array of object literals representing the clones which were added to the Nodes. The returned clone objects includes the following properties...
  • {refNode:Node} The reference Node to which the clone was added.
  • {targNode:Node} The actual Node to which 'content', 'animation' or other replicated types were cloned.
  • {clone:Object | Node} The cloned object for 'animation' types, or the cloned Node for 'content' type replicators.
Parameters:
Node <Node | Node Array> A single Node or Array of Nodes.
Returns: Array
Array of clone object literals which were added to the Nodes.

getClones

Array getClones ( )
Gets all clones created by the replicator. The clones are returned as an Array of object literals containing the following properties.
  • {refNode:Node} The reference Node to which the clone was added.
  • {targNode:Node} The actual Node to which 'content', 'animation' or other replicated types were cloned.
  • {clone:Object | Node} The cloned object for 'animation' types, or the cloned Node for 'content' type replicators.
Returns: Array
Array of clone object literals.

hasClone

Object hasClone ( Node )
Check to see if a Node has a clone created by the replicator. The returned clone object literal contains the following properties...
  • {refNode:Node} The reference Node to which the clone was added.
  • {targNode:Node} The actual Node to which 'content', 'animation' or other replicated types were cloned.
  • {clone:Object | Node} The cloned object for 'animation' types, or the cloned Node for 'content' type replicators.
Parameters:
Node <Node> The node to check for a clone.
Returns: Object
Object literal representing the clone.

removeClone

boolean removeClone ( clone )
Removes a clone created by the replicator.
Parameters:
clone <Object> Clone Object Literal.
Returns: boolean
True, if the clone was removed.

removeClones

void removeClones ( )
Removes all clones created by the replicator.
Returns: void

Events

cloneAdded

cloneAdded ( event )
Fires on a replicator object when a new clone is added to a Node.
Parameters:
event <object> Object literal containing the following properties...
  • {type:string} The type of event.
  • {target:object} The replicator object which dispatched the event.
  • {clone:object} The clone object which was added. Clone object properties include... refNode, targNode, clone.

cloneRemoved

cloneRemoved ( event )
Fires on a replicator object when a clone is removed.
Parameters:
event <object> Object literal containing the following properties...
  • {type:string} The type of event.
  • {target:object} The replicator object which dispatched the event.
  • {clone:object} The clone object which was removed. Clone object properties include... refNode, targNode, clone.

Modules

Copyright © 2011 OpenCube: Inc. All rights reserved.