Merge pull request bigcommerce#435 from mcampa/helpers

Updated and replaced deprecated helpers

lang/en.json

@@ -164,7 +164,21 @@
         "loading": "Loading",
         "month": "Month",
         "day": "Day",
-        "year": "Year"
+        "year": "Year",
+        "short_months": {
+            "1": "Jan",
+            "2": "Feb",
+            "3": "Mar",
+            "4": "Apr",
+            "5": "May",
+            "6": "Jun",
+            "7": "Jul",
+            "8": "Aug",
+            "9": "Sep",
+            "10": "Oct",
+            "11": "Nov",
+            "12": "Dec"
+        }
     },
     "compare": {
         "button": "Compare Products",

templates/components/account/navigation.html

@@ -1,55 +1,55 @@
 <nav class="navBar navBar--sub">
     <ul class="navBar-section">
-        {{#compare account_page 'orders' operator='==='}}
+        {{#if account_page '===' 'orders'}}
             <li class="navBar-item is-active">{{lang 'account.nav.orders'}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.orders.all}}">{{lang 'account.nav.orders'}}</a>
             </li>
-        {{/compare}}
+        {{/if}}
         {{#if settings.returns_enabled}}
-            {{#compare account_page 'returns' operator='==='}}
+            {{#if account_page '===' 'returns'}}
                 <li class="navBar-item is-active">{{lang 'account.nav.returns'}}</li>
             {{else}}
                 <li class="navBar-item">
                     <a class="navBar-action" href="{{urls.account.returns}}">{{lang 'account.nav.returns'}}</a>
                 </li>
-            {{/compare}}
+            {{/if}}
         {{/if}}
-        {{#compare account_page 'messages' operator='==='}}
+        {{#if account_page '===' 'messages'}}
             <li class="navBar-item is-active">{{lang 'account.nav.messages' num_new_messages=customer.num_new_messages}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.inbox}}">{{lang 'account.nav.messages' num_new_messages=customer.num_new_messages}}</a>
             </li>
-        {{/compare}}
-        {{#compare account_page 'addresses' operator='==='}}
+        {{/if}}
+        {{#if account_page '===' 'addresses'}}
             <li class="navBar-item is-active">{{lang 'account.nav.addresses'}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.addresses}}">{{lang 'account.nav.addresses'}}</a>
             </li>
-        {{/compare}}
-        {{#compare account_page 'wishlists' operator='==='}}
+        {{/if}}
+        {{#if account_page '===' 'wishlists'}}
             <li class="navBar-item is-active">{{lang 'account.nav.wishlists' num_wishlists=customer.num_wishlists}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.wishlists.all}}">{{lang 'account.nav.wishlists' num_wishlists=customer.num_wishlists}}</a>
             </li>
-        {{/compare}}
-        {{#compare account_page 'recent_items' operator='==='}}
+        {{/if}}
+        {{#if account_page '===' 'recent_items'}}
             <li class="navBar-item is-active">{{lang 'account.nav.recently_viewed'}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.recent_items}}">{{lang 'account.nav.recently_viewed'}}</a>
             </li>
-        {{/compare}}
-        {{#compare account_page 'settings' operator='==='}}
+        {{/if}}
+        {{#if account_page '===' 'settings'}}
             <li class="navBar-item is-active">{{lang 'account.nav.settings'}}</li>
         {{else}}
             <li class="navBar-item">
                 <a class="navBar-action" href="{{urls.account.details}}">{{lang 'account.nav.settings'}}</a>
             </li>
-        {{/compare}}
+        {{/if}}
     </ul>
 </nav>

templates/components/account/returns-list.html

@@ -9,27 +9,27 @@ <h3 class="account-heading">{{lang 'account.returns.heading' }}</h3>
             </div>
             <div class="account-product-body">
                 <div class="account-orderStatus">
-                    {{#compare status 'ReturnStatusPending' operator='===' }}
+                    {{#if status '===' 'ReturnStatusPending'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.pending'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusReceived' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusReceived'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.received'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusAuthorized' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusAuthorized'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.authorized'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusRepaired' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusRepaired'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.repaired'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusRefunded' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusRefunded'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.refunded'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusRejected' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusRejected'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.rejected'}}</h6>
-                    {{/compare}}
-                    {{#compare status 'ReturnStatusCancelled' operator='===' }}
+                    {{/if}}
+                    {{#if status '===' 'ReturnStatusCancelled'}}
                         <h6 class="account-orderStatus-label">{{lang 'account.returns.status.cancelled'}}</h6>
-                    {{/compare}}
+                    {{/if}}
                 </div>
 
                 <h5 class="account-product-title">{{lang 'account.returns.list.return_number' id=id}}</h5>

templates/components/brand/product-listing.html

@@ -3,11 +3,11 @@
 {{> components/products/filter sort=brand.sort}}
 
 <form action="/compare" method='POST' data-product-compare>
-    {{#compare theme_settings.product_list_display_mode 'grid'}}
+    {{#if theme_settings.product_list_display_mode '===' 'grid'}}
         {{> components/products/grid products=brand.products show_compare=brand.show_compare theme_settings=theme_settings}}
     {{else}}
         {{> components/products/list products=brand.products show_compare=brand.show_compare theme_settings=theme_settings}}
-    {{/compare}}
+    {{/if}}
 
     {{#if brand.show_compare}}
         <input type="submit" value="{{lang 'compare.button'}}" class="button button--primary">

templates/components/cart/coupon-input.html

@@ -1,6 +1,5 @@
 <div class="cart-total-value">
 
-
     <button class="coupon-code-add">{{lang 'cart.coupons.add_coupon'}}</button>
 
     <button class="coupon-code-cancel" style="display: none;">{{lang 'cart.coupons.cancel'}}</button>

templates/components/cart/gift-certificate-input.html

@@ -1,10 +1,6 @@
 <div class="cart-total-value">
 
-    {{#compare cart.discount 0 operator='>'}}
-        <a href="#">{{cart.discount.formatted}}</a>
-    {{else}}
-        <button class="gift-certificate-add">{{lang 'cart.gift_certificates.gift_certificate'}}</button>
-    {{/compare}}
+    <button class="gift-certificate-add">{{lang 'cart.gift_certificates.gift_certificate'}}</button>
 
     <button class="gift-certificate-cancel" style="display: none;">{{lang 'cart.coupons.cancel'}}</button>
 </div>

templates/components/cart/modals/gift-wrapping-form.html

@@ -4,16 +4,16 @@ <h2 class="modal-header-title">{{lang 'cart.gift_wrapping.title'}}</h2>
 </div>
 <div class="modal-body">
 
-    {{#compare quantity 1 operator='>'}}
+    {{#if quantity '>' 1}}
         <p>{{lang 'cart.gift_wrapping.choose_how'}}</p>
-    {{/compare}}
+    {{/if}}
 
     <form class="form giftWrapping-form" action="{{urls.cart}}" method="post">
         <input type="hidden" name="action" value="save_giftwrapping">
         <input type="hidden" name="item_id" value="{{item_id}}">
         <fieldset class="form-fieldset">
 
-            <div class="form-field" {{#compare quantity 1 operator='==='}}style="display:none"{{/compare}}>
+            <div class="form-field" {{#if quantity '===' 1}}style="display:none"{{/if}}>
                 <input type="radio" class="form-radio" name="giftwraptype" id="girftWrapping-radio-same" checked="checked" value="same">
                 <label class="form-label" for="girftWrapping-radio-same">{{lang 'cart.gift_wrapping.option_same'}}</label>
 

templates/components/category/product-listing.html

@@ -1,11 +1,11 @@
 {{> components/products/filter sort=pagination.category.sort}}
 
 <form action="/compare" method='POST' data-product-compare>
-    {{#compare theme_settings.product_list_display_mode 'grid'}}
+    {{#if theme_settings.product_list_display_mode '===' 'grid'}}
         {{> components/products/grid products=category.products show_compare=category.show_compare theme_settings=theme_settings}}
     {{else}}
         {{> components/products/list products=category.products show_compare=category.show_compare theme_settings=theme_settings}}
-    {{/compare}}
+    {{/if}}
 
     {{#if category.show_compare}}
         <input type="submit" value="{{lang 'compare.button'}}" class="button button--primary">

templates/components/category/sort-box.html

@@ -2,14 +2,14 @@
     <div class="form-field">
         <label class="form-label" for="sort">{{lang 'common.sorter.sort_by'}}</label>
         <select class="form-select form-select--small" name="sort" id="sort">
-            <option value="featured" {{#compare sort 'featured' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.featured'}}</option>
-            <option value="newest" {{#compare sort 'newest' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.newest'}}</option>
-            <option value="bestselling" {{#compare sort 'bestselling' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.top_sellers'}}</option>
-            <option value="alphaasc" {{#compare sort 'alphaasc' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.alpha_asc'}}</option>
-            <option value="alphadesc" {{#compare sort 'alphadesc' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.alpha_desc'}}</option>
-            <option value="avgcustomerreview" {{#compare sort 'avgcustomerreview' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.reviews'}}</option>
-            <option value="priceasc" {{#compare sort 'priceasc' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.price_asc'}}</option>
-            <option value="pricedesc" {{#compare sort 'pricedesc' operator='==='}}selected{{/compare}}>{{lang 'common.sorter.price_desc'}}</option>
+            <option value="featured" {{#if sort '==' 'featured'}}selected{{/if}}>{{lang 'common.sorter.featured'}}</option>
+            <option value="newest" {{#if sort '==' 'newest'}}selected{{/if}}>{{lang 'common.sorter.newest'}}</option>
+            <option value="bestselling" {{#if sort '==' 'bestselling'}}selected{{/if}}>{{lang 'common.sorter.top_sellers'}}</option>
+            <option value="alphaasc" {{#if sort '==' 'alphaasc'}}selected{{/if}}>{{lang 'common.sorter.alpha_asc'}}</option>
+            <option value="alphadesc" {{#if sort '==' 'alphadesc'}}selected{{/if}}>{{lang 'common.sorter.alpha_desc'}}</option>
+            <option value="avgcustomerreview" {{#if sort '==' 'avgcustomerreview'}}selected{{/if}}>{{lang 'common.sorter.reviews'}}</option>
+            <option value="priceasc" {{#if sort '==' 'priceasc'}}selected{{/if}}>{{lang 'common.sorter.price_asc'}}</option>
+            <option value="pricedesc" {{#if sort '==' 'pricedesc'}}selected{{/if}}>{{lang 'common.sorter.price_desc'}}</option>
         </select>
     </div>
 </fieldset>

templates/components/common/currency-selector.html

@@ -1,4 +1,4 @@
-{{#compare currency_selector.currencies.length 1 operator='>'}}
+{{#if currency_selector.currencies.length '>' 1}}
 <ul class="navUser-section">
     <li class="navUser-item">
         <a class="navUser-action has-dropdown" href="#" data-dropdown="currencySelection" aria-controls="currencySelection" aria-expanded="false">{{lang 'common.currency' code=currency_selector.active_currency_code}}</a>
@@ -17,4 +17,4 @@
         </ul>
     </li>
 </ul>
-{{/compare}}
+{{/if}}

templates/components/common/forms/date.html

@@ -5,21 +5,21 @@
         <div class="form-field">
             <select class="form-select" name="{{month.name}}" id="{{id}}_day" data-label="month"  aria-required="{{required}}" {{#if private_id}}data-field-type="{{private_id}}"{{/if}}>
                 {{#each month.items}}
-                    <option {{#equals ../month.value value}} selected {{/equals}}value="{{value}}">{{label}}</option>
+                    <option {{#if ../month.value '==' value}} selected {{/if}}value="{{value}}">{{label}}</option>
                 {{/each}}
             </select>
         </div>
         <div class="form-field">
             <select class="form-select" name="{{day.name}}" id="{{id}}_month" data-label="day" aria-required="{{required}}" {{#if private_id}}data-field-type="{{private_id}}"{{/if}}>
                 {{#each day.items}}
-                    <option {{#equals ../day.value value}} selected {{/equals}}value="{{value}}">{{label}}</option>
+                    <option {{#if ../day.value '==' value}} selected {{/if}}value="{{value}}">{{label}}</option>
                 {{/each}}
             </select>
         </div>
         <div class="form-field">
             <select class="form-select" name="{{year.name}}" id="{{id}}_year" data-label="year" aria-required="{{required}}" {{#if private_id}}data-field-type="{{private_id}}"{{/if}}>
                 {{#each year.items}}
-                    <option {{#equals ../year.value value}} selected {{/equals}}value="{{value}}">{{label}}</option>
+                    <option {{#if ../year.value '==' value}} selected {{/if}}value="{{value}}">{{label}}</option>
                 {{/each}}
             </select>
         </div>

templates/components/common/navigation-mobile.html

@@ -30,7 +30,7 @@
             <a class="navPages-action" href="{{urls.auth.login}}">{{lang 'common.login'}}</a> {{lang 'common.or'}} <a class="navPages-action" href="{{urls.auth.create_account}}">{{lang 'common.sign_up'}}</a>
         </li>
         {{/if}}
-        {{#compare currency_selector.currencies.length 1 operator='>'}}
+        {{#if currency_selector.currencies.length '>' 1}}
         <li class="navPages-item">
             <a class="navPages-action has-dropdown" href="#" data-dropdown="currencySelection2" aria-controls="currencySelection2" aria-expanded="false">{{lang 'common.currency' code=currency_selector.active_currency_code}}</a>
             <ul class="dropdown-menu" id="currencySelection2" data-dropdown-content aria-hidden="true" tabindex="-1">
@@ -47,6 +47,6 @@
                 {{/each}}
             </ul>
         </li>
-        {{/compare}}
+        {{/if}}
     </ul>
 </nav>

templates/components/common/navigation.html

@@ -2,7 +2,7 @@
     {{> components/common/currency-selector}}
 
     <ul class="navUser-section navUser-section--alt">
-        {{#compare customer.store_credit.value 0 operator='>'}}
+        {{#if customer.store_credit.value '>' 0}}
             <li class="navUser-item">
                 <a class="navUser-action navUser-action--storeCredit"
                    data-dropdown="storeCredit-dropdown"
@@ -14,7 +14,7 @@
                     {{{lang 'common.store_credit' store_credit=customer.store_credit.formatted}}}
                 </div>
             </li>
-        {{/compare}}
+        {{/if}}
         <li class="navUser-item">
             <a class="navUser-action navUser-item--compare" href="/compare" data-compare-nav>{{lang 'common.compare'}} <span class="countPill countPill--positive countPill--alt"></span></a>
         </li>

templates/components/common/paginator.html

@@ -1,39 +1,40 @@
 <div class="pagination">
     <ul class="pagination-list">
         {{#if previous}}
-        <li class="pagination-item pagination-item--previous">
-            <a class="pagination-link" href="{{previous}}" data-faceted-search-facet>
-                <i class="icon" aria-hidden="true">
-                    <svg>
-                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-left"></use>
-                    </svg>
-                </i>
-                {{lang 'common.previous'}}
-            </a>
-        </li>
+            <li class="pagination-item pagination-item--previous">
+                <a class="pagination-link" href="{{previous}}" data-faceted-search-facet>
+                    <i class="icon" aria-hidden="true">
+                        <svg>
+                            <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-left"></use>
+                        </svg>
+                    </i>
+                    {{lang 'common.previous'}}
+                </a>
+            </li>
         {{/if}}
         {{#each links}}
-        {{#compare this.number ../current}}
-        <li class="pagination-item pagination-item--current">
-            <a class="pagination-link" href="{{this.url}}" data-faceted-search-facet>{{this.number}}</a>
-        </li>
-        {{else}}
-        <li class="pagination-item">
-            <a class="pagination-link" href="{{this.url}}" data-faceted-search-facet>{{this.number}}</a>
-        </li>
-        {{/compare}}
+            {{#if this.number '==' ../current}}
+                <li class="pagination-item pagination-item--current">
+                    <a class="pagination-link" href="{{this.url}}" data-faceted-search-facet>{{this.number}}</a>
+                </li>
+            {{else}}
+                <li class="pagination-item">
+                    <a class="pagination-link" href="{{this.url}}" data-faceted-search-facet>{{this.number}}</a>
+                </li>
+            {{/if}}
         {{/each}}
+
         {{#if next}}
-        <li class="pagination-item pagination-item--next">
-            <a class="pagination-link" href="{{next}}" data-faceted-search-facet>
-                {{lang 'common.next'}}
-                <i class="icon" aria-hidden="true">
-                    <svg>
-                        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-right"></use>
-                    </svg>
-                </i>
-            </a>
-        </li>
+            <li class="pagination-item pagination-item--next">
+                <a class="pagination-link" href="{{next}}" data-faceted-search-facet>
+                    {{lang 'common.next'}}
+                    <i class="icon" aria-hidden="true">
+                        <svg>
+                            <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-chevron-right"></use>
+                        </svg>
+                    </i>
+                </a>
+            </li>
         {{/if}}
     </ul>
 </div>