Changeset 173:4959bd27b191

Timestamp:

08/27/08 17:08:34 (19 months ago)

Author:

rgrp

Branch:

default

convert_revision:

svn:10edda23-d834-0410-9182-b00384516d49/trunk@185

Message:

[js][m]: refactor factletsearch_controller and threadfactlets_controller to be views.

• Create new BaseControlsView? class for them to inherit from copying over delegator stuff from Nick's existing Controller class.
• All tests seem to be passing.

Location:

microfacts/public

Files:

• behaviour/app/controllers/threadpage_controller.js (modified) (1 diff)
• behaviour/app/views/factletsearchview.js (moved) (moved from microfacts/public/behaviour/app/controllers/factletsearch_controller.js) (3 diffs)
• behaviour/app/views/threadfactletsview.js (moved) (moved from microfacts/public/behaviour/app/controllers/threadfactlets_controller.js) (3 diffs)
• behaviour/lib/moovc.js (modified) (3 diffs)
• behaviour/load.js (modified) (5 diffs)
• test/index.html (modified) (1 diff)
• test/spec/factletsearchview_spec.js (moved) (moved from microfacts/public/test/spec/factletsearch_controller_spec.js) (1 diff)
• test/spec/threadfactletsview_spec.js (moved) (moved from microfacts/public/test/spec/threadfactletscontroller_spec.js) (1 diff)

microfacts/public/behaviour/app/controllers/threadpage_controller.js

@@ -7 +7 @@
         this.controllers = [];
         element.getElements('.thread-factlets').each(function (el) {
-            this.addController(new ThreadFactletsController(el));
+            this.addController(new ThreadFactletsView(el));
         }, this);
         // should be only one
         element.getElements('#factlet-search').each(function (el) {
-            this.addController(new FactletSearchController(el));
+            this.addController(new FactletSearchView(el));
         }, this);
 

microfacts/public/behaviour/app/views/factletsearchview.js

@@ -1 @@
-var FactletSearchController = new Class({
-    Extends: Controller,
+var FactletSearchView = new Class({
+    // Extends: Controller,
+    Extends: BaseControlsView,
+    name: 'FactletSearchView',
     
-    initialize: function () {
-        this.parent.apply(this, arguments);
-        console.log('FactletSearchController: initialize');
+    setupView: function () {
         this.searchResults = $$('.factlet-search-results')[0];
         // list of factlet ids currently being shown
@@ -11 +11 @@
     },
     
-    onFactletSelect: function (factlet) {
-    },
-
+    // in parent now
     // will be removed/promoted once controller setup is refactored
-    onThreadStart: function (factlet) {
-    },
+    // onThreadStart: function (factlet) {
+    // },
 
     onDataChange: function (data) {
@@ -68 +66 @@
             var data = $('factlet-search-title').value;
             var query = { "q": data };
+            console.log('Had onclick event');
             request.post(url, encodeURIComponent(JSON.encode(query)));
         },

microfacts/public/behaviour/app/views/threadfactletsview.js

@@ -1 @@
-var ThreadFactletsController = new Class({
-    Extends: Controller,
+var ThreadFactletsView = new Class({
+    Extends: BaseControlsView,
 
     factletSummaryTemplate: [
@@ -8 +8 @@
     ].join('\n'),
     
-    initialize: function (element) {
-        this.parent.apply(this, arguments);
+    setupView: function () {
         this.factlets = [];
         this.selectedFactletId = null;
@@ -33 +32 @@
     },
 
+    // TODO: refactor to use BaseView class onThreadStart
     onThreadStart: function (thread, threadFactlets) {
         console.log("ThreadFactletsController saw threadStart event");

microfacts/public/behaviour/lib/moovc.js

@@ -38 +38 @@
         }, this);
         var factletsData = [];
+        // what is this doing in here?
+        // why test for existence of location? May have date but not location
         this.factlets.each(function (factletObject) {
             if (factletObject.data.location) {
@@ -43 +45 @@
             }
         });
-        this.log("Factlet data:");
-        this.log(factletsData);
+        // this.log("Factlet data:");
+        // this.log(factletsData);
         this.drawFactlets(factletsData);
     },
@@ -66 +68 @@
     }
 
+});
+
+var BaseControlsView = new Class({
+    Extends: BaseView,
+    name: 'BaseControlsView',
+
+    controls: {},
+    
+    initialize: function (element, controls) {
+        this.parent.apply(this, arguments);
+        this.setControls(controls);
+        this.delegateControls();
+    },
+
+    setupView: function () {
+    },
+    
+    setControls: function (controls) {
+        this.controls = $merge(this.controls, controls);
+    },
+    
+    delegateControls: function () {
+        $each(this.controls, function (fn, desc) {
+            var desc = desc.trim().split(" "), type = desc.pop(), selector = desc.join(" ");
+            this.element.delegate(selector, type, fn, this); 
+        }, this);
+    }
 });
 

microfacts/public/behaviour/load.js

@@ -51 +51 @@
     type: "js",
     path: "lib/moovc.js?" + Math.random(),
-    requires: ['mootools'],
+    requires: ['mootools', 'delegator'],
     varName: "LayerBase"
 });
@@ -137 +137 @@
 
 loader.addModule({
+    name: "threadfactletsview",
+    type: "js",
+    path: "app/views/threadfactletsview.js?" + Math.random(),
+    requires: ['view', 'controller', 'thread', 'ejs'],
+    varName: "ThreadFactletsView"
+});
+
+loader.addModule({
+    name: "factletsearchview",
+    type: "js",
+    path: "app/views/factletsearchview.js?" + Math.random(),
+    requires: ['view', 'controller', 'factlet'],
+    varName: "FactletSearchView"
+});
+
+loader.addModule({
     name: "mapview",
     type: "js",
@@ -165 +181 @@
 
 loader.addModule({
-    name: "threadfactletscontroller",
-    type: "js",
-    path: "app/controllers/threadfactlets_controller.js?" + Math.random(),
-    requires: ['controller', 'thread', 'ejs'],
-    varName: "ThreadFactletsController"
-});
-
-loader.addModule({
-    name: "factletsearchcontroller",
-    type: "js",
-    path: "app/controllers/factletsearch_controller.js?" + Math.random(),
-    requires: ['controller', 'factlet'],
-    varName: "FactletSearchController"
-});
-
-
-loader.addModule({
     name: "factletcontroller",
     type: "js",
@@ -197 +196 @@
     type: "js",
     path: "app/microfacts.js?" + Math.random(),
-    requires: ['domainobject', 'view', 'controller', 'microfactscontroller', 'factletcontroller', 'threadfactletscontroller', 'mapview', 'timelineview', 'geochronopagecontroller', 'threadpagecontroller'],
+    requires: ['domainobject', 'view', 'controller', 'microfactscontroller', 'factletcontroller', 'threadfactletsview', 'mapview', 'timelineview', 'geochronopagecontroller', 'threadpagecontroller'],
     varName: "Microfacts"
 });
@@ -205 +204 @@
     type: "js",
     path: "app/controllers/threadpage_controller.js?" + Math.random(),
-    requires: ['model', 'domainobject', 'view', 'controller', 'thread', 'factlet', 'threadfactletscontroller', 'factletsearchcontroller'],
+    requires: ['model', 'domainobject', 'view', 'controller', 'thread', 'factlet', 'threadfactletsview', 'factletsearchview'],
     varName: "ThreadPageController"
 });

microfacts/public/test/index.html

@@ -56 +56 @@
   <!-- views -->
   <script type="text/javascript" src="spec/view_spec.js?123"></script>
-  <script type="text/javascript" src="spec/threadfactletscontroller_spec.js?123"></script>
-  <script type="text/javascript" src="spec/factletsearch_controller_spec.js?123"></script>
+  <script type="text/javascript" src="spec/threadfactletsview_spec.js?123"></script>
+  <script type="text/javascript" src="spec/factletsearchview_spec.js?123"></script>
 
   <script type="text/javascript" src="spec/mapview_spec.js?123"></script>

microfacts/public/test/spec/factletsearchview_spec.js

@@ -25 +25 @@
 
 
-describe('FactletSearchController', {
+describe('FactletSearchView', {
 
     before_each: function () {
         var elem = $('factlet-search');
-        ctrl = new FactletSearchController(elem);
+        ctrl = new FactletSearchView(elem);
     },
 

microfacts/public/test/spec/threadfactletsview_spec.js

@@ -36 +36 @@
 
 
-describe('ThreadFactletsController', {
+describe('ThreadFactletsView', {
 
     before_each: function () {
         var elem = $$('.thread-factlets')[0];
-        ctrl = new ThreadFactletsController(elem);
+        ctrl = new ThreadFactletsView(elem);
     },