wickes-css2 2.103.0-IC-976-pre-commit-lint.5 → 2.103.0-IC-976-pre-commit-lint.8

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

@@ -1,181 +1,183 @@
 var Wick = Wick || {};
-Wick.CheckoutPaymentDetails = (function () {
-    const $modal = $('#modal-terms-and-conditions');
-    let prevClearableMethod;
-    let detailsLabel = {
-        inputName: 'card-name',
-        buttonName: 'btn-enter-details',
-    };
-
-    const elements = {
-        $wrapperPaymentInput: $('.checkout-payment-details__row'),
-        paymentInputName: '[name=payment-method]',
-        $cardDetails: $('.checkout-payment-details__card-details'),
-        $placeOrder: $('.checkout-payment-details__place-order'),
-        $billingAddress: $('.billing-address'),
-        hiddenCardDetailsClass: 'checkout-payment-details__card-details_hidden',
-        hiddenClass: 'd-none',
-    };
-
-    function preparePage() {
-        var modalOpened = $('.modal.show').length;
-        if (!modalOpened) {
-            return;
-        }
-        var modalContent = $modal.find('.modal-content').clone();
-        $modal.modal('hide');
-        modalContent.addClass('print-area');
-        $('body').addClass('print-mode').append(modalContent);
-    }
-
-    function resetPage() {
-        var modalPrintModeActive = $('body.print-mode').length;
-        if (!modalPrintModeActive) {
-            return;
-        }
-        $('body').removeClass('print-mode');
-        $('.print-area').remove();
-        $modal.modal('show');
+Wick.CheckoutPaymentDetails = (function() {
+  const $modal = $('#modal-terms-and-conditions');
+  let prevClearableMethod;
+  let detailsLabel = {
+    inputName: 'card-name',
+    buttonName: 'btn-enter-details',
+  };
+
+  const elements = {
+    $wrapperPaymentInput: $('.checkout-payment-details__row'),
+    paymentInputName: '[name=payment-method]',
+    $cardDetails: $('.checkout-payment-details__card-details'),
+    $placeOrder: $('.checkout-payment-details__place-order'),
+    $billingAddress: $('.billing-address'),
+    hiddenCardDetailsClass: 'checkout-payment-details__card-details_hidden',
+    hiddenClass: 'd-none',
+  }
+
+  function preparePage() {
+    var modalOpened = $(".modal.show").length;
+    if (!modalOpened) {
+      return;
     }
-
-    function getPaymentMethods() {
-        return $(elements.paymentInputName)
-            .map((_, item) => $(item).val())
-            .get();
-    }
-
-    function togglePaymentBlocks(paymentMethods, checkedMethod) {
-        paymentMethods.forEach((method) => {
-            $(`[data-${method}]`).toggle(checkedMethod === method);
-        });
+    var modalContent = $modal.find('.modal-content').clone();
+    $modal.modal("hide");
+    modalContent.addClass("print-area");
+    $("body")
+      .addClass("print-mode")
+      .append(modalContent);
+  }
+
+  function resetPage() {
+    var modalPrintModeActive = $("body.print-mode").length;
+    if (!modalPrintModeActive) {
+      return;
     }
-
-    function changeDetailsBlock(checkedMethod) {
-        switch (checkedMethod) {
-            case 'paypal':
-                hideCardDetails();
-                showPlaceOrder();
-                hideBillingAddres();
-                break;
-            case 'klarna':
-                hideBillingAddres();
-                break;
-            case 'billie':
-                detailsLabel = {
-                    ...detailsLabel,
-                    labelText: 'Name on Billie account',
-                    buttonText: 'Pay with Billie',
-                };
-                changeLabelText(detailsLabel);
-                break;
-            case 'clearpay':
-                detailsLabel = {
-                    ...detailsLabel,
-                    labelText: 'Name on Clearpay account',
-                    buttonText: 'Pay with Clearpay',
-                };
-                prevClearableMethod === 'card' && clearInputFields();
-                changeLabelText(detailsLabel);
-                prevClearableMethod = checkedMethod;
-                break;
-            case 'apple':
-                hideCardDetails();
-                hidePlaceOrder();
-                hideBillingAddres();
-                break;
-            case 'google':
-                hideCardDetails();
-                hidePlaceOrder();
-                hideBillingAddres();
-                break;
-            case 'card':
-                detailsLabel = {
-                    ...detailsLabel,
-                    labelText: 'Name on card',
-                    buttonText: 'Enter card details',
-                };
-                prevClearableMethod === 'clearpay' && clearInputFields();
-                changeLabelText(detailsLabel);
-                prevClearableMethod = checkedMethod;
-                break;
-            default:
-                showPlaceOrder();
+    $("body").removeClass("print-mode");
+    $(".print-area").remove();
+    $modal.modal("show");
+  }
+
+  function getPaymentMethods() {
+    return $(elements.paymentInputName)
+      .map((_, item) => $(item).val())
+      .get()
+  }
+
+  function togglePaymentBlocks(paymentMethods, checkedMethod) {
+    paymentMethods.forEach(method => {
+      $(`[data-${method}]`).toggle(checkedMethod === method)
+    })
+  }
+
+  function changeDetailsBlock(checkedMethod) {
+    switch(checkedMethod) {
+      case 'paypal':
+        hideCardDetails();
+        showPlaceOrder();
+        hideBillingAddres();
+        break;
+      case 'klarna':
+        hideBillingAddres();
+        break;
+      case 'billie':
+        detailsLabel = {
+          ...detailsLabel,
+          labelText: 'Name on Billie account',
+          buttonText: 'Pay with Billie'
         }
+        changeLabelText(detailsLabel);
+        break;
+      case 'clearpay':
+        detailsLabel = {
+          ...detailsLabel,
+          labelText: 'Name on Clearpay account',
+          buttonText: 'Pay with Clearpay'
+        }
+        prevClearableMethod === 'card' && clearInputFields();
+        changeLabelText(detailsLabel);
+        prevClearableMethod = checkedMethod;
+        break;
+      case 'apple':
+        hideCardDetails()
+        hidePlaceOrder()
+        hideBillingAddres()
+        break;
+      case 'google':
+        hideCardDetails()
+        hidePlaceOrder()
+        hideBillingAddres()
+        break;
+      case 'card':
+        detailsLabel = {
+          ...detailsLabel,
+          labelText: 'Name on card',
+          buttonText: 'Enter card details'
+        }
+        prevClearableMethod === 'clearpay' && clearInputFields();
+        changeLabelText(detailsLabel);
+        prevClearableMethod = checkedMethod;
+        break;
+      default:
+        showPlaceOrder()
     }
-
-    function hideCardDetails() {
-        elements.$cardDetails.addClass(elements.hiddenCardDetailsClass);
-    }
-
-    function hideBillingAddres() {
-        elements.$billingAddress.addClass(elements.hiddenClass);
-    }
-
-    function changeLabelText(params) {
-        const { inputName, labelText, buttonName, buttonText } = params;
-        elements.$billingAddress.removeClass(elements.hiddenClass);
-        let labelElement = elements.$billingAddress.find('[for="' + inputName + '"]');
-        let buttonElement = elements.$billingAddress.find('.' + buttonName + ' .btn__text');
-
-        labelElement && labelElement.text(labelText);
-        buttonElement && buttonElement.text(buttonText);
-    }
-
-    function clearInputFields() {
-        elements.$billingAddress.find('input.tbx').val('');
-    }
-
-    function showPlaceOrder() {
-        elements.$placeOrder.removeClass(elements.hiddenClass);
-    }
-
-    function hidePlaceOrder() {
-        elements.$placeOrder.addClass(elements.hiddenClass);
+  }
+
+  function hideCardDetails() {
+    elements.$cardDetails.addClass(elements.hiddenCardDetailsClass);
+  }
+
+  function hideBillingAddres() {
+    elements.$billingAddress.addClass(elements.hiddenClass);
+  }
+
+  function changeLabelText(params) {
+    const { inputName, labelText, buttonName, buttonText } = params;
+    elements.$billingAddress.removeClass(elements.hiddenClass);
+    let labelElement = elements.$billingAddress.find('[for="' + inputName + '"]');
+    let buttonElement = elements.$billingAddress.find("." + buttonName + " .btn__text");
+
+    labelElement && labelElement.text(labelText);
+    buttonElement && buttonElement.text(buttonText);
+  }
+
+  function clearInputFields() {
+    elements.$billingAddress.find('input.tbx').val('');
+  }
+
+  function showPlaceOrder() {
+    elements.$placeOrder.removeClass(elements.hiddenClass);
+  }
+
+  function hidePlaceOrder() {
+    elements.$placeOrder.addClass(elements.hiddenClass);
+  }
+
+  function init() {
+    const paymentMethods = getPaymentMethods();
+
+    elements.$wrapperPaymentInput.on('change', elements.paymentInputName, function() {
+      const checkedMethod = $(this).val();
+
+      togglePaymentBlocks(paymentMethods, checkedMethod)
+      changeDetailsBlock(checkedMethod)
+    });
+
+    $('.btn-new-card').on('click', function() {
+      $('[data-new-card]').show();
+      $('[data-existing-card]').hide();
+      return false;
+    });
+
+    $('.btn-back-to-existing-card').on('click', function() {
+      $('[data-new-card]').hide();
+      $('[data-existing-card]').show();
+      return false;
+    });
+
+    // do not subscribe if no T&C modal on a current page
+    if (!$modal.length) {
+      return;
     }
 
-    function init() {
-        const paymentMethods = getPaymentMethods();
-
-        elements.$wrapperPaymentInput.on('change', elements.paymentInputName, function () {
-            const checkedMethod = $(this).val();
-
-            togglePaymentBlocks(paymentMethods, checkedMethod);
-            changeDetailsBlock(checkedMethod);
-        });
-
-        $('.btn-new-card').on('click', function () {
-            $('[data-new-card]').show();
-            $('[data-existing-card]').hide();
-            return false;
-        });
-
-        $('.btn-back-to-existing-card').on('click', function () {
-            $('[data-new-card]').hide();
-            $('[data-existing-card]').show();
-            return false;
-        });
-
-        // do not subscribe if no T&C modal on a current page
-        if (!$modal.length) {
-            return;
-        }
-
-        if (typeof window.onbeforeprint !== 'undefined') {
-            // subscriptions for browsers
-            window.onbeforeprint = preparePage;
-            window.onafterprint = resetPage;
-        } else if (window.matchMedia) {
-            // subscriptions for iOS devices
-            var mediaQueryList = window.matchMedia('print');
-            mediaQueryList.addListener(function (mql) {
-                if (mql.matches) {
-                    preparePage();
-                } else {
-                    resetPage();
-                }
-            });
+    if (typeof(window.onbeforeprint) !== 'undefined') {
+      // subscriptions for browsers
+      window.onbeforeprint = preparePage;
+      window.onafterprint = resetPage;
+    } else if (window.matchMedia) {
+      // subscriptions for iOS devices
+      var mediaQueryList = window.matchMedia('print');
+      mediaQueryList.addListener(function(mql) {
+        if (mql.matches) {
+          preparePage();
+        } else {
+          resetPage();
         }
+      });
     }
+  }
 
-    init();
+  init();
 })();

package/src/js/page/checkout-sign-in.js

@@ -1,21 +1,17 @@
 var Wick = Wick || {};
 Wick.CheckoutSignIn = (function () {
-    function checkCheckbox() {
-        var passwordBlock = $('#checkout-sign-in-password');
-        if (
-            $('input[name=sign-in-password]:checked')
-                .attr('id')
-                .indexOf('sign-in-check-password-switch') !== -1
-        ) {
-            passwordBlock.slideDown();
-        } else {
-            passwordBlock.slideUp();
-        }
+  function checkCheckbox () {
+    var passwordBlock = $('#checkout-sign-in-password');
+    if ($('input[name=sign-in-password]:checked').attr('id').indexOf('sign-in-check-password-switch') !== -1) {
+      passwordBlock.slideDown();
+    } else {
+      passwordBlock.slideUp();
     }
+  }
 
-    checkCheckbox();
+  checkCheckbox();
 
-    $('input[name=sign-in-password]').change(function () {
-        checkCheckbox();
-    });
+  $('input[name=sign-in-password]').change(function () {
+    checkCheckbox();
+  });
 })();

package/src/js/page/checkout.js

@@ -1,4 +1,4 @@
-import { checkVoucherCode, voucherRemove } from './components/voucher';
+import {checkVoucherCode, voucherRemove} from './components/voucher';
 
 var Wick = window.Wick || {};
 Wick.Checkout = {

package/src/js/page/cms-homepage.js

@@ -2,128 +2,86 @@ document.onreadystatechange = function () {
     if (document.readyState === 'interactive') {
         initHeroes();
     }
-};
+}
 
 if (document.readyState === 'interactive') {
     initHeroes();
 }
 
 function initHeroes() {
-    let hero = document.getElementsByClassName('hero-container'),
+    let hero = document.getElementsByClassName("hero-container"),
+        background = document.getElementsByClassName("hero-background"),
+        foreground = document.getElementsByClassName("hero-foreground"),
         canZoomOnMouse = false,
-        canZoomOnScroll = false;
+        canZoomOnScroll = false
+    ;
+
     function zoomOnMouse() {
         for (i = 0; i < hero.length; i++) {
-            hero[i].addEventListener('mouseover', function () {
+            const heroCount = i;
+            hero[i].addEventListener("mouseover", function() {
                 if (canZoomOnMouse) {
-                    if (this.children[0].children[1].children[1].tagName == 'SOURCE') {
-                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {
-                            scale: 1,
-                            ease: Back.easeOut.config(1.7),
-                        });
+                    if (this.children[0].children[1].children[1].tagName == "SOURCE") {
+                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {scale: 1, ease: Back.easeOut.config(1.7)});
                     } else {
-                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {
-                            scale: 1.05,
-                            ease: Back.easeOut.config(1.7),
-                        });
+                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {scale: 1.05, ease: Back.easeOut.config(1.7)});
                     }
-                    TweenMax.to(this.children[0].children[1].children[2], 0.25, {
-                        boxShadow: 'inset 0 0 30px black',
-                        '-webkit-filter': 'drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 10px)',
-                        scale: 1.05,
-                        ease: Back.easeOut.config(1.7),
-                    });
+                    TweenMax.to(this.children[0].children[1].children[2], 0.25, {boxShadow:'inset 0 0 30px black', '-webkit-filter':'drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 10px)', scale: 1.05, ease: Back.easeOut.config(1.7)});
                 }
-            });
-            hero[i].addEventListener('mouseout', function () {
+            })
+            hero[i].addEventListener("mouseout", function() {
                 if (canZoomOnMouse) {
-                    if (this.children[0].children[1].children[1].tagName == 'SOURCE') {
-                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {
-                            scale: 1.05,
-                            ease: Back.easeOut.config(1.7),
-                        });
+                    if (this.children[0].children[1].children[1].tagName == "SOURCE") {
+                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {scale: 1.05, ease: Back.easeOut.config(1.7)});
                     } else {
-                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {
-                            scale: 1,
-                            ease: Back.easeOut.config(1.7),
-                        });
+                        TweenMax.to(this.children[0].children[0].children[2], 0.25, {scale: 1, ease: Back.easeOut.config(1.7)});
                     }
-                    TweenMax.to(this.children[0].children[1].children[2], 0.25, {
-                        boxShadow: 'inset 0 0 0px black',
-                        '-webkit-filter': 'drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 4px)',
-                        scale: 1,
-                        ease: Back.easeOut.config(1.7),
-                    });
+                    TweenMax.to(this.children[0].children[1].children[2], 0.25, {boxShadow:'inset 0 0 0px black', '-webkit-filter':'drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 4px)', scale: 1, ease: Back.easeOut.config(1.7)});
                 }
-            });
+            })
         }
     }
 
     function zoomOnScroll() {
-        window.addEventListener('scroll', function () {
+        window.addEventListener('scroll', function(ev) {
             if (canZoomOnScroll) {
                 for (i = 0; i < hero.length; i++) {
+                    const heroCount = i;
                     var someDiv = hero[i];
                     var distanceToTop = someDiv.getBoundingClientRect().top;
-                    if (distanceToTop > -200 && distanceToTop < 110) {
-                        if (someDiv.children[0].children[1].tagName == 'IMG') {
-                            TweenMax.to(someDiv.children[0].children[0], 0.25, {
-                                scale: 1,
-                                ease: Power3.easeOut,
-                            });
+                    if (distanceToTop > -200 && distanceToTop < 110 ) {
+                        if (someDiv.children[0].children[1].tagName == "IMG") {
+                            TweenMax.to(someDiv.children[0].children[0], 0.25, {scale: 1, ease: Power3.easeOut});
                         } else {
-                            TweenMax.to(someDiv.children[0].children[0], 0.25, {
-                                scale: 1.05,
-                                ease: Power3.easeOut,
-                            });
+                            TweenMax.to(someDiv.children[0].children[0], 0.25, {scale: 1.05, ease: Power3.easeOut});
                         }
-                        TweenMax.to(someDiv.children[0].children[1], 0.25, {
-                            boxShadow: 'inset 0 0 30px black',
-                            '-webkit-filter': 'drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 10px)',
-                            scale: 1.05,
-                            ease: Power3.easeOut,
-                        });
+                        TweenMax.to(someDiv.children[0].children[1], 0.25, {boxShadow:'inset 0 0 30px black', '-webkit-filter':'drop-shadow(rgba(0, 0, 0, 0.8) 0px 0px 10px)', scale: 1.05, ease: Power3.easeOut});
                     } else {
-                        if (someDiv.children[0].children[1].tagName == 'IMG') {
-                            TweenMax.to(someDiv.children[0].children[0], 0.25, {
-                                scale: 1.05,
-                                ease: Power3.easeOut,
-                            });
+                        if (someDiv.children[0].children[1].tagName == "IMG") {
+                            TweenMax.to(someDiv.children[0].children[0], 0.25, {scale: 1.05, ease: Power3.easeOut});
                         } else {
-                            TweenMax.to(someDiv.children[0].children[0], 0.25, {
-                                scale: 1,
-                                ease: Power3.easeOut,
-                            });
+                            TweenMax.to(someDiv.children[0].children[0], 0.25, {scale: 1, ease: Power3.easeOut});
                         }
-                        TweenMax.to(someDiv.children[0].children[1], 0.25, {
-                            boxShadow: 'inset 0 0 0px black',
-                            '-webkit-filter': 'drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 4px)',
-                            scale: 1,
-                            ease: Power3.easeOut,
-                        });
+                        TweenMax.to(someDiv.children[0].children[1], 0.25, {boxShadow:'inset 0 0 0px black', '-webkit-filter':'drop-shadow(rgba(0, 0, 0, 0.5) 0px 0px 4px)', scale: 1, ease: Power3.easeOut});
                     }
                 }
             }
-        });
+        })
     }
 
-    function zoomEffect() {
-        //determine which zoomEffect is currently correct and execute it
-        if (window.innerWidth > 991) {
-            // IF window width is greater than 992 pixels
+    function zoomEffect(){ //determine which zoomEffect is currently correct and execute it
+        if (window.innerWidth > 991) { // IF window width is greater than 992 pixels
             canZoomOnMouse = true; //allow zoomOnMouse
             canZoomOnScroll = false; //disallow zoomOnScroll
             zoomOnMouse(); //execute zoomOnMouse
-        } else {
-            // IF window width is less than 992 pixels
+        } else { // IF window width is less than 992 pixels
             canZoomOnScroll = true; //allow zoomOnScroll
             canZoomOnMouse = false; //disallow zoomOnMouse
             zoomOnScroll(); //execute zoomOnScroll
         }
     }
 
-    function resizeEvent() {
-        //execute fitImages and zoomEffect
+    function resizeEvent() { //execute fitImages and zoomEffect
         zoomEffect();
     }
 
@@ -132,18 +90,18 @@ function initHeroes() {
     window.onresize = resizeEvent;
 }
 
-document.addEventListener('DOMContentLoaded', function () {
-    var USPbar = document.getElementsByClassName('new-usp-bar');
+document.addEventListener("DOMContentLoaded", function(event){
+    var USPbar = document.getElementsByClassName("new-usp-bar");
     var viewportWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
-    var USPtimeline = new TimelineMax({ repeat: -1, repeatDelay: 4, delay: 5, paused: true });
+    var USPtimeline = new TimelineMax({repeat:-1, repeatDelay:4, delay:5, paused:true});
 
-    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css: { left: '-100%' } });
-    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css: { left: '-200%' } }, '+=5');
-    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css: { left: '-300%' } }, '+=5');
-    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css: { left: '-400%' } }, '+=5');
-    USPtimeline.set(USPbar, { css: { marginLeft: '0' } });
+    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css:{left:"-100%"} });
+    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css:{left:"-200%"} }, "+=5");
+    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css:{left:"-300%"} }, "+=5");
+    USPtimeline.to(USPbar, 1, { ease: Power4.easeInOut, css:{left:"-400%"} }, "+=5");
+    USPtimeline.set(USPbar, { css:{marginLeft:"0"} });
 
-    if (viewportWidth <= 1110) {
+    if (viewportWidth<=1110) {
         USPtimeline.play();
     }
 });