trying to get redirect to All on Clear Completed on Completed filter

working doesn't actually work; got lost in a maze of EmberJS models, controllers, routers, and things that seem to be a lot harder than they should really be.
soundasleep · Jan 22, 2014 · 45a31be · 45a31be
1 parent 5315a65
commit 45a31be
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 4 deletions.
diff --git a/index.html b/index.html
@@ -13,6 +13,7 @@
   </head>
   <body>  
     <script type="text/x-handlebars" data-template-name="todos">
+      {{this}}
       <section id="todoapp">
         <header id="header">
           <h1>Todos</h1>
@@ -50,9 +51,8 @@ <h1>Todos</h1>
           </ul>
 
           {{#if hasCompleted}}
-            <button id="clear-completed" {{action "clearCompleted"}}>
-              Clear completed ({{completed}})
-            </button>
+            route = {{route}}
+            {{outlet button}}
           {{/if}}
         </footer>
       </section>
@@ -63,6 +63,7 @@ <h1>Todos</h1>
     </script>
 
     <script type="text/x-handlebars" data-template-name="todos/index">
+      {{route}}
       <ul id="todo-list">
         {{#each itemController="todo"}}
           <!-- binds 'completed' class to li if 'isCompleted' is 'true' -->
@@ -88,6 +89,13 @@ <h1>Todos</h1>
       </ul>
     </script>
 
+    <script type="text/x-handlebars" data-template-name="todos/button">
+      route = {{route}}
+      <button id="clear-completed" {{action "clearCompleted"}}>
+        Clear completed ({{completed}})
+      </button>
+    </script>
+
     <!-- TODO use a Grunt script to combine all of these scripts into one -->
     <script src="js/application.js"></script>
     <script src="js/router.js"></script>

diff --git a/js/controllers/todo_controller.coffee b/js/controllers/todo_controller.coffee
@@ -37,4 +37,6 @@ Todos.TodoController = Ember.ObjectController.extend(
     )
 
   isEditing: false
+
+  needs: ['todos']
 )
diff --git a/js/controllers/todos_controller.coffee b/js/controllers/todos_controller.coffee
@@ -27,6 +27,9 @@ Todos.TodosController = Ember.ArrayController.extend(
       completed.invoke('deleteRecord')
       completed.invoke('save')
 
+      # if we are currently on the /completed filter, we will have nothing remaining; redirect to the all filter
+      if @get('currentPath') is 'completed' then @transitionToRoute 'index'
+
   # this is basically creating a runtime property/attribute that can be listened to?
   remaining: ( -> 
     @filterBy('isCompleted', false).get('length')   # implicit return
@@ -52,4 +55,5 @@ Todos.TodosController = Ember.ArrayController.extend(
   remainingText: ( ->
     (if @get('remaining') is 0 then "No" else @get('remaining'))
   ).property('remaining')
+
 )
diff --git a/js/router.coffee b/js/router.coffee
@@ -15,12 +15,20 @@ Todos.TodosRoute = Ember.Route.extend(
 Todos.TodosIndexRoute = Ember.Route.extend(
 	model: ->
 		# return the same model as for the route 'todos' (i.e. return the same model as used in Todos.TodosRoute)
-		@modelFor 'todos'		# implicit return; also the same as @modelFor('todos')
+		@modelFor 'todos'
 
 	# TODO test: can we create a renderTemplate as below, i.e. we get an implicit renderTemplate based on the naming convention of this route?
 	renderTemplate: (controller) ->
 		@render 'todos/index',
 			controller: controller
+
+		@render 'todos/button',
+			outlet: 'button',
+			controller: controller
+
+	setupController: (controller, model) ->
+		controller.set 'route', 'index'
+		controller.set 'model', model
 )
 
 Todos.TodosActiveRoute = Ember.Route.extend(
@@ -31,6 +39,10 @@ Todos.TodosActiveRoute = Ember.Route.extend(
 	renderTemplate: (controller) ->
 		@render 'todos/index', 
 			controller: controller
+
+		@render 'todos/button',
+			outlet: 'button',
+			controller: controller
 )
 
 Todos.TodosCompletedRoute = Ember.Route.extend(
@@ -41,4 +53,8 @@ Todos.TodosCompletedRoute = Ember.Route.extend(
 	renderTemplate: (controller) ->
 		@render 'todos/index', 
 			controller: controller
+
+		@render 'todos/button',
+			outlet: 'button',
+			controller: controller
 )