Improve styling in Chaplin app.

labs/dependency-examples/chaplin-brunch/app/application.coffee

@@ -10,12 +10,12 @@ module.exports = class Application extends Chaplin.Application
   # Create additional mediator properties
   # -------------------------------------
   initMediator: ->
-    # Create a user property
-    mediator.user = null
     # Add additional application-specific properties and methods
     mediator.todos = new Todos()
-    # If todos are fetched from server, we will need to wait
-    # for them.
-    mediator.todos.fetch()
     # Seal the mediator
     super
+
+  start: ->
+    # If todos are fetched from server, we will need to wait for them.
+    mediator.todos.fetch()
+    super

labs/dependency-examples/chaplin-brunch/app/controllers/index-controller.coffee

-HeaderView = require 'views/header-view'
-FooterView = require 'views/footer-view'
-TodosView = require 'views/todos-view'
+HeaderView = require '../views/header-view'
+FooterView = require '../views/footer-view'
+TodosView = require '../views/todos-view'
 mediator = require 'mediator'
 
 module.exports = class IndexController extends Chaplin.Controller

labs/dependency-examples/chaplin-brunch/app/views/footer-view.coffee

 View = require './base/view'
-template = require './templates/footer'
 
 module.exports = class FooterView extends View
   autoRender: true
@@ -9,7 +8,7 @@ module.exports = class FooterView extends View
   listen:
     'todos:filter mediator': 'updateFilterer'
     'all collection': 'renderCounter'
-  template: template
+  template: require './templates/footer'
 
   render: ->
     super

labs/dependency-examples/chaplin-brunch/app/views/header-view.coffee

 View = require './base/view'
-template = require './templates/header'
 
 module.exports = class HeaderView extends View
   autoRender: true
   el: '#header'
   events:
     'keypress #new-todo': 'createOnEnter'
-  template: template
+  template: require './templates/header'
 
-  createOnEnter: (event) =>
+  createOnEnter: (event) ->
     ENTER_KEY = 13
     title = $(event.currentTarget).val().trim()
     return if event.keyCode isnt ENTER_KEY or not title

labs/dependency-examples/chaplin-brunch/app/views/todo-view.coffee

 View = require './base/view'
-template = require './templates/todo'
 
 module.exports = class TodoView extends View
   events:
@@ -7,25 +6,25 @@ module.exports = class TodoView extends View
     'dblclick label': 'edit'
     'keypress .edit': 'save'
     'blur .edit': 'save'
-    'click .destroy': 'destroy'
+    'click .destroy': 'clear'
 
   listen:
     'change model': 'render'
 
-  template: template
+  template: require './templates/todo'
   tagName: 'li'
 
-  destroy: =>
+  clear: ->
     @model.destroy()
 
-  toggle: =>
+  toggle: ->
     @model.toggle().save()
 
-  edit: =>
+  edit: ->
     @$el.addClass 'editing'
     @$('.edit').focus()
 
-  save: (event) =>
+  save: (event) ->
     ENTER_KEY = 13
     title = $(event.currentTarget).val().trim()
     return @model.destroy() unless title

labs/dependency-examples/chaplin-brunch/app/views/todos-view.coffee

 CollectionView = require './base/collection-view'
-template = require './templates/todos'
-TodoView = require './todo-view'
 
 module.exports = class TodosView extends CollectionView
   container: '#main'
   events:
     'click #toggle-all': 'toggleCompleted'
-  itemView: TodoView
+  itemView: require './todo-view'
   listSelector: '#todo-list'
   listen:
     'all collection': 'renderCheckbox'
     'todos:clear mediator': 'clear'
-  template: template
+  template: require './templates/todos'
 
-  render: =>
+  render: ->
     super
     @renderCheckbox()
 
-  renderCheckbox: =>
+  renderCheckbox: ->
     @$('#toggle-all').prop 'checked', @collection.allAreCompleted()
     @$el.toggle(@collection.length isnt 0)
 
-  toggleCompleted: (event) =>
+  toggleCompleted: (event) ->
     isChecked = event.currentTarget.checked
     @collection.each (todo) -> todo.save completed: isChecked