Class Index | File Index

Classes


Class generator

Generates HTML code that maps generated TOM to tables, then injects this code into the page DOM. This version uses the old "table layout" method.
Defined in: templateLayout.generator.js.

Class Summary
Constructor Attributes Constructor Name and Description
 
generator(tom)
Creates a template compiler
Field Summary
Field Attributes Field Name and Description
 
tom
Local copy of given TOM
Method Summary
Method Attributes Method Name and Description
 
appendCol(parentNode, colNumber)
Create columns nodes (using COL) and inject it into parent node
 
appendGrid(grid, parentNode)
Create the grid node (using TABLE) and inject it into parent node.
 
appendRow(row, parentNode)
Create a row node (using TR) and inject it into parent node
 
appendSlot(slot, parentNode)
Create a slot node (using TD) and inject it into parent node
 
appendTemplate(template, parentNode)
Get template node and inject it into parent node.
 
appendVirtualNode(parentNode)
Create a virtual node (using DIV) and inject it into parent node.
 
computeColWidths(availableWidth, template)
A lightly modified version of "compute width" algorithm defined in the draft.
 
A lightly modified version of "compute heights" algorithm defined in the draft.
 
getColumnNodes(gridNode, maxColumns)
Get DOM nodes that maps template grid "columns" (COL nodes)
 
getGridNode(templateNode)
Get DOM node that maps template grid (TABLE node)
 
getPixels(dimension, max)
Get pixel size.
 
getRowNode(gridNode, index, maxColumns)
Get DOM node that maps row (TR nodes)
 
Generates the HTML code and injects it into the page DOM.
 
Resets browser default CSS styles.
 
setColNodeWidth(colNodes, computedWidths)
Set columns width (the COL nodes)
 
setGridNodeHeight(gridNode, computedHeights)
Set grid height (the TABLE node)
 
setGridNodeWidth(gridNode, computedWidths)
Set grid width (the TABLE node)
 
setRowNodeHeight(rowNode, computedHeights, rowIndex)
Set row height (the TR nodes)
 
setSlotNodeHeight(slotNode, computedHeights, rowIndex)
Set slot height (the TD nodes)
 
setSlotNodeWidth(slotNode, computedWidths, colIndex)
Set slot width (the TD nodes)
Class Detail
generator(tom)
Creates a template compiler
Parameters:
{r} tom
Template Object Model
Field Detail
{rootTemplate} tom
Local copy of given TOM
Method Detail
{HTMLElement} appendCol(parentNode, colNumber)
Create columns nodes (using COL) and inject it into parent node
Parameters:
{HTMLElement} parentNode
DOM parent node
{integer} colNumber
max number of columns
Returns:
{HTMLElement} current node

{HTMLElement} appendGrid(grid, parentNode)
Create the grid node (using TABLE) and inject it into parent node. Uses appendCol to create column nodes too.
Parameters:
{grid} grid
template grid
{HTMLElement} parentNode
DOM parent node
Returns:
{HTMLElement} current node

{HTMLElement} appendRow(row, parentNode)
Create a row node (using TR) and inject it into parent node
Parameters:
{gridRow} row
template row
{HTMLElement} parentNode
DOM parent node
Returns:
{HTMLElement} current node

{HTMLElement} appendSlot(slot, parentNode)
Create a slot node (using TD) and inject it into parent node
Parameters:
{gridSlot} slot
template slot
{HTMLElement} parentNode
DOM parent node
Returns:
{HTMLElement} current node

{HTMLElement} appendTemplate(template, parentNode)
Get template node and inject it into parent node. Template node is get using a CSS selector query OR if query fails calling generator#appendVirtualNode
Parameters:
{template} template
the template
{HTMLElement} parentNode
DOM parent node
Returns:
{HTMLElement} current node

{HTMLElement} appendVirtualNode(parentNode)
Create a virtual node (using DIV) and inject it into parent node. Virtual nodes are valid templates that doesn't match selector queries because doesn´t have HTML content (used in nested templates chains).

    #parent {display: "aa" "bc" "dd"}
    #header {position:a; display: "123"}
    #logo {position:1}
    ...
    <div id="parent"></div>
    <img id="logo" src="logo.png"/>
    ...
#parent maps to DIV element and #logo to image, but #header maps nothing, its a template used only to simplify layout. #header needs to create a virtual node.
Parameters:
{HTMLElement} parentNode
DOM parent node
Returns:
{HTMLElement} current node

{ComputedWidth} computeColWidths(availableWidth, template)
A lightly modified version of "compute width" algorithm defined in the draft.

The good parts, it works (thanks to native table algorithms); the bad, needs further improvements
Parameters:
{Number} availableWidth
parent node max width
{template} template
the source template
Returns:
{ComputedWidth} columns width

{ComputedHeight} computeRowHeights(template)
A lightly modified version of "compute heights" algorithm defined in the draft.

The good parts, it works (thanks to native table algorithms); the bad, needs further improvements
Parameters:
{template} template
the source template
Returns:
{ComputedHeight} rows height

{HTMLElement[]} getColumnNodes(gridNode, maxColumns)
Get DOM nodes that maps template grid "columns" (COL nodes)
Parameters:
{HTMLElement} gridNode
grid node
{integer} maxColumns
number of columns in grid
Returns:
{HTMLElement[]} array of matching gridNode.childNodes[]

{HTMLElement} getGridNode(templateNode)
Get DOM node that maps template grid (TABLE node)
Parameters:
{HTMLElement} templateNode
template node
Returns:
{HTMLElement} templateNode.childNodes[0]

{integer} getPixels(dimension, max)
Get pixel size. Currently converts "px" and "%"
Parameters:
{string} dimension
source in "75[px|%]" format
{integer} max
max size in pixels. Only used relative sizes ("%")
Returns:
{integer} given size converted to pixels or Error

{HTMLElement[]} getRowNode(gridNode, index, maxColumns)
Get DOM node that maps row (TR nodes)
Parameters:
{HTMLElement} gridNode
grid node
{integer} index
row index
{integer} maxColumns
number of columns in grid
Returns:
{HTMLElement[]} array of matching gridNode.childNodes[]

patchDOM()
Generates the HTML code and injects it into the page DOM.

Code generation is done in three steps:

resetCSS()
Resets browser default CSS styles.

setColNodeWidth(colNodes, computedWidths)
Set columns width (the COL nodes)
Parameters:
{HTMLElement[]} colNodes
array of DOM nodes that maps column nodes
{Object} computedWidths
column widths given by calculateColWidths()
{integer[]} computedWidths.colWidth
array of column widths

setGridNodeHeight(gridNode, computedHeights)
Set grid height (the TABLE node)
Parameters:
{HTMLElement} gridNode
DOM node that maps grid element
{Object} computedHeights
column widths given by calculateRowHeights()
{integer} computedHeights.maxHeight
table height

setGridNodeWidth(gridNode, computedWidths)
Set grid width (the TABLE node)
Parameters:
{HTMLElement} gridNode
DOM node that maps grid element
{Object} computedWidths
column widths given by calculateColWidths()
{integer} computedWidths.totalWidth
table width

setRowNodeHeight(rowNode, computedHeights, rowIndex)
Set row height (the TR nodes)
Parameters:
{HTMLElement} rowNode
DOM node that maps row element
{Object} computedHeights
column widths given by calculateRowHeights()
{integer[]} computedHeights.rowHeight
array of row heights
{integer} rowIndex
row index

setSlotNodeHeight(slotNode, computedHeights, rowIndex)
Set slot height (the TD nodes)
Parameters:
{HTMLElement} slotNode
DOM node that maps slot element
{Object} computedHeights
column widths given by calculateRowHeights()
{integer[]} computedHeights.rowHeight
array of row heights
{integer} rowIndex
slot rowIndex. See gridSlot#rowIndex

setSlotNodeWidth(slotNode, computedWidths, colIndex)
Set slot width (the TD nodes)
Parameters:
{HTMLElement} slotNode
DOM node that maps slot element
{Object} computedWidths
column widths given by calculateColWidths()
{integer[]} computedWidths.colWidth
array of column widths
{integer} colIndex
slot colIndex. See gridSlot#colIndex

Documentation generated by JsDoc Toolkit 2.4.0 on Mon Feb 13 2012 12:35:31 GMT+0100 (CET)