Moving bought items listing up into main section of cart

app/assets/javascripts/darkswarm/controllers/edit_bought_order_controller.js.coffee

@@ -1,4 +1,5 @@
-Darkswarm.controller "EditOrderCtrl", ($scope, $resource, Cart) ->
+Darkswarm.controller "EditBoughtOrderController", ($scope, $resource, Cart) ->
+  $scope.showBought = false
 
   $scope.deleteLineItem = (id) ->
     params = {id: id}

app/assets/stylesheets/darkswarm/shopping-cart.css.scss

@@ -72,11 +72,31 @@
 
 // Shopping cart
 #cart-detail {
-  .cart-item-delete {
-    a.delete {
+  .cart-item-delete, .bought-item-delete {
+    a {
       font-size: 1.125em;
     }
   }
+
+  button, .button {
+    margin: 0;
+  }
+
+  .toggle-bought {
+    cursor: pointer;
+  }
+
+  tr.bought td {
+    color: $med-grey;
+
+    h5 {
+      color: $med-grey;
+    }
+
+    .already-confirmed {
+      float: right;
+    }
+  }
 }
 
 .item-thumb-image {
@@ -90,9 +110,3 @@
     height: 36px;
   }
 }
-
-#edit-cart {
-  button, .button {
-    margin: 0;
-  }
-}

app/views/spree/orders/_bought.html.haml

@@ -1,43 +1,35 @@
-%div#bought-products{ng: {controller: "EditOrderCtrl"}}
-  %div
-    %div
-      .row
-        .row
-          .columns.large-12
-            %table{style: "width: 100%; margin-top: 2em"}
-              %col{halign: "left", valign: "middle", width: "60%"}/
-              %col{halign: "left", valign: "middle", width: "15%"}/
-              %col{halign: "center", valign: "middle", width: "10%"}/
-              %col{halign: "center", valign: "middle", width: "10%"}/
-              %col{halign: "center", valign: "middle", width: "5%"}/
-              %thead
-                %tr
-                  %th.cart-item-description-header= t('.item')
-                  %th.cart-item-price-header.text-right= t(:price)
-                  %th.text-center.cart-item-quantity-header= t(:qty)
-                  %th.cart-item-total-header.text-right= t(:total)
-                  %th.cart-item-delete-header
+%tbody{ ng: { controller: 'EditBoughtOrderController' } }
+  %tr
+    %td.toggle-bought{ colspan: 2, ng: { click: 'showBought=!showBought' } }
+      %h5.brick
+        %i{ ng: { class: "{ 'ofn-i_007-caret-right': !showBought, 'ofn-i_005-caret-down': showBought}"}}
+        = t(:orders_bought_items_notice, count: @order.finalised_line_items.count)
+    %td.text-right{ colspan: 3}
+      %a.edit-finalised.button.radius.expand.small{ href: 'javascript:void(0)', ng: { class: "{secondary: !showBought, primary: showBought}" } }
+        = t(:orders_bought_edit_button)
+        %i.ofn-i_007-caret-right
 
-              %tbody
-                - @order.finalised_line_items.each do |line_item|
-                  - variant = line_item.variant
-                  %tr.line-item{class: "line-item-#{line_item.id} variant-#{variant.id}"}
-                    %td.cart-item-description
 
-                      %div.item-thumb-image
-                        - if variant.images.length == 0
-                          = link_to mini_image(variant.product), variant.product
-                        - else
-                          = link_to image_tag(variant.images.first.attachment.url(:mini)), variant.product
+  - @order.finalised_line_items.each do |line_item|
+    - variant = line_item.variant
+    %tr.bought.line-item{class: "line-item-#{line_item.id} variant-#{variant.id}", ng: { show: 'showBought'} }
+      %td.cart-item-description
 
-                      = render 'spree/shared/line_item_name', line_item: line_item
-                    %td.text-right.cart-item-price
-                      = line_item.single_display_amount_with_adjustments.to_html
-                    %td.text-center.cart-item-quantity
-                      = line_item.quantity
-                    %td.cart-item-total.text-right
-                      = line_item.display_amount_with_adjustments.to_html unless line_item.quantity.nil?
+        %div.item-thumb-image
+          - if variant.images.length == 0
+            = link_to mini_image(variant.product), variant.product
+          - else
+            = link_to image_tag(variant.images.first.attachment.url(:mini)), variant.product
 
-                    %td.cart-item-delete.text-center
-                      %a.delete{ng: {click: "deleteLineItem(#{line_item.id})"}}
-                        %i.delete.ofn-i_026-trash
+        = render 'spree/shared/line_item_name', line_item: line_item
+        %span.already-confirmed= t(:orders_bought_already_confirmed)
+      %td.text-right.cart-item-price
+        = line_item.single_display_amount_with_adjustments.to_html
+      %td.text-center.cart-item-quantity
+        = line_item.quantity
+      %td.cart-item-total.text-right
+        = line_item.display_amount_with_adjustments.to_html unless line_item.quantity.nil?
+
+      %td.bought-item-delete.text-center
+        %a{ng: {click: "deleteLineItem(#{line_item.id})"}}
+          %i.ofn-i_026-trash

app/views/spree/orders/_form.html.haml

@@ -20,8 +20,10 @@
         = order_form.fields_for :line_items do |item_form|
           = render :partial => 'line_item', :locals => { :variant => item_form.object.variant, :line_item => item_form.object, :item_form => item_form }
 
+      = render 'bought' if show_bought_items? && @order.cart?
+
       %tfoot#edit-cart
-        = render 'spree/orders/form/cart_actions_row' unless @order.complete?
+        = render 'spree/orders/form/cart_actions_row' if @order.cart?
 
         / This is the fees row which we want to replace with the pop-over
         -# - unless @order.adjustments.eligible.blank?

app/views/spree/orders/edit.html.haml

@@ -33,6 +33,4 @@
 
         = render "spree/orders/form/cart_links"
 
-    = render 'bought' if show_bought_items?
-
 = render partial: "shared/footer"

config/locales/en.yml

@@ -1052,6 +1052,11 @@ See the %{link} to find out more about %{sitename}'s features and to start using
   orders_show_confirmed: Confirmed
   orders_your_order_has_been_cancelled: "Your order has been cancelled"
   orders_could_not_cancel: "Sorry, the order could not be cancelled"
+  orders_bought_items_notice:
+    one: An additional item is already confirmed for this order cycle
+    other: "%{count} additional items already confirmed for this order cycle"
+  orders_bought_edit_button: Edit confirmed items
+  orders_bought_already_confirmed: "* already confirmed"
 
   products_cart_distributor_choice: "Distributor for your order:"
   products_cart_distributor_change: "Your distributor for this order will be changed to %{name} if you add this product to your cart."

spec/features/consumer/shopping/cart_spec.rb

@@ -104,9 +104,15 @@ feature "full-page cart", js: true do
       it "shows already ordered line items" do
         item1 = prev_order1.line_items.first
         item2 = prev_order2.line_items.first
+
+        expect(page).to_not have_content item1.variant.name
+        expect(page).to_not have_content item2.variant.name
+
+        find("td.toggle-bought").click
+
         expect(page).to have_content item1.variant.name
         expect(page).to have_content item2.variant.name
-        page.find(".line-item-#{item1.id} a.delete").click
+        page.find(".line-item-#{item1.id} td.bought-item-delete a").click
         expect(page).to have_no_content item1.variant.name
         expect(page).to have_content item2.variant.name
 
@@ -116,6 +122,8 @@ feature "full-page cart", js: true do
         expect(page).to have_content item2.variant.name
 
         visit spree.cart_path
+
+        find("td.toggle-bought").click
         expect(page).to have_no_content item1.variant.name
         expect(page).to have_content item2.variant.name
       end