add click event on visu-carto and visu-langue and update the url with the selected element as filter parameter
authornowmad@nowmads-macbook-pro.local
Fri, 11 Dec 2015 13:13:47 +0100
changeset 51 70dff07a76ff
parent 50 182f46ea5a56
child 52 87b6a104de8e
add click event on visu-carto and visu-langue and update the url with the selected element as filter parameter
cms/app-client/app/components/visu-carto.js
cms/app-client/app/components/visu-langues.js
cms/app-client/app/controllers/application.js
cms/app-client/app/controllers/tabs/carto.js
cms/app-client/app/controllers/tabs/langues.js
cms/app-client/app/models/sound.js
cms/app-client/app/templates/tabs/carto.hbs
cms/app-client/app/templates/tabs/langues.hbs
--- a/cms/app-client/app/components/visu-carto.js	Thu Dec 10 17:04:51 2015 +0100
+++ b/cms/app-client/app/components/visu-carto.js	Fri Dec 11 13:13:47 2015 +0100
@@ -3,8 +3,11 @@
 export default Ember.Component.extend({
   // storage: Ember.inject.service(),
   didInsertElement: function(){
+    var _this = this;
+    console.log("maps : ", AmCharts.maps);
+
     console.log('test: ', this.get("query"));
-    
+
     this.get("query").map(item => {
   		console.log(item.get('name'));
   	});
@@ -120,7 +123,7 @@
         if (event.mapObject.id == "backButton") {
             handleGoHome();
         }
-        console.log(event.mapObject.title);
+        _this.sendAction('action', event.mapObject.title);
     }
 
     // monitor when home icon was clicked and also go to continents map
--- a/cms/app-client/app/components/visu-langues.js	Thu Dec 10 17:04:51 2015 +0100
+++ b/cms/app-client/app/components/visu-langues.js	Fri Dec 11 13:13:47 2015 +0100
@@ -2,6 +2,8 @@
 
 export default Ember.Component.extend({
   didInsertElement: function(){
+    var _this = this;
+
     var data = google.visualization.arrayToDataTable([
       ['Location', 'Parent', 'Market trade volume (size)', 'Market increase/decrease (color)'],
       ['Global',    null,     0,    0],
@@ -50,10 +52,6 @@
       ['Bwatoo (bwa)',	'Nouvelle-Calédonie',	4,	4]
     ]);
 
-
-
-
-
     var tree = new google.visualization.TreeMap(document.getElementById('chart_div'));
 
     tree.draw(data, {
@@ -64,5 +62,13 @@
       fontColor: 'black',
       showScale: true
     });
+
+    function selectHandler (){
+      console.log(data.getValue(tree.getSelection()[0].row, 0));
+      _this.sendAction('action', data.getValue(tree.getSelection()[0].row, 0));
+    }
+
+    google.visualization.events.addListener(tree, 'select', selectHandler);
+
   }
 });
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/controllers/application.js	Fri Dec 11 13:13:47 2015 +0100
@@ -0,0 +1,22 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  queryParams: ['location', 'langue'],
+  location: null,
+  langue: null,
+  filteredSounds: Ember.computed('location', 'langue', 'model', function() {
+    var location = this.get('location');
+    var langue = this.get('langue');
+    var sounds = this.get('model');
+
+    if (location) {
+      sounds = sounds.filterBy('location', location);
+    }
+
+    if (langue) {
+      sounds = sounds.filterBy('language', langue);
+    }
+
+    return sounds;
+  })
+});
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/controllers/tabs/carto.js	Fri Dec 11 13:13:47 2015 +0100
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    updateUrl: function(selection){
+      this.transitionToRoute({queryParams: {location: selection}});
+    }
+  }
+});
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/controllers/tabs/langues.js	Fri Dec 11 13:13:47 2015 +0100
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    updateUrl: function(selection){
+      this.transitionToRoute({queryParams: {langue: selection}});
+    }
+  }
+});
--- a/cms/app-client/app/models/sound.js	Thu Dec 10 17:04:51 2015 +0100
+++ b/cms/app-client/app/models/sound.js	Fri Dec 11 13:13:47 2015 +0100
@@ -2,6 +2,9 @@
 
 var Sound = DS.Model.extend({
   name: DS.attr('string'),
+  location: DS.attr('string'),
+  language: DS.attr('string'),
+  datetime: DS.attr('integer'),
   audio: DS.attr('url')
 });
 
@@ -10,24 +13,32 @@
     {
           id: 1,
           name: "Sound 1",
-          location: "france",
-          language: "alsacien",
+          location: "France",
+          language: "Alsacien",
           datetime: 1990,
           audio: "http://sound1.mp3"
       },
       {
           id: 2,
           name: "Sound 2",
-          location: "france",
-          language: "breton",
+          location: "France",
+          language: "Breton",
           datetime: 1965,
           audio: "http://sound2.mp3"
       },
       {
           id: 3,
           name: "Sound 3",
-          location: "spain",
-          language: "judeo-espagnol",
+          location: "Germany",
+          language: "Breton",
+          datetime: 1965,
+          audio: "http://sound2.mp3"
+      },
+      {
+          id: 4,
+          name: "Sound 4",
+          location: "Spain",
+          language: "Judéo-espagnol",
           datetime: 2002,
           audio: "http://sound3.mp3"
       }
--- a/cms/app-client/app/templates/tabs/carto.hbs	Thu Dec 10 17:04:51 2015 +0100
+++ b/cms/app-client/app/templates/tabs/carto.hbs	Fri Dec 11 13:13:47 2015 +0100
@@ -1,2 +1,2 @@
 <h2>Recherche par cartographie</h2>
-{{visu-carto query=model}}
+{{visu-carto action="updateUrl" query=model}}
--- a/cms/app-client/app/templates/tabs/langues.hbs	Thu Dec 10 17:04:51 2015 +0100
+++ b/cms/app-client/app/templates/tabs/langues.hbs	Fri Dec 11 13:13:47 2015 +0100
@@ -1,2 +1,2 @@
 <h2>Recherche par langues</h2>
-{{visu-langues}}
+{{visu-langues action="updateUrl" query=model}}