Functions

render(componentClass, kwargs, referenceNode, position):[void]

componentClass [subclass of Component]

kwargs [optional, defaults to {}, Object]

referenceNode [optional, DOM node]

position [optional, defaults to "last", "first" | "last" | "before" | "after" | "replace" | "only" | integer]

Instantiates a new instance of componentClass, applying kwargs to the constructor, and then applies the method render() to the new instance. If referenceNode is provided, then the DOM tree associated with the new component is inserted with respect to referenceNode as given by position. If position is "replace" or "only" and any removed DOM nodes are also root nodes of some Component instance, then those instances are destroyed.

render(element, referenceNode, position):[void]

element [Element]

referenceNode [optional, DOM node]

position [optional, defaults to "last", "first" | "last" | "before" | "after" | "replace" | "only" | integer]

Syntax sugar for render(Component, {element:element}, referenceNode, position).

version():[string]

Returns the semantic version of the loaded Backdraft library.

e(componentClass, kwargs, ...child):[Element]

componentClass [Component]

kwargs [optional, Object]

child [zero, one, or many, Element | Array of Element | falsey]

Creates and returns a new Element instance. Postprocessing instructions are pulled out of kwargs so that both postprocessing instructions and Component constructor kwargs can be provided as one argument for expressive frugality. If one or many children are provided, then they are flattened into a single array of children.

e(tag, props, ...child):[Element]

tag [string]

props [optional, Object]

child [zero, one, or many, Element | Array of Element | falsey]

Creates and returns a new Element instance. Postprocessing instructions are pulled out of props so that both postprocessing instructions and node property/attribute initialization values can be provided as one argument for expressive frugality. If one or many children are provided, then they are flattened into a single array of children.

connect(target, eventName, listener, useCapture):[disconnectHandle]

target [DOM node]

eventName [string]

listener [function(eventObject)]

useCapture [optional, defaults to false, boolean]

Connects listener to the event given by eventName on the node target by executing target.addEventListener(type, listener, useCapture). If the environment has touch events, then eventName === "mousedown" also causes listener to be connected to the "touchstart" event. Similarly for "mousemove"/"touchmove", and "mouseup"/"touchend".

Returns a disconnectHandle, which is an object with the single method destroy() that causes listener to be disconnected from the event (or events, if extra touch events were connected). The destroy() method may be called multiple times without harm; subsequence applications of destroy() result in a no-op.

setAttr(node, name, value):[void]

node [DOM node]

name [string]

value [any]

If name is "style", then applies setStyle(node, name, value).

Otherwise, if node contains the property name, then executes node[name] = value.

Otherwise, executes node.setAttribute(name, value).

getStyle(node, styleName):[any]

node [DOM node]

styleName [string]

Returns the value of the style attribute given by styleName. If the value is a pixel value, then it is converted to a number.

stopEvent(eventObject):[void]

eventObject [Object]

Given a DOM event object, stops default processing and prevents propagation.

getStyles(node, ...styleNames):[Object]

node [DOM node]

styleNames [one or many, string | Array of string | Object]

Returns a hash (an Object) from style name to style value on node for all style names given in styleNames. Pixel values are converted to a number. If a styleNames parameter is an Object, then the keys of that Object denote the requested style names.

setStyle(node, style, value):[void]

node [DOM node]

style [string]

value [any]

Syntax sugar for node.style[style] = value.

setStyle(node, hash):[void]

node [DOM node]

hash [Object]

Applies (node, key, hash[key]) for each key in hash.

setPosit(target, posit):[void]

target [DOM node | Component | string]

posit [Object]

Sets any/all of the top, left, bottom, right, height, width styles on the node implied by target as given by posit. If target is a Component, then node is given by target._dom.root; otherwise, if target is a string, then node is given by document.getElementById(target); otherwise, target must be a DOM node.

For any of "t", "b", "l", "r", "h", "w" in posit, sets the top, bottom, left, right, height, width style in pixels on target, respectively, posit must provide values as numbers; setPosit converts them to strings with the "px" suffix.

getPosit(target):[object]

target [DOM node | Component | string]

Returns an Object with the properties "t", "b", "l", "r", "h", "w" initialized to hold the top, bottom left, right, height, and width style values (numbers) of the node implied by target. If target is a Component, then node is given by target._dom.root; otherwise, if target is a string, then node is given by document.getElementById(target); otherwise, target must be a DOM node.

insert(node, refNode, position)[void | DOM node | Array of DOM nodes]

node [DOM node]

refNode [DOM node]

position [optional, defaults to "last", "first" | "last" | "before" | "after" | "replace" | "only" | integer]

Inserts nodewith respect to referenceNode as given by position. If position is "replace" or "only", then any removed DOM nodes are returned.

create(tag, props):[object]

tag [string]

props [optional, defaults to {}, Object]

Creates a DOM node of type given by tag, then applies setAttr(node, props).