caboose-store 0.0.11 → 0.0.12

data/app/helpers/caboose_store/checkout_helper.rb

@@ -27,5 +27,20 @@ module CabooseStore
     def caboose_store_billing_form
       render :partial => '/caboose_store/checkout/billing_form'
     end
+    
+    def checkout_nav(i)
+      str = ""
+      str << "<div id='nav'>"
+      str << "  <ul>"
+      str << "    <li class='odd'  id='checkout_nav1'><a href='#{i <= 1 ? '#' : '/checkout/step-one'   }' class='#{i == 1 ? 'current' : (i < 1 ? 'not_done' : 'done')}'><span>User Account </span></a></li>"
+      str << "    <li class='even' id='checkout_nav2'><a href='#{i <= 2 ? '#' : '/checkout/step-two'   }' class='#{i == 2 ? 'current' : (i < 2 ? 'not_done' : 'done')}'><span>Addresses    </span></a></li>"
+      str << "    <li class='odd'  id='checkout_nav3'><a href='#{i <= 3 ? '#' : '/checkout/step-three' }' class='#{i == 3 ? 'current' : (i < 3 ? 'not_done' : 'done')}'><span>Shipping     </span></a></li>"
+      str << "    <li class='even' id='checkout_nav4'><a href='#{i <= 4 ? '#' : '/checkout/step-four'  }' class='#{i == 4 ? 'current' : (i < 4 ? 'not_done' : 'done')}'><span>Payment      </span></a></li>"
+      str << "    <li class='odd'  id='checkout_nav5'><a href='#{i <= 5 ? '#' : '/checkout/step-five'  }' class='#{i == 5 ? 'current' : (i < 5 ? 'not_done' : 'done')}'><span>Confirm      </span></a></li>"
+      str << "  </ul>"
+      str << "</div>"
+      return str
+    end
+    
   end
 end

data/app/models/caboose_store/schema.rb

@@ -3,6 +3,10 @@ class CabooseStore::Schema < Caboose::Utilities::Schema
   
   def self.schema
     {  
+      Caboose::User => [
+         [ :is_guest , :boolean , { :default => false }]
+      ],
+      
       CabooseStore::Address => [
         [ :name          , :string  ],
         [ :first_name    , :string  ],

data/app/models/caboose_store/states.rb

@@ -0,0 +1,66 @@
+class States
+  def self.all
+    {    
+      "AL" => "Alabama",
+      "AK" => "Alaska",
+      "AS" => "American Samoa",
+      "AZ" => "Arizona",
+      "AR" => "Arkansas",
+      "CA" => "California",
+      "CO" => "Colorado",
+      "CT" => "Connecticut",
+      "DE" => "Delaware",
+      "DC" => "District Of Columbia",
+      "FM" => "Federated States Of Micronesia",
+      "FL" => "Florida",
+      "GA" => "Georgia",
+      "GU" => "Guam",
+      "HI" => "Hawaii",
+      "ID" => "Idaho",
+      "IL" => "Illinois",
+      "IN" => "Indiana",
+      "IA" => "Iowa",
+      "KS" => "Kansas",
+      "KY" => "Kentucky",
+      "LA" => "Louisiana",
+      "ME" => "Maine",
+      "MH" => "Marshall Islands",
+      "MD" => "Maryland",
+      "MA" => "Massachusetts",
+      "MI" => "Michigan",
+      "MN" => "Minnesota",
+      "MS" => "Mississippi",
+      "MO" => "Missouri",
+      "MT" => "Montana",
+      "NE" => "Nebraska",
+      "NV" => "Nevada",
+      "NH" => "New Hampshire",
+      "NJ" => "New Jersey",
+      "NM" => "New Mexico",
+      "NY" => "New York",
+      "NC" => "North Carolina",
+      "ND" => "North Dakota",
+      "MP" => "Northern Mariana Islands",
+      "OH" => "Ohio",
+      "OK" => "Oklahoma",
+      "OR" => "Oregon",
+      "PW" => "Palau",
+      "PA" => "Pennsylvania",
+      "PR" => "Puerto Rico",
+      "RI" => "Rhode Island",
+      "SC" => "South Carolina",
+      "SD" => "South Dakota",
+      "TN" => "Tennessee",
+      "TX" => "Texas",
+      "UT" => "Utah",
+      "VT" => "Vermont",
+      "VI" => "Virgin Islands",
+      "VA" => "Virginia",
+      "WA" => "Washington",
+      "WV" => "West Virginia",
+      "WI" => "Wisconsin",
+      "WY" => "Wyoming"
+    }
+  end
+end
+

data/app/views/caboose_store/cart/index.html.erb

@@ -2,3 +2,7 @@
   <div id="cart"></div>
 </div>
 
+<% content_for :caboose_js do %>
+<%= javascript_include_tag 'caboose_store/modules/cart' %>
+<%= javascript_include_tag 'caboose_store/modules/product' %>
+<% end %>

data/app/views/caboose_store/checkout/_confirm.html.erb

@@ -0,0 +1,61 @@
+  <section id='checkout-confirm'>
+    <div class='wrapper'>  
+      <section id="line-items">          
+        <table>
+          <tr>
+            <th>Product</th>
+            <th>Quantity</th>
+            <th>Unit Price</th>
+            <th>Subtotal</th>
+          </tr>
+          <% @order.line_items.each do |li| %>
+            <tr data-id="<%= li.id %>">
+              <td valign='top'>
+                <% if li.variant.product_images.count > 0 %>              
+                  <figure style="background-image: url(<%= li.variant.product_images[0].image.url(:thumb) %>)"></figure>
+                <% end %>                    
+                <p><%= li.title %></p>
+              </td>
+              <td valign='top' align='right' class='qty'     ><%= li.quantity %></td>
+              <td valign='top' align='right' class='price'   ><%= number_to_currency(li.price, :precision => 2) %></td>
+              <td valign='top' align='right' class='subtotal'><%= number_to_currency(li.price, :precision => 2) %></td>
+            </tr>        
+          <% end %>                  
+          <tr><td colspan='3' align='right'>Subtotal:            </td><td align='right'><%= number_to_currency(@order.subtotal, :precision => 2)                   %></td></tr>            
+          <tr><td colspan='3' align='right'>Shipping & Handling: </td><td align='right'><%= number_to_currency(@order.shipping + @order.handling, :precision => 2) %></td></tr>
+          <% if @order.tax > 0 && @order.billing_address.state == 'AL' %>
+            <tr><td colspan='3' align='right'>Tax <small>(if in Alabama)</small>: </td><td align='right'><%= number_to_currency(@order.tax, :precision => 2) %></td></tr>
+          <% end %>      
+          <tr><td colspan='3' align='right'>Total:               </td><td align='right'><%= number_to_currency(@order.total, :precision => 2) %></td></tr>
+        </table>
+      </section>
+      <section id='shipping_address'>
+        <% sa = @order.shipping_address %>        
+        <address>
+          <%= "#{sa.first_name} #{sa.last_name}" %><br />
+          <%= sa.address1 %><br />
+          <%= "#{sa.address2}<br />" if sa.address2 and not sa.address2.empty? %>
+          <%= "#{sa.city}, #{sa.state} #{sa.zip}" %>
+        </address>        
+        <p><a href="/checkout/step-two">Edit shipping address</a></p>
+      </section>
+      <section id='billing_address'>        
+        <% ba = @order.billing_address %>        
+        <address>
+          <%= "#{ba.first_name} #{ba.last_name}" %><br />
+          <%= ba.address1 %><br />
+          <%= "#{ba.address2}<br />" if ba.address2 and not ba.address2.empty? %>
+          <%= "#{ba.city}, #{ba.state} #{ba.zip}" %>
+        </address>
+        <p><a href="/checkout/step-two">Edit billing address</a></p>
+      </section>
+      <section id='shipping_method'>
+        <p><%= @order.shipping_method %> - <%= number_to_currency(@order.shipping) %></p>
+        <p><a href="/checkout/step-three">Edit shipping method</a></p>
+      </section>
+      <section id='payment_method'>
+        <p id='confirm_card_number'></p>
+        <p><a href="#" id='edit_payment'>Edit payment</a></p>
+      </section>
+    </div>
+  </section>

data/app/views/caboose_store/checkout/index.html.erb

@@ -1,4 +1,4 @@
-<h3>Checkout</h3>
+<h3>Checkout2</h3>
 <%= caboose_store_cart %>
 <%= caboose_store_address_form %>
 

data/app/views/caboose_store/checkout/relay.html.erb

@@ -2,10 +2,10 @@
 <html>
   <body>
     <script id="response" type="application/json">
-      {
+      parent.relay_handler({
         "success": <%= @success %>,
         "message": "<%= @message %>"
-      }
+      });
     </script>
   </body>
 </html>

data/app/views/caboose_store/checkout/relay_old.html.erb

@@ -0,0 +1,12 @@
+<!DOCTYPE>
+<html>
+  <body>
+    <script id="response" type="application/json">
+      {
+        "success": <%= @success %>,
+        "message": "<%= @message %>"
+      }
+    </script>
+  </body>
+</html>
+

data/app/views/caboose_store/checkout/step_four.html.erb

@@ -0,0 +1,91 @@
+
+<div id="checkout">
+  <h2>Checkout</h2>
+  <%= raw checkout_nav(4) %>
+  <%= render :partial => 'caboose_store/checkout/confirm' %>  
+  <section id="checkout-payment">  
+    <div class="wrapper">      
+      <% if CabooseStore::payment_processor == 'authorize.net' %>
+        <form id="payment" target="relay" action="<%= CabooseStore::PaymentProcessor.form_url(@order) %>" method="post">
+          <%= sim_fields(@sim_transaction) %>
+          <label>Card Number</label>
+          <input name="x_card_num" type="text" />
+          <label>Expiration</label>
+          <input id="expiration" name="x_exp_date" type="hidden" />          
+          <br />          
+          <select id="month" name="month">                                      
+            <option value="01">01 - Jan</option>
+            <option value="02">02 - Feb</option>
+            <option value="03">03 - Mar</option>
+            <option value="04">04 - Apr</option>
+            <option value="05">05 - May</option>
+            <option value="06">06 - Jun</option>
+            <option value="07">07 - Jul</option>
+            <option value="08">08 - Aug</option>
+            <option value="09">09 - Sep</option>
+            <option value="10">10 - Oct</option>
+            <option value="11">11 - Nov</option>
+            <option value="12">12 - Dec</option>
+          </select>
+          /
+          <select id="year" name="year">
+            <% (DateTime.now.year...DateTime.now.year + 20).each do |i| %>
+              <option value="<%= i-2000 %>"><%= i %></option>
+            <% end %>
+          </select>          
+          <br />          
+          <label>Security Code</label>
+          <input id="x_card_code" name="x_card_code" type="text" />
+          <input type="submit" value="Submit" />
+        </form>
+      <% end %>
+                              
+      <% if CabooseStore::payment_processor == 'payscape' %>
+        <form id="payment" action="<%= @form_url %>" method="post" target="relay">
+          <input id="billing-amount" type="hidden" value="<%= @order.total %>" />
+          <input id="expiration" name="billing-cc-exp" type="hidden" />          
+          <div>
+            <label for="billing-cc-number">Card number:</label>
+            <input id="billing-cc-number" name="billing-cc-number" type="text" maxlength="16" />
+          </div>          
+          <div>
+            <label for="billing-expiration-month">Expiration:</label>
+            <select name="month">
+              <option value="01">01 - Jan</option>
+              <option value="02">02 - Feb</option>
+              <option value="03">03 - Mar</option>
+              <option value="04">04 - Apr</option>
+              <option value="05">05 - May</option>
+              <option value="06">06 - Jun</option>
+              <option value="07">07 - Jul</option>
+              <option value="08">08 - Aug</option>
+              <option value="09">09 - Sep</option>
+              <option value="10">10 - Oct</option>
+              <option value="11">11 - Nov</option>
+              <option value="12">12 - Dec</option>
+            </select>
+            /
+            <select name="year">
+              <% (DateTime.now.year...DateTime.now.year + 20).each do |i| %>
+                <option value="<%= i-2000 %>"><%= i %></option>
+              <% end %>
+            </select>
+          </div>
+          
+          <!--<input type="submit" value="Submit" />-->
+        </form>
+      <% end %>
+    </div>    
+  </section>
+  <section id="checkout-continue">
+    <div id='message'></div>
+    <button class="blue">Continue</button>
+    <em>or</em>
+    <a href="/">return to the store</a>
+  </section>
+  <iframe id="relay" name="relay"></iframe>
+</div>
+
+<%= content_for :caboose_js do %>
+<%= javascript_include_tag 'caboose_store/modules/checkout_step4' %>
+<% end %>

data/app/views/caboose_store/checkout/step_one.html.erb

@@ -1,15 +1,50 @@
-<div id="checkout" class="loading">
-  <header>Thanks for shopping with Expeditions</header>
-  <section id="checkout-line-items"></section>
-  <h3><span>step 1 of 2</span></h3>
-  <figure class="loading"></figure>
-  <section id="checkout-login"></section>
-  <section id="checkout-address"></section>
+<div id="checkout">
+  <h2>Checkout</h2>
+  <%= raw checkout_nav(1) %>
   
-  <section id="checkout-continue">
-    <button class="blue">Continue</button>
-    <em>or</em>
+  <section id="checkout-login">
+    <div class="wrapper" class='login-choices'>
+      <ul>
+        <li><p>Already a member                       </p><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" id='register_button' >New Customer</button></li>
+        <li><p>No thanks                              </p><button data-login-action="guest"    id='guest_button'    >Continue As Guest</button></li>
+      </ul>
+    </div>
+    <section id='checkout-login-form'>    
+      <div class="wrapper" id='signin_form_container'>  
+        <form action="/login" method="post" id='signin_form'>
+          <input name="username" type="text" placeholder="Email" />
+          <input name="password" type="password" placeholder="Password" />
+          <input type="submit" value="Submit" />
+        </form>
+      </div>
+      <div class="wrapper" id='register_form_container'>  
+        <form action="/register" method="post" id='register_form'>
+          <input name="first_name" type="text" placeholder="First Name" />
+          <input name="last_name" type="text" placeholder="Last Name" />
+          <input name="email" type="text" placeholder="Email" />
+          <input name="phone" type="text" placeholder="Phone" />
+          <input name="pass1" type="password" placeholder="Password" />
+          <input name="pass2" type="password" placeholder="Confirm Password" />
+          <input type="submit" value="Submit" />
+        </form>
+      </div>
+      <div class="wrapper" id='guest_form_container'>  
+        <form action="/checkout/attach-guest" method="post" id='guest_form'>
+          <input name="email" type="text" placeholder="Email" />
+          <input name="confirm_email" type="email" placeholder="Confirm email" />
+          <input type="submit" value="Submit" />
+        </form>
+      </div>
+      <div id='message'></div>
+    </section>
+  </section>
+  
+  <section id="checkout-continue">        
     <a href="/">return to the store</a>
   </section>
 </div>
-
+                                    
+<%= content_for :caboose_js do %>
+<%= javascript_include_tag 'caboose_store/modules/checkout_step1' %>
+<% end %>

data/app/views/caboose_store/checkout/step_one_old.html.erb

@@ -0,0 +1,13 @@
+<div id="checkout" class="loading">
+  <header>Checkout Step 1 of 3</header>
+  <section id="checkout-line-items"></section>  
+  <figure class="loading"></figure>
+  <section id="checkout-login"></section>
+  <section id="checkout-address"></section>
+  
+  <section id="checkout-continue">
+    <button class="blue">Continue</button>
+    <em>or</em>
+    <a href="/">return to the store</a>
+  </section>
+</div>

data/app/views/caboose_store/checkout/step_three.html.erb

@@ -0,0 +1,23 @@
+<div id="checkout">  
+  <h2>Checkout</h2>
+  <%= raw checkout_nav(3) %>
+  <section id="checkout-shipping">  
+    <div class="wrapper">      
+      <p>Please select how you would like your products to be delivered</p>
+        <% @rates.each do |rate| %>
+          <button class="blue" data-shipping-code="<%= rate[:service_code] %>" data-shipping-method="<%= rate[:service_name] %>">
+            <%= number_to_currency(rate[:total_price], :precision => 2) %><br /><%= rate[:service_name] %>
+          </button>
+        <% end %>
+      </select>
+    </div>    
+  </section>  
+  <section id="checkout-continue">
+    <div id='message'></div>        
+    <a href="/">return to the store</a>
+  </section>
+</div>
+                                    
+<%= content_for :caboose_js do %>
+<%= javascript_include_tag 'caboose_store/modules/checkout_step3' %>
+<% end %>

data/app/views/caboose_store/checkout/step_two.html.erb

@@ -1,15 +1,51 @@
-<div id="checkout" class="loading">
-  <header>Thanks for shopping with Expeditions</header>
-  <h3><span>step 2 of 2</span></h3>
-  <figure class="loading"></figure>
-  <section id="checkout-shipping"></section>
-  <section id="checkout-line-items"></section>
-  <section id="checkout-payment"></section>
-  
-  <section id="checkout-complete">
-    <button class="blue">Complete my Purchase</button>
-    <em>or</em>
-    <a href="/">return to the store</a>
-  </section>
+<%
+sa = @order.shipping_address
+ba = @order.billing_address
+%>
+<div id="checkout">
+  <h2>Checkout</h2>
+  <%= raw checkout_nav(2) %>  
+  <form  action="/checkout/address" method="put" id='address_form'>
+    <section id="checkout-address">  
+      <div class="wrapper">      
+        <section>
+          <fieldset id="shipping">
+            <h3>Shipping Address</h3>
+            <label><span>First Name </span> <input name="shipping[first_name]" type="text" value="<%= sa ? sa.first_name : "" %>" /></label>
+            <label><span>Last Name  </span> <input name="shipping[last_name]"  type="text" value="<%= sa ? sa.last_name  : "" %>" /></label>
+            <label><span>Company    </span> <input name="shipping[company]"    type="text" value="<%= sa ? sa.company    : "" %>" /></label>
+            <label><span>Address 1  </span> <input name="shipping[address1]"   type="text" value="<%= sa ? sa.address1   : "" %>" /></label>
+            <label><span>Address 2  </span> <input name="shipping[address2]"   type="text" value="<%= sa ? sa.address2   : "" %>" /></label>
+            <label><span>City       </span> <input name="shipping[city]"       type="text" value="<%= sa ? sa.city       : "" %>" /></label>        
+            <label><span>State      </span> <select name="shipping[state]"><% States.all.each do |abbr, state| %><option value="<%= abbr %>" <%= sa && sa.state == abbr ? 'selected' : "" %>><%= state %></option><% end %></select></label>        
+            <label><span>Zip        </span> <input name="shipping[zip]"       type="text"  value="<%= sa ? sa.zip        : "" %>" /></label>
+            <label><input name="use_as_billing" type="checkbox" value="false" /> Use as billing address</label>
+          </fieldset>
+        </section>    
+        <section>
+          <fieldset id="billing">
+            <h3>Billing Address</h3>
+            <label><span>First Name </span> <input name="billing[first_name]" type="text" value="<%= ba ? ba.first_name : "" %>" /></label>
+            <label><span>Last Name  </span> <input name="billing[last_name]"  type="text" value="<%= ba ? ba.last_name  : "" %>" /></label>
+            <label><span>Company    </span> <input name="billing[company]"    type="text" value="<%= ba ? ba.company    : "" %>" /></label>
+            <label><span>Address 1  </span> <input name="billing[address1]"   type="text" value="<%= ba ? ba.address1   : "" %>" /></label>
+            <label><span>Address 2  </span> <input name="billing[address2]"   type="text" value="<%= ba ? ba.address2   : "" %>" /></label>
+            <label><span>City       </span> <input name="billing[city]"       type="text" value="<%= ba ? ba.city       : "" %>" /></label>
+            <label><span>State      </span> <select name="billing[state]"><% States.all.each do |abbr, state| %><option value="<%= abbr %>" <%= ba && ba.state == abbr ? 'selected' : "" %>><%= state %></option><% end %></select></label>                
+            <label><span>Zip        </span> <input name="billing[zip]"        type="text" value="<%= ba ? ba.zip        : "" %>" /></label>
+          </fieldset>
+        </section>        
+      </div>            
+    </section>
+    <section id="checkout-continue">
+      <div id='message'></div>
+      <button class="blue">Continue</button>
+      <em>or</em>
+      <a href="/">return to the store</a>
+    </section>
+  </form>  
 </div>
 
+<%= content_for :caboose_js do %>
+<%= javascript_include_tag 'caboose_store/modules/checkout_step2' %>
+<% end %>