Slightly different controller layout.

Attempts to shortcut ember's view context mechanism to get at the loaded Model object.
geocam · Sep 4, 2012 · 3296832 · 3296832
1 parent 1d8c154
commit 3296832
Show file tree

Hide file tree

Showing 4 changed files with 61 additions and 20 deletions.
diff --git a/geocamTiePoint/static/geocamTiePoint/js/app.js b/geocamTiePoint/static/geocamTiePoint/js/app.js
@@ -46,29 +46,50 @@ App.OverlayListController = Em.ArrayController.extend({
     },
 });
 
+App.OverlayController = Em.ObjectController.extend();
+App.OverlayView = Ember.View.extend({
+    template:
+        '<h1>This is an OverlayView ({{id}})</h1>'+
+        '{{outlet}}',
+});
+
+App.OverlayAlignController = Em.ObjectController.extend({
+    init: function() {
+        this._super();
+        this.currentOverlay = null;
+    },
+})
 App.OverlayAlignView = Ember.View.extend({
     templateName: 'overlay_align',
     map_container_id: 'map_canvas',
     didInsertElement: function() {
-        var map_container = $('#'+this.map_container_id);
-        var overlay = this.content;
+        var overlay = App.get('currentOverlay');
+        if (overlay.isLoaded ) {
+            this._drawMap();
+        } else {
+            overlay.set('didLoad', this._drawMap);
+        }
+    },
+    _drawMap: function() {
+        var map_container = $('#map_canvas');
+        var overlay = App.get('currentOverlay');
         var mapOptions = {
             mapTypeId: google.maps.MapTypeId.ROADMAP,
         };
         map = new google.maps.Map(map_container[0], mapOptions);
-        fitNamedBounds(overlay.bounds);
+        fitNamedBounds(overlay.get('bounds'));
+        return this;
     },
 
 });
 
+//App.OverlayAlignController = Em.ObjectController.extend({});
+
 
 /**************************
 * Controllers
 **************************/
 App.ApplicationController = Em.Controller.extend();
 
-App.OverlayController = Em.ArrayController.extend({
-    content: [],
-});
 
 
diff --git a/geocamTiePoint/static/geocamTiePoint/js/models.js b/geocamTiePoint/static/geocamTiePoint/js/models.js
@@ -68,6 +68,7 @@ App.Overlay = DS.Model.extend({
     "unalignedTilesUrl": DS.attr('string'), 
     "unalignedTilesZoomOffset": DS.attr('number'), 
     "url": DS.attr('string'),
+    'primaryKey': 'key',
 });
 
 App.Overlay.reopenClass({

diff --git a/geocamTiePoint/static/geocamTiePoint/js/router.js b/geocamTiePoint/static/geocamTiePoint/js/router.js
@@ -10,7 +10,7 @@ App.Router = Ember.Router.extend({
 
         listOverlays: Ember.Route.extend({
             route: '/overlays/',
-            alignOverlayAction: Em.Route.transitionTo('alignOverlay'),
+            showOverlayAction: Em.Route.transitionTo('showOverlay'),
 
             connectOutlets: function(router, controller) {
                 router.get('applicationController').connectOutlet( {
@@ -22,27 +22,46 @@ App.Router = Ember.Router.extend({
                     */ 
                     controller: App.get('OverlayListController').create(),
                     viewClass: App.get('OverlayListView'),
+                    context: App.store.find(App.Overlay),
                 } );
             },
         }),
 
-        alignOverlay: Ember.Route.extend({
-            route: '/overlay/:overlay_key/align',
+        showOverlay: Ember.Route.extend({
+            route: '/overlay/:overlay_key',
             serialize: function(router, context) {
-                return {overlay_key: context.get('id')}
+                var hash = {overlay_key: context.get('_id')}
+                Em.assert("serialize() was passed a context with no ID", !!hash.overlay_key);
+                if (hash.overlay_key == null) {debugger;}
+                return hash;
             },
             deserialize: function(router, params) {
-                return App.store.find(App.Overlay, params.overlay_key);
+                var overlay = App.store.find(App.Overlay, params.overlay_key);
+                //router.get('overlayAlignController').set('currentOverlay', overlay);
+                App.set('currentOverlay', overlay);
+                return overlay;
             },
-            connectOutlets: function(router, overlay) {
-                console.log("context for overlayAlignController");
-                console.log(overlay);
-                router.get('applicationController').connectOutlet({
-                    controller: router.get('overlayController'),
-                    viewClass: App.OverlayAlignView,
-                });
+            connectOutlets: function(router, controller) {
+                router.get('applicationController').connectOutlet('overlay');
             },
-        }),
+            initialState: 'align',
+            align: Ember.Route.extend({
+                route: '/align',
+                connectOutlets: function(router, context) {
+                    if (! context) {
+                        context = router.get('overlayController.currentOverlay');
+                    }
+                    console.log("context for overlayAlignController");
+                    console.log(context);
+                    router.get('applicationController').connectOutlet({
+                        controller: router.get('overlayAlignController'),
+                        viewClass: App.get('OverlayAlignView'),
+                        context: context,
+                    });
+                },
+            }),
+
+        }), // end showOverlay
 
         alignTiePoints: Ember.Route.extend({
             route: '/align/:overlay',

diff --git a/geocamTiePoint/templates/geocamTiePoint/handlebars.html b/geocamTiePoint/templates/geocamTiePoint/handlebars.html
@@ -23,7 +23,7 @@
     <span class="debug">This is OverlayList</span>
     <ul id="overlay_list">
     {{#each overlay in controller}}
-      <li><a {{action alignOverlayAction overlay target="App.router" href=true}}>{{overlay.name}}</a></li>
+      <li><a {{action showOverlayAction overlay target="App.router" href=true}}>{{overlay.name}}</a></li>
     {{/each}}
     </ul>
 </script>