Merge pull request #2476 from samvera/collections-#1678-collections_a…

…dmin_show_page_updated Updates to Collections show page UI/layout
samvera · Jan 14, 2018 · 7f0c671 · 7f0c671
2 parents c4db7b0 + 4801093
commit 7f0c671
Show file tree

Hide file tree

Showing 20 changed files with 291 additions and 166 deletions.
diff --git a/app/assets/javascripts/hyrax/collections_forms.js b/app/assets/javascripts/hyrax/collections_forms.js
@@ -63,4 +63,8 @@ Blacklight.onLoad(function () {
     submitModalAjax(url, data);
   });
 
+  // Handle add a subcollection button click on the collections show page
+  $('.sub-collections-wrapper button.add-subcollection').on('click', function (e) {
+    $('#add-subcollection-modal-' + $(this).data('presenterId')).modal('show');
+  });
 });
diff --git a/app/assets/stylesheets/hyrax/_collections.scss b/app/assets/stylesheets/hyrax/_collections.scss
@@ -45,6 +45,10 @@ header {
 .actions-controls-collections {
   display: block;
   margin: 1em 0 0 1em;
+
+  .deposit-new-work-through-collection {
+    margin-bottom: 8px;
+  }
 }
 
 .label-default a:link,
@@ -62,13 +66,6 @@ div.view-type {
   padding-left: 0;
 }
 
-form.per_page {
-  fieldset {
-    margin-bottom: 1em;
-    padding-left: 0;
-  }
-}
-
 input.branding-logo-input,
 input.branding-banner-input {
   width: 250px;
@@ -137,6 +134,13 @@ button.branding-banner-remove:hover {
     .modal {
       text-align: left;
     }
+
+    &.collection-works-table {
+
+      .title-column {
+        width: 40%;
+      }
+    }
   }
 
   // Datatable overwrites
@@ -219,6 +223,92 @@ button.branding-banner-remove:hover {
       }
     }
   }
+
+  .side-arrows::after {
+    content: "»";
+    font-size: 18px;
+    line-height: 1;
+    padding-left: 3px;
+  }
+}
+
+// Admin show page
+.admin-show-page {
+
+  .panel-body > section {
+    border-top: 1px solid #efefef;
+    margin-bottom: 40px;
+
+    &:first-child {
+      border: 0;
+    }
+  }
+
+  .panel-heading {
+    vertical-align: middle;
+
+    .btn {
+      margin-left: 5px;
+    }
+  }
+
+  // This class wraps the collection title row, which includes labels plus show action buttons
+  .collection-title-row-wrapper {
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+
+    @media (max-width: 768px) {
+      display: block;
+    }
+
+    .collection-title-row-content {
+      align-items: center;
+      display: flex;
+
+      @media (max-width: 768px) {
+        display: block;
+        margin-bottom: 10px;
+
+        .btn {
+          display: block;
+          margin: 0 0 5px;
+          width: 100%;
+        }
+      }
+
+      .label {
+        margin: 0 5px;
+      }
+    }
+
+    .collection-title {
+      display: inline-block;
+      margin: 0;
+    }
+  }
+
+  .collection-description-wrapper {
+    section {
+      margin-bottom: 30px;
+    }
+  }
+
+  .parent-collections-count {
+    font-weight: bold;
+  }
+
+  // Search collections section
+  .collections-search-wrapper {
+    border: 0;
+  }
+
+  // Works section
+  .works-wrapper {
+    > div:first-of-type {
+      margin-bottom: 20px;
+    }
+  }
 }
 
 // Selector for Collections forms

diff --git a/app/assets/stylesheets/hyrax/_file-listing.scss b/app/assets/stylesheets/hyrax/_file-listing.scss
@@ -67,8 +67,15 @@ h4 .small {
   cursor: pointer;
 }
 
-.batch-info .sort-toggle {
-  height: 5.1em;
+.batch-info {
+
+  .sort-toggle {
+    height: 5.1em;
+
+    button {
+      margin-left: 10px;
+    }
+  }
 }
 
 .caret.up {

diff --git a/app/controllers/hyrax/my/works_controller.rb b/app/controllers/hyrax/my/works_controller.rb
@@ -12,7 +12,7 @@ def search_builder_class
 
       def index
         # The user's collections for the "add to collection" form
-        @user_collections = collections_service.search_results(:edit)
+        @user_collections = collections_service.search_results(:deposit)
 
         add_breadcrumb t(:'hyrax.controls.home'), root_path
         add_breadcrumb t(:'hyrax.dashboard.breadcrumbs.admin'), hyrax.dashboard_path

diff --git a/app/presenters/hyrax/collection_presenter.rb b/app/presenters/hyrax/collection_presenter.rb
@@ -84,7 +84,7 @@ def collection_type_badge
     end
 
     def user_can_nest_collection?
-      current_ability.can?(:deposit, id)
+      current_ability.can?(:deposit, solr_document)
     end
 
     def user_can_create_new_nest_collection?

diff --git a/app/views/hyrax/dashboard/collections/_collection_title.erb b/app/views/hyrax/dashboard/collections/_collection_title.erb
@@ -1,12 +1,16 @@
-<% presenter.title.each_with_index do |title, index| %>
-  <% if index == 0 %>
-    <span class="h2"><%= title %></span>
-
-    <%= presenter.permission_badge %>
-    <%= presenter.collection_type_badge %>
-
-    <%= render 'show_actions', presenter: presenter %>
-  <% else %>
-    <div class="h2"><%= title %></div>
+<section class="collection-title-row-wrapper">
+  <% presenter.title.each_with_index do |title, index| %>
+    <% if index == 0 %>
+      <div class="collection-title-row-content">
+        <h3 class="collection-title"><%= title %></h3>
+        <%= presenter.permission_badge %>
+        <%= presenter.collection_type_badge %>
+      </div>
+      <div class="collection-title-row-content">
+        <%= render 'show_actions', presenter: presenter %>
+      </div>
+    <% else %>
+      <h3><%= title %></h3>
+    <% end %>
   <% end %>
-<% end %>
+</section>
diff --git a/app/views/hyrax/dashboard/collections/_show_actions.html.erb b/app/views/hyrax/dashboard/collections/_show_actions.html.erb
@@ -1,16 +1,16 @@
 <h2 class="sr-only"><%= t('hyrax.collection.actions.header') %></h2>
-<% if can? :destroy, presenter.solr_document %>
-    <%= link_to t('hyrax.collection.actions.delete.label'),
-                hyrax.dashboard_collection_path(presenter),
-                title: t('hyrax.collection.actions.delete.desc'),
-                class: 'btn btn-danger pull-right',
-                data: { confirm: t('hyrax.collection.actions.delete.confirmation'),
-                        method: :delete } %>
+<% if can? :edit, presenter.solr_document %>
+    <%= link_to t('hyrax.collection.actions.edit.label'),
+                hyrax.edit_dashboard_collection_path(presenter),
+                title: t('hyrax.collection.actions.edit.desc'),
+                class: 'btn btn-primary',
+                data: { turbolinks: false } %>
 <% end %>
+
 <% if presenter.collection_type_is_nestable? %>
 <!-- The user should have deposit access to the parent and read access to the child (the collection we are already showing, so no test is necessary). -->
     <%= button_tag '',
-                  class: 'btn btn-default pull-right add-to-collection',
+                  class: 'btn btn-primary add-to-collection',
                   onclick: "$('#add-to-collection-modal-#{presenter.id}').modal('show');",
                   title: t("hyrax.collection.actions.nested_subcollection.desc"),
                   type: 'button',
@@ -19,10 +19,12 @@
                   <%= t('hyrax.collection.actions.nested_subcollection.button_label') %>
                 <% end %>
 <% end %>
-<% if can? :edit, presenter.solr_document %>
-    <%= link_to t('hyrax.collection.actions.edit.label'),
-                hyrax.edit_dashboard_collection_path(presenter),
-                title: t('hyrax.collection.actions.edit.desc'),
-                class: 'btn btn-default pull-right',
-                data: { turbolinks: false } %>
+
+<% if can? :destroy, presenter.solr_document %>
+    <%= link_to t('hyrax.collection.actions.delete.label'),
+                hyrax.dashboard_collection_path(presenter),
+                title: t('hyrax.collection.actions.delete.desc'),
+                class: 'btn btn-danger',
+                data: { confirm: t('hyrax.collection.actions.delete.confirmation'),
+                        method: :delete } %>
 <% end %>
diff --git a/app/views/hyrax/dashboard/collections/_show_add_items_actions.html.erb b/app/views/hyrax/dashboard/collections/_show_add_items_actions.html.erb
@@ -1,22 +1,25 @@
 <h2 class="sr-only"><%= t('hyrax.collection.actions.header') %></h2>
-<div class="actions-controls-collections">
-  <% if can? :edit, presenter.solr_document # TODO: Shouldn't this be :deposit -- dependency on participants %>
-    <%= link_to t('hyrax.collection.actions.add_existing_works.label'),
-                hyrax.my_works_path(add_works_to_collection: presenter.id),
-                title: t('hyrax.collection.actions.add_existing_works.desc'),
-                class: 'btn btn-default pull-right',
-                data: { turbolinks: false } %>
-
-    <% if @presenter.create_many_work_types? %>
-      <%= link_to t('hyrax.collection.actions.add_new_work.label'),
-                  '#',
-                  title: t('hyrax.collection.actions.add_new_work.desc'),
-                  data: { behavior: "select-work", target: "#worktypes-to-create", 'create-type' => 'single', add_works_to_collection: presenter.id },
-                  class: 'btn btn-default  pull-right'  %>
-    <% else # simple link to the first work type %>
-      <%= link_to t('hyrax.collection.actions.add_new_work.label'),
-                  new_polymorphic_path([main_app, @presenter.first_work_type], add_works_to_collection: presenter.id),
-                  class: 'btn btn-default  pull-right'  %>
-    <% end %>
+<div class="text-right">
+  <% if can? :deposit, presenter.solr_document %>
+    <div>
+      <% if @presenter.create_many_work_types? %>
+        <%= link_to t('hyrax.collection.actions.add_new_work.label'),
+                    '#',
+                    title: t('hyrax.collection.actions.add_new_work.desc'),
+                    data: { behavior: "select-work", target: "#worktypes-to-create", 'create-type' => 'single', add_works_to_collection: presenter.id },
+                    class: 'btn btn-primary deposit-new-work-through-collection'  %>
+      <% else # simple link to the first work type %>
+        <%= link_to t('hyrax.collection.actions.add_new_work.label'),
+                    new_polymorphic_path([main_app, @presenter.first_work_type], add_works_to_collection: presenter.id),
+                    class: 'btn btn-primary'  %>
+      <% end %>
+    </div>
+    <div>
+      <%= link_to t('hyrax.collection.actions.add_existing_works.label'),
+                  hyrax.my_works_path(add_works_to_collection: presenter.id),
+                  title: t('hyrax.collection.actions.add_existing_works.desc'),
+                  class: 'btn btn-link side-arrows',
+                  data: { turbolinks: false } %>
+    </div>
   <% end %>
 </div>
diff --git a/app/views/hyrax/dashboard/collections/_show_document_list.html.erb b/app/views/hyrax/dashboard/collections/_show_document_list.html.erb
@@ -1,10 +1,11 @@
-<table class="table table-striped">
+<table class="table table-striped collections-list-table collection-works-table">
   <caption class="sr-only">List of items in this collection</caption>
   <thead>
   <tr>
     <th>&nbsp;</th>
-    <th>Title</th>
-    <th>Date Uploaded</th>
+    <th class="title-column">Title</th>
+    <th>Date added</th>
+    <th>Owner</th>
     <th>Visibility</th>
     <% if current_user %>
       <th>Action</th>

diff --git a/app/views/hyrax/dashboard/collections/_show_document_list_row.html.erb b/app/views/hyrax/dashboard/collections/_show_document_list_row.html.erb
@@ -20,6 +20,7 @@
     </div>
   </td>
   <td class="text-center"><%= document.date_uploaded %> </td>
+  <td class="text-center"></td>
   <td class="text-center">
     <%= render_visibility_link(document) %>
   </td>

diff --git a/app/views/hyrax/dashboard/collections/_show_subcollection_actions.html.erb b/app/views/hyrax/dashboard/collections/_show_subcollection_actions.html.erb
@@ -1,26 +1,26 @@
 <% if presenter.collection_type_is_nestable? %>
   <!-- The user should have deposit access to the parent (the collection we are showing) and read access to the child -->
   <% if presenter.user_can_nest_collection? %>
-    <div class="actions-controls-collections">
-      <div class="sr-only"><% t('hyrax.collection.actions.nest_collections.desc') %></div>
-      <%= button_tag '',
-                    class: 'btn btn-default pull-right add-subcollection',
-                    onclick: "$('#add-subcollection-modal-#{presenter.id}').modal('show');",
-                    title: t('hyrax.collection.actions.nest_collections.desc'),
-                    type: 'button',
-                    data: { nestable: true,
-                            hasaccess: true } do %>
-                    <%= t('hyrax.collection.actions.nest_collections.button_label') %>
-                  <% end %>
-  <!-- The user should must have the ability to create a new collection of parent's type -->
-      <% if presenter.user_can_create_new_nest_collection? %>
-        <div class="sr-only"><% t('hyrax.collection.actions.add_new_nested_collection.desc') %></div>
-        <%= link_to t('hyrax.collection.actions.add_new_nested_collection.label'),
-          hyrax.dashboard_create_subcollection_under_path(parent_id: presenter.id),
-          title: t('hyrax.collection.actions.add_new_nested_collection.desc'),
-          class: 'btn btn-default pull-right',
-          data: { turbolinks: false } %>
-      <% end %>
+    <div class="text-right">
+      <div>
+        <div class="sr-only"><% t('hyrax.collection.actions.nest_collections.desc') %></div>
+        <%= button_tag t('hyrax.collection.actions.nest_collections.button_label'),
+              class: 'btn btn-primary add-subcollection',
+              title: t('hyrax.collection.actions.nest_collections.desc'),
+              data: { nestable: true,
+                      hasaccess: true,
+                      presenter_id: presenter.id } %>
+      </div>
+      <div>
+        <!-- The user should must have the ability to create a new collection of parent's type -->
+        <% if presenter.user_can_create_new_nest_collection? %>
+          <div class="sr-only"><% t('hyrax.collection.actions.add_new_nested_collection.desc') %></div>
+          <%= link_to t('hyrax.collection.actions.add_new_nested_collection.label'),
+            hyrax.dashboard_create_subcollection_under_path(parent_id: presenter.id),
+            title: t('hyrax.collection.actions.add_new_nested_collection.desc'),
+            class: 'btn btn-link side-arrows' %>
+        <% end %>
+      </div>
     </div>
   <% end %>
 <% end %>