sectioned themes shipping calculator snippet

shipping-calculator

{% unless settings.shipping_calculator == 'Disabled' %}
<div id="shipping-calculator">
  <h3>{{ settings.shipping_calculator_heading | default: 'Get shipping estimates' }}</h3>
  <div>
    <p class="field">
      <label for="address_country">Country</label>
      <select id="address_country" name="address[country]" data-default="{% if shop.customer_accounts_enabled and customer %}{{ customer.default_address.country }}{% elsif settings.shipping_calculator_default_country != '' %}{{ settings.shipping_calculator_default_country }}{% endif %}">{{ country_option_tags }}</select>
    </p>
    <p class="field" id="address_province_container" style="display:none;">
      <label for="address_province" id="address_province_label">Province</label>
      <select id="address_province" name="address[province]" data-default="{% if shop.customer_accounts_enabled and customer and customer.default_address.province != '' %}{{ customer.default_address.province }}{% endif %}"></select>
    </p>  
    <p class="field">
      <label for="address_zip">Zip/Postal Code</label>
      <input type="text" id="address_zip" name="address[zip]"{% if shop.customer_accounts_enabled and customer %} value="{{ customer.default_address.zip }}"{% endif %} />
    </p>
    <p class="field">
      <input type="button" class="get-rates btn button" value="{{ settings.shipping_calculator_submit_button_label | default: 'Calculate shipping' }}" />
    </p>
  </div>
  <div id="wrapper-response"></div>
</div>
{% endunless %}

<script id="shipping-calculator-response-template" type="text/template">
  {% raw %}
  <p id="shipping-rates-feedback" {{#if success}} class="success" {{else}} class="error" {{/if}}>
  {{#if success}}
    {{#if rates}}
      {{#rates}}
        {{#if @first}}
            Rates start at {{price}}.
        {{/if}}
      {{/rates}}
    {{else}}
      We do not ship to this destination.
    {{/if}}    
  {{else}}
    {{ errorFeedback }}
  {{/if}}
  </p>
  {% endraw %}
</script>

<!--[if lte IE 8]>
<style> #shipping-calculator { display: none; } </style>
<![endif]-->

Hey I have a question that is really racking my brain. Instead of simply showing the response "Rates start at {{price}}" I am trying to get this to list out the rates. I've already adjusted the fist rate to read:

{{#if @FIRST}}
{{name}} at {{price}}.
{{/if}}

which prints something like:

Priority USPS Envelope at $4.25

...but I can't figure out how to list the rest of the rates. Please help! I love this addition to my shop, great work!

Actually I think I figure d it out. These seems to work:

`<script id="shipping-calculator-response-template" type="text/template">
{% raw %}

{{#if success}} {{#if rates}} {{#rates}}

    {{#if @first}}
        {{name}} at <b>{{price}}</b>
     <br />
     {{/if}}
     
     {{#if @index}}
        {{name}} at <b>{{price}}</b>
     <br />
     {{/if}}
     
  {{/rates}}
{{else}}
  We do not ship to this destination.
{{/if}}    

{{else}}
{{ errorFeedback }}
{{/if}}

{% endraw %} </script>`