<h1>Shopping Cart</h1>
{% if cart.item_count == 0 %}
  <p><strong>Your shopping basket is empty.</strong> Perhaps a featured item below is of interest...</p>
  <table id="gallery">
  {% tablerow product in collections.frontpage.products cols: 3 limit: 12 %}
    <div class="gallery-image">
      <a href="{{ product.url | within: collections.frontpage }}" title="{{ product.title | escape }} &mdash; {{ product.description | strip_html | truncate: 50 | escape }}"><img src="{{ product.images.first | product_img_url: 'medium' }}" alt="{{ product.title | escape }}" /></a>
    </div>
    <div class="gallery-info">
      <a href="{{ product.url | within: collections.frontpage }}">{{ product.title | truncate: 30 }}</a><br />
      <small>{{ product.price | money }}{% if product.compare_at_price_max > product.price %} <del>{{ product.compare_at_price_max | money }}</del>{% endif %}</small>
    </div>
  {% endtablerow %}
  </table>
{% else %}
<script type="text/javascript">
  function remove_item(id) {
      document.getElementById('updates_'+id).value = 0;
      document.getElementById('cartform').submit();
  }
</script>
<form action="/cart" method="post" id="cartform">
  <table id="basket">
    <tr>
      <th>Item Description</th>
      <th>Price</th>
      <th>Qty</th>
      <th>Delete</th>
      <th>Total</th>
    </tr>{% for item in cart.items %}
    <tr class="basket-{% cycle 'odd', 'even' %}">
      <td class="basket-column-one">
        <div class="basket-images">
          <a href="{{ item.product.url }}" title="{{ item.title | escape }} &mdash; {{ item.product.description | strip_html | truncate: 50 | escape }}"><img src="{{ item.product.images.first | product_img_url: 'thumb' }}" alt="{{ item.title | escape }}" /></a>
        </div>
        <div class="basket-desc">
          <p><a href="{{ item.product.url }}">{{ item.title }}</a></p>
          {{ item.product.description | strip_html | truncate: 120 }}
        </div>
      </td>
      <td class="basket-column">{{ item.price | money }}{% if item.variant.compare_at_price > item.price %}<br /><del>{{ item.variant.compare_at_price | money }}</del>{% endif %}</td>
      <td class="basket-column"><input type="text" size="4" name="updates[{{item.variant.id}}]" id="updates_{{ item.variant.id }}" value="{{ item.quantity }}" onfocus="this.select();"/></td>
      <td class="basket-column"><a href="#" onclick="remove_item({{ item.variant.id }}); return false;">Remove</a></td>
      <td class="basket-column">{{ item.line_price | money }}</td>
    </tr>{% endfor %}
  </table>
  <div id="basket-right">
    <h3>Subtotal {{ cart.total_price | money }}</h3>
    <input type="image" src="{{ 'update.png' | asset_url }}" id="update-cart" name="update" value="Update" />
    <input type="image" src="{{ 'checkout.png' | asset_url }}" name="checkout" value="Checkout" />
    {% if additional_checkout_buttons %}
    <div class="additional-checkout-buttons">
      <p>- or -</p>
      {{ content_for_additional_checkout_buttons }}
    </div>
    {% endif %}
  </div>
</form>{% endif %}
