ELEM
Description
The DOM Abstraction collection. Implements a managed buffer
for style properties.
setFPS( fps )
Description
Re-calculates the amount of delay to achieve a new target frame rate.
The DOM refreshes are typically the most expensive tasks of an Javascript
application, it's a good idea to set an optimal frame rate for the DOM
updates to let your logic code get as many cpu cycles as possible without
wasting most of them on more DOM refreshes than necessary.
The default frame rate is 30 and the maximum frame rate allowed is 100.
Parameters
fps |
The target frame rate (DOM updates per second). |
setBoxCoords( id, coords )
Description
Sets the box coordinates (x,y,width,height) all at once.
Parameters
id |
The ELEM ID. |
coords |
An array containing exactly four coordinates in the following order: x, y, width, height |
setOpacity( id, opacity )
Description
Sets the opacity of the element.
Parameters
id |
The ELEM ID. |
opacity |
The opacity as a floating point number between 0.0 (transparent) and 1.0 (opaque). |
del( id )
Description
Deletes an element and its associated buffers by
ELEM ID.
Parameters
id |
The ELEM Id to delete. |
get( id )
Description
Gets a DOM Element by its
ELEM ID.
Parameters
Returns
The DOM Element object.
setAttr( id, key, value, bypass )
Description
Sets a named element attribute value.
Regular element attributes are cached like the style attributes.
Use this method to set an attribute value to the element.
Parameters
id |
The ELEM ID. |
key |
The Attribute name. |
value |
The Attribute value. |
bypass |
A flag used to bypass the buffers (Optional, default: false) |
getExtraHeight( id )
Description
Returns the amount of height of the element taken by 'extra' space: border
and padding size.
Parameters
Returns
The amount of extra height as an integer.
getOpacity( id )
Description
Returns the opacity of the element.
Parameters
Returns
The opacity as a floating point number between 0.0 (transparent) and 1.0 (opaque).
hasClassName( elemId, className )
Description
Checks if a element has a CSS class name.
Parameters
elemId |
The ELEM ID. |
className |
The CSS class name to check. |
Returns
Returns null, if the element does not exist
Returns true, if the element has the class name set
Returns false otherwise
getStyle( id, key, bypass )
Description
Gets the named element style attribute value.
Use this method to get a style attribute value optimally.
Element style attributes are buffered.
Parameters
id |
The ELEM ID. |
key |
The Style Attribute name. |
bypass |
A flag used to bypass the buffers (Optional, default: false) |
Returns
The element style attribute value.
getExtraWidth( id )
Description
Returns the amount of width of the element taken by 'extra' space: border
and padding size.
Parameters
Returns
The amount of extra width as an integer.
setStyle( id, key, value, bypass )
Description
Sets the named element style attribute value.
Use this method to set a style attribute value optimally.
Element style attributes are buffered.
The buffers are flushed on regular intervals.
Parameters
id |
The ELEM ID. |
key |
The Style Attribute name. |
value |
The Style Attribute value. |
bypass |
A flag used to bypass the buffers (Optional, default: false) |
addClassName( elemId, className )
Description
Adds a CSS class name to the element.
Parameters
elemId |
The ELEM ID. |
className |
The CSS class name to add. |
setIdleDelay( idleDelay )
Description
Sets the idle delay.
The idle delay is the amount of milliseconds between polling for something
to flush to DOM. This is the setting affecting how long (max) it takes to
start flushing the buffers after the buffers have been emptied.
Parameters
idleDelay |
The amount of milliseconds to wait before re-checking the buffers after going idle. |
bindId( domId )
Description
Binds a DOM element by the DOM ID-attribute.
Parameters
domId |
The element's ID-attribute to bind. |
Returns
The
ELEM ID (to use with other
ELEM methods.
getSize( id )
Description
Returns the full size of the element.
Parameters
Returns
An [ width, height ] pair as an Array.
setCSS( id, cssText )
Description
Replaces all styles of the element with the string containing css source.
Parameters
id |
The ELEM ID which all styles will be replaced with the css source. |
cssText |
A string containing the CSS Text. |
getHTML( id )
Description
Gets the innerHTML of an element by its
ELEM ID.
Parameters
Returns
The innerHTML of the element the
ELEM ID is bound to.
windowSize( )
Description
Returns the inner size of the browser window.
Returns
An [ width, height ] pair as an Array.
delAttr( id, key )
Description
Deletes a named element attribute
Parameters
id |
The ELEM ID. |
key |
The Attribute name. |
setSlowness( slowness )
Description
An additional adjustment multiplier to offset the slowness of a
target browser.
The default is 1.0 (no change to the flush delay calculated by setFPS)
A higher value than 1.0 means less frequent updates (slower than
target machine).
You'll need a benchmark in your application to calculate the multiplier
correctly depending on the tasks necessary. The multiplier is useless
without a benchmark, unless you want to temporarily make updates very
infrequent (or frequent) depending on what your application needs to do.
Parameters
slowness |
The multiplier used to offset the DOM update delay. |
getIntStyle( id, key )
Description
Like
getStyle, but always return an integer number.
Parameters
id |
The ELEM ID. |
key |
The style property name. |
Returns
The value of the style property.
getCSS( id )
Description
Returns the CSS source style of the element.
Parameters
id |
The ELEM ID which all styles will be returned as a string containing the CSS source. |
Returns
A string containing the CSS source of the element.
append( sourceId, targetId )
Description
Moves the source element inside the target element.
Parameters
sourceId |
The source element's ELEM ID to move. |
targetId |
The target element's ELEM ID to move the source element into. |
setHTML( id, html )
Description
Sets the innerHTML of an element by its
ELEM ID.
Parameters
id |
The ELEM ID. |
html |
The HTML Block as a string to set the innerHTMl property with. |
make( targetId, tagName )
Description
Creates a new element inside another.
Use this method to create a new DOM element.
Parameters
targetId |
The ELEM ID of the parent element. (Optional, default: 0; the document body) |
tagName |
The tag name of the element. (Optional, default: 'DIV') |
Returns
The new
ELEM ID.
getVisibleSize( id )
Description
Returns the visible size of an element.
Parameters
Returns
An [ width, height ] pair as an Array.
bind( elem )
Description
Binds a DOM element by the DOM Element
Object itself.
Parameters
elem |
The DOM Element object to bind. |
Returns
The
ELEM ID (to use with other
ELEM methods.
getScrollSize( id )
Description
Returns the scroll size of the element.
Parameters
Returns
An [ width, height ] pair as an Array.
removeClassName( elemId, className )
Description
Removes the CSS class name from the element.
Parameters
elemId |
The ELEM ID. |
className |
The CSS class name to remove. |
getAttr( id, key, bypass )
Description
Gets a named element attribute.
Regular element attributes are cached like the style attributes.
Use this method to get an attribute from the element.
Parameters
id |
The ELEM ID. |
key |
The Attribute name. |
bypass |
A flag used to bypass the buffers (Optional, default: false) |
Returns
The attribute value.
getVisiblePosition( id )
Description
Returns the real position of the element, subtracting whatever
scroll bars do to the position..
Parameters
Returns
An [ x, y ] coordinate pair as an Array.
flushLoop( delay )
Description
Flushes the buffers.
Call this method manually, if you need to ensure all changes are
flushed to the DOM before doing another operation.
Parameters:
delay |
Time (ms) before retrying, if another flushLoop is busy. |
Other Singleton Members
ELEMTickerInterval = 33
Description
The interval to flush the buffer specified in milliseconds.
Defaults to 60fps which is the most common refresh rate of displays.
ELEMTickerInterval: 16.667,