As a developer I want to improve Playlist playback

avalonmediasystem · May 16, 2016 · 4412c00 · 4412c00
1 parent 0a0dc5d
commit 4412c00
Show file tree

Hide file tree

Showing 7 changed files with 47 additions and 48 deletions.
diff --git a/app/assets/stylesheets/avalon.css.scss b/app/assets/stylesheets/avalon.css.scss
@@ -1062,7 +1062,6 @@ h5.panel-title {
 }
 .side-playlist{
   border-top:1px solid #ddd;
-  border-bottom:1px solid #ddd;
   li {
     float:left;
     width:100%;
@@ -1080,7 +1079,6 @@ h5.panel-title {
 }
 .playlist-title {
   width:100%;
-  float:left;
   border-bottom:1px solid #ddd;
   line-height:2em;
   .glyphicon {

diff --git a/app/views/playlists/_current_item.html.erb b/app/views/playlists/_current_item.html.erb
@@ -15,14 +15,14 @@ Unless required by applicable law or agreed to in writing, software distributed
 %>
 <section id="metadata">
 <div id="metadata_header">
-  <legend>
+  <h3>
     <% unless @current_mediaobject.title.blank? %>
       <%= @current_mediaobject.title %>
     <% else %>
       <%= @current_mediaobject.pid %>
     <% end %>
     <%= "/ #{@current_mediaobject.statement_of_responsibility}" if @current_mediaobject.statement_of_responsibility.present? %>
-  </legend>
+  </h3>
 </div>
 
 <dl id="creation_metadata">
@@ -50,10 +50,4 @@ Unless required by applicable law or agreed to in writing, software distributed
   <%= display_metadata('Other Identifier', display_other_identifiers(@current_mediaobject)) %>
 
 </dl>
-<% if can? :inspect, @current_mediaobject %>
-  <%= link_to 'View Raw Metadata', inspect_media_object_path(@current_mediaobject.pid, 'descMetadata'), :target => 'blank', :class => "btn btn-default btn-small" %>
-  <%= link_to 'View Fedora Objects', tree_media_object_path(@current_mediaobject.pid), :id => 'show_object_tree', :target => 'blank', :class => "btn btn-default btn-small" %>
-  <div id="object_tree" data-src="<%=tree_media_object_path(@current_mediaobject.pid)%>">
-  </div>
-<% end %>
 </section>
diff --git a/app/views/playlists/_item_list.html.erb b/app/views/playlists/_item_list.html.erb
@@ -13,20 +13,28 @@ Unless required by applicable law or agreed to in writing, software distributed
   specific language governing permissions and limitations under the License.
 ---  END LICENSE_HEADER BLOCK  ---
 %>
-
- <h3 class="playlist-title"> <span class="glyphicon glyphicon-lock"></span> Playlist</h3> 
+<% if current_ability.can? :edit, @playlist %>
  <div class="btn-group pull-right">
-   <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-     Actions <span class="caret"></span>
-   </button>
-   <ul class="dropdown-menu pull-right">
-     <li><a class="md-icon-container"><i class="material-icons md-18">playlist_play</i>Play Playlist</a></li>
-     <li><a class="md-icon-container"><i class="material-icons md-18">info_outline</i>Playlist Details</a></li>
-     <li><a class="md-icon-container"><i class="material-icons md-18">mode_edit</i>Edit Playlist</a></li>
-     <li role="separator" class="divider"></li>
-     <li><a class="md-icon-container"><i class="material-icons md-18">content_copy</i>Clone Playlist</a></li>
-   </ul>
+  <%= link_to edit_playlist_path(@playlist) do %>
+    <button type="button" class="btn btn-default" style="display:block;" >
+      <span class="fa fa-edit"> Edit Playlist</span>
+    </button>
+  <% end %>
  </div>
- <ol class="side-playlist">
-   <%= render partial: 'playlist_item', collection: @playlist.items, locals: { annotations: @playlist.annotations } %>
- </ol>
+<% end %>
+<h3 class="playlist-title">
+  <% if @playlist.visibility=='private' %>
+    <span class="fa fa-lock" alt="<%= t('playlist.lockAltText') %>" title="<%= t('playlist.lockAltText') %>"></span>
+  <% else %>
+    <span class="fa fa-unlock-alt" alt="<%= t('playlist.unlockAltText') %>" title="<%= t('playlist.unlockAltText') %>"></span>
+  <% end %>
+  <%= @playlist.title %>
+</h3>
+<% if @playlist.comment.present? %>
+  <div class="playlist-description">
+    <%= @playlist.comment %>
+  </div>
+<% end %>
+<ol class="side-playlist">
+  <%= render partial: 'playlist_item', collection: @playlist.items, locals: { annotations: @playlist.annotations } %>
+</ol>
diff --git a/app/views/playlists/_player.html.erb b/app/views/playlists/_player.html.erb
@@ -71,7 +71,8 @@ Unless required by applicable law or agreed to in writing, software distributed
     avalonPlayer = new AvalonPlayer($('#left_column'), <%= @currentStreamInfo.to_json.html_safe %>, {
       audioHeight: <%= MasterFile::AUDIO_HEIGHT %>,
       mobileDisplayedDuration: <%= @currentStream ? (@currentStream.duration.to_f / 1000).round : -1 %>,
-      thumbnailSelector: 'false',
+      thumbnailSelector: false,
+      addToPlaylist: false,
       startQuality: '<%= current_quality(@currentStreamInfo) %>',
       customError: '<%= t("media_objects.player.customError").html_safe %>'
     })

diff --git a/app/views/playlists/_playlist_item.html.erb b/app/views/playlists/_playlist_item.html.erb
@@ -1,12 +1,15 @@
 <% annotation = AvalonAnnotation.find(@playlist.items[playlist_item_counter].annotation_id) %>
-<% item_class = (@playlist.items[playlist_item_counter] == @current_playlist_item)? 'now_playing' : 'queue' %>
-<% item_type = (annotation.master_file.file_format=='Moving image')? 'glyphicon-film' : 'glyphicon-music' %> 
+<% item = @playlist.items[playlist_item_counter] %>
+<% item_class = (item == @current_playlist_item)? 'now_playing' : 'queue' %>
+<% item_type = (annotation.master_file.file_format=='Moving image')? 'fa-film' : 'fa-music' %> 
 <li class="<%= item_class %>">
   <% if item_class == 'now_playing' %>
-    <a href="#" class="md-icon-container"><i class="material-icons md-18">equalizer</i>
+    <i class="fa fa-arrow-circle-right"></i>
   <% else %>
     <a href="#">
   <% end %>
-  <%= annotation.title %></a> 
-  <span class="pull-right"> <span class="glyphicon <%= item_type %>"></span> <%= annotation.duration %></span>
+  <%= link_to playlist_path(@playlist, position: item.position) do %>
+    <%= annotation.title %></a> 
+  <% end %>
+  <span class="pull-right"> <span class="fa <%= item_type %>"></span> <%= annotation.duration %></span>
 </li>
diff --git a/app/views/playlists/show.html.erb b/app/views/playlists/show.html.erb
@@ -20,7 +20,6 @@ Unless required by applicable law or agreed to in writing, software distributed
 <% @current_masterfile = MasterFile.find(@current_playlist_item.annotation.source.split('/').last) %>
 <% @current_mediaobject = MediaObject.find(@current_masterfile.mediaobject_id) %>
 <div class="playlist-view container-fluid" >
-  <p id="notice"><%= notice %></p>
   <div class="container-fluid" >
     <div class="row">
       <div class="col-sm-8" id="left_column">
@@ -29,38 +28,31 @@ Unless required by applicable law or agreed to in writing, software distributed
           <div class="panel panel-default">
             <div class="panel-heading" role="tab" id="heading0" style="border-bottom: 1px solid #ddd;">
               <h4 class="panel-title">
-                <span class="now-playing-title"> <i class="material-icons md-hdr">equalizer</i> <%= @current_annotation.title %> <span>[<%= @current_annotation.duration %>]</span></span>
-	        <button class="btn btn-primary btn-xs" id="expand_button">Expand All</button>
-	        <button class="btn btn-primary btn-xs hidden" id="collapse_button">Collapse All</button>
+                <%= link_to media_object_path(@current_mediaobject) do %>
+                  <span><%= @current_annotation.title %></span>
+                <% end %>
+                <span>[<%= @current_annotation.duration %>]</span>
 	        <br class="clear"/>
               </h4>
+              <div>
+                <%= @current_annotation.comment %>
+              </div>
             </div>
             <div class="panel-heading" role="tab" id="heading2">
               <h5 class="panel-title ">
-                <a href="#" class="pull-left" data-toggle="collapse"  data-toggle="collapse" data-target="#section2" aria-expanded="false" aria-controls="collapse2"><i class="indicator glyphicon glyphicon-chevron-down  pull-left"></i>Details</a>  </span>
+                <a href="#" class="pull-left" data-toggle="collapse"  data-toggle="collapse" data-target="#section2" aria-expanded="false" aria-controls="collapse2"><i class="indicator glyphicon glyphicon-chevron-down  pull-left"></i>Mediaobject Details</a>  </span>
               </h5>
             </div>
             <div id="section2" class="panel-collapse collapse collapsed" role="tabpanel" aria-labelledby="heading2">
               <div class="panel-body">
                 <%= render 'current_item' %>
               </div>
             </div>
-            <div class="panel-heading" role="tab" id="heading0">
-              <h5 class="panel-title ">
-                <a href="#"  class="pull-left" data-toggle="collapse"  data-toggle="collapse" data-target="#section0" aria-expanded="true" aria-controls="collapse0"><i class="indicator glyphicon glyphicon-chevron-down  pull-left"></i>Master File</a>
-                <span class="pull-right">[<%= Time.at(@current_masterfile.duration.to_i/1000).utc.strftime(@current_masterfile.duration.to_i/1000<3600?'%M:%S':'%H:%M:%S') %>]</span>
-              </h5>
-            </div>
-            <div id="section0" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading0">
-              <div class="panel-body">
-                <%= render 'current_masterfile' %>
-              </div>
-            </div>
             <% @related_annotations = @playlist.related_annotations_time_contrained(@current_playlist_item)%>
             <% unless @related_annotations.empty? %>
               <div class="panel-heading" role="tab" id="heading1">
                 <h5 class="panel-title ">
-                  <a href="#"  class="pull-left" data-toggle="collapse"  data-toggle="collapse" data-target="#section1" aria-expanded="true" aria-controls="collapse1"><i class="indicator glyphicon glyphicon-chevron-down  pull-left"></i>Related</a>
+                  <a href="#" class="pull-left" data-toggle="collapse"  data-toggle="collapse" data-target="#section1" aria-expanded="true" aria-controls="collapse1"><i class="indicator glyphicon glyphicon-chevron-down  pull-left"></i>Related</a>
                 </h5>
               </div>
               <div id="section1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="heading1">

diff --git a/config/locales/en.yml b/config/locales/en.yml
@@ -181,5 +181,8 @@ en:
       title: '%{media_object_title} - %{application_name}'
     player:
       customError: 'Your browser requires Adobe Flash Player in order to play this item. For more information, see <a href="https://helpx.adobe.com/flash-player.html" target="_blank">Adobe Flash Player Help</a>.'
+
   playlist:
     ago: "%{time} ago"
+    lockAltText: "This playlist is private."
+    unlockAltText: "This playlist is public."