wickes-css2 2.94.0-develop.2 → 2.94.0-develop.20

package/src/js/emulation/mock.js

@@ -10,5 +10,15 @@ Wick.FEMock = {
       "page": 2,
       "html": '<div class="card product-card " data-product-code="177473"> <div id="product_item_code_177473" class="card__inner card__inner-v2"> <div class="products-list-v2__badges price__badges-v2 price__badges-v2-red price__badges-v2-text-white"> <div class="products-list-v2__badge">2 for £34</div> </div> <a href="/" class="card__img-wrap" title="Dulux"> <img loading="lazy" class="card__img-v2" src="//media.wickes.co.uk/is/image/wickes/GPID_1100360630_00?$normal$" alt="Dulux" title="Dulux"> </a> <div class="product-card__content"> <div class="product-card__header"> <a href="/" class="product-card__title product-card__title-v2" title="Dulux">Dulux Silk Emulsion Paint - 61</a> <div class="product-card__reviews product-card__reviews-v2"> <div class="product-rating product-rating-v2"> <div class="rating-bg"> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <div class="rating-overlay" data-rating="4.9"> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> </div> </div> (41) </div> </div></div> <div class=" product-card__price "> <div class="product-card__price__old-price product-card__price_empty">&nbsp;</div> <div class="main-price"> <div class="main-price__value product-card__price-value "> £22</div> </div> <div class="product-card__price-sqm"> £8.80 per L</div> </div> <div class="energy-efficiency energy-efficiency--empty"> <div class="energy-efficiency__link">&nbsp;</div> </div> </div> </div> </div> <div class="card product-card " data-product-code="116987"> <div id="product_item_code_116987" class="card__inner card__inner-v2"> <div class="products-list-v2__badges price__badges-v2 price__badges-v2-red price__badges-v2-text-white"> <div class="products-list-v2__badge">2 for £34</div> </div> <a href="/" class="card__img-wrap" title="Dulux"> <img loading="lazy" class="card__img-v2" src="//media.wickes.co.uk/is/image/wickes/I9026_116987_00?$normal$" alt="Dulux" title="Dulux"> </a> <div class="product-card__content"> <div class="product-card__header"> <a href="/" class="product-card__title product-card__title-v2" title="Dulux">Dulux Matt Emulsion Paint - 62</a> <div class="product-card__reviews product-card__reviews-v2"> <div class="product-rating product-rating-v2"> <div class="rating-bg"> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <div class="rating-overlay" data-rating="4.8"> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> </div> </div> (58) </div> </div></div> <div class=" product-card__price "> <div class="product-card__price__old-price product-card__price_empty">&nbsp;</div> <div class="main-price"> <div class="main-price__value product-card__price-value "> £22</div> </div> <div class="product-card__price-sqm"> £8.80 per L</div> </div> <div class="energy-efficiency energy-efficiency--empty"> <div class="energy-efficiency__link">&nbsp;</div> </div> </div> </div> </div> <div class="card product-card " data-product-code="122385"> <div id="product_item_code_122385" class="card__inner card__inner-v2"> <a href="/" class="card__img-wrap" title="Wickes"> <img loading="lazy" class="card__img-v2" src="//media.wickes.co.uk/is/image/wickes/O0814_122385_00?$normal$" alt="Wickes" title="Wickes"> </a> <div class="product-card__content"> <div class="product-card__header"> <a href="/" class="product-card__title product-card__title-v2" title="Wickes">Wickes Vinyl Silk Emulsion Paint - 63</a> <div class="product-card__reviews product-card__reviews-v2"> <div class="product-rating product-rating-v2"> <div class="rating-bg"> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <div class="rating-overlay" data-rating="4.8"> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> </div> </div> (74) </div> </div></div> <div class=" product-card__price "> <div class="product-card__price__old-price product-card__price_empty">&nbsp;</div> <div class="main-price"> <div class="main-price__value product-card__price-value "> £15</div> </div> <div class="product-card__price-sqm"> £6 per L</div> </div> <div class="energy-efficiency energy-efficiency--empty"> <div class="energy-efficiency__link">&nbsp;</div> </div> </div> </div> </div> <div class="card product-card " data-product-code="122195"> <div id="product_item_code_122195" class="card__inner card__inner-v2"> <a href="/" class="card__img-wrap" title="Wickes"> <img loading="lazy" class="card__img-v2" src="//media.wickes.co.uk/is/image/wickes/O0814_122195_00?$normal$" alt="Wickes" title="Wickes"> </a> <div class="product-card__content"> <div class="product-card__header"> <a href="/" class="product-card__title product-card__title-v2" title="Wickes">Wickes Vinyl Matt Emulsion Paint - 64</a> <div class="product-card__reviews product-card__reviews-v2"> <div class="product-rating product-rating-v2"> <div class="rating-bg"> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <div class="rating-overlay" data-rating="4.7"> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> </div> </div> (88) </div> </div></div> <div class=" product-card__price "> <div class="product-card__price__old-price product-card__price_empty">&nbsp;</div> <div class="main-price"> <div class="main-price__value product-card__price-value "> £15</div> </div> <div class="product-card__price-sqm"> £6 per L</div> </div> <div class="energy-efficiency energy-efficiency--empty"> <div class="energy-efficiency__link">&nbsp;</div> </div> </div> </div> </div> <div class="card product-card " data-product-code="122300"> <div id="product_item_code_122300" class="card__inner card__inner-v2"> <a href="/" class="card__img-wrap" title="Wickes"> <img loading="lazy" class="card__img-v2" src="//media.wickes.co.uk/is/image/wickes/O0814_122300_00?$normal$" alt="Wickes" title="Wickes"> </a> <div class="product-card__content"> <div class="product-card__header"> <a href="/" class="product-card__title product-card__title-v2" title="Wickes">Wickes Vinyl Matt Emulsion Paint - 65</a> <div class="product-card__reviews product-card__reviews-v2"> <div class="product-rating product-rating-v2"> <div class="rating-bg"> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <i class="fa fa-star star-in" aria-hidden="true"></i> <div class="rating-overlay" data-rating="4.8"> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> <span class="star-overlay"> <i class="fa fa-star" aria-hidden="true"></i> </span> </div> </div> (61) </div> </div></div> <div class=" product-card__price "> <div class="product-card__price__old-price product-card__price_empty">&nbsp;</div> <div class="main-price"> <div class="main-price__value product-card__price-value "> £15</div> </div> <div class="product-card__price-sqm"> £6 per L</div> </div> <div class="energy-efficiency energy-efficiency--empty"> <div class="energy-efficiency__link">&nbsp;</div> </div> </div> </div> </div>'
     }
+  ],
+  orders: [
+    {
+      "page": 1,
+      "html": '<article class="active-orders__item"><header class="order-header"><h3 class="order-header__title">Order 940564000</h3><div class="order-status completed"><svg class="svg-inline--fa fa-check-circle fa-w-16 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg><span>Complete</span></div></header><section class="order-details"><div class="order-details__summary"><span class="order-details__price">£92.75</span> <span class="order-details__count">7 item(s)</span></div><time class="order-details__date" datetime="21st November 2024 4:32 PM">21st November 2024 4:32 PM</time></section><div class="view-more"><a class="link" href="/"><span>View More</span> <svg class="svg-inline--fa fa-arrow-right fa-w-14 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg></a></div></article><article class="active-orders__item"><header class="order-header"><h3 class="order-header__title">Order 940520023</h3><div class="order-status cancelled"><svg class="svg-inline--fa fa-times fa-w-10 icon" aria-hidden="true" focusable="false" data-prefix="far" data-icon="times" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" data-fa-i2svg=""><path fill="currentColor" d="M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z"></path></svg><span>Cancelled</span></div></header><section class="order-details"><div class="order-details__summary"><span class="order-details__price">£32.00</span> <span class="order-details__count">1 item(s)</span></div><time class="order-details__date" datetime="28th October 2024 7:29 AM">28th October 2024 7:29 AM</time></section><div class="view-more"><a class="link" href="/"><span>View More</span> <svg class="svg-inline--fa fa-arrow-right fa-w-14 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg></a></div></article>'
+    },
+    {
+      "page": 2,
+      "html": '<article class="active-orders__item"><header class="order-header"><h3 class="order-header__title">Order 940564001</h3><div class="order-status completed"><svg class="svg-inline--fa fa-check-circle fa-w-16 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg><span>Complete</span></div></header><section class="order-details"><div class="order-details__summary"><span class="order-details__price">£92.75</span> <span class="order-details__count">7 item(s)</span></div><time class="order-details__date" datetime="21st November 2024 4:32 PM">21st November 2024 4:32 PM</time></section><div class="view-more"><a class="link" href="/"><span>View More</span> <svg class="svg-inline--fa fa-arrow-right fa-w-14 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg></a></div></article><article class="active-orders__item"><header class="order-header"><h3 class="order-header__title">Order 940520002</h3><div class="order-status cancelled"><svg class="svg-inline--fa fa-times fa-w-10 icon" aria-hidden="true" focusable="false" data-prefix="far" data-icon="times" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" data-fa-i2svg=""><path fill="currentColor" d="M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z"></path></svg><span>Cancelled</span></div></header><section class="order-details"><div class="order-details__summary"><span class="order-details__price">£32.00</span> <span class="order-details__count">1 item(s)</span></div><time class="order-details__date" datetime="28th October 2024 7:29 AM">28th October 2024 7:29 AM</time></section><div class="view-more"><a class="link" href="/"><span>View More</span> <svg class="svg-inline--fa fa-arrow-right fa-w-14 icon" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="arrow-right" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M190.5 66.9l22.2-22.2c9.4-9.4 24.6-9.4 33.9 0L441 239c9.4 9.4 9.4 24.6 0 33.9L246.6 467.3c-9.4 9.4-24.6 9.4-33.9 0l-22.2-22.2c-9.5-9.5-9.3-25 .4-34.3L311.4 296H24c-13.3 0-24-10.7-24-24v-32c0-13.3 10.7-24 24-24h287.4L190.9 101.2c-9.8-9.3-10-24.8-.4-34.3z"></path></svg></a></div></article>'
+    }
   ]
 }

package/src/js/emulation/my-orders-local.js

@@ -0,0 +1,41 @@
+function getOrdersHtmlByCurrentPage({currentPage}) {
+  const matchingData = Wick.FEMock.orders.find(item => item.page === currentPage);
+  return matchingData.html;
+}
+
+function initMyOrdersEvent() {
+  if (!Wick?.MyOrders?.events) {
+    return;
+  }
+
+  $(window).on(Wick.MyOrders.events.MONTHLY_VIEW_EVENT, function ({ detail: { resolve, reject, payload } }) {
+    setTimeout(() => {
+      return resolve({});
+    }, 500);
+  });
+
+  $(window).on(Wick.MyOrders.events.SORT_BY_EVENT, function ({ detail: { resolve, reject, payload } }) {
+    setTimeout(() => {
+      return resolve({url: '/sitemap.html'});
+    }, 500);
+  });
+
+  $(window).on(Wick.MyOrders.events.CATEGORY_EVENT, function ({ detail: { resolve, reject, payload } }) {
+    setTimeout(() => {
+      return resolve({url: '/sitemap.html'});
+    }, 500);
+  });
+
+  $(window).on(Wick.MyOrders.events.LOAD_MORE_EVENT, function ({ detail: { resolve, reject, payload } }) {
+    setTimeout(() => {
+      resolve({
+        innerHTML: getOrdersHtmlByCurrentPage(payload),
+        callback: () => {}
+      });
+    }, 1500);
+  });
+}
+
+$(document).ready(function () {
+  initMyOrdersEvent();
+});

package/src/js/page/basket/summary-mobile.js

@@ -0,0 +1,22 @@
+const summaryMobileEl = {
+  summaryAside: '.summary__aside',
+  backToTop : '#back-to-top',
+  canDisplayPayPal: '#canDisplayPayPalOnBasketPage',
+};
+
+export function addClassToSummaryAside(data) {
+  const payPalEnabled = data?.paymentInfos?.payPalEnabled;
+  const clickAndCollectOnly = data.clickAndCollectOnly;
+  const canDisplayPayPal = $(summaryMobileEl.canDisplayPayPal).val() === 'true';
+  const isPayPalAllowed = payPalEnabled && clickAndCollectOnly && canDisplayPayPal;
+  const $aside = $(summaryMobileEl.summaryAside);
+  const $backToTop = $(summaryMobileEl.backToTop);
+
+  if (isPayPalAllowed === false) {
+    $aside.addClass('single-button');
+    $backToTop.addClass('single-button');
+  } else {
+    $aside.removeClass('single-button');
+    $backToTop.removeClass('single-button');
+  }
+}

package/src/js/page/basket-v2.js

@@ -29,6 +29,8 @@ import {
 } from './basket/session-sync'
 import {displayEnergyEfficiency} from "./basket/display-energy-efficiency";
 import {appendLoader, hideLoader, showLoader} from "./utils/loader";
+import {addClassToSummaryAside} from "./basket/summary-mobile";
+import { initStickyObserver } from './components/sticky-order-observer';
 
 var Wick = window.Wick || {};
 Wick.BasketPage = {
@@ -384,6 +386,7 @@ Wick.BasketPage = {
         } else {
             if (initial) {
                 Wick.BasketPage.getCartEntries(Wick.BasketData.updateCart);
+                addClassToSummaryAside(Wick.BasketData.updateCart);
                 const initialTotalPrice = Wick.BasketData.updateCart.totalPrice.value;
                 updateClearpayVisibility(initialTotalPrice);
             } else {
@@ -405,6 +408,7 @@ Wick.BasketPage = {
                 updateClearpayPlacements(Wick.BasketData.updateCart.totalPrice.value);
                 updateClearpayVisibility(Wick.BasketData.updateCart.totalPrice.value);
                 Wick.BasketPage.addPotentialPromo(Wick.BasketData.updateCart);
+                addClassToSummaryAside(Wick.BasketData.updateCart);
                 Wick.BasketPage.getCartEntries(Wick.BasketData.updateCart);
                 Wick.BasketPage.checkProductArrays(Wick.BasketData.updateCart) || Wick.BasketPage.removeOrderItem(repaintData);
                 updateBasketSession();
@@ -415,6 +419,7 @@ Wick.BasketPage = {
     },
     updateCartAction: function (response, info) {
         updateClearpayVisibility(response.totalPrice.value)
+        addClassToSummaryAside(response)
         if (info.initial) {
             Wick.BasketPage.getCartEntries(response);
         } else {
@@ -739,6 +744,7 @@ Wick.BasketPage = {
 
         Wick.BasketPage.paintActionButton();
         checkPayPalAvailability(data);
+        Wick.VatToggle.reapplyDisplayClass();
         $(document).trigger("cartRerender");
     },
     createBasketSection: function (type, group, data) {
@@ -848,11 +854,11 @@ Wick.BasketPage = {
                                     ? '<span class="order-item__value">FREE</span>'
                                     : Wick.VatToggle.isToggleVatAvailable()
                                         ? `
-                                            <div class="including-vat-inherit"><!--
+                                            <div class="including-vat"><!--
                                                 --><span class="order-item__value">${currentItem.basePrice.formattedValue}</span><!--
                                                 --><div class="price-vat">Inc.VAT</div>
                                             </div>
-                                            <div class="excluding-vat-inherit"><!--
+                                            <div class="excluding-vat"><!--
                                                 --><span class="order-item__value">${currentItem.basePriceExcVat.formattedValue}</span><!--
                                                 --><div class="price-vat">Exc.VAT</div>
                                             </div>
@@ -870,11 +876,11 @@ Wick.BasketPage = {
                                         ? '<span class="order-item__value">FREE</span>'
                                         : Wick.VatToggle.isToggleVatAvailable()
                                             ? `
-                                                <div class="including-vat-inherit"><!--
+                                                <div class="including-vat"><!--
                                                     --><span class="order-item__value">${currentItem.itemTotalWithoutDiscount.formattedValue}</span><!--
                                                     --><div class="price-vat">Inc.VAT</div><!--
                                                 --></div>
-                                                <div class="excluding-vat-inherit"><!--
+                                                <div class="excluding-vat"><!--
                                                     --><span class="order-item__value">${currentItem.itemTotalWithoutDiscountExcVat.formattedValue}</span><!--
                                                     --><div class="price-vat">Exc.VAT</div>
                                                 </div>
@@ -999,11 +1005,11 @@ Wick.BasketPage = {
                         ${
                             Wick.VatToggle.isToggleVatAvailable()
                                 ? `
-                                    <div class="including-vat-inherit"><!--
+                                    <div class="including-vat"><!--
                                         --><span class="order-item__value">£${item.product.pricePerSqm.formattedPriceWithoutCurrencySymbol}</span><!--
                                         --><div class="price-vat">Inc.VAT</div>
                                     </div>
-                                    <div class="excluding-vat-inherit"><!--
+                                    <div class="excluding-vat"><!--
                                         --><span class="order-item__value">£${item.product.pricePerSqmExcVat.formattedPriceWithoutCurrencySymbol}</span><!--
                                         --><div class="price-vat">Exc.VAT</div>
                                     </div>
@@ -1256,6 +1262,9 @@ Wick.BasketPage = {
         $(Wick.BasketPage.el.content).find(quantityButton).prop('disabled', false);
     }
 };
+
+$(document).on('cartUpdate', initStickyObserver);
+
 $(document).ready(function () {
     function init() {
 
@@ -1290,6 +1299,11 @@ $(document).ready(function () {
 
         $(Wick.BasketPage.el.voucherRemove).unbind('click');
         Wick.BasketPage.paintActionButton();
+        initStickyObserver(
+            $('[data-sticky-observe]'),
+            $('[data-sticky-element]'),
+            '.summary__aside.collapse.show'
+        );
         Wick.BasketPage.updateCart(...Array(3), true);
         setDefaultCharityValue();
         if (!$(Wick.BasketPage.el.loader).length) {

package/src/js/page/components/order-summary.js

@@ -1,4 +1,5 @@
 import {updateDiscount} from "./discounts";
+import {addClassToSummaryAside} from "../basket/summary-mobile";
 
 const osEl = {
     $summarySection: $('.summary'),
@@ -9,9 +10,9 @@ const osEl = {
     itemFree: '.checkout-widget__item-free',
     itemDeficit: '.checkout-widget__item-deficit',
     summaryDelivery: '.checkout-widget__item-delivery',
+    summaryMobileTotal: '.summary__mobile-bar-total',
 }
 
-
 export function updateOrderSummary(data, equalMap, isVoucher) {
     equalMap.forEach((obj) => {
         if ($(obj.item).length) {
@@ -32,9 +33,12 @@ export function updateOrderSummary(data, equalMap, isVoucher) {
         }
     })
 
+    const value = data.totalPrice?.formattedValue || data.total;
+
     updateDiscount(data, isVoucher);
     hideUnusedDeliveryTypeCost(data, isVoucher);
     calculateFreeDelivery(data);
+    updateSummaryMobileBarTotal(value);
 }
 
 function createCheckoutWidgetItem(obj) {
@@ -97,3 +101,6 @@ function calculateFreeDelivery(data) {
     })
 }
 
+function updateSummaryMobileBarTotal(formattedValue) {
+    $(osEl.summaryMobileTotal).text(formattedValue);
+}

package/src/js/page/components/sticky-order-observer.js

@@ -0,0 +1,49 @@
+export function initStickyObserver(observedElements, stickyElements, collapseSelector) {
+  let io;
+
+  const $observed = observedElements instanceof jQuery
+    ? observedElements
+    : $(observedElements);
+
+  const $sticky = stickyElements instanceof jQuery
+    ? stickyElements
+    : $(stickyElements);
+
+  if (!$observed.length || !$sticky.length) return;
+
+  function toggle(hide) {
+    $sticky.toggleClass('is-hidden', hide);
+    $('body').toggleClass('summary-hidden', hide);
+    if (hide) {
+      $(collapseSelector).collapse('hide');
+    }
+  }
+
+  if ('IntersectionObserver' in window) {
+    io = new IntersectionObserver(
+      entries => {
+        const anyInView = entries.some(e => e.isIntersecting);
+        toggle(anyInView);
+      },
+      { rootMargin: '0px 0px -20% 0px', threshold: 0 }
+    );
+    $observed.each((_, el) => io.observe(el));
+  } else {
+    // Fallback for older browsers
+    function check() {
+      let anyInView = false;
+      $observed.each(function () {
+        const r = this.getBoundingClientRect();
+        if (r.top < window.innerHeight * 0.8 && r.bottom > 0) {
+          anyInView = true;
+          return false; // break
+        }
+      });
+      toggle(anyInView);
+    }
+    $(window)
+      .off('scroll.sticky resize.sticky')
+      .on('scroll.sticky resize.sticky', check);
+    check();
+  }
+}

package/src/js/page/components/voucher.js

@@ -15,7 +15,7 @@ const voucherEl = {
     formInvalid: 'form_invalid',
     fieldRow: '.form-row[data-row-required]',
     rowValidationError: 'form-row_validation-error',
-    voucherHide: '.checkout-voucher-hide',
+    voucherHide: 'checkout-voucher-hide',
     fieldError: '.form-row__error',
     subtotal: '.checkout-widget__item-bold',
     vat: '.checkout-widget__item-vat',

package/src/js/page/default-store.js

@@ -0,0 +1,44 @@
+var Wick = window.Wick || {};
+
+Wick.DefaultStore = {
+  HIDDEN_CLASS_NAME: 'd-none',
+  el: {
+    searchForm: '.search-store',
+    $searchInput: $('.search-store #postcode'),
+    $btnClear: $('.search-store .btn--clear'),
+    $btnSubmit: $('.search-store .btn-search'),
+  },
+  getPostCode () {
+    return Wick.DefaultStore.el.$searchInput.val();
+  },
+  checkVisibilityOfClearButton () {
+    Wick.DefaultStore.el.$btnClear.toggleClass('d-block', Wick.DefaultStore.getPostCode().length > 0);
+  },
+  updateCollapseState() {
+    const dropdowns = $("#openingTimes, #specialTimes, #facilities");
+    const btn = $('[data-toggle="collapse"]');
+
+    if ($(window).width() >= 768) {
+      dropdowns.addClass("show");
+      if (btn.length) {
+        btn.attr("aria-expanded", "true");
+      }
+    } else {
+      dropdowns.removeClass("show");
+      if (btn.length) {
+        btn.attr("aria-expanded", "false");
+      }
+    }
+  },
+  init () {
+    Wick.DefaultStore.updateCollapseState();
+    $(window).resize( _.debounce(function () {
+      Wick.DefaultStore.updateCollapseState();
+    }, 200));
+    Wick.DefaultStore.el.$searchInput.on('input', Wick.DefaultStore.checkVisibilityOfClearButton);
+  }
+}
+
+$(document).ready(function () {
+  Wick.DefaultStore.init();
+});

package/src/js/page/my-orders.js

@@ -0,0 +1,165 @@
+import {createEvent} from "./utils/create-event";
+import {appendLoader, showLoader, hideLoader} from "./utils/loader";
+
+var Wick = window.Wick || {};
+
+Wick.MyOrders = {
+  events: {
+    MONTHLY_VIEW_EVENT: 'MONTHLY_VIEW_EVENT',
+    SORT_BY_EVENT: 'SORT_BY_EVENT',
+    LOAD_MORE_EVENT: 'LOAD_MORE_EVENT',
+    CATEGORY_EVENT: 'CATEGORY_EVENT',
+  },
+  HIDDEN_CLASS_NAME: 'd-none',
+  el: {
+    $myOrders: $('.my-orders'),
+    calendar: '#calendarInputFlatpickr',
+    loader: '.loader-wrapper',
+    $sortOrders: $('#sort_orders'),
+    $chooseDate: $('.flatpickr-datepicker[choose-date]'),
+    $showYears: $('.flatpickr-datepicker[show-years]'),
+    $desktopTabs: $('.nav-orders .nav-orders__item .link'),
+    $mobileTabs: $('.nav-orders .account-nav__link'),
+    $loadMoreBtn: $('.btn-load-more'),
+    oderList: '.active-orders',
+    $activeOrderState: $('.nav-orders .nav-orders__item.active .link')
+  },
+  initialPageNumber: 0,
+  numberOfPagesOrders: $('#numberOfPagesOrders').val(),
+  loaderPayload: {
+    wrapper: 'body',
+    hidden: true,
+    modifier: 'basket-loader',
+  },
+  chooseDate: '',
+  showYears: '',
+  getChooseDate () {
+    const attrValue = Wick.MyOrders.el.$chooseDate.attr('choose-date');
+    if (attrValue) {
+      Wick.MyOrders.chooseDate = attrValue
+    }
+  },
+  requestToUpdateOrders (currentEvent, payload) {
+    return new Promise((resolve, reject) => {
+      const eventDetail = {resolve, reject};
+      const event = createEvent(currentEvent, payload, eventDetail);
+      window.dispatchEvent(event);
+    })
+      .then(({url}) => {
+        if (!url) {
+          return;
+        }
+
+        window.location.href = url;
+      })
+      .catch((error) => {
+        console.error(error);
+      });
+  },
+  loadMore () {
+    showLoader(Wick.MyOrders.el.loader);
+
+    return new Promise((resolve, reject) => {
+      const eventDetail = {resolve, reject};
+      const payload = {
+        currentPage: ++Wick.MyOrders.initialPageNumber,
+        sort: Wick.MyOrders.el.$sortOrders.val() || '',
+        chooseDate: Wick.MyOrders.chooseDate,
+        orderState: Wick.MyOrders.getCurrentOrderState() || ''
+      };
+      const event = createEvent(Wick.MyOrders.events.LOAD_MORE_EVENT, payload, eventDetail);
+      window.dispatchEvent(event);
+    })
+      .then(({innerHTML, callback}) => {
+        if (!innerHTML) {
+          return;
+        }
+
+        Wick.MyOrders.showNewOrders(innerHTML);
+        Wick.MyOrders.toggleLoadMoreBtn();
+
+        if (callback) {
+          callback()
+        }
+      })
+      .finally(() => {
+        hideLoader(Wick.MyOrders.el.loader);
+        Wick.MyOrders.el.$loadMoreBtn.blur();
+      })
+  },
+  showNewOrders (newProductsHtml) {
+    const $newProductsHtml = $(newProductsHtml);
+    $(Wick.MyOrders.el.oderList).append($newProductsHtml);
+  },
+  toggleLoadMoreBtn () {
+    if (Wick.MyOrders.initialPageNumber + 1 >= +Wick.MyOrders.numberOfPagesOrders) {
+      Wick.MyOrders.el.$loadMoreBtn.addClass(Wick.MyOrders.HIDDEN_CLASS_NAME);
+    }
+  },
+  getShowYears () {
+    const attrValue = Wick.MyOrders.el.$showYears.attr('show-years');
+    if (attrValue) {
+      Wick.MyOrders.showYears = attrValue
+    }
+  },
+  initializeFlatpickr () {
+    Wick.Flatpickr.init({
+      id: Wick.MyOrders.el.calendar,
+      currentYear: new Date().getFullYear(),
+      minYear: new Date().getFullYear() - Wick.MyOrders.showYears,
+      dateFormat: "F Y",
+      static: true,
+      chooseDate: Wick.MyOrders.chooseDate,
+      onChangeCallback: function (dateStr) {
+        if (!dateStr || isNaN(new Date(dateStr))) {
+          Wick.MyOrders.chooseDate = "";
+        } else {
+          Wick.MyOrders.chooseDate = dateStr;
+        }
+
+        Wick.MyOrders.requestToUpdateOrders(Wick.MyOrders.events.MONTHLY_VIEW_EVENT, { chooseDate: Wick.MyOrders.chooseDate });
+      },
+    });
+  },
+  initializeSortOrdersHandler () {
+    Wick.MyOrders.el.$sortOrders.on('change', function () {
+      const selectedValue = $(this).val();
+      Wick.MyOrders.requestToUpdateOrders(Wick.MyOrders.events.SORT_BY_EVENT, { sortBy: selectedValue });
+    });
+  },
+  registerTabClickHandler (tabsElement) {
+    tabsElement.on('click', function (e) {
+      e.preventDefault();
+      const tabId = $(this).attr('id');
+      const orderState = tabId ? { orderState: tabId } : '';
+      Wick.MyOrders.requestToUpdateOrders(Wick.MyOrders.events.CATEGORY_EVENT, orderState);
+    });
+  },
+  handleCategoryTabClick () {
+    Wick.MyOrders.registerTabClickHandler(Wick.MyOrders.el.$desktopTabs);
+    Wick.MyOrders.registerTabClickHandler(Wick.MyOrders.el.$mobileTabs);
+  },
+  getCurrentOrderState () {
+    if (Wick.MyOrders.el.$activeOrderState.length) {
+      return Wick.MyOrders.el.$activeOrderState.attr('id')
+    }
+  },
+  init () {
+    Wick.MyOrders.getShowYears();
+    Wick.MyOrders.getChooseDate();
+    Wick.MyOrders.initializeFlatpickr();
+    Wick.MyOrders.initializeSortOrdersHandler()
+    Wick.MyOrders.handleCategoryTabClick();
+    appendLoader(Wick.MyOrders.loaderPayload);
+    Wick.MyOrders.el.$loadMoreBtn.on('click', Wick.MyOrders.loadMore);
+    Wick.HandleAccordions.handleOutsideClick();
+  }
+}
+
+$(document).ready(function () {
+  if (!Wick.MyOrders.el.$myOrders.length) {
+    return;
+  }
+
+  Wick.MyOrders.init();
+});