/discours and /chrono design changes
authorChloe Laisne <chloe.laisne@gmail.com>
Sun, 03 Jul 2016 13:13:10 +0200
changeset 216 c174124d1849
parent 215 82878d132784
child 217 989b9c36b849
/discours and /chrono design changes Playlist-component error when no items returned
cms/app-client/app/components/discourses-component.js
cms/app-client/app/components/playlist-component.js
cms/app-client/app/helpers/if-and.js
cms/app-client/app/styles/app.scss
cms/app-client/app/styles/components/filter-component.scss
cms/app-client/app/styles/components/playlist-component.scss
cms/app-client/app/styles/tabs/chrono.scss
cms/app-client/app/templates/components/filter-component.hbs
cms/app-client/app/templates/components/visu-chrono.hbs
--- a/cms/app-client/app/components/discourses-component.js	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/components/discourses-component.js	Sun Jul 03 13:13:10 2016 +0200
@@ -14,9 +14,8 @@
     didRender: function() {
         var self = this;
         var baseURL = env.baseURL.replace(/\/$/,"")+'/api/v1';
-
+        
         d3.json(baseURL + "/discourses", function(discourses) {
-
             var width = self.$().parent().width();
             var height = self.$().parent().height() - self.$().siblings().height();
 
@@ -31,7 +30,6 @@
 
             var caption = element.append("div")
                 .attr("class", "caption");
-
             var caption_nodes = caption.selectAll(".node")
                 .data(bubbles);
 
@@ -46,7 +44,6 @@
                 .on('click', function(d) {
                     self.get('filter').set('discourse', d.id);
                 });
-            
             item.append("span")
                 .text(function(d) { return d.name; })
                 .style("display", function(d) { return d.children ? 'none' : 'inline-block'; })
@@ -61,7 +58,6 @@
 
             var svg_nodes = svg.selectAll(".node")
                 .data(bubbles);
-
             svg_nodes.enter().append("g")
                 .attr("class", function(d) { return "node" + (!d.children ? " leaf" : ""); })
                 .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
@@ -74,8 +70,7 @@
             leaf.append("circle")
                 .attr("r", function(d) { return Math.max(7.5 + d.r * 2, d.r * 2); })
                 .attr("fill", function(d) { return d.fill; })
-                .attr("stroke", function() { return "#13212d"; });
-
+                .attr("stroke", function() { return "#859097"; });
             element.style("height", height + "px");
         });
 
--- a/cms/app-client/app/components/playlist-component.js	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/components/playlist-component.js	Sun Jul 03 13:13:10 2016 +0200
@@ -38,8 +38,9 @@
         this.get('player').set('items', this.get('documents').map(function(document) {
             return document.get('id');
         }));
-
-        this.get('player').set('item', this.get('player').get('items')[0]);
+        if(this.get('player').get('items').length) {
+            this.get('player').set('item', this.get('player').get('items')[0]);    
+        }
     }).on('init'),
 
     init: function() {
--- a/cms/app-client/app/helpers/if-and.js	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/helpers/if-and.js	Sun Jul 03 13:13:10 2016 +0200
@@ -1,7 +1,7 @@
 import Ember from 'ember';
 
 export function ifAnd(params) {
-  return params[0] && params[1];
+  return params.every(element => element === true);
 }
 
 export default Ember.Helper.helper(ifAnd);
--- a/cms/app-client/app/styles/app.scss	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/styles/app.scss	Sun Jul 03 13:13:10 2016 +0200
@@ -37,24 +37,25 @@
 }
 
 h2 {
-    color: #ffffff;
     text-transform: uppercase;
-    font-size: 14px;
     text-align: center;
 }
 
-body.tabs-discours h2 {
-    color: #59626b;
-}
-
 .corpus-app-container {
     color: #687a84;
     box-sizing: border-box;
+    background-color: #becfd4;
+}
+
+.corpus-app-container h2 {
+    padding: 15px;
+    font-size: 13px;
+    color: #253946;    
 }
 
 body.tabs-discours .corpus-app-container,
 body.tabs-chrono .corpus-app-container {
-    padding: 20px;
+    padding: 0px 20px;
 }
 
 body.tabs-thematiques .corpus-app-container {
@@ -65,12 +66,6 @@
     padding: 0px;
 }
 
-body.tabs-carto .corpus-app-container,
-body.tabs-chrono .corpus-app-container,
-body.tabs-thematiques .corpus-app-container {
-    background-color: #becfd4;
-}
-
 .corpus-app-wrapper {
     background-color: #253946;
     box-shadow: -4px 0px 8px -4px #59626b;
--- a/cms/app-client/app/styles/components/filter-component.scss	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/styles/components/filter-component.scss	Sun Jul 03 13:13:10 2016 +0200
@@ -5,6 +5,7 @@
 
 .filter-component h2 {
     color: #ffffff;
+    font-size: 13px;
 }
 
 .filter-component ul {
--- a/cms/app-client/app/styles/components/playlist-component.scss	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/styles/components/playlist-component.scss	Sun Jul 03 13:13:10 2016 +0200
@@ -5,9 +5,10 @@
 .playlist-component h2 {
     line-height: 40px;
     text-transform: none;
-    padding: 0px 20px;
+    padding: 0px 15px;
     text-align: left;
     color: #ffffff;
+    font-size: 13px;
 }
 
 .playlist-component ul {
--- a/cms/app-client/app/styles/tabs/chrono.scss	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/styles/tabs/chrono.scss	Sun Jul 03 13:13:10 2016 +0200
@@ -1,5 +1,5 @@
 #chrono-table{
-    margin-top: 20px;
+    margin-top: 40px;
     line-height: 40px;
 }
 
@@ -7,6 +7,15 @@
     margin-bottom: 5px;
 }
 
+#chrono-table .tens {
+    color: #71848d;
+    font-size: 13px;
+}
+
+#chrono-table .tens::after {
+    content: ' -';
+}
+
 #chrono-table ul {
     margin: 0px;
     padding: 0px;
--- a/cms/app-client/app/templates/components/filter-component.hbs	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/templates/components/filter-component.hbs	Sun Jul 03 13:13:10 2016 +0200
@@ -1,20 +1,22 @@
 <h2>Filtres</h2>
+{{#if (ifOr filter.location filter.language filter.discourse filter.date filter.theme)}}
 <ul>
-{{#if filter.location}}
+	{{#if filter.location}}
     <li class="filter location">{{filter.location}}<span class="remove"{{action 'removeFilter' 'location'}}>&#10005;</span></li>
-{{/if}}
-{{#if filter.language}}
+	{{/if}}
+	{{#if filter.language}}
     <li class="filter language">{{doc-language class="label" url=filter.language}}<span class="remove"{{action 'removeFilter' 'language'}}>&#10005;</span></li>
-{{/if}}
-{{#if filter.discourse}}
-<li class="filter discourse">{{filter.discourse}}<span class="remove"{{action 'removeFilter' 'discourse'}}>&#10005;</span></li>
-{{/if}}
-{{#if filter.date}}
+	{{/if}}
+	{{#if filter.discourse}}
+	<li class="filter discourse">{{filter.discourse}}<span class="remove"{{action 'removeFilter' 'discourse'}}>&#10005;</span></li>
+	{{/if}}
+	{{#if filter.date}}
     {{#each intervals as |interval| }}
     <li class="filter date" data-dates="{{interval}}">{{interval interval}}<span class="remove"{{action 'removeFilter' 'date' interval }}>&#10005;</span></li>
     {{/each}}
-{{/if}}
-{{#if filter.theme}}
+	{{/if}}
+	{{#if filter.theme}}
     <li class="filter theme">{{filter.theme}}<span class="remove"{{action 'removeFilter' 'theme'}}>&#10005;</span></li>
-{{/if}}
-</ul>
\ No newline at end of file
+	{{/if}}
+</ul>
+{{/if}}
\ No newline at end of file
--- a/cms/app-client/app/templates/components/visu-chrono.hbs	Fri Jul 01 22:15:35 2016 +0200
+++ b/cms/app-client/app/templates/components/visu-chrono.hbs	Sun Jul 03 13:13:10 2016 +0200
@@ -1,5 +1,5 @@
 <div class="interval">
-    1960 -
+    <span class="tens">1960</span>
     <ul class="1960">
         <li title="1960" id="1960">0</li>
         <li title="1961" id="1961">1</li>
@@ -14,7 +14,7 @@
     </ul>
 </div>
 <div class="interval">
-    1970 -
+    <span class="tens">1970</span>
     <ul class="1970">
         <li title="1970" id="1970">0</li>
         <li title="1971" id="1971">1</li>
@@ -29,7 +29,7 @@
     </ul>
 </div>
 <div class="interval">
-    1980 -
+    <span class="tens">1980</span>
     <ul class="1980">
         <li title="1980" id="1980">0</li>
         <li title="1981" id="1981">1</li>
@@ -44,7 +44,7 @@
     </ul>
 </div>
 <div class="interval">
-    1990 -
+    <span class="tens">1990</span>
     <ul class="1990">
         <li title="1990" id="1990">0</li>
         <li title="1991" id="1991">1</li>
@@ -59,7 +59,7 @@
     </ul>
 </div>
 <div class="interval">
-    2000 -
+    <span class="tens">2000</span>
     <ul class="2000">
         <li title="2000" id="2000">0</li>
         <li title="2001" id="2001">1</li>
@@ -74,7 +74,7 @@
     </ul>
 </div>
 <div class="interval">
-    2010 -
+    <span class="tens">2010</span>
     <ul class="2010">
         <li title="2010" id="2010">0</li>
         <li title="2011" id="2011">1</li>