Rebase, add toolbar, minor fixes css and JS

app/assets/javascripts/projects/index.js

@@ -385,9 +385,9 @@
     initEditProjectButton($('.panel-project'));
     initArchiveRestoreButton($('.panel-project'));
 
-    $('#projects-cards-view').on('click', '.project-card-selector', function() {
+    $('#cards-wrapper').on('click', '.card-selector', function() {
       var projectsToolbar = $('#projectsToolbar');
-      var projectCard = $(this).closest('.panel-project');
+      var projectCard = $(this).closest('.card');
       var projectId = projectCard.data('id');
       // Determine whether ID is in the list of selected project IDs
       var index = $.inArray(projectId, selectedProjects);
@@ -490,16 +490,9 @@
         sort: projectsViewSort
       },
       success: function(data) {
+        viewContainer.find('.card').remove();
         viewContainer.append(data.html);
-        // if (data.count === 0 && projectsViewFilter !== 'archived') {
-        //   $('#projects-present').hide();
-        //   $('#projects-absent').show();
-        // } else {
-        //   $('#projects-absent').hide();
-        //   $('#projects-present').show();
-        // }
-        // initFormSubmitLinks(viewContainer);
-        // init();
+        init();
       },
       error: function() {
         viewContainer.html('Error loading project list');
@@ -761,26 +754,10 @@
 
   $('.projects-view-mode-switch a').off().on('shown.bs.tab', function(event) {
     if ($(event.target).data('mode') === 'table') {
-      // table tab
-      $('#sortMenu').hide();
-      $('#projects-absent').hide();
-      $('#projects-present').show();
-      if ($.isEmptyObject(TABLE)) {
-        dataTableInit();
-      } else if (projectsViewFilterChanged) {
-        TABLE.draw();
-      } else {
-        updateSelectedRows();
-      }
+      $('#cards-wrapper').addClass('list');
     } else {
-      // cards tab
-      $('#sortMenu').show();
-      if (projectsViewFilterChanged) {
-        loadCardsView();
-      }
-      updateSelectedCards();
+      $('#cards-wrapper').removeClass('list');
     }
-    projectsViewFilterChanged = false;
   });
 
   initProjectsViewFilter();

app/assets/stylesheets/projects.scss

@@ -657,7 +657,7 @@ li.module-hover {
 
 // New projects page
 .projects-container {
-  margin-top: 50px;
+  margin-top: 35px;
 
   .cards-wrapper {
     align-items: center;
@@ -796,6 +796,7 @@ li.module-hover {
       grid-auto-rows: 2em 1px;
       grid-row-gap: .5em;
       grid-template-columns: max-content 1fr 1fr 1fr 1fr max-content;
+      margin: 40px 0 0 6px;
 
       .card {
         display: contents;

app/views/projects/index.html.erb

@@ -12,6 +12,7 @@
   <%= render partial: 'projects/index/modals/export_projects' %>
 
   <div class="projects-container">
+    <%= render partial: 'projects/index/toolbar' %>
     <div class="cards-wrapper" id="cards-wrapper" data-projects-cards-url="<%= cards_projects_url %>">
       <div class="table-header">
         <div class="table-header-cell select-all-checkboxes">

app/views/projects/index/_folder_card.html.erb

@@ -1,7 +1,7 @@
 <div class="card folder-card">
   <div class="checkbox-cell">
     <div class="sci-checkbox-container">
-      <input value="1" type="checkbox" class="sci-checkbox select-all">
+      <input value="1" type="checkbox" class="sci-checkbox card-selector">
       <span class="sci-checkbox-label"></span>
     </div>
   </div>

app/views/projects/index/_project_card.html.erb

@@ -1,7 +1,7 @@
 <div class="card project-card">
   <div class="checkbox-cell">
     <div class="sci-checkbox-container">
-      <input value="1" type="checkbox" class="sci-checkbox select-all">
+      <input value="1" type="checkbox" class="sci-checkbox card-selector">
       <span class="sci-checkbox-label"></span>
     </div>
   </div>