Implements hide unavailable button

app/views/catalog/index.html.erb

@@ -5,18 +5,21 @@
     <%= render partial: 'no_equipment' %>
   <% else %>
     <div class="row">
-      <div id="pagination_line" class="col-md-12">
+      <div id="pagination_line" class="col-md-10">
         <%# for kaminari pagination %>
         <%= paginate @page_eq_models_by_category,
               params: { controller: 'catalog', action: 'index' } %>
-        <%= form_tag update_user_per_cat_page_path,
+	<%= form_tag update_user_per_cat_page_path,
               id: 'items_per_form', class: 'form-inline pull-right',
               remote: true, method: 'put' do %>
           <%= label_tag :items_per_page, 'Items per page:' %>
           <%= select_tag :items_per_page,
                 options_for_select(@per_page_opts, session[:items_per_page]),
                 class: 'autosubmitme form-control' %>
-        <% end %>
+	<% end %>
+      </div>
+      <div id="etc" class="col-md-2" style="margin-top: 17.6px;">
+        <%= button_tag 'Hide unavailable', id: 'toggle_unavailable', class: 'btn btn-default'%>
       </div>
     </div>
 
@@ -31,3 +34,28 @@
     <%= paginate @page_eq_models_by_category %>
   <% end %>
 </div>
+
+<script>
+$(document).ready(function() {
+  $('#toggle_unavailable').width(
+    Math.max.apply(
+      Math,
+      $('#toggle_unavailable').map(function(){
+        return $(this).width();
+      }).get()
+    )
+  );
+  $("#toggle_unavailable").click(function() {
+    if ($("#toggle_unavailable").text() == "Hide unavailable") {
+      $("#toggle_unavailable").text("Show unavailable");
+    } else {
+      $("#toggle_unavailable").text("Hide unavailable");
+    }
+    $(".col-md-4").each(function() {
+      if ($(this).find(".col-md-3").text() <= 0) {
+        $(this).toggle();
+      }
+    });
+  });
+});
+</script>

spec/features/reservations_spec.rb

@@ -836,4 +836,44 @@
       expect(page).to have_content('Description')
     end
   end
+
+  context 'when hide unavailable button is clicked' do
+    before do
+      empty_cart
+      @eq_model1 = FactoryGirl.create(:equipment_model, category: @category)
+      FactoryGirl.create(:equipment_item, equipment_model: @eq_model1)
+
+      # update availability of eq_model1 to 0 without making a reservation
+      @temp = @eq_model1[:overdue_count]
+      @eq_model1[:overdue_count] = 1
+      @eq_model1.save!
+      @eq_model1.reload
+      page.reset!
+      visit root_path
+    end
+
+    after do
+      @eq_model1[:overdue_count] = @temp
+      @eq_model1.save!
+      @eq_model1.reload
+      page.reset!
+    end
+
+    it 'shows all items by default' do
+      expect(page).to have_css(".availability-num", :text => 1, visible: true)
+      expect(page).to have_css(".availability-num", :text => 0, visible: true)
+    end
+
+    it 'hides only unavailable items when clicked' do
+      click_button "toggle_unavailable"
+      expect(page).to have_css(".availability-num", :text => 1, visible: true)
+      expect(page).to have_css(".availability-num", :text => 0, visible: false)
+    end
+
+    it 'reshows all items when clicked again' do
+      click_button "toggle_unavailable"
+      expect(page).to have_css(".availability-num", :text => 1, visible: true)
+      expect(page).to have_css(".availability-num", :text => 0, visible: true)
+    end
+  end
 end