wickes-css2 2.98.0-develop.7 → 2.98.0-develop.9

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

@@ -16,8 +16,8 @@ import {checkPayPalAvailability} from './basket/paypal';
 import {
     updateCharity,
     changeCharityPrice,
-    toggleCharityElements,
-    setDefaultCharityValue
+    setDefaultCharityValue,
+    initCharityInteractions,
 } from './components/charity';
 import {callAction} from './utils/http-action';
 import {ROUTES} from './utils/routes';
@@ -29,8 +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';
+import {addClassToSummaryAside} from "./basket/summary-mobile";
 
 var Wick = window.Wick || {};
 Wick.BasketPage = {
@@ -80,7 +80,7 @@ Wick.BasketPage = {
         orderItemInfoOffers: 'order-item__info-offers',
         charityInput: '#donation',
         charityItem: '.charity-new',
-        donationCartBtn: '.donation-cart__btn',
+        donationCartBtn: '.donation-cart__btn, .donation-cart-new__btn',
         checkoutWidgetDetails: '.checkout-widget__details',
         checkoutWidgetDetailsFlex: 'checkout-widget__details-flex',
         subtotal: '.checkout-widget__item-bold',
@@ -311,7 +311,6 @@ Wick.BasketPage = {
         } else {
             if (charity) {
                 Wick.BasketPage.updateCart();
-                quantityToUpdate === 0 && toggleCharityElements();
             } else {
                 if (maxValue > 1 || minValue > 1) {
                     if (quantityToUpdate > maxValue || quantityToUpdate < minValue) {
@@ -1282,8 +1281,16 @@ $(document).ready(function () {
         $(Wick.BasketPage.el.content).on('focusout', Wick.BasketPage.el.quantityValue, Wick.BasketPage.changeOnBlur);
         $(Wick.BasketPage.el.content).on('click', Wick.BasketPage.el.deliveryButtonInCC, Wick.BasketPage.changeMethodToDelivery);
         $(Wick.BasketPage.el.content).on('click', Wick.BasketPage.el.updateStoreButton, Wick.BasketPage.changeMethodToCC);
-        $(Wick.BasketPage.el.charityInput).on('click', updateCharity);
-        $(Wick.BasketPage.el.donationCartBtn).on('click', changeCharityPrice);
+        $(Wick.BasketPage.el.donationCartBtn).on('click', function(e) {
+            e.preventDefault();
+            const context = $(this).closest(Wick.BasketPage.el.charityItem);
+            if (!context.hasClass('charity-added')) {
+                updateCharity(this);
+                context.addClass('charity-added');
+            } else {
+                changeCharityPrice.call(this);
+            }
+        });
         $(Wick.BasketPage.el.charityItem).on('click', Wick.BasketPage.el.removeButton, updateCharity);
         $(Wick.BasketPage.el.orderSummary).on('click', Wick.BasketPage.el.voucherRemove, voucherRemove);
         $(Wick.BasketPage.el.promoWrapper).on('click', Wick.BasketPage.el.promoClose, Wick.BasketPage.removePromotion);
@@ -1305,7 +1312,9 @@ $(document).ready(function () {
             '.summary__aside.collapse.show'
         );
         Wick.BasketPage.updateCart(...Array(3), true);
+
         setDefaultCharityValue();
+        initCharityInteractions();
         if (!$(Wick.BasketPage.el.loader).length) {
             appendLoader(Wick.BasketPage.loaderPayload);
         }

package/build/js/page/billie-business-type.js

@@ -0,0 +1,34 @@
+var Wick = window.Wick || {};
+
+Wick.BusinessType = {
+  el: {
+    radios: 'input[name="businessType"]',
+    panels: '.radio-expanded-content'
+  },
+
+  refreshPanels() {
+    const $radios = $(this.el.radios);
+    const $panels = $(this.el.panels);
+    const selectedValue = $radios.filter(':checked').val();
+
+    $panels.hide();
+    $(`#${selectedValue}-fields`).show();
+  },
+
+  bindEvents() {
+    $(this.el.radios).on('change', this.refreshPanels.bind(this));
+  },
+
+  init() {
+    if (!$(this.el.radios).length) {
+      return;
+    }
+
+    this.refreshPanels();
+    this.bindEvents();
+  }
+};
+
+$(document).ready(function () {
+  Wick.BusinessType.init();
+});

package/build/js/page/checkout-payment-details.js

@@ -62,6 +62,14 @@ Wick.CheckoutPaymentDetails = (function() {
       case 'klarna':
         hideBillingAddres();
         break;
+      case 'billie':
+        detailsLabel = {
+          ...detailsLabel,
+          labelText: 'Name on Billie account',
+          buttonText: 'Pay with Billie'
+        }
+        changeLabelText(detailsLabel);
+        break;
       case 'clearpay':
         detailsLabel = {
           ...detailsLabel,

package/build/js/page/components/charity.js

@@ -8,34 +8,47 @@ const charityEl = {
   charityInput: '#donation',
   charityTitleWrap: '.title-wrap',
   donationCart: '.donation-cart',
-  donationCartBtn: '.donation-cart__btn',
-  donationCartHolder: '.donation-cart__holder',
   donationCartHide: 'donation-cart__hide',
-  donationCartValue: '.donation-cart__value',
+  donationCartBtn: '.donation-cart__btn, .donation-cart-new__btn',
+  donationCartBtnSelected: '.donation-cart-new__btn.btn-selected',
+  donationCartHolder: '.donation-cart__holder, .donation-cart-new__holder',
+  donationCartValue: '.donation-cart__value, .donation-cart-new__value',
   charityAdded: 'charity-added',
+  donationCartCostBlock: '.donation-cart-new__cost',
+  donationCartCostBlockHide: 'donation-cart-new__cost-hide',
+  donationCartRemove: '.donation-cart-new__cost .order-item__remove',
 }
 
-export function updateCharity() {
-  //checkbox action
+export function updateCharity(button) {
   if ($('#donation').attr('disabled') === 'disabled') {
-    $('#donation').removeAttr('disabled')
+    $('#donation').removeAttr('disabled');
   } else {
     $('#donation').prop('disabled', (_, value) => !value);
   }
 
-  const context = getCurrentCharityItem(this);
+  const context = getCurrentCharityItem(button);
   const productCode = getCurrentProductCode(context);
+  const quantity = getSelectedCharityAmount(button);
 
   showLoader('.basket-loader');
 
   if (context.hasClass(charityEl.charityAdded)) {
-    $(this).removeAttr('checked');
+    $(button).removeAttr('checked');
   } else {
-    $(this).attr('checked', 'checked');
-    charityActionForAdd(productCode);
+    $(button).attr('checked', 'checked');
+    repaintCharityButton(button);
+    context
+      .find(charityEl.donationCartValue)
+      .text(quantity);
+    showDonationCostBlock(context);
+    charityActionForAdd(productCode, quantity);
   }
 }
 
+function getSelectedCharityAmount(context) {
+  return $(context).data('value');
+}
+
 function getCurrentCharityItem(context) {
   return $(context).closest(charityEl.charityItem);
 }
@@ -44,13 +57,13 @@ function getCurrentProductCode(context) {
   return context.find('input[name="productCode"]').val();
 }
 
-export function charityActionForAdd(value) {
+export function charityActionForAdd(value, quantity) {
   if (!Wick.checkLocalEnv) {
     const payload = {
       url: ROUTES.CHARITY_ADD,
       queries: {
         productCodePost: value,
-        qty: getDefaultCharityAmount(),
+        qty: quantity,
       },
       type: 'POST',
     };
@@ -61,19 +74,10 @@ export function charityActionForAdd(value) {
 
     callAction(payload, executeCharityAction, productInfo);
   } else {
-    toggleCharityElements();
     Wick.BasketPage.updateCart(...Array(2), true);
   }
 }
 
-export function toggleCharityElements() {
-  if ($(charityEl.charityItem).hasClass(charityEl.charityAdded)) {
-    $(charityEl.charityInput).prop('checked', false);
-  }
-  $(charityEl.charityItem).toggleClass(charityEl.charityAdded);
-  $(charityEl.charityItem).hasClass(charityEl.charityMultiple) && toggleMultipleCharityChoose($(charityEl.charityItem));
-}
-
 function executeCharityAction(response, productInfo) {
   if (response.addedProducts && response.addedProducts[0]) {
     productInfo.quantity = response.addedProducts[0].qty;
@@ -81,7 +85,6 @@ function executeCharityAction(response, productInfo) {
   }
 
   Wick.BasketPage.updateCart(...Array(2), true);
-  toggleCharityElements();
 }
 
 export function changeCharityPrice() {
@@ -95,6 +98,7 @@ export function changeCharityPrice() {
 
   repaintCharityButton(this);
   $(charityEl.donationCartValue).text(charityValue);
+  showDonationCostBlock(context);
   charityActionForChangePrice(this);
 }
 
@@ -119,35 +123,46 @@ function repaintCharityButton(context) {
   $(context).removeClass(btnSecondary).addClass(btnSelected);
 }
 
-function resetCharityButton(context) {
-  const donationButtons = $(context).find(charityEl.donationCartBtn);
-  const btnSelected = 'btn-selected';
-  const btnSecondary = 'btn-secondary';
-  const defaultAmount = getDefaultCharityAmount();
-
-  donationButtons.each((i, btn) => {
-    $(btn).attr('data-value') === defaultAmount
-      ? $(btn).removeClass(btnSecondary).addClass(btnSelected)
-      : $(btn).removeClass(btnSelected).addClass(btnSecondary);
-  })
-}
-
 function getDefaultCharityAmount() {
   const donationButtons = $(charityEl.charityItem).find(charityEl.donationCartBtn);
   return donationButtons.first().attr('data-value');
 }
 
+export function setDefaultCharityValue() {
+  $(charityEl.donationCartBtnSelected).each(function() {
+    const $btn   = $(this);
+    const $item  = $btn.closest(charityEl.charityItem);
+    const value  = $btn.data('value');
+
+    $item.find(charityEl.donationCartValue).text(value);
+    $item.find(charityEl.donationCartCostBlock)
+      .removeClass(charityEl.donationCartCostBlockHide);
+  });
+}
+
+function showDonationCostBlock($charity) {
+  $charity.find(charityEl.donationCartCostBlock)
+    .removeClass(charityEl.donationCartCostBlockHide);
+}
+
 function resetCharityValue() {
   const defaultValue = getDefaultCharityAmount();
   $(charityEl.donationCartValue).text(defaultValue);
 }
 
-export function toggleMultipleCharityChoose(context) {
-  context.find(charityEl.donationCart).toggleClass(charityEl.donationCartHide);
-  resetCharityButton(context);
-  resetCharityValue();
-}
-
-export function setDefaultCharityValue() {
-  $(charityEl.charityItem).hasClass(charityEl.charityMultiple) && resetCharityValue();
+export function initCharityInteractions() {
+  $(document).on('click', charityEl.donationCartRemove, function(e) {
+    e.preventDefault();
+
+    const $item = $(this).closest(charityEl.charityItem);
+    $item.removeClass(charityEl.charityAdded);
+    $item
+      .find(charityEl.donationCartCostBlock)
+      .addClass(charityEl.donationCartCostBlockHide);
+    $item
+      .find(charityEl.donationCartBtn)
+      .removeClass('btn-selected')
+      .addClass('btn-secondary');
+    resetCharityValue();
+  });
 }

package/build/js/page/components/modal-observer.js

@@ -0,0 +1,51 @@
+var Wick = Wick || {};
+
+Wick.ModalObserver = (function () {
+  const modal = $('.modal-scroll-observer');
+    modalContent = modal.find('.modal-content'),
+    modalBody = modal.find('.modal-body');
+
+  $(document).ready(function () {
+    if (!modal.length) {
+      return;
+    }
+
+    function updateScrollFades() {
+      const tolerance = 5;
+      const scrollTop = modalBody.scrollTop();
+      const scrollHeight = modalBody.prop('scrollHeight');
+      const visibleHeight = modalBody.outerHeight();
+
+      const isAtTop = scrollTop <= tolerance;
+      const isAtBottom = scrollTop + visibleHeight >= scrollHeight - tolerance;
+
+      let state;
+
+      if (isAtTop && isAtBottom) {
+        state = 'full';
+      } else if (isAtTop) {
+        state = 'top';
+      } else if (isAtBottom) {
+        state = 'bottom';
+      } else {
+        state = 'middle';
+      }
+
+      modalContent.attr('data-scroll-state', state);
+    }
+
+    modalBody.on('scroll', updateScrollFades);
+
+    modal.on('shown.bs.modal', function() {
+      updateScrollFades();
+    });
+
+    $(window).on('resize', function() {
+      if (modal.is(':visible')) {
+        updateScrollFades();
+      }
+    });
+
+  });
+
+})();

package/build/js/page/pdp.js

@@ -24,10 +24,7 @@ Wick.PDP = (function () {
     $page
       .find('.btn-add-to-basket, .card-store-collect__btn')
       .on('click', function(){
-        // TODO: This code is currently not in use because the backend (BE) has its own build for PDP.
-        //       Consider removing this fragment if it's confirmed to be obsolete, or document why it might still be needed.
-
-        // Wick.MiniBasket && Wick.MiniBasket.showJustAdded();
+        Wick.MiniBasket && Wick.MiniBasket.showJustAdded();
       });
   }