wickes-css2 2.109.0-develop.1 → 2.109.0-develop.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (84) hide show
  1. package/build/css/category-main.css +1 -1
  2. package/build/css/components/card-product-banner.css +1 -1
  3. package/build/css/homepage-main.css +1 -1
  4. package/build/css/kitchen-plp-main.css +1 -1
  5. package/build/css/main.css +1 -1
  6. package/build/css/my-account-main-v2.css +1 -1
  7. package/build/css/my-account-main.css +1 -1
  8. package/build/css/pages/page_checkout_delivery-new.css +1 -1
  9. package/build/css/pages/page_products-list-combined.css +1 -1
  10. package/build/css/pages/page_products-list.css +1 -1
  11. package/build/css/pages/page_shopping-cart-v2.css +1 -1
  12. package/build/css/pdp-main-before-combine.css +1 -1
  13. package/build/css/pdp-main-critical.css +1 -1
  14. package/build/css/pdp-main-non-critical.css +1 -1
  15. package/build/css/pdp-main.css +1 -1
  16. package/build/css/plp-main.css +1 -1
  17. package/build/css/store-locator-main.css +1 -1
  18. package/build/js/basket.min.js +1 -1
  19. package/build/js/checkout.min.js +1 -1
  20. package/build/js/emulation.min.js +178 -56
  21. package/build/js/gift-cards.min.js +1 -1
  22. package/build/js/merged-checkout.min.js +1 -1
  23. package/build/js/mini-basket-slider.min.js +1 -1
  24. package/build/js/page/basket/mini-basket-total.js +17 -2
  25. package/build/js/page/components/notify-me.js +99 -0
  26. package/build/js/page/components/order-summary.js +35 -0
  27. package/build/js/pdp.bundle.min.js +2 -1
  28. package/build/js/wickes-dc.js +1 -0
  29. package/package.json +1 -3
  30. package/src/components/base/button.hbs +1 -1
  31. package/src/components/card_product_banner_v2.hbs +4 -1
  32. package/src/components/card_sponsor_banner.hbs +4 -1
  33. package/src/components/checkout_order-summary-new.hbs +10 -1
  34. package/src/components/click-and-collect-modal.hbs +0 -14
  35. package/src/components/date-selection.hbs +1 -1
  36. package/src/components/delivery-types.hbs +11 -3
  37. package/src/components/injected-content.hbs +6 -1
  38. package/src/components/modal.hbs +1 -1
  39. package/src/components/modals/notify-me-modal.hbs +76 -0
  40. package/src/components/order-summary.hbs +2 -2
  41. package/src/components/price-block-v2.hbs +211 -214
  42. package/src/components/sponsor-top-banner.hbs +10 -0
  43. package/src/data/data_delivery-address-v2.json +1 -1
  44. package/src/data/data_search-results_v2.json +9 -2
  45. package/src/data/data_spr_injected_content.json +4 -0
  46. package/src/js/emulation/checkout-delivery-details.js +28 -25
  47. package/src/js/emulation/custom-slider-emulation.js +1 -1
  48. package/src/js/emulation/date-selection.js +136 -24
  49. package/src/js/emulation/forms.js +12 -0
  50. package/src/js/emulation/mini-basket-data.js +3 -3
  51. package/src/js/emulation/notify-me.js +9 -0
  52. package/src/js/emulation/switchCalendar.js +12 -8
  53. package/src/js/page/basket/mini-basket-total.js +17 -2
  54. package/src/js/page/components/notify-me.js +99 -0
  55. package/src/js/page/components/order-summary.js +35 -0
  56. package/src/page_checkout_next-day-delivery-details.html +2 -2
  57. package/src/page_checkout_payment-details-v2-asm.html +1 -1
  58. package/src/page_checkout_payment-details-v2.html +1 -1
  59. package/src/page_checkout_payment-details_with-card-loader.html +1 -1
  60. package/src/page_checkout_payment-details_with-klarna-loader.html +1 -1
  61. package/src/page_checkout_payment-details_with-loader-v2.html +1 -1
  62. package/src/page_checkout_rapid-delivery-details.html +7 -5
  63. package/src/page_klarna_payment-details_with-klarna.html +1 -1
  64. package/src/page_payment-details-with-billie.html +1 -1
  65. package/src/page_payment-details-with-clearpay.html +1 -1
  66. package/src/page_payment-details-with-gift-card.html +1 -1
  67. package/src/page_payment-details_with_apple-pay.html +1 -1
  68. package/src/page_payment-details_with_google-pay.html +1 -1
  69. package/src/page_plp_v2.html +1 -0
  70. package/src/page_product-details-mfe-calculator.html +9 -3
  71. package/src/scss/common/_CTAs.scss +7 -3
  72. package/src/scss/components/_custom-slider.scss +18 -0
  73. package/src/scss/components/_date-selection-add-new-styles.scss +43 -1
  74. package/src/scss/components/_notify-me-modal.scss +139 -0
  75. package/src/scss/components/_order-summary.scss +25 -12
  76. package/src/scss/components/_price-block-critical.scss +2 -2
  77. package/src/scss/components/_price-block.scss +14 -4
  78. package/src/scss/components/card-product-banner.scss +8 -0
  79. package/src/scss/helpers/_CTAs.scss +15 -5
  80. package/src/scss/pages/page_checkout_delivery-new.scss +36 -0
  81. package/src/scss/pages/page_products-list-combined.scss +8 -1
  82. package/src/scss/pages/page_products-list.scss +8 -1
  83. package/src/scss/pages/page_shopping-cart-v2.scss +34 -10
  84. package/src/scss/pdp-main.scss +1 -0
@@ -1,32 +1,144 @@
1
- var Wick = Wick || {};
2
- Wick.DateSelection = (function(){
3
- var $self = $('.date-selection'),
4
- cell = '.calendar__cell_cnt',
5
- selectedCell = 'calendar__cell_selected',
6
- isSelected = 'date-selection_selected',
7
- isDateSelected = false;
8
-
9
- var selectTimeSlot = function(e){
10
- $(cell).removeClass(selectedCell);
11
- $(e.target).addClass(selectedCell);
12
- $self.addClass(isSelected);
1
+ const DS_EL = {
2
+ cell: '.calendar__cell_cnt',
3
+ dateSelection: '.date-selection',
4
+ loader: '.rapid-loader',
5
+ title: '.delivery-btn .title',
6
+ subtitle: '.delivery-btn .subtitle',
7
+ infoIcon: '.rapid-info-icon',
8
+ image: '.delivery-btn__image',
9
+ };
10
+
11
+ const DS_CLASSES = {
12
+ selectedCell: 'calendar__cell_selected',
13
+ isSelected: 'date-selection_selected',
14
+ rapidCell: 'calendar__cell_rapid',
15
+ hidden: 'd-none',
16
+ };
17
+
18
+ let rapidLoaderShown = false;
19
+ let isDateSelected = false;
20
+
21
+ function generateRapidEstimate() {
22
+ const scenario = Math.floor(Math.random() * 4);
23
+
24
+ switch (scenario) {
25
+ case 0: {
26
+ const mins = Math.floor(Math.random() * 59) + 1;
27
+ const padded = String(mins).padStart(2, '0');
28
+ const word = mins === 1 ? 'minute' : 'minutes';
29
+ return `Delivered in as little as <br>${padded} ${word} for &pound;10.00`;
30
+ }
31
+ case 1: {
32
+ const mins = Math.floor(Math.random() * 60);
33
+ const padded = String(mins).padStart(2, '0');
34
+ const word = mins === 1 ? 'minute' : 'minutes';
35
+ const minutePart = mins === 0 ? '00 minutes' : `${padded} ${word}`;
36
+ return `Delivered in as little as <br>1 hour ${minutePart} for &pound;10.00`;
37
+ }
38
+ case 2: {
39
+ const mins = Math.floor(Math.random() * 60);
40
+ const padded = String(mins).padStart(2, '0');
41
+ const word = mins === 1 ? 'minute' : 'minutes';
42
+ const minutePart = mins === 0 ? '00 minutes' : `${padded} ${word}`;
43
+ return `Delivered in as little as <br>2 hours ${minutePart} for &pound;10.00`;
44
+ }
45
+ default:
46
+ return null;
47
+ }
48
+ }
49
+
50
+ function updateDeliveryInfo() {
51
+ const $subtitle = $(DS_EL.subtitle);
52
+ const $infoIcon = $subtitle.find(DS_EL.infoIcon).detach();
53
+ const estimate = generateRapidEstimate();
54
+
55
+ if (estimate) {
56
+ $subtitle.html(estimate);
57
+ $infoIcon.removeClass(DS_CLASSES.hidden);
58
+ } else {
59
+ $subtitle.html('Delivery within 3 hours for <b>&pound;10.00');
60
+ $infoIcon.addClass(DS_CLASSES.hidden);
61
+ }
62
+
63
+ $subtitle.append($infoIcon);
64
+ $infoIcon.filter('[data-toggle="tooltip"]').tooltip();
65
+ }
66
+
67
+ function showRapidLoader() {
68
+ const $self = $(DS_EL.dateSelection);
69
+ const $loader = $(DS_EL.loader);
70
+ $loader.removeClass(DS_CLASSES.hidden);
71
+
72
+ setTimeout(() => {
73
+ $loader.addClass(DS_CLASSES.hidden);
74
+ $self.addClass(DS_CLASSES.isSelected);
75
+ updateRapidInfo();
76
+ }, 3000);
77
+ }
78
+
79
+ function updateNonRapidInfo() {
80
+ const $title = $(DS_EL.title);
81
+ const $subtitle = $(DS_EL.subtitle);
82
+ const $infoIcon = $subtitle.find(DS_EL.infoIcon).detach();
83
+ const $image = $(DS_EL.image);
84
+
85
+ $title.text('Next or Named day delivery');
86
+ $subtitle.html('Delivery between 7am - 7pm for &pound;12.00');
87
+ $infoIcon.addClass(DS_CLASSES.hidden);
88
+ $subtitle.append($infoIcon);
89
+ $image.addClass(DS_CLASSES.hidden);
90
+ }
91
+
92
+ function updateRapidInfo() {
93
+ const $title = $(DS_EL.title);
94
+ const $image = $(DS_EL.image);
95
+
96
+ $title.text('Rapid delivery');
97
+ $image.removeClass(DS_CLASSES.hidden);
98
+ updateDeliveryInfo();
99
+ }
100
+
101
+ function selectTimeSlot(e) {
102
+ const $self = $(DS_EL.dateSelection);
103
+ const $cell = $(e.target).closest(DS_EL.cell);
104
+ const isRapid = $cell.hasClass(DS_CLASSES.rapidCell);
105
+
106
+ $(DS_EL.cell).removeClass(DS_CLASSES.selectedCell);
107
+ $cell.addClass(DS_CLASSES.selectedCell);
13
108
  $self.trigger('selected');
14
109
  isDateSelected = true;
15
- };
16
110
 
17
- var init = function () {
111
+ if (isRapid) {
112
+ if (!rapidLoaderShown) {
113
+ rapidLoaderShown = true;
114
+ showRapidLoader();
115
+ return;
116
+ } else {
117
+ $self.addClass(DS_CLASSES.isSelected);
118
+ updateRapidInfo();
119
+ }
120
+ } else {
121
+ $self.addClass(DS_CLASSES.isSelected);
122
+ updateNonRapidInfo();
123
+ }
124
+ }
125
+
126
+ function initDateSelection() {
127
+ const $self = $(DS_EL.dateSelection);
128
+
18
129
  if (!$self.length) {
19
- return;
130
+ return;
20
131
  }
21
132
 
22
- $self.on('click', cell, selectTimeSlot);
23
- }
133
+ $self.on('click', DS_EL.cell, selectTimeSlot);
134
+ }
24
135
 
25
- init();
136
+ var Wick = window.Wick || {};
26
137
 
27
- return {
28
- isDateSelected: function(){
29
- return isDateSelected;
30
- }
31
- }
32
- })();
138
+ Wick.DateSelection = {
139
+ isDateSelected: () => isDateSelected,
140
+ };
141
+
142
+ $(document).ready(function () {
143
+ initDateSelection();
144
+ });
@@ -323,6 +323,18 @@ Wick.Forms = (function () {
323
323
  }
324
324
  }
325
325
 
326
+ if ($(form).is('.notify-me-form')) {
327
+ if ($(form).find('#notify-me-email').val().length) {
328
+ return false;
329
+ }
330
+ }
331
+
332
+ if ($(form).is('.add-list-id__form')) {
333
+ if ($(form).find('#project-id').val().length) {
334
+ return false;
335
+ }
336
+ }
337
+
326
338
  if ($(form).is('.header-search')) {
327
339
  window.location.href = './page_search-results.html';
328
340
  }
@@ -1,4 +1,4 @@
1
- var Wick = Wick || {};
1
+ window.Wick = window.Wick || {};
2
2
  Wick.MiniBasketData = (function () {
3
3
  return {
4
4
  updateQuantity: {
@@ -874,14 +874,14 @@ Wick.MiniBasketData = (function () {
874
874
  clickAndCollectOnly: false,
875
875
  deliveryItemsQuantity: 1,
876
876
  pickupItemsQuantity: 2,
877
- freeDelivery: true,
877
+ freeDelivery: false,
878
878
  subtotalWithoutCharity: {
879
879
  value: 19.0,
880
880
  formattedValue: '£19.00',
881
881
  currencyIso: 'GBP',
882
882
  formattedPriceWithoutCurrencySymbol: '19.00',
883
883
  },
884
- messageForFreeDelivery: 'Free delivery<i class="icon fas fa-check"></i>',
884
+ messageForFreeDelivery: null,
885
885
  pickupOrderGroups: [
886
886
  {
887
887
  entries: [
@@ -0,0 +1,9 @@
1
+ function initNotifyMeEmulation() {
2
+ $(document).on('submit', Wick.NotifyMeSubscription.el.form, () =>
3
+ Wick.NotifyMeSubscription.showSuccessState()
4
+ );
5
+ }
6
+
7
+ $(document).ready(function () {
8
+ initNotifyMeEmulation();
9
+ });
@@ -16,20 +16,21 @@ Wick.Calendar = {
16
16
  if ($(this).hasClass(Wick.Calendar.el.switchBtnEarlier)) {
17
17
  $currentCalendar = $currentCalendar.prev();
18
18
  $currentCalendar.removeClass(Wick.Calendar.el.dateSectionHidden);
19
-
20
19
  } else if ($(this).hasClass(Wick.Calendar.el.switchBtnLatest)) {
21
20
  $currentCalendar = $currentCalendar.next(Wick.Calendar.el.dateSection);
22
21
  $currentCalendar.removeClass(Wick.Calendar.el.dateSectionHidden);
23
22
  }
24
23
  },
25
-
26
24
  };
27
25
 
28
26
  $(document).ready(function () {
29
27
  function init() {
30
-
31
28
  if (Wick.checkLocalEnv) {
32
- $(Wick.Calendar.el.componentDateSection).on('click', Wick.Calendar.el.switchBtn, Wick.Calendar.SwitchCalendar);
29
+ $(Wick.Calendar.el.componentDateSection).on(
30
+ 'click',
31
+ Wick.Calendar.el.switchBtn,
32
+ Wick.Calendar.SwitchCalendar
33
+ );
33
34
  }
34
35
  }
35
36
 
@@ -39,8 +40,11 @@ $(document).ready(function () {
39
40
 
40
41
  init();
41
42
 
42
- $(window).on('resize', _.debounce(function () {
43
- unbind();
44
- init();
45
- }, 250));
43
+ $(window).on(
44
+ 'resize',
45
+ _.debounce(function () {
46
+ unbind();
47
+ init();
48
+ }, 250)
49
+ );
46
50
  });
@@ -1,10 +1,11 @@
1
1
  import { updateDiscount } from '../components/discounts';
2
2
 
3
3
  const osEl = {
4
- $totalSection: $('.mini-basket__total'),
4
+ totalSection: '.mini-basket__total',
5
5
  checkoutWidgetDetailsDiscount: '.checkout-widget__details-discount',
6
6
  checkoutWidgetDetails: '.checkout-widget__details',
7
7
  delivery: '.checkout-widget__item-delivery',
8
+ deliveryCostMessage: '.checkout-widget__item-delivery-cost-message',
8
9
  cc: '.checkout-widget__item-cc',
9
10
  itemFree: '.checkout-widget__item-free',
10
11
  itemDeficit: '.checkout-widget__item-deficit',
@@ -37,26 +38,40 @@ export function updateTotal(data, equalMap, isVoucher) {
37
38
  }
38
39
 
39
40
  function createCheckoutWidgetItem(obj) {
41
+ const isDelivery = obj.item === osEl.delivery;
40
42
  return `
41
43
  <li class="checkout-widget__item ${obj.item.substr(1)}">
42
44
  <span>${obj.title}</span>
43
45
  <span class="checkout-widget__item-value">${obj.dataValue}</span>
44
46
  </li>
47
+ ${
48
+ isDelivery
49
+ ? `
50
+ <li class="checkout-widget__item checkout-widget__item-delivery-cost-message">
51
+ <span class="checkout-widget__item-value" id="order-delivery-cost-message">
52
+ Final delivery cost confirmed at checkout
53
+ </span>
54
+ </li>`
55
+ : ''
56
+ }
45
57
  `;
46
58
  }
47
59
 
48
60
  function hideUnusedDeliveryTypeCost(data, isVoucher) {
49
61
  $(osEl.delivery).show();
62
+ $(osEl.deliveryCostMessage).show();
50
63
  $(osEl.cc).show();
51
64
  if (isVoucher) {
52
65
  if (!data.deliveryOrder) {
53
66
  $(osEl.delivery).hide();
67
+ $(osEl.deliveryCostMessage).hide();
54
68
  } else if (!data.clickAndCollectOrder) {
55
69
  $(osEl.cc).hide();
56
70
  }
57
71
  } else {
58
72
  if (data.clickAndCollectOnly) {
59
73
  $(osEl.delivery).hide();
74
+ $(osEl.deliveryCostMessage).hide();
60
75
  } else if (data.deliveryItemsQuantity > 0 && data.pickupItemsQuantity === 0) {
61
76
  $(osEl.cc).hide();
62
77
  }
@@ -64,7 +79,7 @@ function hideUnusedDeliveryTypeCost(data, isVoucher) {
64
79
  }
65
80
 
66
81
  function calculateFreeDelivery(data) {
67
- osEl.$totalSection.each(function () {
82
+ $(osEl.totalSection).each(function () {
68
83
  let $free = $(this).find(osEl.itemFree);
69
84
  let $deficit = $(this).find(osEl.itemDeficit);
70
85
 
@@ -0,0 +1,99 @@
1
+ import { showValidationErrors, clearValidationErrors, isValidEmail } from '../utils/validation';
2
+
3
+ var Wick = window.Wick || {};
4
+
5
+ Wick.NotifyMeSubscription = {
6
+ NOTIFY_ME_EVENT: 'NOTIFY_ME',
7
+ HIDDEN_CLASS_NAME: 'd-none',
8
+ el: {
9
+ notifyMePopup: '#modal-notify-me',
10
+ notifyMeBtn: '.btn--notify-open',
11
+
12
+ form: '#modal-notify-me .notify-me-form',
13
+ emailInput: '#modal-notify-me #notify-me-email',
14
+ stateForm: '#modal-notify-me [data-notify-state="form"]',
15
+ stateSuccess: '#modal-notify-me [data-notify-state="success"]',
16
+ headerForm: '#modal-notify-me [data-notify-header="form"]',
17
+ headerSuccess: '#modal-notify-me [data-notify-header="success"]',
18
+ productId: '#product-code-val',
19
+ },
20
+ defaultErrorMessage: 'Something went wrong',
21
+ invalidEmailMessage: 'Please enter a valid email address',
22
+ showCustomModal() {
23
+ $(Wick.NotifyMeSubscription.el.notifyMePopup).modal('show');
24
+ },
25
+ getEmail() {
26
+ return ($(Wick.NotifyMeSubscription.el.emailInput).val() || '').toString().trim();
27
+ },
28
+ isEmailValid() {
29
+ const email = Wick.NotifyMeSubscription.getEmail();
30
+
31
+ return isValidEmail(email);
32
+ },
33
+ showFormState() {
34
+ $(Wick.NotifyMeSubscription.el.stateSuccess).addClass(
35
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
36
+ );
37
+ $(Wick.NotifyMeSubscription.el.stateForm).removeClass(
38
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
39
+ );
40
+
41
+ $(Wick.NotifyMeSubscription.el.headerSuccess).addClass(
42
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
43
+ );
44
+ $(Wick.NotifyMeSubscription.el.headerForm).removeClass(
45
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
46
+ );
47
+ },
48
+ showSuccessState() {
49
+ $(Wick.NotifyMeSubscription.el.stateForm).addClass(
50
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
51
+ );
52
+ $(Wick.NotifyMeSubscription.el.stateSuccess).removeClass(
53
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
54
+ );
55
+
56
+ $(Wick.NotifyMeSubscription.el.headerForm).addClass(
57
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
58
+ );
59
+ $(Wick.NotifyMeSubscription.el.headerSuccess).removeClass(
60
+ Wick.NotifyMeSubscription.HIDDEN_CLASS_NAME
61
+ );
62
+ },
63
+ resetValidation() {
64
+ clearValidationErrors(Wick.NotifyMeSubscription.el.form);
65
+ },
66
+ validateForm() {
67
+ Wick.NotifyMeSubscription.resetValidation();
68
+
69
+ if (!Wick.NotifyMeSubscription.isEmailValid()) {
70
+ showValidationErrors(
71
+ Wick.NotifyMeSubscription.el.form,
72
+ Wick.NotifyMeSubscription.invalidEmailMessage
73
+ );
74
+ return false;
75
+ }
76
+
77
+ return true;
78
+ },
79
+ showError(err = {}) {
80
+ const msg = err.errMsg || err.errorMessage || Wick.NotifyMeSubscription.defaultErrorMessage;
81
+
82
+ showValidationErrors(Wick.NotifyMeSubscription.el.form, msg);
83
+ },
84
+ init() {
85
+ $(document).on('click', Wick.NotifyMeSubscription.el.notifyMeBtn, function (e) {
86
+ e.preventDefault();
87
+ Wick.NotifyMeSubscription.showCustomModal();
88
+ });
89
+
90
+ $(Wick.NotifyMeSubscription.el.notifyMePopup).on('hidden.bs.modal', function () {
91
+ Wick.NotifyMeSubscription.showFormState();
92
+ clearValidationErrors(Wick.NotifyMeSubscription.el.form);
93
+ });
94
+ },
95
+ };
96
+
97
+ $(document).ready(function () {
98
+ Wick.NotifyMeSubscription.init();
99
+ });
@@ -5,6 +5,7 @@ const osEl = {
5
5
  checkoutWidgetDetailsDiscount: '.checkout-widget__details-discount',
6
6
  checkoutWidgetDetails: '.checkout-widget__details',
7
7
  delivery: '.checkout-widget__item-delivery',
8
+ deliveryCostMessage: '.checkout-widget__item-delivery-cost-message',
8
9
  cc: '.checkout-widget__item-cc',
9
10
  itemFree: '.checkout-widget__item-free',
10
11
  itemDeficit: '.checkout-widget__item-deficit',
@@ -26,6 +27,22 @@ export function updateOrderSummary(data, equalMap, isVoucher) {
26
27
  }
27
28
  }
28
29
 
30
+ if (obj.item === osEl.delivery) {
31
+ $(osEl.delivery).each(function () {
32
+ if (
33
+ !$(this).siblings(osEl.deliveryCostMessage).length &&
34
+ !$(this).closest('[data-hide-delivery-cost-message]').length
35
+ ) {
36
+ $(this).after(`
37
+ <li class="checkout-widget__item checkout-widget__item-delivery-cost-message">
38
+ <span class="checkout-widget__item-value" id="order-delivery-cost-message">
39
+ Final delivery cost confirmed at checkout
40
+ </span>
41
+ </li>`);
42
+ }
43
+ });
44
+ }
45
+
29
46
  $(obj.item).find(obj.itemValue).text(obj.dataValue);
30
47
  if (isVoucher ? obj.dataValue : obj.value && obj.dataValue) {
31
48
  $(obj.item).find(obj.itemValue).show();
@@ -64,20 +81,37 @@ export function updateOrderSummary(data, equalMap, isVoucher) {
64
81
  }
65
82
 
66
83
  function createCheckoutWidgetItem(obj) {
84
+ const isDelivery = obj.item === osEl.delivery;
85
+ const hideMessage = $(osEl.checkoutWidgetDetails).closest(
86
+ '[data-hide-delivery-cost-message]'
87
+ ).length;
88
+ const costMessageExists = $(osEl.deliveryCostMessage).length > 0;
67
89
  return `
68
90
  <li class="checkout-widget__item ${obj.item.substr(1)}">
69
91
  <span>${obj.title}</span>
70
92
  <span class="checkout-widget__item-value">${obj.dataValue}</span>
71
93
  </li>
94
+ ${
95
+ isDelivery && !hideMessage && !costMessageExists
96
+ ? `
97
+ <li class="checkout-widget__item checkout-widget__item-delivery-cost-message">
98
+ <span class="checkout-widget__item-value" id="order-delivery-cost-message">
99
+ Final delivery cost confirmed at checkout
100
+ </span>
101
+ </li>`
102
+ : ''
103
+ }
72
104
  `;
73
105
  }
74
106
 
75
107
  function hideUnusedDeliveryTypeCost(data, isVoucher) {
76
108
  $(osEl.delivery).show();
109
+ $(osEl.deliveryCostMessage).show();
77
110
  $(osEl.cc).show();
78
111
  if (isVoucher) {
79
112
  if ('deliveryOrder' in data && data.deliveryOrder === false) {
80
113
  $(osEl.delivery).hide();
114
+ $(osEl.deliveryCostMessage).hide();
81
115
  }
82
116
 
83
117
  if ('clickAndCollectOrder' in data && data.clickAndCollectOrder === false) {
@@ -86,6 +120,7 @@ function hideUnusedDeliveryTypeCost(data, isVoucher) {
86
120
  } else {
87
121
  if (data.clickAndCollectOnly) {
88
122
  $(osEl.delivery).hide();
123
+ $(osEl.deliveryCostMessage).hide();
89
124
  } else if (data.deliveryItemsQuantity > 0 && data.pickupItemsQuantity === 0) {
90
125
  $(osEl.cc).hide();
91
126
  }
@@ -23,7 +23,7 @@
23
23
  Please choose a date for delivery from the calendar below.
24
24
  </p>
25
25
  <p class="date-selection__info-block">
26
- Our delivery slots are currently available up to 8 days in advance. We release additional delivery slots daily.
26
+ Our delivery slots are currently available up to 8 days in advance.<br> We release additional delivery slots daily.
27
27
  </p>
28
28
  <p class="date-selection__annotation">
29
29
  *Individual couriers will provide more information on delivery times, closer to your chosen delivery date.
@@ -32,7 +32,7 @@
32
32
 
33
33
  <div class="component component-date-selection">
34
34
  {{> date-selection
35
- titleDelivery="Next and Named day delivery"
35
+ titleDelivery="Next or Named day delivery"
36
36
  subtitleDelivery="Delivery between 7am - 7pm for £7*"
37
37
  wisdom=true
38
38
  }}
@@ -11,7 +11,7 @@
11
11
  {{/content}}
12
12
 
13
13
  {{#content "aside"}}
14
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true email=true}}
14
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true email=true hideDeliveryCostMessage=true}}
15
15
  {{/content}}
16
16
 
17
17
 
@@ -11,7 +11,7 @@
11
11
  {{/content}}
12
12
 
13
13
  {{#content "aside"}}
14
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2="true"}}
14
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2="true" hideDeliveryCostMessage=true}}
15
15
  {{/content}}
16
16
 
17
17
 
@@ -11,7 +11,7 @@
11
11
  {{/content}}
12
12
 
13
13
  {{#content "aside"}}
14
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
14
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true hideDeliveryCostMessage=true}}
15
15
  {{/content}}
16
16
 
17
17
 
@@ -11,7 +11,7 @@
11
11
  {{/content}}
12
12
 
13
13
  {{#content "aside"}}
14
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
14
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true hideDeliveryCostMessage=true}}
15
15
  {{/content}}
16
16
 
17
17
 
@@ -11,7 +11,7 @@
11
11
  {{/content}}
12
12
 
13
13
  {{#content "aside"}}
14
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
14
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true hideDeliveryCostMessage=true}}
15
15
  {{/content}}
16
16
 
17
17
 
@@ -17,7 +17,7 @@
17
17
  <div class="delivery-block">
18
18
  <h3 class="delivery-block__heading">Delivery Information</h3>
19
19
  {{> banner-news
20
- description="<b>Your order qualifies for Wickes Rapid delivery.</b></br>Alternative delivery options are available."
20
+ description="<b>Your order qualifies for Rapid delivery.</b></br>Alternative delivery options are available."
21
21
  classImg="fas fa-shipping-fast"
22
22
  }}
23
23
  <div class="delivery-block__wrapper">
@@ -27,14 +27,15 @@
27
27
  Please choose a date for delivery from the calendar below.
28
28
  </p>
29
29
  <p class="date-selection__info-block">
30
- Our delivery slots are currently available up to 8 days in advance. We release additional delivery slots daily.
30
+ Our delivery slots are currently available up to 8 days in advance.<br> We release additional delivery slots daily.
31
31
  </p>
32
+ <p>*Individual couriers will provide more information on delivery times, closer to your chosen delivery date.</p>
32
33
  </div>
33
34
 
34
35
  <div class="component component-date-selection">
35
36
  {{> date-selection
36
- titleDelivery="Wickes Rapid delivery"
37
- subtitleDelivery="Delivery within 3 hours for £12"
37
+ titleDelivery="Next or Named day delivery"
38
+ subtitleDelivery="Delivery between 7am - 7pm for £12.00"
38
39
  imgDelivery="fas fa-shipping-fast"
39
40
  wisdom=true
40
41
  }}
@@ -131,10 +132,11 @@
131
132
  <div class="continue-btn">
132
133
  <button class="btn btn-action">Continue to Payment Details</button>
133
134
  </div>
134
-
135
135
  {{/content}}
136
136
 
137
137
  {{#content "foot" mode="append"}}
138
+ {{> loader titleLoader="Loading Rapid delivery..." hidden=true modifier="basket-loader rapid-loader"}}
139
+
138
140
  <script defer src="./js/page/checkout-confirmation-new.js"></script>
139
141
  <script defer src="./js/page/select-address.js"></script>
140
142
 
@@ -13,7 +13,7 @@
13
13
  {{/content}}
14
14
 
15
15
  {{#content "aside"}}
16
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true}}
16
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true hideDeliveryCostMessage=true}}
17
17
  {{/content}}
18
18
 
19
19
 
@@ -16,7 +16,7 @@
16
16
  {{/content}}
17
17
 
18
18
  {{#content "aside"}}
19
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon billieIcon=true paymentsCheckoutV2=true}}
19
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon billieIcon=true paymentsCheckoutV2=true hideDeliveryCostMessage=true}}
20
20
  {{/content}}
21
21
 
22
22
 
@@ -16,7 +16,7 @@
16
16
  {{/content}}
17
17
 
18
18
  {{#content "aside"}}
19
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2=true checkout=true}}
19
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon paymentsCheckoutV2=true checkout=true hideDeliveryCostMessage=true}}
20
20
  {{/content}}
21
21
 
22
22
 
@@ -18,7 +18,7 @@
18
18
  {{/content}}
19
19
 
20
20
  {{#content "aside"}}
21
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon billieIcon=true paymentsCheckoutV2=true checkout=true}}
21
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true clearPayIcon=clearPayIcon billieIcon=true paymentsCheckoutV2=true checkout=true hideDeliveryCostMessage=true}}
22
22
  {{/content}}
23
23
 
24
24
 
@@ -13,7 +13,7 @@
13
13
  {{/content}}
14
14
 
15
15
  {{#content "aside"}}
16
- {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true basket="true"}}
16
+ {{> order-summary delivery-address-v2.summary no-action=true id=1 basket-id=true basket="true" hideDeliveryCostMessage=true}}
17
17
  {{/content}}
18
18
 
19
19