add action helper on "thematique" click or input enter to set the "thematique" parameter
authornowmad@23.1.168.192.in-addr.arpa
Fri, 22 Jan 2016 11:14:11 +0100
changeset 96 719390899adf
parent 95 f7ab931581af
child 97 32c0f831de45
add action helper on "thematique" click or input enter to set the "thematique" parameter
cms/app-client/app/controllers/tabs/thematiques.js
cms/app-client/app/styles/tabs/thematiques.scss
cms/app-client/app/templates/tabs/thematiques.hbs
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/controllers/tabs/thematiques.js	Fri Jan 22 11:14:11 2016 +0100
@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+  actions: {
+    updateUrl: function(selection){
+      this.transitionToRoute({queryParams: {thematique: selection}});
+    }
+  }
+});
--- a/cms/app-client/app/styles/tabs/thematiques.scss	Fri Jan 22 10:35:52 2016 +0100
+++ b/cms/app-client/app/styles/tabs/thematiques.scss	Fri Jan 22 11:14:11 2016 +0100
@@ -36,6 +36,10 @@
   text-align: justify;
 }
 
+.tag-cloud span{
+  cursor: pointer;
+}
+
 .not-popular{
   font-size: 1em;
 }
--- a/cms/app-client/app/templates/tabs/thematiques.hbs	Fri Jan 22 10:35:52 2016 +0100
+++ b/cms/app-client/app/templates/tabs/thematiques.hbs	Fri Jan 22 11:14:11 2016 +0100
@@ -1,60 +1,60 @@
 <div class="search-box">
-  <input type="text" placeholder="Entrez un mot clé">
+  {{input type="text" placeholder="Entrez un mot clé" action="updateUrl"}}
 </div>
 
 <div class="tag-cloud">
-  <span class="popular">ipsum</span>
-  <span class="not-popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="popular">amet</span>
-  <span class="popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="very-popular">elit</span>
-  <span class="not-popular">Curabitur</span>
-  <span class="popular">non</span>
-  <span class="not-popular">ipsum</span>
-  <span class="very-popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="popular">amet</span>
-  <span class="popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="not-popular">elit</span>
-  <span class="popular">Curabitur</span>
-  <span class="not-popular">non</span>
-  <span class="popular">ipsum</span>
-  <span class="popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="not-popular">amet</span>
-  <span class="not-popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="very-popular">elit</span>
-  <span class="popular">Curabitur</span>
-  <span class="very-popular">non</span>
-  <span class="popular">ipsum</span>
-  <span class="not-popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="popular">amet</span>
-  <span class="popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="very-popular">elit</span>
-  <span class="not-popular">Curabitur</span>
-  <span class="popular">non</span>
-  <span class="not-popular">ipsum</span>
-  <span class="very-popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="popular">amet</span>
-  <span class="popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="not-popular">elit</span>
-  <span class="popular">Curabitur</span>
-  <span class="not-popular">non</span>
-  <span class="popular">ipsum</span>
-  <span class="popular">dolor</span>
-  <span class="not-popular">sit</span>
-  <span class="not-popular">amet</span>
-  <span class="not-popular">consectetur</span>
-  <span class="not-popular">adipiscing</span>
-  <span class="very-popular">elit</span>
-  <span class="popular">Curabitur</span>
-  <span class="very-popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="popular">ipsum</span>
+  <span {{action 'Url' 'dolor'}} class="not-popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="very-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="not-popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="not-popular">ipsum</span>
+  <span {{action 'updateUrl' 'dolor'}} class="very-popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="not-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="not-popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="popular">ipsum</span>
+  <span {{action 'updateUrl' 'dolor'}} class="popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="not-popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="not-popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="very-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="very-popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="popular">ipsum</span>
+  <span {{action 'updateUrl' 'dolor'}} class="not-popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="very-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="not-popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="not-popular">ipsum</span>
+  <span {{action 'updateUrl' 'dolor'}} class="very-popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="not-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="not-popular">non</span>
+  <span {{action 'updateUrl' 'ipsum'}} class="popular">ipsum</span>
+  <span {{action 'updateUrl' 'dolor'}} class="popular">dolor</span>
+  <span {{action 'updateUrl' 'sit'}} class="not-popular">sit</span>
+  <span {{action 'updateUrl' 'amet'}} class="not-popular">amet</span>
+  <span {{action 'updateUrl' 'consectetur'}} class="not-popular">consectetur</span>
+  <span {{action 'updateUrl' 'adipiscing'}} class="not-popular">adipiscing</span>
+  <span {{action 'updateUrl' 'elit'}} class="very-popular">elit</span>
+  <span {{action 'updateUrl' 'Curabitur'}} class="popular">Curabitur</span>
+  <span {{action 'updateUrl' 'non'}} class="very-popular">non</span>
 </div>