vfonic/solidify

{% comment %}
  Important notes about pagination:
  - Never access collection.products before the opening paginate tag.
  - Never paginate by more than 50.
{% endcomment %}

{% assign products_per_page = settings.products_per_row | times: settings.number_of_rows %}
{% assign numbers = 'zero, one, two, three, four, five, six' | split: ',' %}
{% assign products_per_row = settings.products_per_row | times: 1 %}
{% assign products_per_row = numbers[products_per_row] | strip | append: '-per-row' %}

{% paginate collection.products by products_per_page %}

{% comment %}
  Re-use the .rte class wherever you output content that was added by a merchant using
  the Rich Text Editor ( 'rte' stands for rich text editor ).
  Style all HTML elements in that content the same way across the board.
  Use the .rte class in your CSS to help maintain consistency.
  Example: the h2 element should have the same size and color in:
  - product descriptions
  - collection descriptions
  - page content
  - blog post
{% endcomment %}

<h1 class="left">{{ collection.title }}</h1>

{% comment %}
  Collection sorting. Needs the JavaScript that is at the bottom of this file.
{% endcomment %}
{% if collection.products_count > 1 %}
<select class="sort-by right">
  <option value="manual">Featured</option>
  <option value="price-ascending">Price: Low to High</option>
  <option value="price-descending">Price: Hight to Low</option>
  <option value="title-ascending">A-Z</option>
  <option value="title-descending">Z-A</option>
  <option value="created-ascending">Oldest to Newest</option>
  <option value="created-descending">Newest to Oldest</option>
  <option value="best-selling">Best Selling</option>
 </select>
{% endif %}

{% comment %}
  Listing all tags within the current collection.
  Shopify uses product tags to manage subcategories inside collections.
  See 'How do I create subcategories of products?' at 
  http://bit.ly/1j1Dti4 for details.
{% endcomment %}

{% if collection.all_tags.size > 0 %}
<ul class="subcategories clearfix clear">
  <li class="{% unless current_tags %} active{% endunless %}">
    {{ 'All' | link_to_remove_tag: current_tags.first }}
  </li>
  {% for tag in collection.all_tags %}
  {% if current_tags contains tag %}
  <li class="active">
    {{ tag | link_to_remove_tag: tag }}
  </li>
  {% else %}
  <li>
    {{ tag | link_to_tag: tag }}
  </li>
  {% endif %}
  {% endfor %}  
</ul>
{% endif %}

{% if collection.description.size > 0 %}
<div class="rte clearfix">
  {{ collection.description }}
</div>
{% endif %}

<ul class="grid clearfix">
{% for product in collection.products %}
  {% include 'product-grid-item' with products_per_row %}
{% else %}
  <p>There are no products in this view.</p>
{% endfor %}
</ul>

{% if paginate.pages > 1 %}
<div class="pagination centered">
  {{ paginate | default_pagination }}
</div>
{% endif %}

{% endpaginate %}

{% comment %}
  JavaScript for collection sorting.
{% endcomment %}
<script>
jQuery('.sort-by')
  .val('{{ collection.sort_by | default: collection.default_sort_by }}')
  .on('change', function() {
    Shopify.queryParams.sort_by = jQuery(this).val();
    location.search = jQuery.param(Shopify.queryParams).replace(/\+/g, '%20');
  });
</script>