Merge pull request #440 from commercetools/wishlist

Apply changes from sunrise java wishlist implementation.
commercetools · Jun 15, 2017 · 3007417 · 3007417
2 parents 9579243 + f507b16
commit 3007417
Show file tree

Hide file tree

Showing 7 changed files with 94 additions and 77 deletions.
diff --git a/input/i18n/de/my-account.yaml b/input/i18n/de/my-account.yaml
@@ -78,6 +78,11 @@ myOrder:
     quantity: Quantity
     unitPrice: Price
     totalPrice: Total
+myWishlist:
+  title: Meine Wunschliste
+  clear: Alle löschen
+  itemsTotal: __count__ Artikel
+  itemsTotal_plural: __count__ Artikel
 changePassword:
   oldPasswordLabelTxt: Aktuelles Passwort
   newPasswordLabelTxt: Neues Passwort

diff --git a/input/i18n/en/my-account.yaml b/input/i18n/en/my-account.yaml
@@ -79,6 +79,11 @@ myOrder:
     quantity: Quantity
     unitPrice: Price
     totalPrice: Total
+myWishlist:
+  title: My Wishlist
+  clear: Delete all
+  itemsTotal: __count__ item in total
+  itemsTotal_plural: __count__ items in total
 changePassword:
   oldPasswordLabelTxt: Current password
   newPasswordLabelTxt: New password

diff --git a/input/templates/my-account-wishlist.hbs b/input/templates/my-account-wishlist.hbs
@@ -1,72 +1,67 @@
-
 <!DOCTYPE html>
 <html lang="en">
 
 <head>
-  {{> common/htmlhead}}
+    {{> common/htmlhead}}
 </head>
 
 <body>
-  <div class="darkbg hidden"></div>
-  {{> common/header}}
-  <div class="my-orders">
+<div class="darkbg hidden"></div>
+{{> common/header}}
+<div class="my-orders">
     <div class="container">
-      <div class="my-account-title">
-        <span class="my-account-title-text icon-user">{{i18n "my-account:myAccount.title"}}</span>
-      </div>
-      <div class="row">
-        <div class="col-sm-12">
-          <div class="my-orders-wrapper">
-            <div class="row">
-              <div class="col-sm-3">
-                {{> myaccount/my-account-sidebar myWishlistTab=true}}
-              </div>
-              <div id="my-account-desktop-content" class="col-sm-9">
-                <div class="my-orders-order-content">
-                  <div class="row">
-                    <div class="col-sm-12">
-                      <div class="my-orders-title hidden-xs">
-                        <span>{{content.contentTitle}}</span>
-                        <span class="my-account-wishlist-items-number">{{content.itemsInTotal}}</span>
-                      </div>
-                    </div>
-                  </div>
-                  {{> myaccount/my-account-wishlist-pagination}}
-                  <div class="my-account-wishlist-items-wrapper">
+        <div class="my-account-title">
+            <span class="my-account-title-text icon-user">{{i18n "my-account:myWishlist.title"}}</span>
+            &nbsp;&nbsp;&nbsp;
+            <span class="items-total-txt">{{i18n "my-account:myWishlist.itemsTotal" count=content.itemsInTotal}}</span>
+        </div>
+        <div class="row">
+            <div class="col-sm-12">
+                <div class="my-orders-wrapper">
                     <div class="row">
-                      {{#each content.products.list}}
-                        <div class="col-sm-6 col-md-4">
-                          {{> catalog/product-thumbnail thumbnail=this index=@index wishlist=true}}
-                          <div class="my-account-wishlist-remove-btn">
-                            <button>{{i18n "catalog:removeBtn.title"}}</button>
-                          </div>
+                        <div id="my-account-desktop-content" class="col-sm-12">
+                            <div class="my-orders-order-content">
+                                <div class="my-account-wishlist-items-wrapper">
+                                    <div class="row">
+                                        {{#each content.products.list}}
+                                            <div class="col-sm-6 col-md-3">
+                                                {{> catalog/product-thumbnail thumbnail=this index=@index wishlist=true}}
+                                                <form id="form-remove-from-wishlist{{index}}" name="remove-from-wishlist"
+                                                      action="{{@root.meta._links.removeFromWishlist.href}}" method="post">
+                                                    <input type="hidden" name="csrfToken"
+                                                           value="{{@root.meta.csrfToken}}"/>
+                                                    <input type="hidden" name="lineItemId" value="{{product.lineItemId}}">
+
+                                                    <div class="my-account-wishlist-remove-btn">
+                                                        <button type="submit">{{i18n
+                                                                "catalog:removeBtn.title"}}</button>
+                                                    </div>
+                                                </form>
+                                            </div>
+                                        {{/each}}
+                                    </div>
+                                </div>
+                                <div class="my-account-wishlist-pagination-bottom">
+                                </div>
+                                <div class="my-account-wishlist-clear-btn">
+                                    <form id="form-clear-wishlist" name="clear-wishlist"
+                                          action="{{@root.meta._links.clearWishlist.href}}" method="post">
+                                        <input type="hidden" name="csrfToken"
+                                               value="{{@root.meta.csrfToken}}"/>
+
+                                        <button type="submit">{{i18n "my-account:myWishlist.clear"}}</button>
+                                    </form>
+                                </div>
+                            </div>
                         </div>
-                      {{/each}}
-                    </div>
-                  </div>
-                  <div class="my-account-wishlist-pagination-bottom">
-                    <div class="row">
-                      <div class="col-sm-12 hidden-xs text-center custom-pagination">
-                        <ul class="page-numbers">
-                          {{> common/pagination pagination=content.pagination}}
-                        </ul>
-                      </div>
                     </div>
-                  </div>
-                  <div class="my-account-wishlist-clear-btn">
-                    <button>{{content.clearWishlistBtn}}</button>
-                  </div>
                 </div>
-              </div>
             </div>
-          </div>
         </div>
-      </div>
     </div>
-  </div>
-  {{!-- {{> common/wishlist}} --}}
-  {{> common/footer}}
-  {{> common/htmlscripts}}
+</div>
+{{> common/footer}}
+{{> common/htmlscripts}}
 </body>
 
 </html>
diff --git a/input/templates/partials/catalog/add-to-wishlist-btn.hbs b/input/templates/partials/catalog/add-to-wishlist-btn.hbs
@@ -1,5 +1,9 @@
-<form id="form-add-to-wishlist{{index}}" name="add-to-wishlist" action="{{@root.meta._links.addToWishlist.href}}">
-  <button type="submit" class="btn pdp-product-heart">
+<form id="form-add-to-wishlist{{index}}" method="post" name="add-to-wishlist" action="{{@root.meta._links.addToWishlist.href}}">
+    <input type="hidden" name="csrfToken" value="{{@root.meta.csrfToken}}"/>
+    <input type="hidden" name="productId" value="{{product.productId}}">
+    <input type="hidden" name="variantId" value="{{product.variantId}}">
+
+    <button type="submit" class="btn pdp-product-heart">
     <span class="sr-only">{{i18n "catalog:wishlist.add"}}</span>
   </button>
 </form>
diff --git a/input/templates/partials/catalog/product-thumbnail.hbs b/input/templates/partials/catalog/product-thumbnail.hbs
@@ -6,8 +6,12 @@
     {{#if thumbnail.new}}
       <div class="new-flag">{{i18n "catalog:thumbnail.new"}}</div>
     {{/if}}
-    <form id="form-add-to-wishlist-mobile{{index}}" {{#if wishlist}}class="hidden"{{/if}} name="add-to-wishlist-mobile" action="{{@root.meta._links.addToWishlist.href}}">
-      <button type="submit" class="heart-xs visible-xs">
+    <form id="form-add-to-wishlist-mobile{{index}}" method="post" {{#if wishlist}}class="hidden"{{/if}} name="add-to-wishlist-mobile" action="{{@root.meta._links.addToWishlist.href}}">
+        <input type="hidden" name="csrfToken" value="{{@root.meta.csrfToken}}"/>
+        <input type="hidden" name="productId" value="{{product.productId}}">
+        <input type="hidden" name="variantId" value="{{product.variantId}}">
+
+        <button type="submit" class="heart-xs visible-xs">
         <span class="sr-only">{{i18n "catalog:wishlist.add"}}</span>
       </button>
     </form>
@@ -44,12 +48,16 @@
       <button type="button" class="quickview" data-modal="quickview-modal{{index}}">
         {{i18n "catalog:thumbnail.quickView"}}
       </button>
-      <form id="form-add-to-wishlist{{index}}" {{#if wishlist}}class="hidden"{{/if}} name="add-to-wishlist" action="{{@root.meta._links.addToWishlist.href}}">
-        <button type="submit" class="heart">
+      <form id="form-add-to-wishlist{{index}}" method="post" {{#if wishlist}}class="hidden"{{/if}} name="add-to-wishlist" action="{{@root.meta._links.addToWishlist.href}}">
+          <input type="hidden" name="csrfToken" value="{{@root.meta.csrfToken}}"/>
+          <input type="hidden" name="productId" value="{{product.productId}}">
+          <input type="hidden" name="variantId" value="{{product.variantId}}">
+
+          <button type="submit" class="heart">
           <span class="sr-only">{{i18n "catalog:wishlist.add"}}</span>
         </button>
       </form>
     </div>
   </div>
 </a>
-{{> catalog/quickview}}
+{{> catalog/quickview wishlist=wishlist}}
diff --git a/input/templates/partials/catalog/quickview.hbs b/input/templates/partials/catalog/quickview.hbs
@@ -43,7 +43,7 @@
             </div>
             <div class="quickview-wishlist-row">
               <ul class="list-inline">
-                <li>
+                <li {{#if wishlist}}class="hidden"{{/if}}>
                   {{> catalog/add-to-wishlist-btn}}
                 </li>
                 <li>

diff --git a/input/templates/partials/common/wishlist.hbs b/input/templates/partials/common/wishlist.hbs
@@ -1,19 +1,19 @@
-{{#if @root.meta.features.wishlist.active}}
-  <div class="wishlist">
-      <button id="wishlist-open-btn" class="hidden-xs wishlist-btn">
-          <div class="wishlist-number">{{wishlist.quantity}}</div>
-      </button>
-      <div class="wishlist-items hidden">
-          <p class="wishlist-title">
+<div class="wishlist">
+    <button id="wishlist-open-btn" class="hidden-xs wishlist-btn">
+        <div class="wishlist-number">{{wishlist.quantity}}</div>
+    </button>
+    <div class="wishlist-items hidden">
+        <p class="wishlist-title">
             {{i18n "catalog:wishlist.title"}} <span>({{wishlist.quantity}})</span>
-          </p>
-          <span class="recently-added-title">{{i18n "catalog:wishlist.recentlyAdded"}}</span>
-          <div class="clearfix">
+        </p>
+        <span class="recently-added-title">{{i18n "catalog:wishlist.recentlyAdded"}}</span>
+        <div class="clearfix">
             {{#each wishlist.list}}
                 <img class="pull-left img-responsive wishlist-img" src="{{imageUrl}}" alt="{{name}}">
             {{/each}}
-          </div>
-          <a href="{{wishlist.url}}" id="wishlist-view-btn" class="btn view-wishlist-btn">{{i18n "catalog:wishlist.view"}}</a>
-      </div>
-  </div>
-{{/if}}
+        </div>
+        <a href="{{@root.meta._links.myWishlist.href}}" id="wishlist-view-btn" class="btn view-wishlist-btn">
+            {{i18n "catalog:wishlist.view"}}
+        </a>
+    </div>
+</div>