on page load, hilight the objects corresponding to the query params
authornowmad@23.1.168.192.in-addr.arpa
Fri, 18 Dec 2015 15:21:52 +0100
changeset 77 0889740f79c2
parent 76 32af4f9922c9
child 78 08765d161e96
on page load, hilight the objects corresponding to the query params
cms/app-client/app/components/visu-chrono.js
cms/app-client/app/templates/components/visu-chrono.hbs
--- a/cms/app-client/app/components/visu-chrono.js	Fri Dec 18 15:21:00 2015 +0100
+++ b/cms/app-client/app/components/visu-chrono.js	Fri Dec 18 15:21:52 2015 +0100
@@ -3,6 +3,11 @@
 export default Ember.Component.extend({
   didInsertElement: function(){
     var _this = this;
+
+    if (this.get('container').lookup('controller:application').date !== null){
+      this.highlightQuery(this.get('container').lookup('controller:application').date.split(','));
+    }
+
     var isMouseDown = false,
       isHighlighted;
     $("#our_table li").mousedown(function () {
@@ -30,5 +35,11 @@
     }).get().join(',');
     dateQuery = (dateQuery == "") ? null : dateQuery;
     this.sendAction('action', dateQuery);
+  },
+  highlightQuery: function(list){
+    list.map(function(elt, index){
+      var year = Math.floor(parseInt(elt)/10)*10;
+      $("#"+year+" ."+(parseInt(elt)-year)).toggleClass("highlighted", true);
+    });
   }
 });
--- a/cms/app-client/app/templates/components/visu-chrono.hbs	Fri Dec 18 15:21:00 2015 +0100
+++ b/cms/app-client/app/templates/components/visu-chrono.hbs	Fri Dec 18 15:21:52 2015 +0100
@@ -1,74 +1,74 @@
 <div cellpadding="0" cellspacing="0" id="our_table">
   <ul id="1960"> 1960 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
   <ul id="1970"> 1970 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
   <ul id="1980"> 1980 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
   <ul id="1990"> 1990 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
   <ul id="2000"> 2000 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
   <ul id="2010"> 2010 -
-    <li>0</li>
-    <li>1</li>
-    <li>2</li>
-    <li>3</li>
-    <li>4</li>
-    <li>5</li>
-    <li>6</li>
-    <li>7</li>
-    <li>8</li>
-    <li>9</li>
+    <li class="0">0</li>
+    <li class="1">1</li>
+    <li class="2">2</li>
+    <li class="3">3</li>
+    <li class="4">4</li>
+    <li class="5">5</li>
+    <li class="6">6</li>
+    <li class="7">7</li>
+    <li class="8">8</li>
+    <li class="9">9</li>
   </ul>
 </div>