wickes-css2 2.103.0-RG-1658-apply-dynamic-logic-gift-card.1 → 2.103.0-develop.1

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 (79) hide show
  1. package/Readme.md +3 -1
  2. package/build/css/components/card-product-banner.css +1 -1
  3. package/build/css/components/checkout-payment-details-v2.css +1 -1
  4. package/build/css/main.css +1 -1
  5. package/build/css/pages/page_checkout_delivery-new.css +1 -1
  6. package/build/css/pages/page_products-list-combined.css +1 -1
  7. package/build/css/pages/page_products-list.css +1 -1
  8. package/build/css/plp-main.css +1 -1
  9. package/build/js/account-members.min.js +1 -1
  10. package/build/js/add-project-list-id.min.js +1 -1
  11. package/build/js/address-book.min.js +1 -1
  12. package/build/js/basket.min.js +2 -2
  13. package/build/js/bundle.min.js +1 -1
  14. package/build/js/change-password.min.js +1 -1
  15. package/build/js/checkout.min.js +2 -2
  16. package/build/js/emulation.min.js +70 -268
  17. package/build/js/general.bundle.min.js +1 -1
  18. package/build/js/merged-checkout.min.js +2 -2
  19. package/build/js/page/components/order-summary.js +25 -42
  20. package/build/js/page/plp-cards-v2.js +15 -6
  21. package/build/js/page/plp-load-more.js +1 -1
  22. package/build/js/page/utils/validation.js +1 -46
  23. package/build/js/pdp.bundle.min.js +1 -1
  24. package/build/js/personal-details.min.js +1 -1
  25. package/build/js/plp.bundle.min.js +1 -1
  26. package/build/js/project-list.min.js +1 -44
  27. package/build/js/quiz.min.js +1 -1
  28. package/build/js/track-my-order.min.js +1 -1
  29. package/package.json +2 -2
  30. package/src/components/card_product_v2.hbs +10 -5
  31. package/src/components/card_sponsor_banner.hbs +8 -0
  32. package/src/components/card_sponsor_product.hbs +6 -0
  33. package/src/components/checkout-payment-details-v2.hbs +2 -3
  34. package/src/components/injected-content.hbs +1 -1
  35. package/src/data/data_search-results_v2.json +56 -141
  36. package/src/elements/form-row.hbs +1 -1
  37. package/src/elements/input.hbs +2 -31
  38. package/src/js/components/banner-placement-manager.js +258 -0
  39. package/src/js/components/general/notification.js +1 -2
  40. package/src/js/components/toggle-password-visibility.js +58 -0
  41. package/src/js/emulation/banner-placement-manager.js +53 -0
  42. package/src/js/emulation/checkout-payment-details.js +14 -23
  43. package/src/js/emulation/forms.js +2 -7
  44. package/src/js/page/components/order-summary.js +25 -42
  45. package/src/js/page/plp-cards-v2.js +15 -6
  46. package/src/js/page/plp-load-more.js +1 -1
  47. package/src/js/page/utils/validation.js +1 -46
  48. package/src/layouts/checkout.hbs +5 -1
  49. package/src/page_my-account_change-password.html +0 -1
  50. package/src/page_payment-details-with-gift-card.html +4 -7
  51. package/src/page_plp_v2.html +16 -6
  52. package/src/page_search-results.html +12 -2
  53. package/src/scss/components/card-product-banner.scss +91 -3
  54. package/src/scss/components/checkout-payment-details-v2.scss +0 -2
  55. package/src/scss/pages/page_checkout_delivery-new.scss +0 -26
  56. package/src/scss/pages/page_products-list-combined.scss +11 -0
  57. package/src/scss/pages/page_products-list.scss +8 -0
  58. package/build/img/giftcard.svg +0 -28
  59. package/build/js/gift-cards.min.js +0 -1
  60. package/build/js/page/components/gift-cards.js +0 -877
  61. package/build/js/page/components/toggle-password-visibility.js +0 -22
  62. package/build/js/page/utils/gift-cards-utils.js +0 -144
  63. package/build/js/page/utils/input-handling.js +0 -92
  64. package/build/js/page/utils/show-hide-input.js +0 -28
  65. package/build/js/toggle-password-visibility.min.js +0 -1
  66. package/src/components/gift-cards-hint.hbs +0 -9
  67. package/src/components/gift-cards.hbs +0 -90
  68. package/src/components/giftcard-chip.hbs +0 -23
  69. package/src/components/giftcard-summary.hbs +0 -6
  70. package/src/img/giftcard.svg +0 -28
  71. package/src/js/components/product-banner.js +0 -148
  72. package/src/js/emulation/checkout-data.js +0 -35
  73. package/src/js/emulation/gift-cards.js +0 -201
  74. package/src/js/page/components/gift-cards.js +0 -877
  75. package/src/js/page/components/toggle-password-visibility.js +0 -22
  76. package/src/js/page/utils/gift-cards-utils.js +0 -144
  77. package/src/js/page/utils/input-handling.js +0 -92
  78. package/src/js/page/utils/show-hide-input.js +0 -28
  79. package/src/scss/components/_gift-cards.scss +0 -361
@@ -1,22 +0,0 @@
1
- import { initializeInputToggle } from "../utils/show-hide-input";
2
-
3
- var Wick = window.Wick || {};
4
-
5
- Wick.TogglePasswordVisibility = {
6
- el: {
7
- $containers: $('.form-row[data-show-content] .input-wrap'),
8
- },
9
-
10
- init() {
11
- if (!this.el.$containers.length) {
12
- return;
13
- }
14
- this.el.$containers.each(function () {
15
- initializeInputToggle($(this));
16
- });
17
- },
18
- };
19
-
20
- $(document).ready(function () {
21
- Wick.TogglePasswordVisibility.init();
22
- });
@@ -1,144 +0,0 @@
1
- import { showLoader, hideLoader } from "./loader";
2
-
3
- const SUMMARY_SELECTORS = {
4
- subTotal: { item: '.checkout-widget__item-bold', value: '.checkout-widget__item-value', title: 'Items subtotal:' },
5
- vat: { item: '.checkout-widget__item-vat', value: '.checkout-widget__item-value', title: 'VAT:' },
6
- clickAndCollectCost: { item: '.checkout-widget__item-cc', value: '.checkout-widget__item-value', title: 'Click & Collect:' },
7
- deliveryCost: { item: '.checkout-widget__item-delivery', value: '.checkout-widget__item-value', title: 'Delivery:' },
8
- charityPrice: { item: '.checkout-widget__item-charity', value: '.checkout-widget__item-value', title: 'Charity donation:' },
9
- discountTotal: { item: '.checkout-widget__details-discount', value: '.checkout-widget__detail-value' },
10
- giftCardApplied: { item: '.checkout-widget__gift-card', value: '.checkout-widget__item-value', title: 'Gift Card:' },
11
- total: { item: '.checkout-widget__total', value: '.checkout-widget__total-value' },
12
- };
13
-
14
- const CURRENCY_KEYS = new Set([
15
- 'subTotal','vat','clickAndCollectCost','deliveryCost',
16
- 'charityPrice','discountTotal','total','giftCardApplied'
17
- ]);
18
-
19
- export const OK_CODE = 0;
20
-
21
- export const ZERO_BALANCE_MESSAGE =
22
- 'Insufficient funds available, please try another Gift Card or alternate payment method.';
23
-
24
- export const MESSAGE_BY_CODE = {
25
- 10: 'Gift Card number and / or PIN not recognised. A Gift Card will be locked following three unsuccessful PIN attempts.',
26
- 16: 'Card locked due to three unsuccessful PIN entries. For support click here.',
27
- 20: 'Unable to use Gift Card at this time, please try later or click here for support.',
28
- 40: 'Unable to use Gift Card at this time, please try later or click here for support.',
29
- 60: 'The entered Gift Card has expired. For support click here.',
30
- 89: 'Gift Card already added, please use a different card.',
31
- 99: 'The entered Gift Card is invalid. For support click here.',
32
- [-1]: 'Gift Card is unavailable at this time, please try later. For support click here.',
33
- };
34
-
35
- export const PAY_MESSAGE_BY_CODE = {
36
- 101: 'Unable to use Gift Cards at this time, please try later or click here for support.',
37
- 102: 'Unfortunately there was a problem with requesting your card details from the payment provider. Available funds on your Gift Card are unchanged.',
38
- 103: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
39
- 104: 'Unfortunately there was a problem placing your order with Gift Card(s). Please click here for support.',
40
- };
41
-
42
- export const ADD_GIFT_CARD = 'addGiftCard';
43
- export const REMOVE_GIFT_CARD = 'removeGiftCard';
44
- export const PAY_WITH_GIFT_CARD = 'payWithGiftCard';
45
-
46
- export const FAQ_URL = 'https://www.wickes.co.uk/gifts';
47
-
48
- export const escapeHtml = (s) => $('<div>').text(String(s || '')).html();
49
-
50
- export const linkifyClickHere = (msg) =>
51
- escapeHtml(msg).replace(
52
- /\bclick here\b/gi,
53
- `<a href="${FAQ_URL}" target="_blank" rel="noopener" class="notification_link">click here</a>`
54
- );
55
-
56
- export function formatGc16(raw) {
57
- const digits = String(raw || '').replace(/\D/g, '').slice(0, 16);
58
- return digits.replace(/(\d{4})(?=\d)/g, '$1-');
59
- }
60
-
61
- function formatGBP(value) {
62
- if (value === null || typeof value === 'undefined' || String(value).trim() === '') {
63
- return value;
64
- }
65
-
66
- const cleanedValue = String(value).replace(/[^\d.-]/g, '');
67
- const numberValue = Number(cleanedValue);
68
-
69
- if (Number.isFinite(numberValue)) {
70
- return `£${numberValue.toFixed(2)}`;
71
- }
72
-
73
- return value;
74
- }
75
-
76
- export function buildHintContext(count, limit) {
77
- const max = count >= limit;
78
-
79
- return {
80
- canAdd: !max,
81
- max,
82
- hintClass: `giftcard-summary__hint${max ? ' giftcard-summary__hint--max' : ''}`,
83
- };
84
- }
85
-
86
- export function buildSummaryEqualMap(data) {
87
- return Object.entries(SUMMARY_SELECTORS).map(([key, d]) => {
88
- let dataValue = data[key];
89
-
90
- if (CURRENCY_KEYS.has(key)) {
91
- dataValue = formatGBP(dataValue);
92
- }
93
-
94
- return {
95
- item: d.item,
96
- itemValue: d.value,
97
- dataValue: dataValue,
98
- ...(d.title ? { title: d.title } : {}),
99
- };
100
- });
101
- }
102
-
103
- export function isZeroAmount(val) {
104
- const cleaned = String(val ?? '').replace(/[^\d.]/g, '');
105
- if (!cleaned) {
106
- return false;
107
- }
108
- const num = Number(cleaned);
109
- return Number.isFinite(num) && num === 0;
110
- }
111
-
112
- // --- API/Event-Dispatching Functions ---
113
-
114
- export function verifyGiftCard($loader, giftCardNumber, pin) {
115
- showLoader($loader);
116
- return new Promise((resolve, reject) => {
117
- const payload = { giftCardNumber, pin };
118
- const detail = { resolve, reject, payload };
119
- const evt = createEvent(ADD_GIFT_CARD, payload, detail);
120
- window.dispatchEvent(evt);
121
- }).finally(() => {
122
- hideLoader($loader);
123
- });
124
- }
125
-
126
- export function removeGiftCard($loader, index) {
127
- showLoader($loader);
128
- return new Promise((resolve, reject) => {
129
- const payload = { index };
130
- const detail = { resolve, reject, payload };
131
- const evt = createEvent(REMOVE_GIFT_CARD, payload, detail);
132
- window.dispatchEvent(evt);
133
- }).finally(() => {
134
- hideLoader($loader);
135
- });
136
- }
137
-
138
- export function payWithGiftCard() {
139
- return new Promise((resolve, reject) => {
140
- const detail = { resolve, reject };
141
- const evt = createEvent(PAY_WITH_GIFT_CARD, undefined, detail);
142
- window.dispatchEvent(evt);
143
- });
144
- }
@@ -1,92 +0,0 @@
1
- import {formatGc16} from './gift-cards-utils';
2
- import {clearErrorText, showErrorText} from './validation';
3
-
4
-
5
- export function createGcNumberInputHandler({
6
- fieldSelector,
7
- fieldErrorClass,
8
- errorTextSelector,
9
- ariaInvalidAttr
10
- }) {
11
- return function handleGcNumberInput(e) {
12
- const input = e.currentTarget;
13
- const $input = $(input);
14
-
15
- const canTrack = typeof input.selectionStart === 'number';
16
- const atEnd = canTrack && input.selectionStart === input.value.length;
17
-
18
- const hadErr = $input.closest(fieldSelector).hasClass(fieldErrorClass);
19
-
20
- input.value = formatGc16(input.value);
21
-
22
- if (hadErr) {
23
- clearErrorText($input, fieldSelector, errorTextSelector, fieldErrorClass, ariaInvalidAttr);
24
- }
25
-
26
- if (atEnd && typeof input.setSelectionRange === 'function') {
27
- input.setSelectionRange(input.value.length, input.value.length);
28
- }
29
- };
30
- }
31
-
32
- export function digitsOnlyKeypress(e) {
33
- if (!/\d/.test(String.fromCharCode(e.which || e.keyCode))) {
34
- e.preventDefault();
35
- }
36
- }
37
-
38
- export function handleGcNumberBlur(e, {
39
- fieldSelector,
40
- errorTextSelector,
41
- errorClass,
42
- ariaInvalidAttr,
43
- numberMessage,
44
- }) {
45
- const $input = $(e.currentTarget);
46
- const len = String($input.val() || '').replace(/\D/g, '').length;
47
-
48
- clearErrorText($input, fieldSelector, errorTextSelector, errorClass, ariaInvalidAttr);
49
-
50
- if (len < 16) {
51
- showErrorText($input, numberMessage, fieldSelector, errorTextSelector, errorClass, ariaInvalidAttr);
52
- }
53
- }
54
-
55
- export function handleGcPinInput(e, {
56
- fieldSelector,
57
- errorTextSelector,
58
- errorClass,
59
- ariaInvalidAttr,
60
- }) {
61
- const input = e.currentTarget;
62
- const $input = $(input);
63
-
64
- const hadErr = $input.closest(fieldSelector).hasClass(errorClass);
65
- input.value = String(input.value || '').replace(/\D/g, '').slice(0, 8);
66
-
67
- if (hadErr) {
68
- clearErrorText($input, fieldSelector, errorTextSelector, errorClass, ariaInvalidAttr);
69
- }
70
- }
71
-
72
-
73
- export function handleGcPinKeypress(e) {
74
- if (!/\d/.test(String.fromCharCode(e.which || e.keyCode))) e.preventDefault();
75
- }
76
-
77
- export function handleGcPinBlur(e, {
78
- fieldSelector,
79
- errorTextSelector,
80
- errorClass,
81
- ariaInvalidAttr,
82
- pinMessage,
83
- }) {
84
- const $input = $(e.currentTarget);
85
- const length = String($input.val() || '').replace(/\D/g, '').length;
86
-
87
- clearErrorText($input, fieldSelector, errorTextSelector, errorClass, ariaInvalidAttr);
88
-
89
- if (length < 8) {
90
- showErrorText($input, pinMessage, fieldSelector, errorTextSelector, errorClass, ariaInvalidAttr);
91
- }
92
- }
@@ -1,28 +0,0 @@
1
- export function initializeInputToggle($container) {
2
- const $input = $container.find('input');
3
- const $toggle = $container.find('.toggle-show');
4
-
5
- if (!$input.length || !$toggle.length) return;
6
-
7
- const handleToggleClick = (e) => {
8
- e.preventDefault();
9
-
10
- const isPassword = String($input.attr('type')) === 'password';
11
- $input.attr('type', isPassword ? 'text' : 'password');
12
- const $icon = $toggle.find('svg, i').first();
13
-
14
- if ($icon.length) {
15
- $icon.removeClass('fa-eye fa-eye-slash').addClass(isPassword ? 'fa-eye' : 'fa-eye-slash');
16
- }
17
- };
18
-
19
- const updateToggleVisibility = () => {
20
- $toggle.toggle(($input.val() || '').length > 0);
21
- };
22
-
23
- $toggle.off('click.passwordToggle mousedown.passwordToggle')
24
- .on('mousedown.passwordToggle', handleToggleClick);
25
-
26
- $input.off('input.passwordToggle').on('input.passwordToggle', updateToggleVisibility);
27
- updateToggleVisibility();
28
- }
@@ -1 +0,0 @@
1
- !function i(o,r,s){function u(t,e){if(!r[t]){if(!o[t]){var n="function"==typeof require&&require;if(!e&&n)return n(t,!0);if(a)return a(t,!0);throw(e=new Error("Cannot find module '"+t+"'")).code="MODULE_NOT_FOUND",e}n=r[t]={exports:{}},o[t][0].call(n.exports,function(e){return u(o[t][1][e]||e)},n,n.exports,i,o,r,s)}return r[t].exports}for(var a="function"==typeof require&&require,e=0;e<s.length;e++)u(s[e]);return u}({1:[function(e,t,n){"use strict";var i=e("../utils/show-hide-input"),o=window.Wick||{};o.TogglePasswordVisibility={el:{$containers:$(".form-row[data-show-content] .input-wrap")},init:function(){this.el.$containers.length&&this.el.$containers.each(function(){(0,i.initializeInputToggle)($(this))})}},$(document).ready(function(){o.TogglePasswordVisibility.init()})},{"../utils/show-hide-input":2}],2:[function(e,t,n){"use strict";Object.defineProperty(n,"__esModule",{value:!0}),n.initializeInputToggle=function(e){var n=e.find("input"),i=e.find(".toggle-show");n.length&&i.length&&(e=function(){i.toggle(0<(n.val()||"").length)},i.off("click.passwordToggle mousedown.passwordToggle").on("mousedown.passwordToggle",function(e){e.preventDefault();var e="password"===String(n.attr("type")),t=(n.attr("type",e?"text":"password"),i.find("svg, i").first());t.length&&t.removeClass("fa-eye fa-eye-slash").addClass(e?"fa-eye":"fa-eye-slash")}),n.off("input.passwordToggle").on("input.passwordToggle",e),e())}},{}]},{},[1]);
@@ -1,9 +0,0 @@
1
- <p class="{{hintClass}}">
2
- {{#if canAdd}}
3
- <span class="giftcard-summary__add js-giftcard-add">Add another Gift Card</span>
4
- or pay the remaining balance with a Credit/Debit card.
5
- {{else}}
6
- Maximum number of Gift Cards added, please pay remaining balance with a Credit/Debit card.
7
- {{/if}}
8
- {{> info-icon title="If you’d like to pay with a different payment method, please remove any / all applied Gift Cards." data-placement="top"}}
9
- </p>
@@ -1,90 +0,0 @@
1
- <div class="form-row giftcard-row">
2
- <div class="giftcard">
3
- <div class="giftcard__wrapper">
4
- <span
5
- class="giftcard-add"
6
- id="giftcard-toggle"
7
- role="button"
8
- tabindex="0"
9
- aria-controls="giftcard-inline"
10
- aria-expanded="false"
11
- >
12
- <span class="icon">
13
- <i class="fas fa-plus giftcard-add__icon" aria-hidden="true"></i>
14
- </span>
15
- <span class="giftcard-add__text">Add Wickes Gift Card</span>
16
- </span>
17
- <span class="giftcard-hint">Combine with Credit/Debit card</span>
18
- </div>
19
-
20
- <div class="giftcard__container">
21
- <div class="giftcard-inline" id="giftcard-inline" hidden>
22
- <div class="giftcard-inline__header">
23
- <span class="giftcard-inline__title">Add Wickes Gift Card</span>
24
- <a href="https://www.showmybalance.com/" target="_blank" class="giftcard-inline__balance">Check balance</a>
25
- <span class="giftcard-inline__close">
26
- <i class="fal fa-times" aria-hidden="true"></i>
27
- </span>
28
- </div>
29
-
30
- {{> notifications classModifier="notification_error" error=true withCloseBtn="true"}}
31
-
32
- <form class="giftcard-inline__form">
33
- <div class="giftcard-inline__fields">
34
- {{> form-row
35
- id="giftcard-number"
36
- label="Gift Card number"
37
- required="true"
38
- placeholder="0000-0000-0000-0000"
39
- row-mod="giftcard__field giftcard__field--number"
40
- name="giftcard-number"
41
- maxlength="19"
42
- inputmode="numeric"
43
- type="tel"
44
- autocomplete="off"
45
- input-mod="giftcard__input"
46
- skipGlobalValidation=true
47
- }}
48
-
49
- {{> form-row
50
- id="giftcard-pin"
51
- label="Gift Card PIN"
52
- required="true"
53
- placeholder="00000000"
54
- row-mod="giftcard__field giftcard__field--pin"
55
- name="giftcard-pin"
56
- maxlength="8"
57
- type="password"
58
- inputmode="numeric"
59
- autocomplete="off"
60
- input-mod="giftcard__input"
61
- skipGlobalValidation=true
62
- showContent=(hash
63
- idToggleIcon="giftcard-pin-toggle"
64
- classCustomIcon="fas fa-eye-slash"
65
- idCustomIcon="giftcard-pin-eye"
66
- )
67
- }}
68
-
69
- <div class="giftcard__actions">
70
- {{> button text="Add" modification="giftcard__btn" }}
71
- </div>
72
- </div>
73
- </form>
74
- </div>
75
-
76
- </div>
77
-
78
- </div>
79
-
80
- <div class="giftcard-applied" id="giftcard-applied" hidden>
81
- <div class="giftcard-applied__inner" role="status" aria-live="polite">
82
- <span class="giftcard-applied__icon" aria-hidden="true">
83
- <i class="fas fa-check-circle"></i>
84
- </span>
85
- <p class="giftcard-applied__text">
86
- Gift Card added successfully, basket total updated
87
- </p>
88
- </div>
89
- </div>
90
- </div>
@@ -1,23 +0,0 @@
1
- <div class="giftcard-chip" data-giftcard-id="{{id}}">
2
- <div class="giftcard-chip__icon" aria-hidden="true">
3
- <img src="https://eu-images.contentstack.com/v3/assets/blt066259863543a0d2/blt0af9cb9d86356305/69130779467abd2df07b7e79/giftcard.svg" alt="giftcard" />
4
- </div>
5
-
6
- <div class="giftcard-chip__content">
7
- <div class="giftcard-chip__line">
8
- <span
9
- class="giftcard-chip__number"
10
- aria-label="{{maskedNumber}}">
11
- {{maskedNumber}}
12
- </span>
13
- </div>
14
-
15
- <div class="giftcard-chip__line">
16
- <span class="giftcard-chip__applied">{{currency}}{{amount}} applied</span>
17
- </div>
18
- </div>
19
-
20
- <span class="giftcard-chip__close">
21
- <i class="fal fa-times" aria-hidden="true"></i>
22
- </span>
23
- </div>
@@ -1,6 +0,0 @@
1
- <div class="giftcard-summary" style="display:none">
2
- <div class="giftcard-chip-list">
3
- {{> loader hidden=true }}
4
- </div>
5
- <p class="giftcard-summary__hint"></p>
6
- </div>
@@ -1,28 +0,0 @@
1
- <svg width="48" height="31" viewBox="0 0 48 31" fill="none" xmlns="http://www.w3.org/2000/svg">
2
- <g clip-path="url(#clip0_9507_79257)">
3
- <rect y="0.207031" width="48" height="30" rx="3" fill="white"/>
4
- <path d="M42.5 26.207C39.5 25.707 36.5 21.207 36.5 21.207C36.5 21.207 34 25.207 31 26.207" stroke="#004587" stroke-width="1.8"/>
5
- <path d="M29.7862 18.5774C30.7643 19.8755 32.9202 20.2323 35.2567 20.6584C35.2241 18.7373 34.7506 16.8572 33.7724 15.5591C32.7942 14.261 31.3287 13.7129 30.0307 14.691C28.7326 15.6692 28.808 17.2793 29.7862 18.5774Z" fill="white" stroke="#004587" stroke-width="1.8"/>
6
- <path d="M43.164 18.5774C42.1859 19.8755 40.03 20.2323 37.6935 20.6584C37.7261 18.7373 38.1996 16.8572 39.1778 15.5591C40.1559 14.261 41.6215 13.7129 42.9195 14.691C44.2176 15.6692 44.1422 17.2793 43.164 18.5774Z" fill="white" stroke="#004587" stroke-width="1.8"/>
7
- <g clip-path="url(#clip1_9507_79257)">
8
- <path fill-rule="evenodd" clip-rule="evenodd" d="M3 0.207031V12.4151L16.5154 15.1785L30.0427 12.3838V0.207031H3Z" fill="white"/>
9
- <path fill-rule="evenodd" clip-rule="evenodd" d="M3.90234 1.08984V11.6893L16.5155 14.2625L29.1463 11.6881V1.08984H3.90234Z" fill="#004587"/>
10
- <path fill-rule="evenodd" clip-rule="evenodd" d="M15.7783 7.92572C15.7696 7.62779 15.5026 7.41921 15.207 7.41921C14.5493 7.41921 14.4462 7.96811 14.4462 8.45635C14.4462 8.91044 14.6458 9.37843 15.1424 9.37843C15.5498 9.37843 15.7562 9.14851 15.8118 8.77483H16.9531C16.8474 9.71885 16.1003 10.2603 15.1504 10.2603C14.0724 10.2603 13.2715 9.53599 13.2715 8.45635C13.2715 7.33602 13.9969 6.53516 15.1504 6.53516C16.0389 6.53516 16.8342 6.99838 16.9153 7.92572H15.7783Z" fill="white"/>
11
- <path fill-rule="evenodd" clip-rule="evenodd" d="M17.1543 5.31641H18.3288V7.81242L19.4004 6.63986H20.7594L19.4483 7.96917L20.9249 10.16H19.5089L18.6344 8.74224L18.3288 9.03322V10.16H17.1543V5.31641Z" fill="white"/>
12
- <path fill-rule="evenodd" clip-rule="evenodd" d="M21.7333 8.67923C21.7536 9.16013 22.0363 9.47999 22.535 9.47999C22.8166 9.47999 23.0924 9.35193 23.2046 9.09401H24.3016C24.0876 9.90917 23.32 10.2602 22.5192 10.2602C21.3542 10.2602 20.5586 9.56984 20.5586 8.38984C20.5586 7.30951 21.4374 6.53516 22.4916 6.53516C23.7754 6.53516 24.4182 7.48632 24.3632 8.67923H21.7333ZM23.189 8.03592C23.169 7.64149 22.8853 7.31607 22.4916 7.31607C22.0778 7.31607 21.8021 7.60794 21.7333 8.03592H23.189Z" fill="white"/>
13
- <path fill-rule="evenodd" clip-rule="evenodd" d="M25.5842 8.99642C25.5842 9.17551 25.6574 9.30418 25.7769 9.39104C25.8863 9.47275 26.0451 9.51434 26.2117 9.51434C26.4397 9.51434 26.7649 9.42043 26.7649 9.13997C26.7649 8.86835 26.3976 8.81603 26.1918 8.76798C25.4513 8.58432 24.5267 8.56159 24.5267 7.61548C24.5267 6.76836 25.4589 6.53516 26.1636 6.53516C26.9515 6.53516 27.7712 6.76041 27.8136 7.67723H26.7287C26.7287 7.52613 26.6751 7.43222 26.5773 7.36908C26.4792 7.30941 26.3507 7.28013 26.2052 7.28013C26.0108 7.28013 25.7017 7.30207 25.7017 7.54688C25.7017 7.87886 26.4881 7.93992 27.0274 8.05399C27.75 8.19744 27.9381 8.71249 27.9381 9.00545C27.9381 9.94987 27.0274 10.2602 26.2187 10.2602C25.3684 10.2602 24.4986 9.98342 24.4639 8.99642H25.5842Z" fill="white"/>
14
- <path fill-rule="evenodd" clip-rule="evenodd" d="M10.3756 10.16H9.08877L8.41406 6.82332H8.3981L7.72329 10.16H6.41975L5.08691 5.31641H6.36913L7.0693 8.85571H7.08112L7.80504 5.31641H9.01268L9.73841 8.85571H9.75195L10.4494 5.31641H11.7329L10.3756 10.16Z" fill="white"/>
15
- <path fill-rule="evenodd" clip-rule="evenodd" d="M11.8215 6.19887H12.9972V5.31641H11.8215V6.19887ZM11.8213 10.1601H12.997V6.63986H11.8213V10.1601Z" fill="white"/>
16
- </g>
17
- <path d="M36.5 0.207031V21.707M36.5 30.207V21.707M36.5 21.707H47.5M36.5 21.707H1" stroke="#004587" stroke-width="1.8"/>
18
- </g>
19
- <rect x="0.5" y="0.707031" width="47" height="29" rx="2.5" stroke="#CCCCCC"/>
20
- <defs>
21
- <clipPath id="clip0_9507_79257">
22
- <rect y="0.207031" width="48" height="30" rx="3" fill="white"/>
23
- </clipPath>
24
- <clipPath id="clip1_9507_79257">
25
- <rect width="27" height="14.9703" fill="white" transform="translate(3 0.207031)"/>
26
- </clipPath>
27
- </defs>
28
- </svg>
@@ -1,148 +0,0 @@
1
- var Wick = Wick || {};
2
- Wick.ProductBanner = {
3
- el: {
4
- banners: '.card-product-banner',
5
- bannerInactiveClass: 'card-product-banner--inactive',
6
- productsWrap: '.products-list-v2',
7
- $products: $('.product-card'),
8
- attrPositionDesktop: 'data-desktop-position',
9
- attrPositionMobile: 'data-mobile-position',
10
- attrRequiredAmountDesktop: 'data-required-amount-desktop',
11
- attrRequiredAmountMobile: 'data-required-amount-mobile',
12
- hide: 'd-none'
13
- },
14
- currentBreakpoint: null,
15
- checkProductsInColumn() {
16
- Wick.ProductBanner.addInactiveClasses();
17
- Wick.ProductBanner.arrangeBannersInRightOrder();
18
- $(Wick.ProductBanner.el.banners).each((index, banner) => {
19
- Wick.ProductBanner.hideBannerDueLimit(banner, index);
20
- Wick.ProductBanner.moveBannerToSpecifiedPosition(banner);
21
- });
22
- },
23
- moveBannerToSpecifiedPosition(banner) {
24
- const $listSlots = Wick.ProductBanner.getListSlots();
25
- const bannerPosition = Wick.ProductBanner.getBannerPosition(banner) - 2;
26
- const listSlotsLength = $listSlots.length;
27
-
28
- if(Wick.ProductBanner.isBannerVisible(banner)) {
29
- if (bannerPosition <= listSlotsLength) {
30
- if ($listSlots[bannerPosition]) {
31
- Wick.ProductBanner.showBanner(banner);
32
- Wick.ProductBanner.removeInactiveClass(banner);
33
- Wick.ProductBanner.moveBanner(banner, $listSlots[bannerPosition]);
34
- } else {
35
- Wick.ProductBanner.hideBanner(banner);
36
- Wick.ProductBanner.coverEdgeCases(banner);
37
- }
38
- } else {
39
- Wick.ProductBanner.hideBanner(banner);
40
- }
41
- }
42
- },
43
- moveBanner(banner, targetElement) {
44
- $(banner).remove();
45
- $(targetElement).after(banner);
46
- },
47
- hideBanner(banner) {
48
- $(banner).addClass(Wick.ProductBanner.el.hide);
49
- },
50
- showBanner(banner) {
51
- $(banner).removeClass(Wick.ProductBanner.el.hide);
52
- },
53
- isBannerVisible(banner) {
54
- return !$(banner).hasClass(Wick.ProductBanner.el.hide);
55
- },
56
- hideBannerDueLimit(banner) {
57
- const bannerMinLimit = Wick.ProductBanner.getBannerLimit(banner) - 1;
58
- const $listSlots = Wick.ProductBanner.getListSlots();
59
- const listProductsLength = $listSlots.length;
60
- Wick.ProductBanner.showBanner(banner);
61
-
62
- if (bannerMinLimit > listProductsLength) {
63
- Wick.ProductBanner.hideBanner(banner);
64
- }
65
- },
66
- getBannerPosition(banner) {
67
- const isMobile = Wick.ProductBanner.isMobileResolution();
68
- const positionAttribute = isMobile
69
- ? Wick.ProductBanner.el.attrPositionMobile
70
- : Wick.ProductBanner.el.attrPositionDesktop
71
-
72
- return banner.hasAttribute(positionAttribute)
73
- ? Number(banner.getAttribute(positionAttribute))
74
- : Number(Wick.ProductBanner.getListLength() + Wick.ProductBanner.getBannersAmount());
75
- },
76
- getBannerLimit(banner) {
77
- const isMobile = Wick.ProductBanner.isMobileResolution();
78
-
79
- const limitAttribute = isMobile
80
- ? Wick.ProductBanner.el.attrRequiredAmountMobile
81
- : Wick.ProductBanner.el.attrRequiredAmountDesktop;
82
-
83
- return banner.hasAttribute(limitAttribute)
84
- ? Number(banner.getAttribute(limitAttribute))
85
- : 0;
86
- },
87
- isMobileResolution() {
88
- return Wick.Responsive.getCurrentBreakpoint() !== 'up-lg';
89
- },
90
- getListLength() {
91
- const $listItems = $(Wick.ProductBanner.el.productsWrap).find('.product-card');
92
- return $listItems.length;
93
- },
94
- getBannersAmount() {
95
- return $(Wick.ProductBanner.el.banners).length;
96
- },
97
- getProductsAmount() {
98
- return Wick.ProductBanner.el.$products.length;
99
- },
100
- arrangeBannersInRightOrder() {
101
- $(Wick.ProductBanner.el.banners).sort((a, b) => {
102
- let bannerPositionA = Wick.ProductBanner.getBannerPosition(a);
103
- let bannerPositionB = Wick.ProductBanner.getBannerPosition(b);
104
-
105
- return bannerPositionA - bannerPositionB
106
- }).appendTo(Wick.ProductBanner.el.productsWrap);
107
- },
108
- addInactiveClasses() {
109
- $(Wick.ProductBanner.el.banners).addClass(Wick.ProductBanner.el.bannerInactiveClass);
110
- },
111
- removeInactiveClass(banner) {
112
- $(banner).removeClass(Wick.ProductBanner.el.bannerInactiveClass)
113
- },
114
- insertFirstBanner(banner) {
115
- const bannerPosition = Wick.ProductBanner.getBannerPosition(banner);
116
-
117
- if (bannerPosition === 1) {
118
- Wick.ProductBanner.showBanner(banner);
119
- Wick.ProductBanner.removeInactiveClass(banner);
120
- $(banner).remove();
121
- $(Wick.ProductBanner.el.productsWrap).prepend(banner);
122
- }
123
- },
124
- coverEdgeCases(banner) {
125
- Wick.ProductBanner.insertFirstBanner(banner);
126
- },
127
- getListSlots() {
128
- return $(Wick.ProductBanner.el.productsWrap)
129
- .find('.product-card, .card-product-banner:not(.card-product-banner--inactive)');
130
- },
131
- init() {
132
- Wick.Responsive.onResize(function () {
133
- if(Wick.ProductBanner.currentBreakpoint !== Wick.Responsive.getCurrentBreakpoint()) {
134
- Wick.ProductBanner.currentBreakpoint = Wick.Responsive.getCurrentBreakpoint()
135
- Wick.ProductBanner.checkProductsInColumn();
136
- $(window).trigger('productBannerPositionChanged');
137
- }
138
- });
139
- }
140
- };
141
-
142
- $(document).ready(function () {
143
- if (!Wick.ProductBanner.getBannersAmount() || !Wick.ProductBanner.getProductsAmount()) {
144
- return;
145
- }
146
-
147
- Wick.ProductBanner.init();
148
- })
@@ -1,35 +0,0 @@
1
- var Wick = Wick || {};
2
- Wick.CheckoutData = (function () {
3
- return {
4
- //TODO: update after BE confirmation
5
- successGiftCardData: {
6
- "subTotal": "£100.00",
7
- "deliveryCost": "£4.00",
8
- "freeDelivery": false,
9
- "clickAndCollectCost": "FREE",
10
- "totalForDelivery": "£69.00",
11
- "totalForClickAndCollect": "FREE",
12
- "total": "£0.00",
13
- "vat": "£11.17",
14
- "deliveryOrder": true,
15
- "clickAndCollectOrder": false,
16
- "discountTotal": "£2.00",
17
- "giftCardApplied": "-£100.00",
18
- "discounts": [
19
- "Spend over £10 and get £2 fixed discount"
20
- ],
21
- "promotionsInfo": [
22
- {
23
- "description": "Spend over £10 and get £2 fixed discount",
24
- "usedCouponCode": "RT_02"
25
- }
26
- ],
27
- "subTotalWithDeliveryCost": "£69.00",
28
- "net": false,
29
- "subtotalWithDeliveryAndDiscounts": "£67.00",
30
- "discountAmounts": [],
31
- "goodsTotalWithoutDiscount": "£65.00",
32
- "charityPrice": ""
33
- },
34
- }
35
- })();