Template.coffeesrc/ | |
---|---|
Provides rendering of dust.js templates as well as simple node reference tracking and event delegation. | define -> \
new Class
TEMPLATES: {}
refs: {} |
Template Rendering | |
Renders a dust.js template and returns the html nodes. It does not insert these into the DOM.
| renderTemplate: (templateName, data={}, events=null) ->
rendered = @_renderDustTemplate templateName, data
els = Elements.from rendered
@delegateEvents els, events if events?
if els.length == 1
els[0]
else
els |
Loads all current dust templates into memory so they can be rendered. This step is essential if partials are used anywhere as they are expected to be in the dust cache already when called. Templates are loaded from either:
| loadAllTemplates: ->
@_loadTemplate(k) for k in $$('script[type=text/html]').get('template')
@_loadTemplate(k) for k, v of @TEMPLATES |
Delegates events from the top level node(s) of the passed in The
e.g.
You can chose to stop event propagation upwards and the default action of the elements by default if you wish. | delegateEvents: (els, events, stopPropagation=false,
preventDefault=false) ->
els = Array.from els
for eventKey, fnName of events
boundFn = (fnName, event, target) ->
event.stopPropagation() if stopPropagation
event.preventDefault() if preventDefault
@[fnName] event, target
boundFn = boundFn.bind @, fnName
for node in els
@_addDelegatedEvent node, eventKey, boundFn |
To make saving references to elements with the template easier, if you add the property ref to the element. Running this will then pull those references back into an object. e.g.
results in
| getRefs: (els, ref=null) ->
refs = {}
for el in Array.from els
elRefName = el.get 'ref'
return el if ref and elRefName == ref
refs[elRefName] = el if elRefName
for refEl in el.getElements "*[ref]"
refName = refEl.get 'ref'
return refEl if ref and refName == ref
refs[refName] = refEl
return refs |
Pulls out a given ref, calls getRefs directly so just gives a more meaningful name. | getRef: (el, ref) -> @getRefs el, ref |
Private methods | |
Calls dust to render the given template. It will try to load the template before rendering. To allow for setting variables it adds the variable
| _renderDustTemplate: (templateName, data={}) ->
@_loadTemplate templateName
data = Object.clone data
data.let = data or 0
rendered = ""
dust.render(templateName, data, (err, out) ->
rendered = out
)
return rendered |
Tries to find and load a dustjs template if it is not already in the cache | _loadTemplate: (templateName) ->
if not dust.cache[templateName]?
compiled = dust.compile @_getTemplate(templateName), templateName
dust.loadSource compiled |
Tries to find template in the following order of precedence: 1 - Within the current class in 2 - Within a JST script tag on the page
| _getTemplate: (templateName) ->
template = @TEMPLATES[templateName] if @TEMPLATES?
return template if template?
template = document.getElement "script[template=#{templateName}]"
return template.get('html') if template?
throw "Cannot find template #{templateName}" |
Delegates an event from a given element. Mootools uses a more verbose syntax to specify the event. e.g
in converted to
| _addDelegatedEvent: (el, eventKey, fn) ->
eventKey = eventKey.split ":"
mtEvent = "#{eventKey[0]}:relay(#{eventKey[1]})"
el.addEvent mtEvent, fn
|