wickes-css2 2.103.0-gift-cards.17 → 2.103.0-lg-788-no-extra-req-empty-cart.1

package/src/data/data_mini-basket.json

@@ -3,6 +3,7 @@
     "number": 0,
     "products": [
       {
+        "id": 1,
         "quantity": {
           "value": "1"
         },
@@ -15,87 +16,9 @@
         "CC": "East Grinstead"
       },
       {
+        "id": 2,
         "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/[e-img-4to3].jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£309.00",
-        "excVatPrice": "£109.00",
-        "bad-amount": true
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/[e-img-4to3].jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£309.00",
-        "excVatPrice": "£109.00",
-        "bad-amount": true
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/tap.jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£30.00",
-        "excVatPrice": "£10.00",
-        "lower-quantity": true,
-        "CC": "East Grinstead"
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/[e-img-4to3].jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£309.00",
-        "excVatPrice": "£109.00",
-        "bad-amount": true
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/[e-img-4to3].jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£309.00",
-        "excVatPrice": "£109.00",
-        "bad-amount": true
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/tap.jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£30.00",
-        "excVatPrice": "£10.00",
-        "lower-quantity": true,
-        "CC": "East Grinstead"
-      },
-      {
-        "quantity": {
-          "value": "1"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
-        "src": "img/placeholders/[e-img-4to3].jpg",
-        "price": "£2,009.00",
-        "incVatPrice": "£309.00",
-        "excVatPrice": "£109.00",
-        "bad-amount": true
-      },
-      {
-        "quantity": {
-          "value": "1"
+          "value": "5"
         },
         "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim",
         "src": "img/placeholders/[e-img-4to3].jpg",
@@ -125,3 +48,4 @@
     }
   }
 }
+

package/src/data/data_wismo.json

@@ -64,7 +64,7 @@
       },
       {
         "name": "Payment details:",
-        "value": "<div class='klarna-logo-img mt-1'><img src='./img/klarna.svg' alt='klarna'></div>"
+        "value": "<div class='klarna-logo-img mt-1'><klarna-placement data-key='sidebar-promotion-auto-size' data-locale='en-GB'></klarna-placement></div>"
       },
       {
         "name": "Voucher:",

package/src/elements/form-row.hbs

@@ -1,4 +1,4 @@
-<div class="form-row {{#if clearInput}}form-row--clear-input{{/if}} {{#if error}}form-row_validation-error{{/if}} {{#if locked}}form-row--locked{{/if}} {{row-mod}}" {{#if required}}data-row-required{{/if}} {{#if clearInput}}data-clearable{{/if}} {{#if showContent}}data-show-content{{/if}} {{#if skipGlobalValidation}}data-no-global-validation{{/if}} data-form-field>
+<div class="form-row {{#if clearInput}}form-row--clear-input{{/if}} {{#if error}}form-row_validation-error{{/if}} {{#if locked}}form-row--locked{{/if}} {{row-mod}}" {{#if required}}data-row-required{{/if}} {{#if clearInput}}data-clearable{{/if}} {{#if showContent}}data-show-content{{/if}} data-form-field>
   <label class="form-row__label {{#if required}}form-row__label_required{{/if}} {{#if label-hidden}}sr-only{{/if}}" for="{{id}}">
     {{label}}
     {{#if tooltip}}

package/src/elements/input.hbs

@@ -1,36 +1,7 @@
 {{#if textarea}}
   <textarea class="tbx {{#if textarea}}tbx_textarea{{/if}} {{#if error}}tbx_error{{/if}}" rows="{{textareaRows}}" cols="{{textareaCols}}" value="{{value}}" maxlength="{{maxlength}}" id="{{id}}" name="{{#if name}}{{name}}{{else}}{{id}}{{/if}}" {{#if disabled}}disabled{{/if}}></textarea>
 {{else if type}}
-  <input
-      type="{{type}}"
-      class="tbx {{#if error}}tbx_error{{/if}} {{input-mod}}"
-      value="{{value}}"
-      id="{{id}}"
-      name="{{#if name}}{{name}}{{else}}{{id}}{{/if}}"
-      placeholder="{{placeholder}}"
-      {{#if (or locked disabled)}}disabled{{/if}}
-      {{#if need-pattern}}pattern=""{{/if}}
-      {{#if readonly}}readonly{{/if}}
-      {{#if data-tag}}data-tag="{{data-tag}}"{{/if}}
-      {{#if maxlength}}maxlength="{{maxlength}}"{{/if}}
-      {{#if inputmode}}inputmode="{{inputmode}}"{{/if}}
-      {{#if autocomplete}}autocomplete="{{autocomplete}}"{{/if}}
-  >
+  <input type="{{type}}" class="tbx {{#if error}}tbx_error{{/if}} {{input-mod}}" value="{{value}}" id="{{id}}" name="{{#if name}}{{name}}{{else}}{{id}}{{/if}}" placeholder="{{placeholder}}" {{#if (or locked disabled)}}disabled{{/if}} {{#if need-pattern}}pattern=""{{/if}} {{#if readonly}}readonly{{/if}} {{#if data-tag}}data-tag="{{data-tag}}"{{/if}}>
 {{else}}
-  <input
-      type="text"
-      class="tbx {{#if error}}tbx_error{{/if}} {{input-mod}}"
-      value="{{value}}"
-      id="{{id}}"
-      name="{{#if name}}{{name}}{{else}}{{id}}{{/if}}"
-      placeholder="{{placeholder}}"
-      {{#if (or locked disabled)}}disabled{{/if}}
-      {{#if need-pattern}}pattern=""{{/if}}
-      {{#if readonly}}readonly{{/if}}
-      {{#if data-tag}}data-tag="{{data-tag}}"{{/if}}
-      {{#if error}}aria-invalid="true"{{/if}}
-      {{#if maxlength}}maxlength="{{maxlength}}"{{/if}}
-      {{#if inputmode}}inputmode="{{inputmode}}"{{/if}}
-      {{#if autocomplete}}autocomplete="{{autocomplete}}"{{/if}}
-    >
+  <input type="text" class="tbx {{#if error}}tbx_error{{/if}} {{input-mod}}" value="{{value}}" id="{{id}}" name="{{#if name}}{{name}}{{else}}{{id}}{{/if}}" placeholder="{{placeholder}}" {{#if (or locked disabled)}}disabled{{/if}} {{#if need-pattern}}pattern=""{{/if}} {{#if readonly}}readonly{{/if}} {{#if data-tag}}data-tag="{{data-tag}}"{{/if}}>
 {{/if}}

package/src/js/components/general/cart-slider.js

@@ -11,6 +11,10 @@ createPopupSlider({
     const htmlContent = event.detail.html;
     $(el.slider).append(htmlContent);
     showSlider();
+    Wick.MiniBasketSliderFE.isMiniBasketLoaded = false;
     $(el.sliderWrap).on('scroll', _.debounce(() => handleScroll(el.sliderWrap), 100));
   },
+  onClose: function () {
+    Wick.MiniBasketSliderFE.cartEntries = [];
+  }
 });

package/src/js/components/general/create-popup-slider.js

@@ -8,7 +8,7 @@ function createEvent(eventName, payload, eventDetail) {
   });
 }
 
-function createPopupSlider({ type, sliderSelector, onAppendEvent, onAppend }) {
+function createPopupSlider({ type, sliderSelector, onAppendEvent, onAppend, onClose }) {
   const events = {
     CLOSE_JUST_ADDED: 'CLOSE_JUST_ADDED',
     CLOSE_MINI_BASKET: 'CLOSE_MINI_BASKET'
@@ -119,6 +119,9 @@ function createPopupSlider({ type, sliderSelector, onAppendEvent, onAppend }) {
       .finally(() => {
         hideSlider();
         Wick.Backdrop.hide();
+        if (typeof onClose === 'function') {
+          onClose();
+        }
       })
   }
 
@@ -167,7 +170,7 @@ function createPopupSlider({ type, sliderSelector, onAppendEvent, onAppend }) {
     bindClosePopup();
 
     if (onAppendEvent && onAppend) {
-      document.addEventListener(onAppendEvent, (event) => {
+      window.addEventListener(onAppendEvent, (event) => {
         onAppend(event, { showSlider, handleScroll, el });
       });
     }

package/src/js/components/general/notification.js

@@ -4,14 +4,13 @@ Wick.Notification = (function(){
     var self = this,
         iconSuccess = '<span class="icon notification__icon"><span class="fas fa-check-circle"></span></span>',
         iconWarning = '<span class="icon notification__icon"><span class="fas fa-exclamation-circle"></span></span>',
-        iconError = '<span class="icon notification__icon"><span class="fas fa-times-circle"></span></span>',
         closeBtn = '<span class="icon notification__close"><span class="far fa-times"></span></span>';
 
     this.$self = $('<div/>', {
       'class': 'notification notification_general notification_' + params.type,
       html: params.text
     })
-        .prepend(params.type === 'success' ? iconSuccess : params.type === 'warning' ? iconWarning : params.type === 'error' ? iconError : '')
+        .prepend(params.type === 'success' ? iconSuccess : params.type === 'warning' ? iconWarning : params.type === 'error' ? iconWarning : '')
         .prepend(params.closeBtn ? closeBtn : '')
         .prependTo(params.container);
 

package/src/js/components/toggle-password-visibility.js

@@ -0,0 +1,58 @@
+var Wick = window.Wick || {};
+
+Wick.TogglePasswordVisibility = {
+  el: {
+    $toggleShow: $('[data-show-content] .toggle-show'),
+    inputWrap: $('.form-row[data-show-content] .input-wrap'),
+    toggleIcon: '.toggle-show',
+  },
+
+  updateIconVisibility(inputField, toggleIcon) {
+    const valueLength = inputField.val().length;
+    if (valueLength > 0) {
+      toggleIcon.show();
+    } else {
+      toggleIcon.hide();
+    }
+  },
+
+  attachInputListener(inputField, toggleIcon) {
+    inputField.on('input', function () {
+      Wick.TogglePasswordVisibility.updateIconVisibility($(this), toggleIcon);
+    });
+  },
+
+  attachToggleClickListener(inputField, toggleIcon) {
+    toggleIcon.on('click', function () {
+      const isPasswordType = inputField.attr('type') === 'password';
+      const iconSvg = $(this).find('svg');
+
+      if (isPasswordType) {
+        inputField.attr('type', 'text');
+        iconSvg.removeClass('fa-eye-slash').addClass('fa-eye');
+      } else {
+        inputField.attr('type', 'password');
+        iconSvg.removeClass('fa-eye').addClass('fa-eye-slash');
+      }
+    });
+  },
+
+  init() {
+    Wick.TogglePasswordVisibility.el.inputWrap.each(function () {
+      const inputField = $(this).find('input');
+      const toggleIcon = $(this).find(Wick.TogglePasswordVisibility.el.toggleIcon);
+
+      Wick.TogglePasswordVisibility.attachInputListener(inputField, toggleIcon);
+      Wick.TogglePasswordVisibility.updateIconVisibility(inputField, toggleIcon);
+      Wick.TogglePasswordVisibility.attachToggleClickListener(inputField, toggleIcon);
+    });
+  },
+};
+
+$(document).ready(function () {
+  if (!Wick.TogglePasswordVisibility.el.$toggleShow.length) {
+    return;
+  }
+
+  Wick.TogglePasswordVisibility.init();
+});

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

@@ -2,33 +2,24 @@ var Wick = Wick || {};
 
 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 (e) {
-      e.preventDefault();
-      var $scope = $(this).closest('form');
-      if (!$scope.length) $scope = $(this).closest('.billing-address');
-      if (!$scope.length) $scope = $('.billing-address');
-      var nameVal= ($scope.find('#card-name').val() || '').trim();
-      var finderVal= ($scope.find('#first-line-address').val() || '').trim();
-      var manualLine1= ($scope.find('#address-line-1').val() || '').trim();
-      var manualTown= ($scope.find('#town-city').val() || '').trim();
-      var manualPost= ($scope.find('#postcode_additional').val() || '').trim();
-      var addressFinderOk = finderVal.length > 0;
-      var addressManualOk = manualLine1 && manualTown && manualPost;
-
-      if (nameVal && (addressFinderOk || addressManualOk)) {
-        var $details = $('.checkout-payment-details__card-details');
-        $details.removeClass('checkout-payment-details__card-details_hidden');
-        $('html, body').animate({ scrollTop: $details.offset().top - 15 }, 700);
-        return;
-      }
-
-      var formEl = $scope.closest('form').get(0) || $scope.get(0);
-      if (formEl && Wick.Forms && Wick.Forms.showValidationErrors) {
-        Wick.Forms.showValidationErrors(formEl);
+    $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){
+        $('.checkout-payment-details__card-details').removeClass('checkout-payment-details__card-details_hidden');
+        $('html, body').animate({
+          scrollTop: $('.checkout-payment-details__card-details').offset().top - 15
+        }, 700);
+        return false;
       }
+      Wick.Forms.showValidationErrors($form[0]);
+      return false;
     });
 
     $('.checkout-payment-details__card-details').on('submit', function(){

package/src/js/emulation/custom-slider-emulation.js

@@ -7,22 +7,16 @@ function simulateHybrisSendingHtml() {
   document.dispatchEvent(event);
 }
 
-function initCloseJustAddedDiff() {
-  $(window).on('CLOSE_JUST_ADDED CLOSE_MINI_BASKET', function ({ detail: { resolve }}) {
+function bindResolveEvent(events) {
+  $(window).on(events.join(' '), function ({ detail: { resolve } }) {
     setTimeout(() => {
-      return resolve();
+      resolve();
     }, 200);
   });
-};
-
-function simulateShowMiniBasket() {
-  const event = new CustomEvent('showMiniBasket', {});
-  document.dispatchEvent(event);
 }
 
 $(document).ready(function () {
   $('.btn-add-to-basket').on('click', simulateHybrisSendingHtml);
-  $('.header-minicart__btn').on('click', simulateShowMiniBasket);
 
-  initCloseJustAddedDiff();
+  bindResolveEvent(['CLOSE_JUST_ADDED', 'CLOSE_MINI_BASKET', 'MINI_BASKET_CHECKOUT', 'MINI_BASKET_VIEW_BASKET']);
 });

package/src/js/emulation/forms.js

@@ -60,16 +60,11 @@ Wick.Forms = (function(){
 
   var showValidationErrors = function (form, errorMsg) {
     var $form = $(form);
-    var $rows = $form.find(fieldRow).not('[data-no-global-validation]');
-    if (!$rows.length) return;
-    $rows.find('.form-row__error').remove();
-
     if (!$form.hasClass(formInvalid)) {
-      $form.addClass(formInvalid);
+      $form.find('.form-row__error').remove();
+      $form.addClass(formInvalid).find(fieldRow).append(validationError(errorMsg)).addClass(rowValidationError);
     }
 
-    $rows.append(validationError(errorMsg)).addClass(rowValidationError);
-
     var $firstMsg = $form.find(fieldRow).first();
     if($firstMsg.length && !isElementInViewport($firstMsg)){
       var inModal = $firstMsg.closest('.modal').length,