Cell Render Helper _ - peterwmwong/cell GitHub Wiki
Quickly craft HTML DOM nodes in CoffeeScript!
_ '#myid.myclass', # <div id='myid' class='myclass'>
_ '.child1' # <div class='child1'></div>
_ '.child2' # <div class='child2'></div>
# </div>
_ 'table', cellpadding: 0, # <table cellpadding='0'>
_ 'tbody', # <tbody>
_ 'tr', # <tr>
for i in [0...5] # <td class='even'>Column 0</tr>
_ "td.#{i%2 and 'odd' or 'even'}", # <td class='odd' >Column 1</tr>
"Column #{i}" # <td class='even'>Column 2</tr>
# <td class='odd' >Column 3</tr>
# <td class='even'>Column 4</tr>
# </tr>
# </tbody>
# </table>
#=== ButtonCell.coffee ===
define (require)->
require('cell/defineView!')
render: (_)-> [
@options.button_text
]
#=========================
_ ButtonCell, button_text:'YO!' # <div class='ButtonCell'>YO!</div>
_ [Selector String], [Ext]..., [Attributes Hash]?, [Children: DOM Node, String, Number, jQuery Object, Array]...
- Selector String
- Describes the tag name, id, and/or class(es) of the DOM Node to create. See below 'Selector String' section.
- Ext
- Zero to many Extensions (cell/Ext) to be applied to the DOM Node
- Attributes Hash
- For each key/value pair of the hash, `node.setAttribute(key, value)` is called.
- Children
- Each child is appended in order to the DOM Node
Instantiates a new cell/View and returns the View's root DOM Node (el
)
Quickly describe a DOM Node's tag name, id, and/or class(es). Format:
{tag name}?(#{id})?(.{class})*
If no tag name
is specified, defaults to a <div/>
'span' # <span/>
'#myid' # <div id='myid'/>
'.class1' # <div class='class1/>
'#myid.class1.class2' # <div id='myid' class='class1 class2'/>
'span#myid' # <span id='myid'/>
'span.class1.class2' # <span class='class1 class2'/>
'span#myid.class1.class2' # <span id='myid' class='class1 class2'/>