caboose-store 0.0.11 → 0.0.12

data/app/assets/javascripts/caboose_store/modules/checkout_step1.js

@@ -0,0 +1,157 @@
+//
+// Checkout
+//
+
+Caboose.Store.Modules.CheckoutStep1 = (function() {
+
+  // Steps
+  // Step 1: Present non-editable cart and login/register/guest buttons.
+  // Step 2: Present shipping address form.
+  // Step 3: Present shipping options.
+  // Step 4: Present credit card form.
+  // Step 5: Thank you.
+    
+  self = {};
+  
+  //
+  // Initialize
+  //
+  
+  self.initialize = function() {
+    switch (window.location.pathname.replace(/\/$/, "")) {
+      case '/checkout':
+      case '/checkout/step-one': self.step = 1; break;      
+    }
+    
+    $('#signin_form_container'   ).slideUp();
+    $('#register_form_container' ).slideUp();
+    $('#guest_form_container'    ).slideUp();
+    
+    self.$checkout = $('#checkout')        
+    self.bindEventHandlers();
+  };
+  
+  //
+  // Events
+  //
+  
+  self.bindEventHandlers = function() {
+    self.$checkout.on('click' , '[data-login-action]', self.loginClickHandler);
+    self.$checkout.on('submit', '#checkout-login form', self.loginSubmitHandler);    
+    self.$checkout.on('click' , '#checkout-continue button', self.continueHandler);
+
+    $('#signin_form'  ).submit(self.login_form_submit_handler);
+    $('#register_form').submit(self.register_form_submit_handler);
+    $('#guest_form'   ).submit(self.guest_form_submit_handler);    
+  };
+  
+  self.loginClickHandler = function(event) {    
+    var form = $(event.target).data('login-action');    
+    if (self.current_form && form == self.current_form)
+      return;
+    if (self.current_form)
+    {
+      $('#' + self.current_form + '_form_container').slideUp(400, function() {
+        $('#' + form + '_form_container').slideDown();        
+      });
+      $('#' + self.current_form + '_button').removeClass('selected');
+    }    
+    else
+    {
+      $('#' + form + '_form_container').slideDown();      
+    }
+    $('#' + form + '_button').addClass('selected');
+    self.current_form = form;         
+  };
+  
+  self.loginSubmitHandler = function(event) {
+    event.preventDefault();
+    var $form = $(event.target);
+    
+    $.ajax({
+      type: $form.attr('method'),
+      url: $form.attr('action'),
+      data: $form.serialize(),
+      success: function(response) {
+        if (response.error || (response.errors && response.errors.length > 0)) {
+          if ($form.find('.message').length) {
+            $form.find('.message').empty().addClass('error').text(response.error || response.errors[0]);
+          } else {
+            $form.append($('<span/>').addClass('message error').text(response.error || response.errors[0]));
+          }
+        } else {
+          if (response.logged_in) {
+            self.$login.after($('<p/>').addClass('alert').text('You are now signed in').css('text-align', 'center')).remove();
+            $.post('/checkout/attach-user');
+          } else {
+            self.$login.after($('<p/>').addClass('alert').text('Email successfully saved').css('text-align', 'center')).remove();
+          }
+        }
+        
+        self.fetch(self.render);
+      }
+    });
+  };
+  
+  self.continueHandler = function(event) {
+    $form = self.$address.find('form');
+    
+    $.ajax({
+      type: $form.attr('method'),
+      url: $form.attr('action'),
+      data: $form.serialize(),
+      success: function(response) {
+        if (response.success) {
+          window.location = '/checkout/step-two';
+        } else {
+          $form.find('.message').remove();
+          $form.find('#' + response.address + ' h3').append($('<span/>').addClass('message error').text(response.errors[0]));
+        }
+      }
+    });
+  };
+  
+  self.login_form_submit_handler = function(event) {    
+    $('#message').html("<p class='loading'>Logging in...</p>");
+    $.ajax({
+      url: '/login',
+      type: 'post',
+      data: $('#signin_form').serialize(),
+      success: function(resp) {
+        if (resp.error) $('#message').html("<p class='note error'>" + resp.error + "</p>");
+        else window.location = '/checkout/step-two';
+      }
+    });
+    return false;
+  };
+  
+  self.register_form_submit_handler = function(event) {    
+    $('#message').html("<p class='loading'>Registering...</p>");
+    $.ajax({
+      url: '/register',
+      type: 'post',
+      data: $('#register_form').serialize(),
+      success: function(resp) {
+        if (resp.error) $('#message').html("<p class='note error'>" + resp.error + "</p>");
+        else window.location = '/checkout/step-two';
+      }
+    });
+    return false;
+  };
+  
+  self.guest_form_submit_handler = function(event) {    
+    $('#message').html("<p class='loading'>Submitting...</p>");
+    $.ajax({
+      url: '/checkout/attach-guest',
+      type: 'post',
+      data: $('#guest_form').serialize(),
+      success: function(resp) {
+        if (resp.error) $('#message').html("<p class='note error'>" + resp.error + "</p>");
+        else window.location = '/checkout/step-two';
+      }
+    });
+    return false;
+  };
+      
+  return self
+}).call(Caboose.Store);

data/app/assets/javascripts/caboose_store/modules/checkout_step2.js

@@ -0,0 +1,39 @@
+
+Caboose.Store.Modules.CheckoutStep2 = (function() {
+    
+  self = {};
+  
+  self.initialize = function() {                
+    self.bind_event_handlers();
+  };
+  
+  self.bind_event_handlers = function() {
+    $('input[type=checkbox][name=use_as_billing]').on('change', self.use_as_billing_handler);
+    $('#address_form').submit(self.continue_handler);
+  };
+
+  self.use_as_billing_handler = function(event) {    
+    if (event.target.checked)
+      $('#billing').hide();
+    else
+      $('#billing').show();    
+  };
+  
+  self.continue_handler = function(event) {    
+    $('#message').html("<p class='loading'>Saving information...</p>");
+    $.ajax({
+      url: '/checkout/address',
+      type: 'put',      
+      data: $('#address_form').serialize(),
+      success: function(resp) {
+        if (resp.errors && resp.errors.length > 0)
+          $('#message').html("<p class='note error'>" + resp.errors[0] + "</p>");
+        else if (resp.success)
+          window.location = '/checkout/step-three';        
+      }
+    });
+    return false;
+  };
+    
+  return self
+}).call(Caboose.Store);

data/app/assets/javascripts/caboose_store/modules/checkout_step3.js

@@ -0,0 +1,34 @@
+
+Caboose.Store.Modules.CheckoutStep3 = (function() {
+    
+  self = {};
+   
+  self.initialize = function() {                
+    self.bind_event_handlers();
+  };
+  
+  self.bind_event_handlers = function() {
+    $('#checkout button').click(self.shipping_click_handler);    
+  };
+
+  self.shipping_click_handler = function(event) {
+    $('#message').html("<p class='loading'>Saving information...</p>");            
+    $.ajax({
+      url: '/checkout/shipping',
+      type: 'put',      
+      data: { 
+        shipping_method: $(event.target).data('shipping-method'),
+        shipping_code:   $(event.target).data('shipping-code') 
+      },
+      success: function(resp) {
+        if (resp.errors && resp.errors.length > 0)
+          $('#message').html("<p class='note error'>" + resp.errors[0] + "</p>");
+        else if (resp.success)
+          window.location = '/checkout/step-four';        
+      }
+    });
+    return false;
+  };
+    
+  return self
+}).call(Caboose.Store);

data/app/assets/javascripts/caboose_store/modules/checkout_step4.js

@@ -0,0 +1,102 @@
+
+Caboose.Store.Modules.CheckoutStep4 = (function() {
+
+  self = {
+    is_confirm: false
+  };    
+  
+  self.initialize = function() {
+    $('#checkout-confirm').hide();
+    $('#relay').hide();
+    self.bind_event_handlers();    
+  };
+    
+  self.bind_event_handlers = function() {
+    $('#checkout-payment form#payment select').change(self.expiration_change_handler);
+    $('#checkout-continue button').click(self.continue_handler);
+    $('#checkout-confirm #edit_payment').click(self.edit_payment_handler);                
+    //$('#relay').on('load', self.relay_handler);
+  };
+    
+  self.expiration_change_handler = function(event) {
+    var form = $('#checkout-payment #payment')
+    month = form.find('select[name=month]').val()
+    year = form.find('select[name=year]').val();    
+    $('#expiration').val(month + year);
+  };
+  
+  self.continue_handler = function(event) {
+    if (!self.is_confirm)
+    {
+      var cc = $('#billing-cc-number').val();
+      if (cc.length < 15)
+        $('#message').html("<p class='note error'>Please enter a valid credit card number.</p>");
+      else
+      {          
+        $('#message').empty();
+        $('#checkout-payment').hide();
+        $('#checkout-confirm').show();
+        $('#checkout_nav4 a').removeClass('current').addClass('done');
+        $('#checkout_nav5 a').removeClass('not_done').addClass('current');
+        $('#confirm_card_number').html("Card ending in " + cc.substr(-4));
+        $('#checkout-continue button').html("Confirm order");
+        self.is_confirm = true;
+      }
+    }
+    else
+    {    
+      $('#message').html("<p class='loading'>Processing payment...</p>");
+      $('form#payment').submit();
+    }
+  };
+  
+  self.edit_payment_handler = function(event) {
+    $('#checkout-confirm').hide();
+    $('#checkout-payment').show();
+    $('#checkout_nav4 a').removeClass('done').addClass('current');
+    $('#checkout_nav5 a').removeClass('current').addClass('not_done');
+    $('#checkout-continue button').html("Continue");    
+    self.is_confirm = false;    
+  };
+  
+  //self.relay_handler = function(event) {
+  //  alert('Relay handler');
+  //  var iframe = $('#relay');
+  //  var form   = $('#payment');
+  //  var resp   = iframe.contents().find('#response');
+  //  
+  //  if (!resp.length || form.length)
+  //  {
+  //    alert('No response found.');
+  //    return false;
+  //  }
+  //  
+  //  resp = JSON.parse(resp.html());    
+  //  if (resp.error)
+  //    $('#message').html("<p class='note error'>" + resp.error + "</p>");
+  //  else if (resp.success == true)
+  //    window.location = '/checkout/thanks';                
+  //};
+  
+  return self
+}).call(Caboose.Store);
+
+function relay_handler()
+{
+  alert('Relay handler');
+  var iframe = $('#relay');
+  var form   = $('#payment');
+  var resp   = iframe.contents().find('#response');
+  
+  if (!resp.length || form.length)
+  {
+    alert('No response found.');
+    return false;
+  }
+  
+  resp = JSON.parse(resp.html());    
+  if (resp.error)
+    $('#message').html("<p class='note error'>" + resp.error + "</p>");
+  else if (resp.success == true)
+    window.location = '/checkout/thanks';                
+}

data/app/assets/templates/caboose_store/checkout/forms/guest.jst.ejs

@@ -1,4 +1,4 @@
-<div class="wrapper">
+<div class="wrapper">  
   <form action="/checkout/attach-guest" method="post">
     <input name="email" type="text" placeholder="Email" />
     <input name="confirm_email" type="email" placeholder="Confirm email" />

data/app/assets/templates/caboose_store/checkout/forms/register.jst.ejs

@@ -1,4 +1,4 @@
-<div class="wrapper">
+<div class="wrapper">  
   <form action="/register" method="post">
     <input name="first_name" type="text" placeholder="First Name" />
     <input name="last_name" type="text" placeholder="Last Name" />

data/app/assets/templates/caboose_store/checkout/forms/signin.jst.ejs

@@ -1,4 +1,4 @@
-<div class="wrapper">
+<div class="wrapper">  
   <form action="/login" method="post">
     <input name="username" type="text" placeholder="Email" />
     <input name="password" type="password" placeholder="Password" />

data/app/assets/templates/caboose_store/checkout/line_items.jst.ejs

@@ -7,8 +7,7 @@
         <aside>
           <figure style="background-image: url(<%= lineItem.variant.images[0].urls.thumb %>)"></figure>
           <p><%= lineItem.title %><br />Qty: <%= lineItem.quantity %><br /><span class="price">$<%= ((parseFloat(lineItem.price) * 100) / 100).toFixed(2) %></span></p>
-        </aside>
-        
+        </aside>        
         <section>
           <p>$<%= ((parseFloat(lineItem.price) * 100) / 100).toFixed(2) %></p>
         </section>

data/app/assets/templates/caboose_store/checkout/login.jst.ejs

@@ -1,18 +1,18 @@
-<div class="wrapper">
+<div class="wrapper" class='login-choices'>
   <ul>
     <li>
       <p>Already a member<p>
-      <button data-login-action="signin">Sign in</button>
+      <button data-login-action="signin" id='signin_button'>Sign in</button>
     </li>
     
     <li>
       <p>Sign up for all of our member benefits</p>
-      <button data-login-action="register">New Customer</button>
+      <button data-login-action="register" id='register_button'>New Customer</button>
     </li>
     
     <li>
       <p>No thanks</p>
-      <button data-login-action="continue">Continue As Guest</button>
+      <button data-login-action="continue" id='continue_button'>Continue As Guest</button>
     </li>
   </ul>
 </div>

data/app/controllers/caboose_store/checkout_controller.rb

@@ -7,15 +7,57 @@ module CabooseStore
       redirect_to '/checkout/empty' if @order.line_items.empty?
     end
     
-    # GET /checkout || GET /checkout/step-one
+    # GET /checkout
+    def index
+      redirect_to '/checkout/step-one'
+    end
+    
+    # GET /checkout/step-one
     def step_one
+      redirect_to '/checkout/step-two' if logged_in?
     end
     
     # GET /checkout/step-two
     def step_two
-      redirect_to '/checkout/step-one' if !@order.shipping_address || !@order.billing_address
+      #redirect_to '/checkout/step-one' if !@order.shipping_address || !@order.billing_address
+      redirect_to '/checkout/step-one' if !logged_in?      
+    end
+    
+    # GET /checkout/step-three
+    def step_three      
+      redirect_to '/checkout/step-one' and return if !logged_in?
+      redirect_to '/checkout/step-two' and return if @order.shipping_address.nil? || @order.billing_address.nil?
+      @rates = ShippingCalculator.rates(@order)      
+      @selected_rate = ShippingCalculator.rate(@order)
+    end
+    
+    # GET /checkout/step-four
+    def step_four            
+      redirect_to '/checkout/step-one'   and return if !logged_in?
+      redirect_to '/checkout/step-two'   and return if @order.shipping_address.nil? || @order.billing_address.nil?
+      redirect_to '/checkout/step-three' and return if @order.shipping_code.nil?
+      
+      case CabooseStore::payment_processor
+        when 'authorize.net'
+          @sim_transaction = AuthorizeNet::SIM::Transaction.new(
+            CabooseStore::authorize_net_login_id,
+            CabooseStore::authorize_net_transaction_key,
+            @order.total,
+            :relay_url => "#{CabooseStore::root_url}/checkout/relay/#{@order.id}",
+            :transaction_type => 'AUTH_ONLY',
+            :test => true
+          )
+        when 'payscape'
+          @form_url = CabooseStore::PaymentProcessor.form_url(@order)
+      end
     end
     
+    # GET /checkout/thanks
+    def thanks
+    end
+    
+    #===========================================================================
+    
     # GET /checkout/address
     def address
       render :json => {
@@ -68,7 +110,7 @@ module CabooseStore
     end
     
     # POST /checkout/attach-user
-    def attach_user
+    def attach_user            
       render :json => { :success => false, :errors => ['User is not logged in'] } and return if !logged_in?
       @order.customer_id = logged_in_user.id
       render :json => { :success => @order.save, :errors => @order.errors.full_messages, :logged_in => logged_in? }
@@ -76,54 +118,82 @@ module CabooseStore
     
     # POST /checkout/guest
     def attach_guest
-      render :json => { :success => false, :errors => ['Emails do not match'] } and return if params[:email] != params[:confirm_email]
-      @order.email = params[:email]
-      render :json => { :succes => @order.save, :errors => @order.errors.full_messages, :logged_in => logged_in? }
+      resp = Caboose::StdClass.new      
+      email = params[:email]      
+      
+      if email != params[:confirm_email]
+        resp.error = "Emails do not match."
+      elsif Caboose::User.where(:email => email, :is_guest => false).exists?
+        resp.error = "A user with that email address already exists."
+      else
+        user = Caboose::User.where(:email => email, :is_guest => true).first
+        if user.nil?        
+          user = Caboose::User.create(:email => email)
+          user.is_guest = true
+          user.save
+          user = Caboose::User.where(:email => email).first
+        end                   
+        @order.customer_id = user.id
+        login_user(user)
+        
+        if !@order.valid?        
+          resp.errors = @order.errors.full_messages
+        else
+          @order.save
+          resp.redirect = '/checkout/step-two'
+        end
+      end
+      render :json => resp            
     end
     
-    # GET /checkout/shipping
-    def shipping
-      render :json => { :rates => ShippingCalculator.rates(@order), :selected_rate => ShippingCalculator.rate(@order) }
-    end
+    ## GET /checkout/shipping
+    #def shipping
+    #  render :json => { :rates => ShippingCalculator.rates(@order), :selected_rate => ShippingCalculator.rate(@order) }
+    #end
     
     # PUT /checkout/shipping
-    def update_shipping
-      @order.shipping_code = params[:shipping_code]
-      render :json => { :success => @order.save, :errors => @order.errors.full_messages, :order => @order, :selected_rate => ShippingCalculator.rate(@order) }
+    def update_shipping      
+      @order.shipping_method = params[:shipping_method]
+      @order.shipping_code   = params[:shipping_code]                 
+      render :json => { 
+        :success => @order.save, 
+        :errors => @order.errors.full_messages 
+        #:order => @order, 
+        #:selected_rate => ShippingCalculator.rate(@order) 
+      }
     end
     
     # GET /checkout/payment
-    def payment
-      case CabooseStore::payment_processor
-      when 'authorize.net'
-        @sim_transaction = AuthorizeNet::SIM::Transaction.new(
-          CabooseStore::authorize_net_login_id,
-          CabooseStore::authorize_net_transaction_key,
-          @order.total,
-          :relay_url => "#{CabooseStore::root_url}/checkout/relay/#{@order.id}",
-          :transaction_type => 'AUTH_ONLY',
-          :test => true
-        )
-      when 'payscape'
-        @form_url = CabooseStore::PaymentProcessor.form_url(@order)
-      end
-      
-      render :layout => false
-    end
+    #def payment
+    #  case CabooseStore::payment_processor
+    #    when 'authorize.net'                             
+    #      @sim_transaction = AuthorizeNet::SIM::Transaction.new(
+    #        CabooseStore::authorize_net_login_id,
+    #        CabooseStore::authorize_net_transaction_key,
+    #        @order.total,
+    #        :relay_url => "#{CabooseStore::root_url}/checkout/relay/#{@order.id}",
+    #        :transaction_type => 'AUTH_ONLY',
+    #        :test => true
+    #      )
+    #    when 'payscape'
+    #      @form_url = CabooseStore::PaymentProcessor.form_url(@order)
+    #  end      
+    #  render :layout => false
+    #end
     
     # POST /checkout/relay/:order_id
     def relay
       @order = CabooseStore::Order.find(params[:order_id])
       
       case CabooseStore::payment_processor
-      when 'authorize.net'
-        @success = params[:x_response_code] == '1'
-        @message = params[:x_response_reason_text]
-        @order.transaction_id = params[:x_trans_id] if params[:x_trans_id]
-      when 'payscape'
-        @success = CabooseStore::PaymentProcessor.authorize(@order, params)
-        @message = @success ? 'Payment processed successfully' : 'There was a problem processing your payment'
-        @order.transaction_id = params['transaction-id'] if params['transaction-id']
+        when 'authorize.net'
+          @success = params[:x_response_code] == '1'
+          @message = params[:x_response_reason_text]
+          @order.transaction_id = params[:x_trans_id] if params[:x_trans_id]
+        when 'payscape'
+          @success = CabooseStore::PaymentProcessor.authorize(@order, params)
+          @message = @success ? 'Payment processed successfully' : 'There was a problem processing your payment'
+          @order.transaction_id = params['transaction-id'] if params['transaction-id']
       end
       ap @success
       ap '---------'
@@ -150,14 +220,6 @@ module CabooseStore
       render :layout => false
     end
     
-    # GET /checkout/empty
-    def empty
-    end
-    
-    # GET /checkout/thanks
-    def thanks
-    end
-    
     # GET /checkout/discount
     #def discount
     #  # TODO make it possible to use multiple discounts