# HG changeset patch
# User Chloe Laisne <chloe.laisne@gmail.com>
# Date 1476467368 -7200
# Node ID 400719e1e9a882e6ffef8f73048d19ab467912d0
# Parent  7f5fd48fa6c2154b465ee4f833fe2e0cfc2c2b07
Add share notice button + Remove external notice

diff -r 7f5fd48fa6c2 -r 400719e1e9a8 cms/app-client/app/styles/components/playlist-component.scss
--- a/cms/app-client/app/styles/components/playlist-component.scss	Fri Oct 14 18:50:43 2016 +0200
+++ b/cms/app-client/app/styles/components/playlist-component.scss	Fri Oct 14 19:49:28 2016 +0200
@@ -47,9 +47,14 @@
     float: right;
     text-align: right;
     font-size: 0px;
+    margin-left: 20px;
 }
 
-.playlist-component ul li .tools button,
+.playlist-component ul li .tools > * {
+    clear: both;
+}
+
+.playlist-component ul li .tools .notice,
 .playlist-component ul li .tools .fa {
     border: 1px solid $dark-grey;
     cursor: pointer;
@@ -57,56 +62,53 @@
     pointer-events: all;
 }
 
-.playlist-component ul li.playing .tools button,
+.playlist-component ul li.playing .tools .notice,
 .playlist-component ul li.playing .tools .fa {
     border-color: $medium-blue;
 }
 
-.playlist-component ul li.notice .tools button,
+.playlist-component ul li.notice .tools .notice,
 .playlist-component ul li.notice .tools .fa {
     border-color: $dark-grey;
 }
 
-.playlist-component ul li .tools button.active,
-.playlist-component ul li .tools button:hover,
+.playlist-component ul li .tools .notice.active,
+.playlist-component ul li .tools .notice:hover,
 .playlist-component ul li .tools .fa:hover {
     background-color: $dark-grey;
     color: $light-white;
 }
 
-.playlist-component ul li.playing .tools button.active,
-.playlist-component ul li.playing .tools button:hover,
+.playlist-component ul li.playing .tools .notice.active,
+.playlist-component ul li.playing .tools .notice:hover,
 .playlist-component ul li.playing .tools .fa:hover {
     background-color: $medium-blue;
     color: $light-blue;
 }
 
-.playlist-component ul li.playing .tools button:hover,
+.playlist-component ul li.playing .tools .notice:hover,
 .playlist-component ul li.playing .tools .fa:hover {
     color: $light-blue;
 }
 
+.playlist-component ul li:not(.playing) .notice,
+.playlist-component ul li:not(.playing) .fa-share-alt,
 .playlist-component ul li:not(.playing) .fa-text-height {
     pointer-events: none;
     cursor: default;
     opacity: 0.5;
 }
 
-.playlist-component ul li .meta {
-    padding-right: 78px;
-}
-
 .playlist-component ul li .meta p {
     margin: 0;
 }
 
-.playlist-component ul li .tools button {
+.playlist-component ul li .tools .notice {
     font-size: 12px;
     background-color: transparent;
     line-height: 20px;
     padding: 0 10px;
     margin-top: 10px;
-    display: block;
     width: 68px;
 }
 
@@ -120,7 +122,8 @@
     display: inline-block;
 }
 
-.playlist-component ul li .tools .fa-play {
+.playlist-component ul li .tools .fa-play,
+.playlist-component ul li .tools .fa-pause {
     float: right;
 }
 
diff -r 7f5fd48fa6c2 -r 400719e1e9a8 cms/app-client/app/templates/application.hbs
--- a/cms/app-client/app/templates/application.hbs	Fri Oct 14 18:50:43 2016 +0200
+++ b/cms/app-client/app/templates/application.hbs	Fri Oct 14 19:49:28 2016 +0200
@@ -2,12 +2,6 @@
 
 <div class="corpus-window">
 
-    {{#if notice}}
-    <div class="corpus-app-modal">
-        {{ notice-component class="overlay" model=noticeModel }}
-    </div>
-    {{/if}}
-
     <div class="corpus-app-container{{if player.window ' window'}}">
     {{#if player.window}}
         {{#if (eq player.window 'notice')}}
diff -r 7f5fd48fa6c2 -r 400719e1e9a8 cms/app-client/app/templates/components/playlist-component.hbs
--- a/cms/app-client/app/templates/components/playlist-component.hbs	Fri Oct 14 18:50:43 2016 +0200
+++ b/cms/app-client/app/templates/components/playlist-component.hbs	Fri Oct 14 19:49:28 2016 +0200
@@ -3,15 +3,22 @@
     {{#each documents as |document| }}
     <li id="{{document.id}}" class="{{if (eq player.item document.id) 'playing'}}{{if (eq document.id notice) 'notice'}}" {{action 'select' document.id}}>
         <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>
             {{/if}}
             {{#if (ifAnd (eq player.playing true) (eq player.item document.id))}}
-                <i class="fa fa-pause" {{ action 'pause' }}>Pause</i>
+                <i title="Pause" class="fa fa-pause" {{ action 'pause' }}>Pause</i>
             {{else}}
-                <i class="fa fa-play" {{ action 'play' document.id }}>Play</i>
+                <i title="Play" class="fa fa-play" {{ action 'play' document.id }}>Play</i>
             {{/if}}
-            <button{{action 'displayNotice' document.id bubbles=false}} class="{{if (ifOr (ifAnd (eq player.window 'notice') (eq player.item document.id)) (eq document.id notice)) 'active'}}">Notice</button>
+            </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'}}">
+                    Notice
+                </button>
+                <i title="Share notice" class="fa fa-share-alt">Share notice</i>
+            </div>
         </div>
         <div class="meta">
             <p class="head">