Hamlet: expressive, intuitive templates (http://hamlet.coffee)

hamlet-todo-model.coffee

//- Model: ----------------------------------------

items = Observable []
completeAll = Observable(false)
completeAll.observe (val) ->
  items.forEach (i) ->
    i.checked(val)

model =
  removeFinished: ->
    @finished().forEach items.remove
    @completeAll(false)
    
  completeAll: completeAll
  hideMarkComplete: -> "hidden" unless @items().length
  value: Observable ""
  items: items
  finished: -> @items.filter (item) -> item.checked()
  finishedCount: -> @finished().length
  
  unfinished: ->
    @items.filter (item) -> !item.checked()
    .length
  
  add: (e) ->
    return unless e.keyCode is 13
    item =
      description: @value()
      checked: Observable false
      class: -> "completed" if item.checked()
    @items.push(item)
    @value ""

hamlet-todo-view.coffee

//- View -----------------------------------------

- item = ->
  %li
    %label
      %input(type="checkbox" @checked)
      %span.item(@class)= @description

%h2 Todos by Hamlet
%input(type="text" @value placeholder="What needs to be done?" onkeydown=@add)
%label(class=@hideMarkComplete)
  %input(type="checkbox" checked=@completeAll)
  %span Mark all as complete
%ul
  - each @items, item
.totals(class=@hideMarkComplete)
  .unfinished
    %span.count= @unfinished
    left
  .clear(click=@removeFinished)
    Clear
    %span.count= @finishedCount
    items