node-example/client.coffee at master · liamdon/node-example · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
$ ->
  class window.Todo extends Backbone.Model
    idAttribute: "_id"

    defaults:
      content: "empty todo..."
      done: false

    initialize: ->
      unless @get "content"
        @set content: @defaults.content

    toggle: ->
      @save done: !@get("done")

    clear: ->
      @destroy()
      @view.remove()

  class window.TodoList extends Backbone.Collection
    model: Todo
    url: '/todos'

    done: ->
      @filter (todo) ->
        todo.get('done')

    remaining: ->
      @without.apply(@, @done())

    nextOrder: ->
      return 1 unless @length
      @last().get('order') + 1

    comparator: (todo) ->
      todo.get('order')

  window.Todos = new TodoList

  class window.TodoView extends Backbone.View
    tagName: "li"

    template: _.template($("#item-template").html())

    events:
      "click .check":               "toggleDone"
      "dblclick div.todo-content":  "edit"
      "click span.todo-destroy":    "clear"
      "keypress .todo-input":       "updateOnEnter"

    initialize: ->
      @model.bind 'change', @render
      @model.view = @

    render: =>
      $(@el).html(@template(@model.toJSON()))
      @setContent()
      @

    setContent: ->
      content = @model.get 'content'
      @$('.todo-content').text(content)
      @input = @$('.todo-input')
      @input.bind 'blur', @close
      @input.val(content)

    toggleDone: ->
      @model.toggle()

    edit: ->
      $(@el).addClass "editing"
      @input.focus()

    close: ->
      @model.save content: @input.val()
      $(@el).removeClass "editing"

    updateOnEnter: (e) ->
      @close() if e.keyCode is 13

    remove: ->
      $(@el).remove()

    clear: ->
      @model.clear()

  class window.AppView extends Backbone.View
    el: $("#todoapp")

    statsTemplate: _.template($('#stats-template').html())

    events:
      "keypress #new-todo":  "createOnEnter"
      "keyup #new-todo":     "showTooltip"
      "click .todo-clear a": "clearCompleted"

    initialize: ->
      @input = @$("#new-todo")
      Todos.bind 'add', @addOne
      Todos.bind 'reset', @addAll
      Todos.bind 'all', @render

      Todos.fetch()

    render: =>
      @$('#todo-stats').html @statsTemplate(
        total: Todos.length
        done: Todos.done().length
        remaining: Todos.remaining().length
      )

    addOne: (todo) =>
      view = new TodoView model: todo
      @$('#todo-list').append view.render().el

    addAll: =>
      Todos.each @addOne

    newAttributes: ->
      content: @input.val()
      order: Todos.nextOrder()
      done: false

    createOnEnter: (e) ->
      return null if e.keyCode != 13
      Todos.create @newAttributes()
      @input.val ''

    clearCompleted: ->
      for todo in Todos.done()
        do (todo) ->
          todo.clear()
      false

    showTooltip: (e) ->
      # TODO

  window.App = new AppView