Merge pull request #50 from boushley/emberjs

Update ember.js app to use classNameBindings

todo-example/emberjs/css/todos.css

@@ -396,9 +396,6 @@ body {
 
 	border:0px;
 }
-#todoapp #todo-stats button.none-completed {
-  display: none;
-}
 
 /* line 136 */
 #todoapp #todo-stats button:hover, #todoapp #todo-stats button:focus {

todo-example/emberjs/index.html

@@ -51,8 +51,8 @@
   
     <!-- Insert this after the CreateTodoView and before the collection. -->
   {{#view Todos.StatsView id="todo-stats" content=this}}
-    {{#view Ember.Button target="Todos.todosController" action="clearCompletedTodos" classNameBindings="Todos.todosController.completeClass" content=this}}
-      Clear {{content.completedString}} 
+    {{#view Todos.ClearCompletedButtonView target="Todos.todosController" action="clearCompletedTodos" classNameBindings="completedButtonClass"}}
+      Clear {{completedString}} 
     {{/view}}
     {{remainingString}} left
   {{/view}}

todo-example/emberjs/js/app.js

@@ -65,12 +65,6 @@ Todos.StatsView = Ember.View.extend({
     var remaining = this.get('remaining');
     return remaining + (remaining === 1 ? " item" : " items");
   }.property('remaining'),
-
-  completedBinding: 'Todos.todosController.completed',
-  completedString: function() {
-    var completed = this.get('completed');
-    return completed + " completed" + (completed === 1 ? " item" : " items");
-  }.property('completed')
 });
 
 Todos.CreateTodoView = Ember.TextField.extend({
@@ -84,6 +78,21 @@ Todos.CreateTodoView = Ember.TextField.extend({
   }
 });
 
+Todos.ClearCompletedButtonView = Ember.Button.extend({
+  completedBinding: 'Todos.todosController.completed',
+  completedString: function() {
+    var completed = this.get('completed');
+    return completed + " completed" + (completed === 1 ? " item" : " items");
+  }.property('completed'),
+
+  completedButtonClass: function () {
+      if (this.get('completed') < 1)
+          return 'hidden';
+      else
+          return '';
+  }.property('completed')
+});
+
 Todos.TodoStore = (function () {
   // Generate four random hex digits.
   var S4 = function () {