bind chono visu with query parameters
authornowmad@nowmads-macbook-pro.local
Tue, 15 Dec 2015 17:21:05 +0100
changeset 54 5b2b161dd4ce
parent 53 30e7ac1ff04a
child 55 484c02a0e590
bind chono visu with query parameters
cms/app-client/app/components/visu-chrono.js
cms/app-client/app/controllers/tabs/chrono.js
cms/app-client/app/templates/components/visu-chrono.hbs
cms/app-client/app/templates/tabs/chrono.hbs
--- a/cms/app-client/app/components/visu-chrono.js	Tue Dec 15 17:20:27 2015 +0100
+++ b/cms/app-client/app/components/visu-chrono.js	Tue Dec 15 17:21:05 2015 +0100
@@ -2,27 +2,37 @@
 
 export default Ember.Component.extend({
   didInsertElement: function(){
+    var _this = this;
     var isMouseDown = false,
       isHighlighted;
-    $("#our_table li")
-      .mousedown(function () {
-        isMouseDown = true;
-        $(this).toggleClass("highlighted");
-        isHighlighted = $(this).hasClass("highlighted");
-        return false; // prevent text selection
-      })
-      .mouseover(function () {
-        if (isMouseDown) {
-          $(this).toggleClass("highlighted", isHighlighted);
-        }
-      })
-      .bind("selectstart", function () {
-        return false;
-      })
+    $("#our_table li").mousedown(function () {
+      isMouseDown = true;
+      $(this).toggleClass("highlighted");
+      isHighlighted = $(this).hasClass("highlighted");
+      _this.sendUpdate();
+      return false; // prevent text selection
+    }).mouseover(function () {
+      if (isMouseDown) {
+        $(this).toggleClass("highlighted", isHighlighted);
+        _this.sendUpdate();
+      }
+    }).bind("selectstart", function () {
+      return false;
+    })
 
-    $(document)
-      .mouseup(function () {
-        isMouseDown = false;
-      });
+    $(document).mouseup(function () {
+      isMouseDown = false;
+    });
+
+    console.log('test: ', this);
+    console.log(this.get('route'));
+    console.log(this.get('router.queryParams'));
+  },
+  sendUpdate: function(){
+    var dateQuery = $('.highlighted').map(function(index, elt) {
+      return parseInt($(elt).parent().attr('id')) + parseInt($(elt).html());
+    }).get().join(',');
+    dateQuery = (dateQuery == "") ? null : dateQuery;
+    this.sendAction('action', dateQuery);
   }
 });
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/controllers/tabs/chrono.js	Tue Dec 15 17:21:05 2015 +0100
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    updateUrl: function(selection){
+      this.transitionToRoute({queryParams: {date: selection}});
+    }
+  }
+});
--- a/cms/app-client/app/templates/components/visu-chrono.hbs	Tue Dec 15 17:20:27 2015 +0100
+++ b/cms/app-client/app/templates/components/visu-chrono.hbs	Tue Dec 15 17:21:05 2015 +0100
@@ -1,5 +1,5 @@
 <div cellpadding="0" cellspacing="0" id="our_table">
-  <ul> 1960 -
+  <ul id="1960"> 1960 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
@@ -11,7 +11,7 @@
     <li>8</li>
     <li>9</li>
   </ul>
-  <ul> 1970 -
+  <ul id="1970"> 1970 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
@@ -23,7 +23,7 @@
     <li>8</li>
     <li>9</li>
   </ul>
-  <ul> 1980 -
+  <ul id="1980"> 1980 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
@@ -35,7 +35,7 @@
     <li>8</li>
     <li>9</li>
   </ul>
-  <ul> 1990 -
+  <ul id="1990"> 1990 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
@@ -47,7 +47,7 @@
     <li>8</li>
     <li>9</li>
   </ul>
-  <ul> 2000 -
+  <ul id="2000"> 2000 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
@@ -59,7 +59,7 @@
     <li>8</li>
     <li>9</li>
   </ul>
-  <ul> 2010 -
+  <ul id="2010"> 2010 -
     <li>0</li>
     <li>1</li>
     <li>2</li>
--- a/cms/app-client/app/templates/tabs/chrono.hbs	Tue Dec 15 17:20:27 2015 +0100
+++ b/cms/app-client/app/templates/tabs/chrono.hbs	Tue Dec 15 17:21:05 2015 +0100
@@ -1,2 +1,2 @@
 <h2>Recherche par chronologie</h2>
-{{visu-chrono}}
+{{visu-chrono action="updateUrl" query=model}}