wickes-css2 2.104.0-develop.1 → 2.104.0-develop.2

package/build/js/emulation.min.js

@@ -3443,6 +3443,52 @@ Wick.BigWinsProto = function () {
 }();
 
 
+(function () {
+    const ORDER = ["30", "30_60", "30_90", "30_60_90"];
+
+    const COPY = {
+        "30": {
+            heading: "Buy now, pay within 30 days",
+            repayment: "From the point of collection / delivery of goods you’ll have 30 days to pay",
+        },
+        "30_60": {
+            heading: "Buy now and choose to pay within 30 or 60 days",
+            repayment: "From the point of collection / delivery of goods, you'll have until the end of your chosen repayment term to pay",
+        },
+        "30_90": {
+            heading: "Buy now and choose to pay within 30 or 90 days",
+            repayment: "From the point of collection / delivery of goods, you'll have until the end of your chosen repayment term to pay",
+        },
+        "30_60_90": {
+            heading: "Buy now and choose to pay within 30, 60 or 90 days",
+            repayment: "From the point of collection / delivery of goods, you'll have until the end of your chosen repayment term to pay",
+        },
+    };
+
+    let index = -1;
+
+    function nextTerms() {
+        index = (index + 1) % ORDER.length;
+        return ORDER[index];
+    }
+
+    function applyBillieTerms(terms) {
+        const copy = COPY[terms] || COPY["30"];
+        const $modal = $("#billieLearnMoreModal");
+
+        $modal.find(".js-billie-terms-heading").text(copy.heading);
+        $modal.find(".js-billie-repayment-line").text(copy.repayment);
+        $modal.attr("data-billie-terms", terms);
+    }
+
+    $(document).on("click", ".billie__link", function (e) {
+        e.preventDefault();
+
+        const terms = nextTerms();
+        applyBillieTerms(terms);
+    });
+})();
+
 var Wick = Wick || {};
 Wick.ChatBot = (function () {
   let $backToTop = $('#back-to-top'),
@@ -3520,21 +3566,21 @@ Wick.DeliveryDetails = (function () {
 
 var Wick = Wick || {};
 
-Wick.PaymentDetails = (function () {
+Wick.PaymentDetails = (function() {
   var $btnEnterDetails = $('.btn-enter-details'),
     $form = $btnEnterDetails.parents('form'),
     isGuestPage = $('.page_checkout-payment-details_guest').length;
 
-  function bindEvents () {
-    $btnEnterDetails.on('click', function(){
-      if ($form.find('#card-name').val().length &&
+  function bindEvents() {
+    $btnEnterDetails.on('click', function() {
+      if ($form.find('#card-name').val()?.length &&
         $form.find('#first-line-address').val().length &&
         $form.find('#address-line-1').val().length &&
         $form.find('#town-city').val().length &&
-        $form.find('#postcode_additional').val().length){
+        $form.find('#postcode_additional').val().length) {
         $('.checkout-payment-details__card-details').removeClass('checkout-payment-details__card-details_hidden');
         $('html, body').animate({
-          scrollTop: $('.checkout-payment-details__card-details').offset().top - 15
+          scrollTop: $('.checkout-payment-details__card-details').offset().top - 15,
         }, 700);
         return false;
       }
@@ -3542,14 +3588,14 @@ Wick.PaymentDetails = (function () {
       return false;
     });
 
-    $('.checkout-payment-details__card-details').on('submit', function(){
+    $('.checkout-payment-details__card-details').on('submit', function() {
       var $form = $(this);
       if ($form.find('#card-type').val() &&
         $form.find('#card-name1').val().length &&
         $form.find('#card-number').val().length &&
         $form.find('#month').val() &&
         $form.find('#year').val() &&
-        $form.find('#security-code').val()){
+        $form.find('#security-code').val()) {
         window.location.href = isGuestPage
           ? './page_checkout_confirmation_guest.html'
           : './page_checkout_confirmation.html';
@@ -4009,7 +4055,7 @@ Wick.FooterСurrentYear = (function () {
 })();
 
 var Wick = Wick || {};
-Wick.Forms = (function(){
+Wick.Forms = (function() {
   var fieldRow = '.form-row[data-row-required]',
     field = '.form-row__field',
     fieldError = '.form-row__error',
@@ -4019,43 +4065,44 @@ Wick.Forms = (function(){
     // validationError = '<div class="form-row__error">Error message here</div>',
     $forgotPassword = $('.link-forgot-password'),
     scenarios = [{
-        condition: function(){
-          // fill in the valid returning customer's details
-          // Email: responsive@test.com; Password: 123456
-          return $('#login-email').val() === 'responsive@test.com' && $('#password').val() === '123456';
-        },
-        action: function(){
-          // redirected to the homepage
-          Wick.User.login();
-          window.location.href = './';
-        }
+      condition: function() {
+        // fill in the valid returning customer's details
+        // Email: responsive@test.com; Password: 123456
+        return $('#login-email').val() === 'responsive@test.com' && $('#password').val() === '123456';
       },
+      action: function() {
+        // redirected to the homepage
+        Wick.User.login();
+        window.location.href = './';
+      },
+    },
       {
-        condition: function(){
+        condition: function() {
           // continue as a new user with "test+random@user.com"
           return $('#registration-email').val().length;
           // return $('#registration-email').val() === 'test+random@user.com';
         },
-        action: function(){
+        action: function() {
           // redirected to the register form
           window.location.href = './page_registration.html';
-        }
+        },
       },
       {
-        condition: function(){
+        condition: function() {
           // When I click forgotten password link
         },
-        action: function(){
+        action: function() {
           // redirected on the "Forgotten Password" page
           window.location.href = './page_forgotten-password.html';
-        }
-      }
-    ];
+        },
+      },
+    ],
 
-  validationError = function (errorMsg) {
-    return `<div class="form-row__error"> ${errorMsg || 'Error message here'}</div>`
-  }
-  function isElementInViewport (el) {
+    validationError = function(errorMsg) {
+      return `<div class="form-row__error"> ${errorMsg || 'Error message here'}</div>`;
+    };
+
+  function isElementInViewport(el) {
     if (typeof jQuery === 'function' && el instanceof jQuery) {
       el = el[0];
     }
@@ -4068,15 +4115,21 @@ Wick.Forms = (function(){
     );
   }
 
-  var showValidationErrors = function (form, errorMsg) {
+  var showValidationErrors = function(form, errorMsg) {
     var $form = $(form);
     if (!$form.hasClass(formInvalid)) {
       $form.find('.form-row__error').remove();
-      $form.addClass(formInvalid).find(fieldRow).append(validationError(errorMsg)).addClass(rowValidationError);
+      var $rows = $form.find(fieldRow).filter(function() {
+        return $(this).is(':visible');
+      });
+
+      $rows.append(validationError(errorMsg)).addClass(rowValidationError);
     }
 
-    var $firstMsg = $form.find(fieldRow).first();
-    if($firstMsg.length && !isElementInViewport($firstMsg)){
+    var $firstMsg = $form.find(fieldRow).filter(function() {
+      return $(this).is(':visible');
+    }).first();
+    if ($firstMsg.length && !isElementInViewport($firstMsg)) {
       var inModal = $firstMsg.closest('.modal').length,
         $scrollableEl = inModal ? $firstMsg.closest('.modal') : $('html, body'),
         y = inModal ? 0 : $firstMsg.offset().top - 30;
@@ -4085,22 +4138,26 @@ Wick.Forms = (function(){
     }
   };
 
-  var clearValidationErrors = function (form) {
+  var clearValidationErrors = function(form) {
     var $form = $(form);
-    if ($form.hasClass(formInvalid)) {
-      $form.removeClass(formInvalid)
-        .find(fieldRow).removeClass(rowValidationError)
-        .find(fieldError).remove();
-    }
+
+    $form.removeClass(formInvalid);
+
+    $form.find(fieldRow)
+      .removeClass(rowValidationError)
+      .find(fieldError).remove();
+
+    $form.find(fieldError).remove();
   };
 
-  var handleSmoothScroll = function () {
+
+  var handleSmoothScroll = function() {
     $('html, body').animate({
-      scrollTop: $('.cards-store-list').offset().top - 60
+      scrollTop: $('.cards-store-list').offset().top - 60,
     }, 300);
   };
 
-  var handleFormSubmit = function () {
+  var handleFormSubmit = function() {
     var form = this;
 
     if ($(form).is('#form-login') || $(form).is('#form-register')) {
@@ -4114,21 +4171,21 @@ Wick.Forms = (function(){
     }
 
     if ($(form).is('#form-forgotten-password')) {
-      if ($(form).find('#email').val().length){
+      if ($(form).find('#email').val().length) {
         window.location.href = './page_upd-pass.html';
         return false;
       }
     }
 
     if ($(form).is('#form-forgotten-password-popup')) {
-      if ($(form).find('#email').val().length){
+      if ($(form).find('#email').val().length) {
         window.location.href = './page_checkout_sign-in.html';
         return false;
       }
     }
 
     if ($(form).is('#checkout-form-forgotten-password-popup')) {
-      if ($(form).find('#email').val().length){
+      if ($(form).find('#email').val().length) {
         $('.modal-reset-wrap').addClass('d-block');
         $('.request-pass').addClass('d-none');
         $('.modal-title').text('Password Reset');
@@ -4137,7 +4194,7 @@ Wick.Forms = (function(){
     }
 
     if ($(form).is('.update-pass')) {
-      if ($(form).find('#new-password').val().length && $(form).find('#confirmed-password').val().length){
+      if ($(form).find('#new-password').val().length && $(form).find('#confirmed-password').val().length) {
         window.location.href = './page_login.html';
         return false;
       }
@@ -4146,7 +4203,7 @@ Wick.Forms = (function(){
     if ($(form).is('.change-email')) {
       if ($(form).find('#new-email').val().length &&
         $(form).find('#confirm-new-email').val().length &&
-        $(form).find('#password').val().length){
+        $(form).find('#password').val().length) {
         window.location.href = './page_my-account.html';
         return false;
       }
@@ -4155,7 +4212,7 @@ Wick.Forms = (function(){
     if ($(form).is('.form-change-password')) {
       if ($(form).find('#current-password').val().length &&
         $(form).find('#new-password').val().length &&
-        $(form).find('#confirm-password').val().length){
+        $(form).find('#confirm-password').val().length) {
         window.location.href = './page_my-account.html';
         return false;
       }
@@ -4167,14 +4224,14 @@ Wick.Forms = (function(){
         $(form).find('#postcode').val().length &&
         $(form).find('#email').val().length &&
         $(form).find('#password').val().length &&
-        $(form).find('#confirm-password').val().length){
+        $(form).find('#confirm-password').val().length) {
         window.location.href = './page_my-account.html';
         return false;
       }
     }
 
     if ($(form).is('.form-personal-details')) {
-      if ($(form).find('#first-name').val().length && $(form).find('#surname').val().length){
+      if ($(form).find('#first-name').val().length && $(form).find('#surname').val().length) {
         window.location.href = './page_my-account.html';
         return false;
       }
@@ -4182,26 +4239,26 @@ Wick.Forms = (function(){
 
     if ($(form).is('.form-address-details')) {
       if ($(form).find('#first-name').val().length &&
-          $(form).find('#second-name').val().length &&
-          $(form).find('#address1').val().length &&
-          $(form).find('#town-city').val().length &&
-          $(form).find('#mobile-telephone').val().length) {
+        $(form).find('#second-name').val().length &&
+        $(form).find('#address1').val().length &&
+        $(form).find('#town-city').val().length &&
+        $(form).find('#mobile-telephone').val().length) {
         window.location.href = './page_my-account_address-book.html';
         return false;
       }
     }
 
     if ($(form).is('.form-locator')) {
-      if ($(form).find('#store-id').val()){
+      if ($(form).find('#store-id').val()) {
         window.location.href = './page_store-locator-details.html';
         return false;
       }
     }
 
     if ($(form).is('.form-locator-list')) {
-      if ($(form).find('#postcode-town').val().length){
+      if ($(form).find('#postcode-town').val().length) {
         var actionAfterSubmit = $(form).attr('data-action');
-        if (actionAfterSubmit === 'scroll-to-list'){
+        if (actionAfterSubmit === 'scroll-to-list') {
           clearValidationErrors(this);
           handleSmoothScroll();
         } else {
@@ -4212,7 +4269,7 @@ Wick.Forms = (function(){
     }
 
     if ($(form).is('#form-mini-basket')) {
-      if (Wick.User.isLoggedIn()){
+      if (Wick.User.isLoggedIn()) {
         window.location.href = './page_checkout_delivery-address.html';
       } else {
         window.location.href = './page_checkout_sign-in.html';
@@ -4220,13 +4277,31 @@ Wick.Forms = (function(){
       return false;
     }
 
-    function isNotEmpty(field){
-      return !!$(field).val();
+    function isNotEmpty(field) {
+      var $field = $(field);
+      var type = ($field.attr('type') || '').toLowerCase();
+
+      if (type === 'checkbox') {
+        return $field.is(':checked');
+      }
+
+      if (type === 'radio') {
+        var name = $field.attr('name');
+        if (!name) return false;
+
+        var $scope = $field.closest('[data-row-required]');
+        if (!$scope.length) $scope = $field.closest('form');
+
+        return $scope.find('input[type="radio"][name="' + name.replace(/"/g, '\\"') + '"]').is(':checked');
+      }
+
+      return !!$field.val();
     }
 
+
     if ($(form).is('#form-checkout-your-details')) {
       var requiredFields = $(form).find('[data-row-required]:visible :input');
-      if (_.every(requiredFields, isNotEmpty)){
+      if (_.every(requiredFields, isNotEmpty)) {
         window.location.href = $(form).attr('data-action');
         return false;
       }
@@ -4234,7 +4309,7 @@ Wick.Forms = (function(){
 
     if ($(form).is('#checkout-your-details-modal')) {
       var requiredFields = $(form).find('[data-row-required]:visible :input');
-      if (_.every(requiredFields, isNotEmpty)){
+      if (_.every(requiredFields, isNotEmpty)) {
         $('#modalDeliveryEdit').modal('hide');
         return false;
       }
@@ -4248,15 +4323,15 @@ Wick.Forms = (function(){
       }
     }
 
-    if ($(form).is('.checkout-register')){
+    if ($(form).is('.checkout-register')) {
       if ($(form).find('#password').val().length &&
-          $(form).find('#confirm-password').val().length) {
+        $(form).find('#confirm-password').val().length) {
         window.location.href = './page_my-account.html';
         return false;
       }
     }
 
-    if ($(form).is('#form-checkout-voucher')){
+    if ($(form).is('#form-checkout-voucher')) {
       if ($(form).find('#voucher-code').val().length) {
         return false;
       }
@@ -4268,11 +4343,11 @@ Wick.Forms = (function(){
       }
     }
 
-    if ($(form).is('.header-search')){
+    if ($(form).is('.header-search')) {
       window.location.href = './page_search-results.html';
     }
 
-    if ($(form).is('.click-and-collect__locator-form')){
+    if ($(form).is('.click-and-collect__locator-form')) {
       var $form = $(form);
       if ($form.find('#click-and-collect-town').val().length) {
         clearValidationErrors(this);
@@ -4285,24 +4360,24 @@ Wick.Forms = (function(){
       return false;
     }
 
-    if($(form).is('.form-track-order')) {
-        var $form = $(form);
+    if ($(form).is('.form-track-order')) {
+      var $form = $(form);
 
-        if ($form.find('#order').val().length &&
-            $form.find('#tel').val().length &&
-            $form.find('#email').val().length &&
-            $form.find('#postcode').val().length) {
-            clearValidationErrors(this);
-        } else if (!$form.hasClass(formInvalid)) {
-          $form.addClass(formInvalid);
+      if ($form.find('#order').val().length &&
+        $form.find('#tel').val().length &&
+        $form.find('#email').val().length &&
+        $form.find('#postcode').val().length) {
+        clearValidationErrors(this);
+      } else if (!$form.hasClass(formInvalid)) {
+        $form.addClass(formInvalid);
 
-          $(fieldRow).each(function() {
-            $(this).addClass(rowValidationError)
-              .append('<div class="form-row__error">' + $(this).data('message') + '</div>');
-          });
-        }
+        $(fieldRow).each(function() {
+          $(this).addClass(rowValidationError)
+            .append('<div class="form-row__error">' + $(this).data('message') + '</div>');
+        });
+      }
 
-        return false;
+      return false;
     }
 
     if ($(form).is('#edit-billing-address')) {
@@ -4318,28 +4393,28 @@ Wick.Forms = (function(){
   };
 
   var scrollLocatorListPage = function() {
-      var isLocatorListPage = $('.cards-store-list').length;
-      var isScrollNeeded = window.location.hash === "#stores-list";
-      if (isLocatorListPage && isScrollNeeded) {
-          handleSmoothScroll();
-      }
+    var isLocatorListPage = $('.cards-store-list').length;
+    var isScrollNeeded = window.location.hash === '#stores-list';
+    if (isLocatorListPage && isScrollNeeded) {
+      handleSmoothScroll();
+    }
   };
 
-  let bindEvents = function () {
+  let bindEvents = function() {
     let selector = excludedClassesForForm.reduce((acc, className) => {
       return acc + ':not([class^="' + className + '"])';
     }, 'form');
     $(document).on('submit', selector, handleFormSubmit);
     $forgotPassword.on('click', scenarios[2].action);
-    $('.btn-cancel').on('click', function(){
+    $('.btn-cancel').on('click', function() {
       window.location.href = './page_my-account.html';
     });
-    $('.btn-previous').on('click', function(){
+    $('.btn-previous').on('click', function() {
       window.location.href = './page_login.html';
     });
   };
 
-  var init = function () {
+  var init = function() {
     bindEvents();
     scrollLocatorListPage();
   };
@@ -4348,8 +4423,8 @@ Wick.Forms = (function(){
 
   return {
     showValidationErrors: showValidationErrors,
-    clearValidationErrors: clearValidationErrors
-  }
+    clearValidationErrors: clearValidationErrors,
+  };
 })();
 
 var Wick = Wick || {};
@@ -11782,6 +11857,8 @@ $(document).ready(function () {
   initMyOrdersEvent();
 });
 
+var Wick = Wick || {};
+
 const paymentLoader= '.payment-loader';
 const paymentLoaderHideClass= 'payment-loader--hidden';
 const paymentLoaderModal = '.payment-loader__modal'
@@ -11789,11 +11866,10 @@ const paymentTypeSelectors = {
   apple: '.apple__button',
   google: '.google__button',
   clearpay: '#checkout-payment-details-clearpay',
-  billie: '#checkout-payment-details-billie, .billie__button',
   paypal: '#checkout-payment-details-paypal'
 };
 
-function showPaymentLoader(paymentType) {
+Wick.showPaymentLoader = function(paymentType) {
   $(paymentLoader).find(`${paymentLoaderModal} > div`).hide();
   $(`.${paymentType}-checkout-logo`).show();
   $(`${paymentLoader} .spinner`).show();
@@ -11805,7 +11881,7 @@ function showPaymentLoader(paymentType) {
 }
 
 Object.entries(paymentTypeSelectors).forEach(([type, triggerSelector]) => {
-  $(document).on('click', triggerSelector, () => showPaymentLoader(type));
+  $(document).on('click', triggerSelector, () => Wick.showPaymentLoader(type));
 });
 
 var Wick = Wick || {};
@@ -12836,6 +12912,42 @@ Wick.ReferenceField = (function () {
     init();
 })();
 
+var Wick = Wick || {};
+
+Wick.RepaymentToggle = (function () {
+  const SELECTORS = {
+    repaymentRadio: 'input[name="repaymentTerms"]',
+    term: '.billie-info .term',
+    paymentMethod: '[name="payment-method"]'
+  };
+
+  function updateTerm(value) {
+    const $term = $(SELECTORS.term);
+    if (!$term.length) return;
+
+    $term.text(value);
+  }
+
+  function bindEvents () {
+    $(document).on('change', SELECTORS.repaymentRadio, function () {
+      const value = $(this).val();
+      if (!value) return;
+
+      updateTerm(value);
+
+      const currentMethod = $(SELECTORS.paymentMethod + ':checked').val();
+      if (currentMethod !== 'billie') return;
+
+      if (typeof Wick.showPaymentLoader === 'function') {
+        Wick.showPaymentLoader('billie');
+      }
+
+    });
+  }
+
+  bindEvents();
+})();
+
 var Wick = Wick || {};
 Wick.Selectable = (function(){
   $selectable = $('.js-selectable'),

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

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