wickes-css2 2.103.0-IC-977-colors-semantic.1 → 2.103.0-RG-1658-apply-dynamic-logic-gift-card.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.
- package/Readme.md +1 -3
- package/build/css/category-main.css +1 -1
- package/build/css/components/checkout-payment-details-v2.css +1 -1
- package/build/css/homepage-main.css +1 -1
- package/build/css/kitchen-plp-main.css +1 -1
- package/build/css/main.css +1 -1
- package/build/css/my-account-main-v2.css +1 -1
- package/build/css/my-account-main.css +1 -1
- package/build/css/pages/page_checkout_delivery-new.css +1 -1
- package/build/css/pages/page_wismo-orders.css +1 -1
- package/build/css/pdp-main-before-combine.css +1 -1
- package/build/css/pdp-main-non-critical.css +1 -1
- package/build/css/pdp-main.css +1 -1
- package/build/css/plp-main.css +1 -1
- package/build/css/store-locator-main.css +1 -1
- package/build/img/giftcard.svg +28 -0
- package/build/js/account-members.min.js +1 -1
- package/build/js/add-project-list-id.min.js +1 -1
- package/build/js/address-book.min.js +1 -1
- package/build/js/basket.min.js +2 -2
- package/build/js/bundle.min.js +1 -1
- package/build/js/change-password.min.js +1 -1
- package/build/js/checkout.min.js +2 -2
- package/build/js/emulation.min.js +268 -16
- package/build/js/general.bundle.min.js +1 -1
- package/build/js/gift-cards.min.js +1 -0
- package/build/js/merged-checkout.min.js +2 -2
- package/build/js/page/components/gift-cards.js +877 -0
- package/build/js/page/components/order-summary.js +42 -25
- package/build/js/page/components/toggle-password-visibility.js +22 -0
- package/build/js/page/utils/gift-cards-utils.js +144 -0
- package/build/js/page/utils/input-handling.js +92 -0
- package/build/js/page/utils/show-hide-input.js +28 -0
- package/build/js/page/utils/validation.js +46 -1
- package/build/js/pdp.bundle.min.js +1 -1
- package/build/js/personal-details.min.js +1 -1
- package/build/js/plp.bundle.min.js +1 -1
- package/build/js/project-list.min.js +44 -1
- package/build/js/quiz.min.js +1 -1
- package/build/js/toggle-password-visibility.min.js +1 -0
- package/build/js/track-my-order.min.js +1 -1
- package/package.json +2 -2
- package/src/components/checkout-payment-details-v2.hbs +3 -2
- package/src/components/gift-cards-hint.hbs +9 -0
- package/src/components/gift-cards.hbs +90 -0
- package/src/components/giftcard-chip.hbs +23 -0
- package/src/components/giftcard-summary.hbs +6 -0
- package/src/elements/form-row.hbs +1 -1
- package/src/elements/input.hbs +31 -2
- package/src/img/giftcard.svg +28 -0
- package/src/js/components/general/notification.js +2 -1
- package/src/js/emulation/checkout-data.js +35 -0
- package/src/js/emulation/checkout-payment-details.js +23 -14
- package/src/js/emulation/forms.js +7 -2
- package/src/js/emulation/gift-cards.js +201 -0
- package/src/js/page/components/gift-cards.js +877 -0
- package/src/js/page/components/order-summary.js +42 -25
- package/src/js/page/components/toggle-password-visibility.js +22 -0
- package/src/js/page/utils/gift-cards-utils.js +144 -0
- package/src/js/page/utils/input-handling.js +92 -0
- package/src/js/page/utils/show-hide-input.js +28 -0
- package/src/js/page/utils/validation.js +46 -1
- package/src/layouts/checkout.hbs +1 -5
- package/src/page_my-account_change-password.html +1 -0
- package/src/page_payment-details-with-gift-card.html +7 -4
- package/src/scss/components/_gift-cards.scss +361 -0
- package/src/scss/components/checkout-payment-details-v2.scss +2 -0
- package/src/scss/helpers/_variables.scss +0 -2
- package/src/scss/pages/page_checkout_delivery-new.scss +26 -0
- package/src/js/components/toggle-password-visibility.js +0 -58
- package/src/scss/helpers/_colors-semantic.scss +0 -224
|
@@ -3428,6 +3428,42 @@ Wick.checkLocalEnv = (function () {
|
|
|
3428
3428
|
}
|
|
3429
3429
|
})();
|
|
3430
3430
|
|
|
3431
|
+
var Wick = Wick || {};
|
|
3432
|
+
Wick.CheckoutData = (function () {
|
|
3433
|
+
return {
|
|
3434
|
+
//TODO: update after BE confirmation
|
|
3435
|
+
successGiftCardData: {
|
|
3436
|
+
"subTotal": "£100.00",
|
|
3437
|
+
"deliveryCost": "£4.00",
|
|
3438
|
+
"freeDelivery": false,
|
|
3439
|
+
"clickAndCollectCost": "FREE",
|
|
3440
|
+
"totalForDelivery": "£69.00",
|
|
3441
|
+
"totalForClickAndCollect": "FREE",
|
|
3442
|
+
"total": "£0.00",
|
|
3443
|
+
"vat": "£11.17",
|
|
3444
|
+
"deliveryOrder": true,
|
|
3445
|
+
"clickAndCollectOrder": false,
|
|
3446
|
+
"discountTotal": "£2.00",
|
|
3447
|
+
"giftCardApplied": "-£100.00",
|
|
3448
|
+
"discounts": [
|
|
3449
|
+
"Spend over £10 and get £2 fixed discount"
|
|
3450
|
+
],
|
|
3451
|
+
"promotionsInfo": [
|
|
3452
|
+
{
|
|
3453
|
+
"description": "Spend over £10 and get £2 fixed discount",
|
|
3454
|
+
"usedCouponCode": "RT_02"
|
|
3455
|
+
}
|
|
3456
|
+
],
|
|
3457
|
+
"subTotalWithDeliveryCost": "£69.00",
|
|
3458
|
+
"net": false,
|
|
3459
|
+
"subtotalWithDeliveryAndDiscounts": "£67.00",
|
|
3460
|
+
"discountAmounts": [],
|
|
3461
|
+
"goodsTotalWithoutDiscount": "£65.00",
|
|
3462
|
+
"charityPrice": ""
|
|
3463
|
+
},
|
|
3464
|
+
}
|
|
3465
|
+
})();
|
|
3466
|
+
|
|
3431
3467
|
var Wick = Wick || {};
|
|
3432
3468
|
Wick.DeliveryDetails = (function () {
|
|
3433
3469
|
var $page = $('.page_checkout-delivery-details');
|
|
@@ -3468,24 +3504,33 @@ var Wick = Wick || {};
|
|
|
3468
3504
|
|
|
3469
3505
|
Wick.PaymentDetails = (function () {
|
|
3470
3506
|
var $btnEnterDetails = $('.btn-enter-details'),
|
|
3471
|
-
$form = $btnEnterDetails.parents('form'),
|
|
3472
3507
|
isGuestPage = $('.page_checkout-payment-details_guest').length;
|
|
3473
3508
|
|
|
3474
3509
|
function bindEvents () {
|
|
3475
|
-
$btnEnterDetails.on('click', function(){
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3510
|
+
$btnEnterDetails.on('click', function (e) {
|
|
3511
|
+
e.preventDefault();
|
|
3512
|
+
var $scope = $(this).closest('form');
|
|
3513
|
+
if (!$scope.length) $scope = $(this).closest('.billing-address');
|
|
3514
|
+
if (!$scope.length) $scope = $('.billing-address');
|
|
3515
|
+
var nameVal= ($scope.find('#card-name').val() || '').trim();
|
|
3516
|
+
var finderVal= ($scope.find('#first-line-address').val() || '').trim();
|
|
3517
|
+
var manualLine1= ($scope.find('#address-line-1').val() || '').trim();
|
|
3518
|
+
var manualTown= ($scope.find('#town-city').val() || '').trim();
|
|
3519
|
+
var manualPost= ($scope.find('#postcode_additional').val() || '').trim();
|
|
3520
|
+
var addressFinderOk = finderVal.length > 0;
|
|
3521
|
+
var addressManualOk = manualLine1 && manualTown && manualPost;
|
|
3522
|
+
|
|
3523
|
+
if (nameVal && (addressFinderOk || addressManualOk)) {
|
|
3524
|
+
var $details = $('.checkout-payment-details__card-details');
|
|
3525
|
+
$details.removeClass('checkout-payment-details__card-details_hidden');
|
|
3526
|
+
$('html, body').animate({ scrollTop: $details.offset().top - 15 }, 700);
|
|
3527
|
+
return;
|
|
3528
|
+
}
|
|
3529
|
+
|
|
3530
|
+
var formEl = $scope.closest('form').get(0) || $scope.get(0);
|
|
3531
|
+
if (formEl && Wick.Forms && Wick.Forms.showValidationErrors) {
|
|
3532
|
+
Wick.Forms.showValidationErrors(formEl);
|
|
3486
3533
|
}
|
|
3487
|
-
Wick.Forms.showValidationErrors($form[0]);
|
|
3488
|
-
return false;
|
|
3489
3534
|
});
|
|
3490
3535
|
|
|
3491
3536
|
$('.checkout-payment-details__card-details').on('submit', function(){
|
|
@@ -4022,11 +4067,16 @@ Wick.Forms = (function(){
|
|
|
4022
4067
|
|
|
4023
4068
|
var showValidationErrors = function (form, errorMsg) {
|
|
4024
4069
|
var $form = $(form);
|
|
4070
|
+
var $rows = $form.find(fieldRow).not('[data-no-global-validation]');
|
|
4071
|
+
if (!$rows.length) return;
|
|
4072
|
+
$rows.find('.form-row__error').remove();
|
|
4073
|
+
|
|
4025
4074
|
if (!$form.hasClass(formInvalid)) {
|
|
4026
|
-
$form.
|
|
4027
|
-
$form.addClass(formInvalid).find(fieldRow).append(validationError(errorMsg)).addClass(rowValidationError);
|
|
4075
|
+
$form.addClass(formInvalid);
|
|
4028
4076
|
}
|
|
4029
4077
|
|
|
4078
|
+
$rows.append(validationError(errorMsg)).addClass(rowValidationError);
|
|
4079
|
+
|
|
4030
4080
|
var $firstMsg = $form.find(fieldRow).first();
|
|
4031
4081
|
if($firstMsg.length && !isElementInViewport($firstMsg)){
|
|
4032
4082
|
var inModal = $firstMsg.closest('.modal').length,
|
|
@@ -4336,6 +4386,208 @@ $(document).ready(function () {
|
|
|
4336
4386
|
Wick.GenerateProjectIdLocal.init();
|
|
4337
4387
|
});
|
|
4338
4388
|
|
|
4389
|
+
(function () {
|
|
4390
|
+
if (!window.Wick) return;
|
|
4391
|
+
|
|
4392
|
+
const M_OK = '0000000000000001';
|
|
4393
|
+
const M_ZERO_BALANCE = '0000000000000000';
|
|
4394
|
+
const M_NOT_RECOGNISED = '1111111111111111';
|
|
4395
|
+
const M_LOCKED = '2222222222222222';
|
|
4396
|
+
const M_MERCHANT_ISSUE = '3333333333333333';
|
|
4397
|
+
const M_EXCHANGE = '4040404040404040';
|
|
4398
|
+
const M_EXPIRED = '4444444444444444';
|
|
4399
|
+
const M_INVALID = '5555555555555555';
|
|
4400
|
+
const M_ADDED = '6666666666666666';
|
|
4401
|
+
const M_CONFIG_PROBLEM = '9999999999999999';
|
|
4402
|
+
|
|
4403
|
+
const M_PAY_ERR_101 = '7777777777777101';
|
|
4404
|
+
const M_PAY_ERR_102 = '7777777777777102';
|
|
4405
|
+
const M_PAY_ERR_103 = '7777777777777103';
|
|
4406
|
+
|
|
4407
|
+
const PAY_ERROR_CARD_MAP = {
|
|
4408
|
+
[M_PAY_ERR_101]: 101,
|
|
4409
|
+
[M_PAY_ERR_102]: 102,
|
|
4410
|
+
[M_PAY_ERR_103]: 103,
|
|
4411
|
+
};
|
|
4412
|
+
|
|
4413
|
+
const GIFT_CARDS_LIMIT = 3;
|
|
4414
|
+
const BASE_ORDER_TOTAL = 300.00;
|
|
4415
|
+
|
|
4416
|
+
let PAY_ERROR_CODE;
|
|
4417
|
+
|
|
4418
|
+
const mock = {
|
|
4419
|
+
orderTotal: BASE_ORDER_TOTAL,
|
|
4420
|
+
giftCardTotal: 0.00,
|
|
4421
|
+
giftCards: [],
|
|
4422
|
+
};
|
|
4423
|
+
|
|
4424
|
+
const toMasked = (num) => `************${String(num || '').slice(-5)}`;
|
|
4425
|
+
|
|
4426
|
+
function recomputeTotalsAndOrder() {
|
|
4427
|
+
mock.giftCardTotal = mock.giftCards.reduce((sum, c) => sum + Number(c.amountToRedeem || 0), 0);
|
|
4428
|
+
const remaining = Math.max(0, BASE_ORDER_TOTAL - mock.giftCardTotal);
|
|
4429
|
+
mock.orderTotal = Number(remaining.toFixed(2));
|
|
4430
|
+
}
|
|
4431
|
+
|
|
4432
|
+
function applyWithClamp(requestedAmount) {
|
|
4433
|
+
const remaining = Math.max(0, BASE_ORDER_TOTAL - mock.giftCardTotal);
|
|
4434
|
+
const applied = Math.min(Number(requestedAmount || 0), remaining);
|
|
4435
|
+
return Number(applied.toFixed(2));
|
|
4436
|
+
}
|
|
4437
|
+
|
|
4438
|
+
function successPayload() {
|
|
4439
|
+
return {
|
|
4440
|
+
orderTotal: mock.orderTotal,
|
|
4441
|
+
giftCardTotal: mock.giftCardTotal,
|
|
4442
|
+
giftCards: mock.giftCards.slice()
|
|
4443
|
+
};
|
|
4444
|
+
}
|
|
4445
|
+
|
|
4446
|
+
function getGiftCardErrorCode(giftCardNumber) {
|
|
4447
|
+
switch (giftCardNumber) {
|
|
4448
|
+
case M_NOT_RECOGNISED:
|
|
4449
|
+
return 10;
|
|
4450
|
+
case M_LOCKED:
|
|
4451
|
+
return 16;
|
|
4452
|
+
case M_MERCHANT_ISSUE:
|
|
4453
|
+
return 20;
|
|
4454
|
+
case M_EXCHANGE:
|
|
4455
|
+
return 40;
|
|
4456
|
+
case M_EXPIRED:
|
|
4457
|
+
return 60;
|
|
4458
|
+
case M_INVALID:
|
|
4459
|
+
return 99;
|
|
4460
|
+
case M_ADDED:
|
|
4461
|
+
return 89;
|
|
4462
|
+
case M_CONFIG_PROBLEM:
|
|
4463
|
+
return -1;
|
|
4464
|
+
default:
|
|
4465
|
+
return null;
|
|
4466
|
+
}
|
|
4467
|
+
}
|
|
4468
|
+
|
|
4469
|
+
function addGiftCardMock(giftCardNumber) {
|
|
4470
|
+
const errorCode = getGiftCardErrorCode(giftCardNumber);
|
|
4471
|
+
|
|
4472
|
+
let requested;
|
|
4473
|
+
if (giftCardNumber === M_OK) {
|
|
4474
|
+
requested = 123.45;
|
|
4475
|
+
} else if (giftCardNumber === M_ZERO_BALANCE) {
|
|
4476
|
+
requested = 0;
|
|
4477
|
+
} else {
|
|
4478
|
+
requested = 50.00;
|
|
4479
|
+
}
|
|
4480
|
+
|
|
4481
|
+
if (mock.giftCards.length >= GIFT_CARDS_LIMIT) {
|
|
4482
|
+
return Promise.reject({ code: 20 });
|
|
4483
|
+
}
|
|
4484
|
+
|
|
4485
|
+
const beforeTotal = mock.giftCardTotal;
|
|
4486
|
+
const applied = applyWithClamp(requested);
|
|
4487
|
+
|
|
4488
|
+
mock.giftCards.push({
|
|
4489
|
+
id: (Date.now() + Math.random()).toString(36),
|
|
4490
|
+
maskedNumber: toMasked(giftCardNumber),
|
|
4491
|
+
amountToRedeem: applied,
|
|
4492
|
+
originalNumber: giftCardNumber,
|
|
4493
|
+
});
|
|
4494
|
+
|
|
4495
|
+
if (mock.giftCards.length === GIFT_CARDS_LIMIT) {
|
|
4496
|
+
const leftover = Math.max(0, BASE_ORDER_TOTAL - (beforeTotal + applied));
|
|
4497
|
+
if (leftover > 0) {
|
|
4498
|
+
const last = mock.giftCards[mock.giftCards.length - 1];
|
|
4499
|
+
last.amountToRedeem = Number((Number(last.amountToRedeem) + leftover).toFixed(2));
|
|
4500
|
+
}
|
|
4501
|
+
mock.giftCardTotal = BASE_ORDER_TOTAL;
|
|
4502
|
+
mock.orderTotal = 0;
|
|
4503
|
+
return Promise.resolve(successPayload());
|
|
4504
|
+
}
|
|
4505
|
+
|
|
4506
|
+
recomputeTotalsAndOrder();
|
|
4507
|
+
return Promise.resolve(successPayload());
|
|
4508
|
+
}
|
|
4509
|
+
|
|
4510
|
+
function removeGiftCardMock(index) {
|
|
4511
|
+
const beforeLen = mock.giftCards.length;
|
|
4512
|
+
if (index < 0 || index >= beforeLen) return Promise.reject({ code: 20 });
|
|
4513
|
+
|
|
4514
|
+
mock.giftCards.splice(index, 1);
|
|
4515
|
+
recomputeTotalsAndOrder();
|
|
4516
|
+
return Promise.resolve(successPayload());
|
|
4517
|
+
}
|
|
4518
|
+
|
|
4519
|
+
function anyPayErrorCardApplied() {
|
|
4520
|
+
for (const gc of mock.giftCards) {
|
|
4521
|
+
const code = PAY_ERROR_CARD_MAP[gc.originalNumber];
|
|
4522
|
+
if (Number.isFinite(code)) return code;
|
|
4523
|
+
}
|
|
4524
|
+
return undefined;
|
|
4525
|
+
}
|
|
4526
|
+
|
|
4527
|
+
function initGiftCardMock() {
|
|
4528
|
+
if (!$('.giftcard-row, .giftcard').length) return;
|
|
4529
|
+
|
|
4530
|
+
$(window).off(Wick.GiftCard.ADD_GIFT_CARD);
|
|
4531
|
+
$(window).off(Wick.GiftCard.REMOVE_GIFT_CARD);
|
|
4532
|
+
$(window).off(Wick.GiftCard.PAY_WITH_GIFT_CARD);
|
|
4533
|
+
|
|
4534
|
+
$(window).on(Wick.GiftCard.ADD_GIFT_CARD, function (e) {
|
|
4535
|
+
const payload = (e.detail && e.detail.payload) || {};
|
|
4536
|
+
const giftCardNumber = payload.giftCardNumber;
|
|
4537
|
+
setTimeout(function () {
|
|
4538
|
+
addGiftCardMock(giftCardNumber)
|
|
4539
|
+
.then(function (p) { e.detail.resolve(Object.assign({ code: 0 }, p)); })
|
|
4540
|
+
.catch(function (err) { e.detail.reject(err); });
|
|
4541
|
+
}, 1000);
|
|
4542
|
+
});
|
|
4543
|
+
|
|
4544
|
+
$(window).on(Wick.GiftCard.REMOVE_GIFT_CARD, function (e) {
|
|
4545
|
+
const payload = (e.detail && e.detail.payload) || {};
|
|
4546
|
+
const index = Number(payload.index);
|
|
4547
|
+
setTimeout(function () {
|
|
4548
|
+
removeGiftCardMock(index)
|
|
4549
|
+
.then(function (p) { e.detail.resolve(Object.assign({ code: 0 }, p)); })
|
|
4550
|
+
.catch(function (err) { e.detail.reject(err); });
|
|
4551
|
+
}, 1000);
|
|
4552
|
+
});
|
|
4553
|
+
|
|
4554
|
+
$(window).on(Wick.GiftCard.PAY_WITH_GIFT_CARD, function (e) {
|
|
4555
|
+
setTimeout(function () {
|
|
4556
|
+
const forcedErrorFromCard = anyPayErrorCardApplied();
|
|
4557
|
+
if (Number.isFinite(forcedErrorFromCard)) {
|
|
4558
|
+
return e.detail.reject({
|
|
4559
|
+
errorCode: forcedErrorFromCard,
|
|
4560
|
+
giftCards: mock.giftCards.slice(),
|
|
4561
|
+
});
|
|
4562
|
+
}
|
|
4563
|
+
|
|
4564
|
+
if (Number(mock.orderTotal) === 0) {
|
|
4565
|
+
e.detail.resolve({ url: 'page_checkout_confirmation-billie.html' });
|
|
4566
|
+
} else {
|
|
4567
|
+
const errorCode = Number.isFinite(PAY_ERROR_CODE) ? PAY_ERROR_CODE : undefined;
|
|
4568
|
+
e.detail.reject({
|
|
4569
|
+
errorCode,
|
|
4570
|
+
giftCards: mock.giftCards.slice(),
|
|
4571
|
+
});
|
|
4572
|
+
}
|
|
4573
|
+
}, 1000);
|
|
4574
|
+
});
|
|
4575
|
+
}
|
|
4576
|
+
|
|
4577
|
+
$(document).ready(function () {
|
|
4578
|
+
mock.giftCards = [];
|
|
4579
|
+
recomputeTotalsAndOrder();
|
|
4580
|
+
|
|
4581
|
+
Wick.GiftCard.init({
|
|
4582
|
+
giftCardsLimit: GIFT_CARDS_LIMIT,
|
|
4583
|
+
errorCode: PAY_ERROR_CODE,
|
|
4584
|
+
giftCards: mock.giftCards.slice()
|
|
4585
|
+
});
|
|
4586
|
+
});
|
|
4587
|
+
|
|
4588
|
+
$(document).ready(initGiftCardMock);
|
|
4589
|
+
})();
|
|
4590
|
+
|
|
4339
4591
|
const suggestions = [
|
|
4340
4592
|
{
|
|
4341
4593
|
value: 'lintel',
|