Fix notice/transcript display when adding filter from notice, switching from playlist, toolbar, and player
authorChloe Laisne <chloe.laisne@gmail.com>
Sun, 16 Oct 2016 22:23:31 +0530
changeset 338 4a3899b6a7ed
parent 337 2ea18460d5e3
child 339 766af1228b05
Fix notice/transcript display when adding filter from notice, switching from playlist, toolbar, and player
cms/app-client/app/components/notice-component.js
cms/app-client/app/components/playlist-component.js
cms/app-client/app/controllers/application.js
cms/app-client/app/router.js
cms/app-client/app/routes/tabs/carto.js
cms/app-client/app/routes/tabs/chrono.js
cms/app-client/app/routes/tabs/discours.js
cms/app-client/app/routes/tabs/thematiques.js
cms/app-client/app/services/player.js
cms/app-client/app/styles/components/notice-component.scss
cms/app-client/app/styles/components/playlist-component.scss
cms/app-client/app/styles/components/toolbar-component.scss
cms/app-client/app/templates/components/notice-component.hbs
cms/app-client/app/templates/components/playlist-component.hbs
--- a/cms/app-client/app/components/notice-component.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/components/notice-component.js	Sun Oct 16 22:23:31 2016 +0530
@@ -3,6 +3,7 @@
 export default Ember.Component.extend({
 
     player: Ember.inject.service(),
+    filter: Ember.inject.service(),
 
     classNames: ['notice-component'],
 
@@ -57,6 +58,18 @@
             }
         }
         return location;
-    })
+    }),
+
+    actions: {
+
+        addThemeFilter: function(id) {
+            this.get('filter').set('theme', id);
+        },
+
+        addLanguageFilter: function(id) {
+            this.get('filter').set('language', id);
+        }
+
+    }
 
 });
--- a/cms/app-client/app/components/playlist-component.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/components/playlist-component.js	Sun Oct 16 22:23:31 2016 +0530
@@ -64,14 +64,10 @@
         },
 
         displayNotice: function(id) {
-            if(this.get('player').get('item') === id) {
+            if(this.get('player').get('window') !== 'notice') {
                 this.get('player').displayMetadata('notice');
             } else {
-                if(this.get('notice') !== id) {
-                    this.set('notice', id);
-                } else {
-                    this.set('notice', null);
-                }
+                this.get('player').displayMetadata(false);
             }
 
         }
--- a/cms/app-client/app/controllers/application.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/controllers/application.js	Sun Oct 16 22:23:31 2016 +0530
@@ -22,7 +22,9 @@
 
     filter: Ember.inject.service(),
     setFilter: Ember.observer('discourse', 'language', 'location', 'theme', function(sender, key) {
-        this.get('filter').set(key, this.get(key));
+        if(this.get('filter').get(key) !== this.get(key)) {
+            this.get('filter').set(key, this.get(key));    
+        }
     }),
     filterObserver: Ember.observer('filter.discourse', 'filter.language', 'filter.location', 'filter.theme', function(sender, key) {
         key = key.split('.').pop();
--- a/cms/app-client/app/router.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/router.js	Sun Oct 16 22:23:31 2016 +0530
@@ -10,9 +10,11 @@
 
     didTransition:function() {
     	this.get('player').toggleVideoscreen(false);
-    	this.get('player').displayMetadata(false);
+    	this.get('player').displayMetadata(this.get('player').get('window'));
+
     	this._super(...arguments);
     }
+
 });
 
 Router.map(function() {
--- a/cms/app-client/app/routes/tabs/carto.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/routes/tabs/carto.js	Sun Oct 16 22:23:31 2016 +0530
@@ -3,6 +3,7 @@
 export default Ember.Route.extend({
 
     constants: Ember.inject.service(),
+    player: Ember.inject.service(),
 
     modelQueryParam: '',
 
@@ -19,6 +20,10 @@
         });
     },
 
+    activate: function() {
+        this.get('player').set('window', false);
+    },
+
     deactivate: function () {
         this.set('modelQueryParam', this.get('constants').GEONAMES['world']);
     },
--- a/cms/app-client/app/routes/tabs/chrono.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/routes/tabs/chrono.js	Sun Oct 16 22:23:31 2016 +0530
@@ -1,4 +1,11 @@
 import Ember from 'ember';
 
 export default Ember.Route.extend({
+
+	player: Ember.inject.service(),
+
+    activate: function() {
+        this.get('player').set('window', false);
+    }
+
 });
--- a/cms/app-client/app/routes/tabs/discours.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/routes/tabs/discours.js	Sun Oct 16 22:23:31 2016 +0530
@@ -1,4 +1,11 @@
 import Ember from 'ember';
 
 export default Ember.Route.extend({
+
+	player: Ember.inject.service(),
+	
+	activate: function() {
+        this.get('player').set('window', false);
+    }
+
 });
\ No newline at end of file
--- a/cms/app-client/app/routes/tabs/thematiques.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/routes/tabs/thematiques.js	Sun Oct 16 22:23:31 2016 +0530
@@ -2,6 +2,8 @@
 
 export default Ember.Route.extend({
 
+    player: Ember.inject.service(),
+
     index: 0,
     limit: 40,
     sort: 'alphabetical',
@@ -33,6 +35,10 @@
         this.set('themes', []);
     },
 
+    activate: function() {
+        this.get('player').set('window', false);
+    },
+
     actions: {
 
         setIndexQueryparams: function() {
--- a/cms/app-client/app/services/player.js	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/services/player.js	Sun Oct 16 22:23:31 2016 +0530
@@ -20,12 +20,16 @@
         if(el === 'video') {
             this.toggleVideoscreen();
         } else {
-            this.displayMetadata(el);
+            if(this.get('window') !== el) {
+                this.displayMetadata(el);
+            } else {
+                this.displayMetadata(false);
+            }
         }
     },
 
     displayMetadata: function(el) {
-         if(this.get('window') !== el) {
+         if(typeof el !== 'undefined') {
             this.set('window', el);
         } else {
             this.set('window', false);
--- a/cms/app-client/app/styles/components/notice-component.scss	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/styles/components/notice-component.scss	Sun Oct 16 22:23:31 2016 +0530
@@ -7,11 +7,27 @@
     color: $dark-grey;
 }
 
-.notice-component a {
+.notice-component a.fa {
+    text-decoration: none;
+    color: inherit;
+    font-size: 0px;
+    margin-left: 5px;
+}
+
+.notice-component a.fa:before {
+    font-size: 12px;
+}
+
+.notice-component .action {
+    cursor: pointer;
+}
+
+.notice-component a.doc-link-bnf, 
+.notice-component a.doc-link-lexvo {
     cursor: pointer;
     color: $dark-grey;
     text-decoration: none;
-    border-bottom: 1px dashed $dark-grey;
+    pointer-events: none;
 }
 
 .notice-component .language a {
--- a/cms/app-client/app/styles/components/playlist-component.scss	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/styles/components/playlist-component.scss	Sun Oct 16 22:23:31 2016 +0530
@@ -80,6 +80,7 @@
     color: $light-white;
 }
 
+.playlist-component ul li .tools .fa.active,
 .playlist-component ul li.playing .tools .notice.active,
 .playlist-component ul li.playing .tools .notice:hover,
 .playlist-component ul li.playing .tools .fa:hover {
--- a/cms/app-client/app/styles/components/toolbar-component.scss	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/styles/components/toolbar-component.scss	Sun Oct 16 22:23:31 2016 +0530
@@ -32,5 +32,6 @@
 .toolbar-component ul li.active {
     border-left-color: $dark-blue;
     background-color: $light-white;
+    pointer-events: none;
     color: $dark-blue;
 }
\ No newline at end of file
--- a/cms/app-client/app/templates/components/notice-component.hbs	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/templates/components/notice-component.hbs	Sun Oct 16 22:23:31 2016 +0530
@@ -13,7 +13,7 @@
 </tr>
 <tr>
 	<td class="title">Langue</td>
-	<td>{{ doc-language url=item.language class="language"}}</td>
+	<td><span class="action" {{action 'addLanguageFilter' item.language}}>{{ doc-language url=item.language class="language"}}</span><a href="{{item.language}}" target="_blank" class="fa fa-share-square">Share</a></td>
 </tr>
 <tr>
 	<td class="title">Sujet{{#if (if-operator item.computedSubjects.length '>' 1)}}s{{/if}}</td>
@@ -22,9 +22,12 @@
 		{{#each subjects as |subject|}}
 			<li>
 			{{#if subject.url}}
-				<a href="{{subject.url}}" target="_blank">
-					{{#if subject.name}}{{subject.name}}{{else}}{{component (getLinkType subject.url) url=subject.url}}{{/if}}
-				</a>
+				{{#if subject.name}}
+					{{subject.name}}
+				{{else}}
+					<span class="action" {{action 'addThemeFilter' subject.url}}>{{component (getLinkType subject.url) url=subject.url}}</span>
+				{{/if}}
+				<a href="{{subject.url}}" target="_blank" class="fa fa-share-square">Share</a>
 			{{else}}
 				{{subject.name}}
 			{{/if}}
--- a/cms/app-client/app/templates/components/playlist-component.hbs	Sat Oct 15 20:02:09 2016 +0530
+++ b/cms/app-client/app/templates/components/playlist-component.hbs	Sun Oct 16 22:23:31 2016 +0530
@@ -5,7 +5,7 @@
         <div class="tools">
             <div>
             {{#if document.transcript_url}}
-                <i title="Transcript" class="fa fa-text-height{{if (ifOr (eq player.window 'transcript') (eq player.item document.id)) ' active'}}"{{action 'displayTranscript'}}>Transcript</i>
+                <i title="Transcript" class="fa fa-text-height{{if (ifAnd (eq player.window 'transcript') (eq player.item document.id)) ' active'}}"{{action 'displayTranscript'}}>Transcript</i>
             {{/if}}
             {{#if (ifAnd (eq player.playing true) (eq player.item document.id))}}
                 <i title="Pause" class="fa fa-pause" {{ action 'pause' }}>Pause</i>
@@ -14,7 +14,7 @@
             {{/if}}
             </div>
             <div>
-                <button title="Notice" {{action 'displayNotice' document.id bubbles=false}} class="notice{{if (ifOr (ifAnd (eq player.window 'notice') (eq player.item document.id)) (eq document.id notice)) ' active'}}">
+                <button title="Notice" {{action 'displayNotice' document.id}} class="notice{{if (ifOr (ifAnd (eq player.window 'notice') (eq player.item document.id)) (eq document.id notice)) ' active'}}">
                     Notice
                 </button>
                 <i title="Share notice" class="fa fa-share-alt">Share notice</i>