like virtual-dom except works with real elements

hdom.coffee

util = require('./util')


applyStyle = (elem, style) ->
  if typeof style is 'string'
    elem.setAttribute('style', style)
  else
    elem.style[key] = val for own key, val of style
  return

applyProps = (elem, props) ->
  for own prop, val of props
    switch prop
      when 'className'
        elem.className = val
      when 'style'
        applyStyle(elem, val)
      when 'for'
        elem.cssFor = val
      when 'innerHTML'
        elem.innerHTML = val
      when 'outerHTML'
        elem.outerHTML = val
      when 'innerText'
        elem.innerText = val
      when 'text'
        elem.text = val
      when 'textContent'
        elem.textContent = val
      else
        if prop.indexOf('-') is -1
          elem.setAttribute(prop, val)
        else
          elem[prop] = val
  return

applyChild = (elem, child) ->
  if child instanceof Element
    elem.appendChild(child)
  else if typeof child is 'string'
    node = document.createTextNode(child)
    elem.appendChild(node)
  return


h = (tag, props, children) ->
  if not children and (props instanceof Array or typeof props is 'string')
    children = props
    props = null
  children = [ children ] if typeof children is 'string'
  elem = document.createElement(tag)
  applyProps(elem, props) if props
  applyChild(elem, child) for child in children if children
  elem

tag = (tag) -> util.curry(h, tag)

exports.h = h
exports.tag = tag
exports.span = tag('span')
exports.div = tag('div')