Angularise /account page: Order service/controller, rough layout

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

@@ -0,0 +1,8 @@
+Darkswarm.controller "DistributorNodeCtrl", ($scope, HashNavigation, $anchorScroll) ->
+  $scope.toggle = ->
+    HashNavigation.toggle $scope.distributor
+  $scope.open = ->
+    HashNavigation.active($scope.distributor)
+    
+  if $scope.open()
+    $anchorScroll()

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

@@ -0,0 +1,8 @@
+Darkswarm.controller "OrdersCtrl", ($scope, $rootScope, $timeout, Orders, Search, $document, HashNavigation, FilterSelectorsService, EnterpriseModal, enterpriseMatchesNameQueryFilter, distanceWithinKmFilter) ->
+  $scope.Orders = Orders
+
+  $scope.filterEnterprises = ->
+    es = Enterprises.hubs
+    $scope.nameMatches = enterpriseMatchesNameQueryFilter(es, true)
+    $scope.distanceMatches = enterpriseMatchesNameQueryFilter(es, false)
+    $scope.distanceMatches = distanceWithinKmFilter($scope.distanceMatches, 50)

app/assets/javascripts/darkswarm/services/orders.js.coffee

@@ -0,0 +1,14 @@
+Darkswarm.factory 'Orders', (orders, CurrentHub, Taxons, Dereferencer, visibleFilter, Matcher, Geo, $rootScope)->
+  new class Orders
+    orders_by_distributor: {}
+    distributors = []
+    constructor: ->
+      # Populate Orders.orders from json in page.
+      @orders = orders
+      # Organise orders by distributor.
+      for order in orders
+        if order.distributor?.id
+          @orders_by_distributor[order.distributor.name] = order
+      # Can we guarantee order of keys in js?
+      @distributors = Object.keys(@orders_by_distributor)
+      # Sorting by most orders (most recent/frequent?)

app/helpers/injection_helper.rb

@@ -51,6 +51,10 @@ module InjectionHelper
     render partial: "json/injection_ams", locals: {name: 'enterpriseAttributes', json: "#{@enterprise_attributes.to_json}"}
   end
 
+  def inject_orders_for_user
+    inject_json_ams "orders", spree_current_user.orders, Api::OrderSerializer
+  end
+
   def inject_json(name, partial, opts = {})
     render partial: "json/injection", locals: {name: name, partial: partial}.merge(opts)
   end

app/serializers/api/order_serializer.rb

@@ -0,0 +1,10 @@
+class Api::OrderSerializer < ActiveModel::Serializer
+  attributes :id, :completed_at, :total, :state, :shipment_state, :outstanding_balance
+
+  has_one :distributor, serializer: Api::IdNameSerializer
+
+  def completed_at
+    object.completed_at.blank? ? "" : object.completed_at.strftime("%F %T")
+  end
+
+end

app/views/spree/users/_fat.html.haml

@@ -0,0 +1,3 @@
+.row.active_table_row
+  .columns.small-12.medium-7.large-7.fat
+    %span{"bo-text" => "distributor"}

app/views/spree/users/_skinny.html.haml

@@ -0,0 +1,14 @@
+-# Add extra highlighting etc (credit/debit?) here
+.row.active_table_row{"ng-click" => "toggle($event)", "ng-class" => "{'closed' : !open()}"}
+  .columns.small-12.medium-4.large-4.skinny-head
+    %span.margin-top
+      %strong{"bo-text" => "distributor"}
+
+  -#
+    .columns.small-6.medium-3.large-3
+      %span.margin-top{"bo-text" => "producer.address.city"}
+    .columns.small-4.medium-3.large-4
+      %span.margin-top{"bo-bind" => "producer.address.state_name | uppercase"}
+    .columns.small-2.medium-2.large-1.text-right
+      %span.margin-top
+        %i{"ng-class" => "{'ofn-i_005-caret-down' : !open(), 'ofn-i_006-caret-up' : open()}"}

app/views/spree/users/show.html.haml

@@ -1,34 +1,22 @@
-.darkswarm
-  .row.pad-top
-    .small-12.columns.pad-top
-      %h1= accurate_title
-      .account-summary{"data-hook" => "account_summary"}
-        %dl#user-info
-          %dt= t(:email)
-          %dd
-            = @user.email
-            (#{link_to t(:edit), spree.edit_account_path})
-      .account-my-orders{"data-hook" => "account_my_orders"}
-        %h3= t(:my_orders)
-        - if @orders.present?
-          %table.order-summary
-            %thead
-              %tr
-                %th.order-number= t(:order_number)
-                %th.order-date= t(:order_date)
-                %th.order-status= t(:status)
-                %th.order-payment-state= t(:payment_state)
-                %th.order-shipment-state= t(:shipment_state)
-                %th.order-total= t(:total)
-            %tbody
-              - @orders.each do |order|
-                %tr{class: cycle('even', 'odd')}
-                  %td.order-number= link_to order.number, order_url(order)
-                  %td.order-date= l order.completed_at.to_date
-                  %td.order-status= t(order.state).titleize
-                  %td.order-payment-state= t("payment_states.#{order.payment_state}") if order.payment_state
-                  %td.order-shipment-state= t("shipment_states.#{order.shipment_state}") if order.shipment_state
-                  %td.order-total= money order.total
-        - else
-          %p= t(:you_have_no_orders_yet)
-        %br/
+= inject_orders_for_user
+
+.row.pad-top
+  .small-12.columns.pad-top
+    %h1= accurate_title
+    .account-summary{"data-hook" => "account_summary"}
+      %dl#user-info
+        %dt= t(:email)
+        %dd
+          = @user.email
+          (#{link_to t(:edit), spree.edit_account_path})
+          -# Add back ng-cloak below
+    .orders{"ng-controller" => "OrdersCtrl"}
+      .row{bindonce: true}
+        .small-12.columns
+          .active_table
+            %distributor.active_table_node.row.animate-repeat{id: "{{distributor}}",
+            "ng-repeat" => "distributor in Orders.distributors",
+            "ng-controller" => "DistributorNodeCtrl",
+            "ng-class" => "{'closed' : !open(), 'open' : open()}"}
+              .small-12.columns
+                = render partial: "spree/users/fat"