Splitting out the accordion stuff for checkout

app/assets/javascripts/darkswarm/controllers/checkout/accordion_controller.js.coffee

@@ -0,0 +1,11 @@
+Darkswarm.controller "AccordionCtrl", ($scope, storage) ->
+  $scope.accordion = 
+    details: true 
+    shipping: false
+    payment: false
+    billing: false
+  storage.bind $scope, "accordion", {storeName: "accordion_#{$scope.order.id}"}
+
+  $scope.show = (name)->
+    $scope.accordion[name] = true
+

app/assets/javascripts/darkswarm/controllers/checkout/checkout_controller.js.coffee

@@ -0,0 +1,16 @@
+Darkswarm.controller "CheckoutCtrl", ($scope, storage, CheckoutFormState, Order, CurrentUser) ->
+  $scope.Order = Order
+  storage.bind $scope, "Order.order", {storeName: "order_#{Order.order.id}"}
+  $scope.order = Order.order # Ordering is important
+
+  if CurrentUser
+    $scope.enabled = true 
+  else
+    $scope.enabled = false 
+
+  $scope.purchase = (event)->
+    event.preventDefault()
+    $scope.Order.submit()
+
+  $scope.CheckoutFormState = CheckoutFormState
+  storage.bind $scope, "CheckoutFormState.ship_address_same_as_billing", { defaultValue: true}

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

@@ -1,38 +0,0 @@
-Darkswarm.controller "CheckoutCtrl", ($scope, Order, storage, CheckoutFormState, User) ->
-
-  # We put Order.order into the scope for convenience
-  # However, storage.bind replaces Order.order
-  # So we must put Order.order into the scope AFTER it's bound to localStorage
-  $scope.Order = Order
-  storage.bind $scope, "Order.order", {storeName: "order_#{Order.order.id}"}
-  $scope.order = Order.order
-
-  if User
-    $scope.accordion = {details: true}
-  else
-    $scope.accordion = {user: true}
-  $scope.show = (name)->
-    $scope.accordion[name] = true
-  storage.bind $scope, "accordion", {storeName: "accordion_#{$scope.order.id}"}
-  # If we are logged in, but the cached accordion panel is user, move to details
-  if User and $scope.accordion.user
-    $scope.accordion.user = false
-    $scope.accordion.details = true
-
-  # TODO MAKE THIS BETTER SOMEHOW
-  # if User
-  #   show details
-  # else
-  #   show user
-  #
-  # localStorage overrides above
-  #
-  # If localStorage set to user, but User exists
-  # Then default to details
-
-  $scope.CheckoutFormState = CheckoutFormState
-  storage.bind $scope, "CheckoutFormState.ship_address_same_as_billing", { defaultValue: true}
-
-  $scope.purchase = (event)->
-    event.preventDefault()
-    $scope.Order.submit()

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

@@ -1,7 +1,6 @@
-Darkswarm.factory 'User', (user)->
-  # This is for the current user
+Darkswarm.factory 'CurrentUser', (user)-> # This is for the current user
   if user and !$.isEmptyObject(user)
-    new class User
+    new class CurrentUser
       constructor: ->
         @[k] = v for k, v of user
   else

app/views/checkout/_authentication.html.haml

@@ -1,9 +1,6 @@
-%fieldset
-  %accordion-group{heading: "User", "is-open" => "accordion.user"}
-    .row
-      .large-4.columns.text-center{"ng-controller" => "AuthenticationCtrl"}
-        %button{"ng-click" => "open('/login')"} Login
-      .large-4.columns.text-center{"ng-controller" => "AuthenticationCtrl"}
-        %button{"ng-click" => "open('/signup')"} Signup
-      .large-4.columns.text-center
-        %button{"ng-click" => "show('details')"} Checkout as guest
+#checkout_login.row{"ng-show" => "!enabled"}
+  .large-4.columns.text-center{"ng-controller" => "AuthenticationCtrl"}
+    %button{"ng-click" => "open()"} Login
+
+  .large-4.columns.text-center
+    %button{"ng-click" => "enabled = true"} Checkout as guest

app/views/checkout/edit.html.haml

@@ -11,8 +11,7 @@
       .large-9.columns
         - unless spree_current_user
           = render partial: "checkout/authentication"
-        .row
+        .row{"ng-show" => "enabled", "ng-controller" => "AccordionCtrl"}
           = render partial: "checkout/form"
       .large-3.columns
         = render partial: "checkout/summary"
-

spec/features/consumer/shopping/checkout_auth_spec.rb

@@ -22,15 +22,24 @@ feature "As a consumer I want to check out my cart", js: true do
     quick_login_as user
     visit checkout_path 
     within "section[role='main']" do
-      page.should_not have_content "USER"
+      page.should_not have_content "Login"
+      page.should have_content "Customer Details"
     end
   end
 
-  it "renders the login form when logged out" do
+  it "renders the login buttons when logged out" do
     visit checkout_path 
-    toggle_accordion "User"
     within "section[role='main']" do
-      page.should have_content "User"
+      page.should have_content "Login"
+      click_button "Login"
     end
+    page.should have_content "Remember Me"
+  end
+
+  it "allows user to checkout as guest" do
+    visit checkout_path 
+    click_button "Checkout as guest"
+    page.should have_content "Customer Details"
   end
 end
+

spec/javascripts/unit/darkswarm/controllers/checkout/accordion_controller_spec.js.coffee

@@ -0,0 +1,19 @@
+describe "AccordionCtrl", ->
+  ctrl = null
+  scope = scope
+
+  beforeEach ->
+    module "Darkswarm"
+    localStorage.clear()
+    inject ($controller, $rootScope) ->
+      scope = $rootScope.$new() 
+      scope.order =
+        id: 129
+      ctrl = $controller 'AccordionCtrl', {$scope: scope}
+
+  it "defaults the details accordion to visible", ->
+    expect(scope.accordion.details).toEqual true
+
+  it "changes accordion", ->
+    scope.show "shipping"
+    expect(scope.accordion["shipping"]).toEqual true

spec/javascripts/unit/darkswarm/controllers/checkout/checkout_controller_spec.js.coffee

@@ -0,0 +1,39 @@
+describe "CheckoutCtrl", ->
+  ctrl = null
+  scope = null
+  Order = null
+  CurrentUser = null
+
+  beforeEach ->
+    module("Darkswarm")
+    angular.module('Darkswarm').value('user', {})
+    Order = 
+      submit: ->
+      navigate: ->
+      order:
+        id: 1
+     
+  describe "with user", ->
+    beforeEach ->
+      inject ($controller, $rootScope) ->
+        scope = $rootScope.$new() 
+        ctrl = $controller 'CheckoutCtrl', {$scope: scope, Order: Order, CurrentUser: {}}
+  
+    it "delegates to the service on submit", ->
+      event = 
+        preventDefault: ->
+      spyOn(Order, "submit")
+      scope.purchase(event)
+      expect(Order.submit).toHaveBeenCalled()
+
+    it "is enabled", ->
+      expect(scope.enabled).toEqual true
+
+  describe "without user", ->
+    beforeEach ->
+      inject ($controller, $rootScope) ->
+        scope = $rootScope.$new() 
+        ctrl = $controller 'CheckoutCtrl', {$scope: scope, Order: Order, CurrentUser: undefined}
+
+    it "is disabled", ->
+      expect(scope.enabled).toEqual false

spec/javascripts/unit/darkswarm/controllers/checkout_controller_spec.js.coffee

@@ -1,28 +0,0 @@
-describe "CheckoutCtrl", ->
-  ctrl = null
-  scope = null
-  Order = null
-
-  beforeEach ->
-    module("Darkswarm")
-    angular.module('Darkswarm').value('user', {})
-    Order = {
-      submit: ->
-      navigate: ->
-      order:
-        id: 1
-    } 
-    inject ($controller, $rootScope) ->
-      scope = $rootScope.$new() 
-      ctrl = $controller 'CheckoutCtrl', {$scope: scope, Order: Order}
-
-  it "defaults the user accordion to visible", ->
-    expect(scope.accordion.user).toEqual true
-  
-  it "delegates to the service on submit", ->
-    event = {
-      preventDefault: ->
-    }
-    spyOn(Order, "submit")
-    scope.purchase(event)
-    expect(Order.submit).toHaveBeenCalled()