spree_bootstrap_frontend 1.0.1

checksums.yaml

@@ -0,0 +1,15 @@
+---
+!binary "U0hBMQ==":
+  metadata.gz: !binary |-
+    NDM0NmQyYTRmNDIyOTZmYWI1YzhmMjQ0YTk3MGVmMjkwMGFhNDgyYg==
+  data.tar.gz: !binary |-
+    NTAwZTExYjdhNjU1N2NkYTU1NjcwOWYzOGY3YTAwZWYzYzUyNTU4YQ==
+SHA512:
+  metadata.gz: !binary |-
+    ZDJiYzMxNTFlYmM0ZjE5ZGFmZGU0NTY2NDM5ZjkwOGJlOTRlNzg5YzRjZmI4
+    NDcwMThiMzc1ZTY5NTUxM2Y4YzU5NjU5ZWRkMWVkZWJhZWYwNTU1MTlkYzkz
+    MzQ2NTIyMzZhN2M1YjVkYzFkZWYwZTg0MjUzZjFhYjc3MGY2OTE=
+  data.tar.gz: !binary |-
+    ZjFiZmYzNDJkMGFmZTVmNjZkODMxMGFjZjk3OGQ2OTI0MDJkYTFmMjM3MWFk
+    Mjk3ZDkwYjYzYWRkYTA1MmNjMDE1MTQ4YmY0YjA5ODFhZWJiOWYwOGVmODhk
+    N2I5NTNkZDA3ODI3YmZkYzg3NjgxYmE1MDFjMGQ0MzEzOTBhNWI=

data/.gitignore

@@ -0,0 +1,14 @@
+\#*
+*~
+.#*
+.DS_Store
+.idea
+.project
+.sass-cache
+coverage
+Gemfile.lock
+tmp
+nbproject
+pkg
+*.swp
+spec/dummy

data/.rspec

@@ -0,0 +1 @@
+--color

data/Gemfile

@@ -0,0 +1,7 @@
+source 'https://rubygems.org'
+
+# Provides basic authentication functionality for testing parts of your engine
+gem 'spree', github: 'spree/spree'
+gem 'spree_auth_devise', github: 'spree/spree_auth_devise'
+
+gemspec

data/LICENSE

@@ -0,0 +1,23 @@
+Copyright (c) 2013, 
+All rights reserved.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of source code must retain the above copyright notice, this
+  list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice, this
+  list of conditions and the following disclaimer in the documentation and/or
+  other materials provided with the distribution.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
+ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE FOR
+ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
+ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

data/README.md

@@ -0,0 +1,109 @@
+### Switches out Spree’s entire frontend for a bootstrap 3 powered frontend.
+
+This attempts to stay as closely to the original spree frontend markup as possible, only changing layout class names and adding a few DOM elements where required. Helper decorators have been kept to a bare minimum. It utilises the SCSS port of bootstrap 3 to keep inline with existing spree practices. It also includes support for `spree_auth_devise`.
+
+Ideally my goal is for this to replace spree’s current frontend. Or at least becoming a viable drop-in alternative. It has several large advantages:
+
+- Fully responsive - Mobile, tablet and desktop. With custom grids for each, collapsing elements, and full retina display support. Current spree only goes half way. 
+- Just 40 lines of custom SCSS, replacing 1328 lines of undocumented spree CSS. Plus most of these lines only add some visual style to the header and footer and can be removed. 
+- The entire frontend can be easily customized: colours, grid, spacing, etc, by just overriding [variables from bootstrap]() - giving a custom store design in minutes. 
+- Bootstrap has some of the most [robust documentation](http://getbootstrap.com/css) of any framework, and a hugely active community. As this port uses only default bootstrap it means that entire spree frontend layout is documented by default. 
+- Sites like [bootswatch](http://bootswatch.com) allow for one-file bootstrap drop-in spree themes.
+- Lots of [spree community will for bootstrap](https://groups.google.com/forum/#!searchin/spree-user/bootstrap/spree-user/B17492QdnGA/AF9vEzRzf4cJ). 
+- Though this uses ‘full bootstrap’ for simplicity, you can remove the unused SCSS components you don’t require for minimal file sizes. 
+- Bootstrap is one of the largest most active open source projects out there - maintaining an entire framework just for spree makes little sense. Forget about cross browser bugs. Woo!
+
+![spree_bootstrap_frontend preview](http://i.imgur.com/S50Gn7V.png)
+
+Installation
+-------
+
+**WARNING: The master branch is currently built against spree edge!**
+
+Add the following to your gemfile
+
+```ruby
+gem 'spree_bootstrap_frontend', github: '200Creative/spree_bootstrap_frontend'
+```
+
+And run
+
+```bash
+bundle install
+```
+
+Done.
+
+If you are running a stable branch of spree check if there is a compatible branch of spree_bootstrap_frontend and use that. For example:
+
+```ruby
+gem 'spree_bootstrap_frontend', github: '200Creative/spree_bootstrap_frontend', branch: '2-2-stable'
+```
+
+Compatibility
+-------
+
+**WARNING: The master branch is currently built against spree edge!**
+
+I’m targeting switching to a stable branch when `2-2-stable` is released, but as of now it's on `2.2.0.beta`. Stay tuned.
+Currenly only tested against rails 4.0.X.
+
+Customizing
+-------
+
+Copy the `spree_bootstrap_frontend.css.scss` file from `assets/stylesheets/store` into your application and edit as required.
+
+To style your spree store just override the bootstrap 3 variables. The full list of bootstrap variables can be found [here](http://getbootstrap.com/customize/#less-variables). You can override these by simply redefining the variable before the `@import` directive.
+For example:
+
+```scss
+$navbar-default-bg: #312312;
+$light-orange: #ff8c00;
+$navbar-default-color: $light-orange;
+
+@import "bootstrap";
+```
+
+This uses the [bootstrap-sass](https://github.com/thomas-mcdonald/bootstrap-sass) gem. So check there for full cutomization instructions.
+
+It’s quite powerful, here are some examples created in ~10 minutes with a few extra SCSS variables:
+
+![spree_bootstrap_frontend theme](http://i.imgur.com/zh34YJ5.png)
+
+Contributing
+-------
+
+Please fork and make a pull request.
+
+**Tests, tests, tests.** Although care has been taken to try and keep HTML changes to a minimum, this plugin currently breaks tests.
+To get it to a stage that it can be maintained moving forwards getting all tests passing is the highest priority.
+
+**I’m looking for help maintaining this, so anyone who would like to become a core contributor please email me.** My email is in the gemspec.
+
+Raise bugs in github’s [issues tracker](https://github.com/200Creative/spree_bootstrap_frontend/issues).
+
+Further discussion can be had in the [spree google group](https://groups.google.com/forum/#!forum/spree-user).
+
+
+Running tests
+-------
+
+Be sure to bundle your dependencies and then create a dummy test app for the specs to run against.
+
+```bash
+bundle
+bundle exec rake test_app
+bundle exec rspec spec
+```
+
+When testing your applications integration with this extension you may use it's factories.
+Simply add this require statement to your spec_helper:
+
+```ruby
+require 'spree_bootstrap_frontend/factories'
+```
+
+Licence
+-------
+
+Copyright Alex James ([200creative.com](http://200creative.com)) and released under the BSD Licence.

data/Rakefile

@@ -0,0 +1,15 @@
+require 'bundler'
+Bundler::GemHelper.install_tasks
+
+require 'rspec/core/rake_task'
+require 'spree/testing_support/extension_rake'
+
+RSpec::Core::RakeTask.new
+
+task :default => [:spec]
+
+desc 'Generates a dummy app for testing'
+task :test_app do
+  ENV['LIB_NAME'] = 'spree_bootstrap_frontend'
+  Rake::Task['extension:test_app'].invoke
+end

data/app/assets/javascripts/spree/backend/spree_bootstrap_frontend.js

@@ -0,0 +1 @@
+// Placeholder for dummy application

data/app/assets/javascripts/spree/frontend/spree_bootstrap_frontend.js

@@ -0,0 +1 @@
+// Placeholder for dummy application

data/app/assets/stylesheets/spree/backend/spree_bootstrap_frontend.css

@@ -0,0 +1 @@
+/* Placeholder for dummy application */

data/app/assets/stylesheets/spree/frontend/spree_bootstrap_frontend.css.scss

@@ -0,0 +1,45 @@
+@import "bootstrap";
+
+// -- Spree Custom Header and Footer ---------------------
+#spree-header {
+  background: #1c5c92 asset-url('store/spree-header.jpg') center center;
+  background-size: cover;
+  margin-bottom: $line-height-computed;
+  #header {
+    background: rgba(9, 22, 33, 0.4);
+    padding: $line-height-computed 0;
+  }
+  #logo {
+    margin-bottom: 10px;
+  }
+  .nav a {
+    color: #fff;
+    &:hover {
+      background:rgba(9, 22, 33, 0.4);  
+    }
+  }
+  .navbar {
+    border: 0;
+    margin-bottom: 0;
+  }
+}
+#spree-footer {
+  background: $gray-dark;
+  padding-top: $padding-base-horizontal;
+  margin-top: $line-height-computed;
+  color: #fff;
+}
+
+// -- Spree Layout Custom Rules -------------------------
+.alert-error { //This is a hack, TODO FIXME
+  .alert-danger{};
+}
+.product-body {
+  height: 170px;
+}
+.progress-steps {
+  margin-top: $line-height-computed;
+}
+h1 {
+  margin-bottom: 30px;
+}

data/app/assets/stylesheets/spree/frontend/spree_frontend.css.scss

@@ -0,0 +1,5 @@
+/*
+* This is a manifest file that includes stylesheets for spree_frontend
+* Spree_bootstrap_frontend overrides all spree’s defualt css and resets here in favour of bootstrap
+ *= require spree/frontend/spree_bootstrap_frontend
+*/

data/app/helpers/spree/base_helper_decorator.rb

@@ -0,0 +1,57 @@
+Spree::BaseHelper.module_eval do
+  def link_to_cart(text = nil)
+    return "" if current_spree_page?(spree.cart_path)
+
+    text = text ? h(text) : Spree.t('cart')
+    css_class = nil
+
+    if current_order.nil? or current_order.item_count.zero?
+      text = "<span class='glyphicon glyphicon-shopping-cart'></span> #{text}: (#{Spree.t('empty')})".html_safe
+      css_class = 'empty'
+    else
+      text = "<span class='glyphicon glyphicon-shopping-cart'></span> #{text}: (#{current_order.item_count})  <span class='amount'>#{current_order.display_total.to_html}</span>".html_safe
+      css_class = 'full'
+    end
+
+    link_to text, spree.cart_path, :class => "cart-info #{css_class}"
+  end
+
+  def flash_messages(opts = {})
+    opts[:ignore_types] = [:commerce_tracking].concat(Array(opts[:ignore_types]) || [])
+
+    flash.each do |msg_type, text|
+      unless opts[:ignore_types].include?(msg_type)
+        concat(content_tag :div, text, class: "alert alert-#{msg_type}")
+      end
+    end
+    nil
+  end
+
+  def taxons_tree(root_taxon, current_taxon, max_level = 1)
+    return '' if max_level < 1 || root_taxon.children.empty?
+    content_tag :ul, class: 'list-group' do
+      root_taxon.children.map do |taxon|
+        css_class = (current_taxon && current_taxon.self_and_ancestors.include?(taxon)) ? 'list-group-item current' : 'list-group-item'
+        content_tag :li, class: css_class do
+         link_to(taxon.name, seo_url(taxon)) +
+         taxons_tree(taxon, current_taxon, max_level - 1)
+        end
+      end.join("\n").html_safe
+    end
+  end
+
+  def breadcrumbs(taxon, separator="&nbsp;")
+    return "" if current_page?("/") || taxon.nil?
+    separator = raw(separator)
+    crumbs = [content_tag(:li, link_to(Spree.t(:home), spree.root_path) + separator)]
+    if taxon
+      crumbs << content_tag(:li, link_to(Spree.t(:products), products_path) + separator)
+      crumbs << taxon.ancestors.collect { |ancestor| content_tag(:li, link_to(ancestor.name , seo_url(ancestor)) + separator) } unless taxon.ancestors.empty?
+      crumbs << content_tag(:li, content_tag(:span, link_to(taxon.name , seo_url(taxon))))
+    else
+      crumbs << content_tag(:li, content_tag(:span, Spree.t(:products)))
+    end
+    crumb_list = content_tag(:ol, raw(crumbs.flatten.map{|li| li.mb_chars}.join), class: 'breadcrumb')
+    content_tag(:nav, crumb_list, id: 'breadcrumbs', class: 'col-md-12')
+  end
+end

data/app/helpers/spree/checkout_helper_decorator.rb

@@ -0,0 +1,30 @@
+Spree::CheckoutHelper.module_eval do
+	def checkout_progress
+      states = checkout_states
+      items = states.map do |state|
+        text = Spree.t("order_state.#{state}").titleize
+
+        css_classes = []
+        current_index = states.index(@order.state)
+        state_index = states.index(state)
+
+        if state_index < current_index
+          css_classes << 'completed'
+          text = link_to text, checkout_state_path(state)
+        end
+
+        css_classes << 'next' if state_index == current_index + 1
+        css_classes << 'active' if state == @order.state
+        css_classes << 'first' if state_index == 0
+        css_classes << 'last' if state_index == states.length - 1
+        # No more joined classes. IE6 is not a target browser.
+        # Hack: Stops <a> being wrapped round previous items twice.
+        if state_index < current_index
+          content_tag('li', text, class: css_classes.join(' '))
+        else
+          content_tag('li', content_tag('a', text), class: css_classes.join(' '))
+        end
+      end
+      content_tag('ul', raw(items.join("\n")), class: 'progress-steps nav nav-pills nav-justified', id: "checkout-step-#{@order.state}")
+    end
+end

data/app/views/spree/address/_form.html.erb

@@ -0,0 +1,75 @@
+<% address_id = address_type.chars.first %>
+<div class="inner" data-hook=<%="#{address_type}_inner" %>>
+  <p class="field" id=<%="#{address_id}firstname" %>>
+    <%= form.label :firstname, Spree.t(:first_name) %><span class="required">*</span><br />
+    <%= form.text_field :firstname, :class => 'form-control required' %>
+  </p>
+  <p class="field" id=<%="#{address_id}lastname" %>>
+    <%= form.label :lastname, Spree.t(:last_name) %><span class="required">*</span><br />
+    <%= form.text_field :lastname, :class => 'form-control required' %>
+  </p>
+  <% if Spree::Config[:company] %>
+    <p class="field" id=<%="#{address_id}company" %>>
+      <%= form.label :company, Spree.t(:company) %><br />
+      <%= form.text_field :company, :class => 'form-control' %>
+    </p>
+  <% end %>
+  <p class="field" id=<%="#{address_id}address1" %>>
+    <%= form.label :address1, Spree.t(:street_address) %><span class="required">*</span><br />
+    <%= form.text_field :address1, :class => 'form-control  required' %>
+  </p>
+  <p class="field" id=<%="#{address_id}address2" %>>
+    <%= form.label :address2, Spree.t(:street_address_2) %><br />
+    <%= form.text_field :address2, :class => 'form-control' %>
+  </p>
+  <p class="field" id=<%="#{address_id}city" %>>
+    <%= form.label :city, Spree.t(:city) %><span class="required">*</span><br />
+    <%= form.text_field :city, :class => 'form-control required' %>
+  </p>
+  <p class="field" id=<%="#{address_id}country" %>>
+    <%= form.label :country_id, Spree.t(:country) %><span class="required">*</span><br />
+    <span id=<%="#{address_id}country-selection" %>>
+      <%= form.collection_select :country_id, available_countries, :id, :name, {}, {:class => 'form-control required'} %>
+    </span>
+  </p>
+
+  <% if Spree::Config[:address_requires_state] %>
+    <p class="field" id=<%="#{address_id}state" %>>
+      <% have_states = !address.country.states.empty? %>
+      <%= form.label :state, Spree.t(:state) %><span class='required' id=<%="#{address_id}state-required"%>>*</span><br/>
+
+      <% state_elements = [
+         form.collection_select(:state_id, address.country.states,
+                            :id, :name,
+                            {:include_blank => true},
+                            {:class => have_states ? 'form-control required' : 'form-control hidden',
+                            :disabled => !have_states}) +
+         form.text_field(:state_name,
+                            :class => !have_states ? 'form-control required' : 'form-control hidden',
+                            :disabled => have_states)
+         ].join.gsub('"', "'").gsub("\n", "")
+      %>
+      <%= javascript_tag do -%>
+        $('#<%="#{address_id}state" %>').append("<%== state_elements %>");
+      <% end %>
+    </p>
+      <noscript>
+        <%= form.text_field :state_name, :class => 'form-control required' %>
+      </noscript>
+  <% end %>
+
+  <p class="field" id=<%="#{address_id}zipcode" %>>
+    <%= form.label :zipcode, Spree.t(:zip) %><span class="required">*</span><br />
+    <%= form.text_field :zipcode, :class => 'form-control required' %>
+  </p>
+  <p class="field" id=<%="#{address_id}phone" %>>
+    <%= form.label :phone, Spree.t(:phone) %><span class="required">*</span><br />
+    <%= form.phone_field :phone, :class => 'form-control required' %>
+  </p>
+  <% if Spree::Config[:alternative_shipping_phone] %>
+    <p class="field" id=<%="#{address_id}altphone" %>>
+      <%= form.label :alternative_phone, Spree.t(:alternative_phone) %><br />
+      <%= form.phone_field :alternative_phone, :class => 'form-control' %>
+    </p>
+  <% end %>
+</div>

data/app/views/spree/checkout/_address.html.erb

@@ -0,0 +1,41 @@
+<div class="row">
+  <div class="col-sm-6" data-hook="billing_fieldset_wrapper">
+    <div class="panel panel-default" id="billing" data-hook>
+      <%= form.fields_for :bill_address do |bill_form| %>
+        <div class="panel-heading">
+          <h3 class="panel-title"><%= Spree.t(:billing_address) %></h3>
+        </div>
+        <div class="panel-body">
+          <%= render :partial => 'spree/address/form', :locals => { :form => bill_form, :address_type => 'billing', :address => @order.bill_address } %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+
+  <div class="col-sm-6" data-hook="shipping_fieldset_wrapper">
+    <div class="panel panel-default" id="shipping" data-hook>
+      <%= form.fields_for :ship_address do |ship_form| %>
+        <div class="panel-heading">
+          <h3 class="panel-title"><%= Spree.t(:shipping_address) %></h3>
+        </div>
+        <div class="panel-body">
+          <p class="field checkbox" data-hook="use_billing">
+            <%= check_box_tag 'order[use_billing]', '1', @order.shipping_eq_billing_address? %>
+            <%= label_tag :order_use_billing, Spree.t(:use_billing_address), :id => 'use_billing' %>
+          </p>
+          <%= render :partial => 'spree/address/form', :locals => { :form => ship_form, :address_type => 'shipping', :address => @order.ship_address } %>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</div>
+
+<div class="well text-right form-buttons" data-hook="buttons">
+  <%= submit_tag Spree.t(:save_and_continue), :class => 'btn btn-lg btn-success' %>
+
+  <span data-hook="save_user_address">
+    &nbsp; &nbsp;
+    <%= check_box_tag 'save_user_address', '1', try_spree_current_user.respond_to?(:persist_order_address) %>
+    <%= label_tag :save_user_address, Spree.t(:save_my_address) %>
+  </span>
+</div>