wickes-css2 2.113.0-develop.1 → 2.113.0-develop.10

package/src/js/emulation/banner-placement-manager.js

@@ -1,254 +1,285 @@
-// Simulate prompt for input
+(function () {
+    // Simulate prompt for input
 
-function parseSlots(value) {
-    if (!value) {
-        return [];
+    function parseSlots(value) {
+        if (!value) {
+            return [];
+        }
+
+        return String(value)
+            .split(',')
+            .map((item) => parseInt(item.trim(), 10))
+            .filter((item) => Number.isInteger(item) && item >= 0);
     }
 
-    return String(value)
-        .split(',')
-        .map((item) => parseInt(item.trim(), 10))
-        .filter((item) => Number.isInteger(item) && item >= 0);
-}
-
-function isBloomreachDisabled(slots) {
-    return !slots.length || slots.every((s) => s === 0);
-}
-
-function toggleHybrisProductBanners(inputs) {
-    const banners = document.querySelectorAll('.card-product-banner');
-    const disabled = isBloomreachDisabled(inputs.bloomreachSlots);
-
-    banners.forEach((banner) => {
-        if (disabled) {
-            banner.classList.remove('d-none');
-            banner.classList.remove('card-product-banner--inactive');
-        } else {
-            banner.classList.add('d-none');
-            banner.classList.add('card-product-banner--inactive');
-        }
-    });
-}
+    function isBloomreachDisabled(slots) {
+        return !slots.length || slots.every((s) => s === 0);
+    }
+
+    function toggleHybrisProductBanners(inputs) {
+        const banners = document.querySelectorAll('.card-product-banner');
+        const disabled = isBloomreachDisabled(inputs.bloomreachSlots);
+
+        banners.forEach((banner) => {
+            if (disabled) {
+                banner.classList.remove('d-none');
+                banner.classList.remove('card-product-banner--inactive');
+            } else {
+                banner.classList.add('d-none');
+                banner.classList.add('card-product-banner--inactive');
+            }
+        });
+    }
+
+    function getPositionAttr() {
+        const isMobile = window.Wick?.BannerPlacementManager?.isMobileResolution();
+
+        return isMobile ? 'data-mobile-position' : 'data-desktop-position';
+    }
+
+    function setUnifiedPosition(el, slot) {
+        el.setAttribute('data-desktop-position', String(slot));
+        el.setAttribute('data-mobile-position', String(slot));
+    }
 
-function getPositionAttr() {
-    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+    function hasLegacyBanners() {
+        return Boolean(
+            document.querySelector('.card-product-banner') ||
+            document.querySelector('.card-sponsor-product') ||
+            document.querySelector('.card-sponsor-banner')
+        );
+    }
+
+    function isPackagePlp() {
+        const manager = window.Wick?.BannerPlacementManager;
+        const productsWrapSelector = manager
+            ? manager.el.productsWrap
+            : '.products-list.products-list-v2';
+        return (
+            productsWrapSelector.includes('.package-plp__cards') ||
+            document.querySelector('.package-plp__cards') !== null
+        );
+    }
 
-    return isMobile ? 'data-mobile-position' : 'data-desktop-position';
-}
+    function getInputs() {
+        const hasLegacy = hasLegacyBanners();
 
-function setUnifiedPosition(el, slot) {
-    el.setAttribute('data-desktop-position', String(slot));
-    el.setAttribute('data-mobile-position', String(slot));
-}
+        const bloomreachSlots = parseSlots(
+            prompt('Enter Bloomreach Banner Slots (comma-separated):', '3') || ''
+        );
 
-function hasLegacyBanners() {
-    return Boolean(
-        document.querySelector('.card-product-banner') ||
-        document.querySelector('.card-sponsor-product') ||
-        document.querySelector('.card-sponsor-banner')
-    );
-}
+        if (!hasLegacy) {
+            return {
+                bloomreachSlots,
+                sponsorProductPositions: [],
+                sponsorBannerPositions: [],
+                productBannerPositions: [],
+            };
+        }
 
-function getInputs() {
-    const hasLegacy = hasLegacyBanners();
+        const productBannerPositions =
+            prompt('Enter Product Banner Positions (comma-separated):', '2') || '';
 
-    const bloomreachSlots = parseSlots(
-        prompt('Enter Bloomreach Banner Slots (comma-separated):', '3') || ''
-    );
+        const sponsorProductPositions = isPackagePlp()
+            ? ''
+            : prompt('Enter Sponsor Product Positions (comma-separated):', '6,7,8') || '';
+
+        const sponsorBannerPositions =
+            prompt('Enter Sponsor Banner Positions (comma-separated):', '10') || '';
 
-    if (!hasLegacy) {
         return {
+            productBannerPositions: parseSlots(productBannerPositions),
+            sponsorProductPositions: parseSlots(sponsorProductPositions),
+            sponsorBannerPositions: parseSlots(sponsorBannerPositions),
             bloomreachSlots,
-            sponsorProductPositions: [],
-            sponsorBannerPositions: [],
-            productBannerPositions: [],
         };
     }
 
-    const productBannerPositions =
-        prompt('Enter Product Banner Positions (comma-separated):', '2') || '';
-
-    const sponsorProductPositions =
-        prompt('Enter Sponsor Product Positions (comma-separated):', '6,7,8') || '';
+    function updateBannerPositions(selector, positions) {
+        if (!positions?.length) {
+            return;
+        }
 
-    const sponsorBannerPositions =
-        prompt('Enter Sponsor Banner Positions (comma-separated):', '10') || '';
+        const positionAttr = getPositionAttr();
+        const elements = document.querySelectorAll(selector);
 
-    return {
-        productBannerPositions: parseSlots(productBannerPositions),
-        sponsorProductPositions: parseSlots(sponsorProductPositions),
-        sponsorBannerPositions: parseSlots(sponsorBannerPositions),
-        bloomreachSlots,
-    };
-}
+        elements.forEach((el, index) => {
+            if (positions[index] !== undefined) {
+                el.setAttribute(positionAttr, String(positions[index]));
+            }
+        });
+    }
 
-function updateBannerPositions(selector, positions) {
-    if (!positions?.length) {
-        return;
+    function updatePositions(inputs) {
+        updateBannerPositions('.card-product-banner', inputs.productBannerPositions);
+        updateBannerPositions('.card-sponsor-product', inputs.sponsorProductPositions);
+        updateBannerPositions('.card-sponsor-banner', inputs.sponsorBannerPositions);
     }
 
-    const positionAttr = getPositionAttr();
-    const elements = document.querySelectorAll(selector);
+    function patchBannerPlacementManagerForBloomreachEmulation(inputs) {
+        const manager = window.Wick?.BannerPlacementManager;
 
-    elements.forEach((el, index) => {
-        if (positions[index] !== undefined) {
-            el.setAttribute(positionAttr, String(positions[index]));
+        if (!manager || manager.__bloomreachEmulationPatched) {
+            return;
         }
-    });
-}
 
-function updatePositions(inputs) {
-    updateBannerPositions('.card-product-banner', inputs.productBannerPositions);
-    updateBannerPositions('.card-sponsor-product', inputs.sponsorProductPositions);
-    updateBannerPositions('.card-sponsor-banner', inputs.sponsorBannerPositions);
-}
+        const shouldDisableProductBanners = Boolean(inputs.bloomreachSlots?.length);
+        const includeSponsorProduct = !isPackagePlp();
 
-function patchBannerPlacementManagerForBloomreachEmulation(inputs) {
-    const manager = window.Wick?.BannerPlacementManager;
+        manager.el.bloomreachBanners = '.card-bloomreach-media-banner';
 
-    if (!manager || manager.__bloomreachEmulationPatched) {
-        return;
-    }
+        let activeBanners = ['.card-bloomreach-media-banner', '.card-sponsor-banner'];
+        if (!shouldDisableProductBanners) activeBanners.push('.card-product-banner');
+        if (includeSponsorProduct) activeBanners.push('.card-sponsor-product');
+
+        manager.el.allBanners = activeBanners.join(', ');
 
-    const shouldDisableProductBanners = Boolean(inputs.bloomreachSlots?.length);
+        let activeListSlots = [
+            manager.el.productCard || '.product-card',
+            '.card-bloomreach-media-banner',
+            '.card-sponsor-banner',
+        ];
+        if (!shouldDisableProductBanners) activeListSlots.push('.card-product-banner');
+        if (includeSponsorProduct) activeListSlots.push('.card-sponsor-product');
 
-    manager.el.bloomreachBanners = '.card-bloomreach-media-banner';
+        manager.el.allListSlots = activeListSlots.join(', ');
+        manager.classes.bloomreachBanners = 'card-bloomreach-media-banner';
 
-    manager.el.allBanners = shouldDisableProductBanners
-        ? '.card-bloomreach-media-banner, .card-sponsor-banner, .card-sponsor-product'
-        : '.card-product-banner, .card-bloomreach-media-banner, .card-sponsor-banner, .card-sponsor-product';
+        manager.getListSlots = function () {
+            return $(manager.el.productsWrap)
+                .children(manager.el.allListSlots)
+                .filter(function () {
+                    if (
+                        $(this).hasClass(manager.classes.productBanners) ||
+                        $(this).hasClass(manager.classes.bloomreachBanners)
+                    ) {
+                        const position = manager.getBannerPosition(this);
+                        const productsCount = manager.getListLength();
 
-    manager.el.allListSlots = shouldDisableProductBanners
-        ? '.product-card, .card-bloomreach-media-banner, .card-sponsor-banner, .card-sponsor-product'
-        : '.product-card, .card-product-banner, .card-bloomreach-media-banner, .card-sponsor-banner, .card-sponsor-product';
+                        return position <= productsCount;
+                    }
 
-    manager.classes.bloomreachBanners = 'card-bloomreach-media-banner';
+                    return true;
+                });
+        };
 
-    manager.getListSlots = function () {
-        return $(manager.el.productsWrap)
-            .children(manager.el.allListSlots)
-            .filter(function () {
-                if (
-                    $(this).hasClass(manager.classes.productBanners) ||
-                    $(this).hasClass(manager.classes.bloomreachBanners)
-                ) {
-                    const position = manager.getBannerPosition(this);
-                    const productsCount = manager.getListLength();
+        manager.arrangeBannersInRightOrder = function () {
+            const $allBanners = $(manager.el.allBanners);
 
-                    return position <= productsCount;
+            function getSameSlotInsertionOrder(el) {
+                if ($(el).hasClass(manager.classes.bloomreachBanners)) {
+                    return 0;
                 }
 
-                return true;
-            });
-    };
+                if ($(el).hasClass(manager.classes.sponsorBanners)) {
+                    return 1;
+                }
 
-    manager.arrangeBannersInRightOrder = function () {
-        const $allBanners = $(manager.el.allBanners);
+                if ($(el).hasClass(manager.classes.sponsorProducts)) {
+                    return 2;
+                }
 
-        function getSameSlotInsertionOrder(el) {
-            if ($(el).hasClass(manager.classes.bloomreachBanners)) {
-                return 0;
-            }
+                if ($(el).hasClass(manager.classes.productBanners)) {
+                    return 3;
+                }
 
-            if ($(el).hasClass(manager.classes.sponsorBanners)) {
-                return 1;
+                return 4;
             }
 
-            if ($(el).hasClass(manager.classes.sponsorProducts)) {
-                return 2;
-            }
+            $allBanners
+                .sort((a, b) => {
+                    const positionA = manager.getBannerPosition(a);
+                    const positionB = manager.getBannerPosition(b);
 
-            if ($(el).hasClass(manager.classes.productBanners)) {
-                return 3;
-            }
+                    if (positionA !== positionB) {
+                        return positionA - positionB;
+                    }
 
-            return 4;
-        }
+                    return getSameSlotInsertionOrder(a) - getSameSlotInsertionOrder(b);
+                })
+                .appendTo(manager.el.productsWrap);
+        };
 
-        $allBanners
-            .sort((a, b) => {
-                const positionA = manager.getBannerPosition(a);
-                const positionB = manager.getBannerPosition(b);
+        manager.__bloomreachEmulationPatched = true;
+    }
 
-                if (positionA !== positionB) {
-                    return positionA - positionB;
-                }
+    function rebuildBloomreachBannersForEmulation(inputs) {
+        const slots = inputs.bloomreachSlots || [];
+        const manager = window.Wick?.BannerPlacementManager;
+        const productsWrapSelector = manager
+            ? manager.el.productsWrap
+            : '.products-list.products-list-v2';
+        const productsWrap = document.querySelector(productsWrapSelector);
 
-                return getSameSlotInsertionOrder(a) - getSameSlotInsertionOrder(b);
-            })
-            .appendTo(manager.el.productsWrap);
-    };
+        if (!productsWrap) {
+            return;
+        }
 
-    manager.__bloomreachEmulationPatched = true;
-}
+        const existingBanners = document.querySelectorAll('.card-bloomreach-media-banner');
 
-function rebuildBloomreachBannersForEmulation(inputs) {
-    const slots = inputs.bloomreachSlots || [];
-    const productsWrap = document.querySelector('.products-list.products-list-v2');
+        if (isBloomreachDisabled(slots)) {
+            existingBanners.forEach((banner) => banner.remove());
+            return;
+        }
 
-    if (!productsWrap) {
-        return;
-    }
+        if (!existingBanners.length) {
+            return;
+        }
 
-    const existingBanners = document.querySelectorAll('.card-bloomreach-media-banner');
+        const template = existingBanners[0].cloneNode(true);
 
-    if (isBloomreachDisabled(slots)) {
         existingBanners.forEach((banner) => banner.remove());
-        return;
-    }
-
-    if (!existingBanners.length) {
-        return;
-    }
 
-    const template = existingBanners[0].cloneNode(true);
+        const fragment = document.createDocumentFragment();
 
-    existingBanners.forEach((banner) => banner.remove());
+        slots.forEach((slot) => {
+            if (slot === 0) return;
 
-    const fragment = document.createDocumentFragment();
+            const node = template.cloneNode(true);
 
-    slots.forEach((slot) => {
-        if (slot === 0) return;
+            node.removeAttribute('data-slots');
+            setUnifiedPosition(node, slot);
 
-        const node = template.cloneNode(true);
+            fragment.appendChild(node);
+        });
 
-        node.removeAttribute('data-slots');
-        setUnifiedPosition(node, slot);
+        productsWrap.appendChild(fragment);
+    }
 
-        fragment.appendChild(node);
-    });
+    function applyBloomreachEmulation() {
+        const inputs = getInputs();
 
-    productsWrap.appendChild(fragment);
-}
+        updatePositions(inputs);
 
-function applyBloomreachEmulation() {
-    const inputs = getInputs();
+        const isDisabled = isBloomreachDisabled(inputs.bloomreachSlots);
 
-    updatePositions(inputs);
+        toggleHybrisProductBanners(inputs);
 
-    const isDisabled = isBloomreachDisabled(inputs.bloomreachSlots);
+        if (!isDisabled) {
+            patchBannerPlacementManagerForBloomreachEmulation(inputs);
+        }
 
-    toggleHybrisProductBanners(inputs);
+        rebuildBloomreachBannersForEmulation(inputs);
 
-    if (!isDisabled) {
-        patchBannerPlacementManagerForBloomreachEmulation(inputs);
+        if (
+            window.Wick &&
+            window.Wick.BannerPlacementManager &&
+            typeof window.Wick.BannerPlacementManager.checkProductsInColumn === 'function'
+        ) {
+            window.Wick.BannerPlacementManager.checkProductsInColumn();
+        }
     }
 
-    rebuildBloomreachBannersForEmulation(inputs);
-
-    if (
-        window.Wick &&
-        Wick.BannerPlacementManager &&
-        typeof Wick.BannerPlacementManager.checkProductsInColumn === 'function'
-    ) {
-        Wick.BannerPlacementManager.checkProductsInColumn();
-    }
-}
+    $(document).ready(function () {
+        const manager = window.Wick?.BannerPlacementManager;
+        const productsWrapSelector = manager
+            ? manager.el.productsWrap
+            : '.products-list.products-list-v2';
 
-$(document).ready(function () {
-    if ($('.products-list.products-list-v2').length) {
-        setTimeout(() => {
-            applyBloomreachEmulation();
-        }, 100);
-    }
-});
+        if ($(productsWrapSelector).length) {
+            setTimeout(() => {
+                applyBloomreachEmulation();
+            }, 100);
+        }
+    });
+})();

package/src/js/emulation/complete-your-project-loading.js

@@ -0,0 +1,16 @@
+var Wick = window.Wick || {};
+
+$(document).ready(function () {
+    const $container = $('[data-complete-widget]');
+
+    if (!$container.length) {
+        return;
+    }
+
+    window.setTimeout(function () {
+        const mockDataKey = $container.data('mock-key');
+        const payloadData = Wick.FEMock.dataBloomreach[mockDataKey];
+
+        Wick.BloomreachWidget.init('completeYourProject', payloadData);
+    }, 3000);
+});

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

@@ -1,21 +1,34 @@
-function simulateHybrisSendingHtml() {
-    const htmlFromHybris = Wick.FEMock.cartPDP;
-    const event = new CustomEvent('productAddedToCart', {
-        detail: { html: htmlFromHybris },
-    });
-    window.dispatchEvent(event);
+var Wick = window.Wick || {};
+
+import { getNextCartAddScenario, dispatchCartScenario } from './just-added-scenarios-emulation';
+
+function getCartMock() {
+    const cartMockKey = $('.pdp__main').data('cart-mock-key') || 'cartPDP';
+
+    return Wick.FEMock[cartMockKey];
+}
+
+function simulateHybrisSendingHtml(event) {
+    event.preventDefault();
+
+    const scenario = getNextCartAddScenario();
+    const cartMock = getCartMock();
+
+    dispatchCartScenario(cartMock, scenario);
 }
 
 function bindResolveEvent(events) {
     $(window).on(events.join(' '), function ({ detail: { resolve } }) {
-        setTimeout(() => {
+        setTimeout(function () {
             resolve();
         }, 200);
     });
 }
 
 $(document).ready(function () {
-    $('.btn-add-to-basket').on('click', simulateHybrisSendingHtml);
+    $(document)
+        .off('click.customSliderEmulation', '.btn-add-to-basket')
+        .on('click.customSliderEmulation', '.btn-add-to-basket', simulateHybrisSendingHtml);
 
     bindResolveEvent([
         'CLOSE_JUST_ADDED',

package/src/js/emulation/date-selection.js

@@ -142,8 +142,8 @@ function updatePremiumInfo() {
     const $image = $(DS_EL.image);
     const $premiumImage = $(DS_EL.premiumImage);
 
-    $title.text('Premium delivery');
-    $subtitle.html('Delivered tomorrow morning for £12.00');
+    $title.text('Next Day AM delivery');
+    $subtitle.html('Delivered tomorrow Pre-12pm for £12.00');
     $infoIcon.addClass(DS_CLASSES.hidden);
     $subtitle.append($infoIcon);
     $image.addClass(DS_CLASSES.hidden);

package/src/js/emulation/dont-forget-loading.js

@@ -0,0 +1,36 @@
+var Wick = window.Wick || {};
+
+let shouldFailNext = false;
+
+const RESPONSE_MESSAGES = {
+    success: {
+        messageType: 'success',
+        messageText: 'Item added to cart',
+    },
+    error: {
+        messageType: 'error',
+        messageText: 'Product has not been added to basket',
+    },
+};
+
+function bindDontForgetAddToCartEvent() {
+    $(window)
+        .off('addToCart.dontForgetEmulation')
+        .on('addToCart.dontForgetEmulation', function ({ detail = {} }) {
+            const { payload, resolve } = detail;
+
+            if (!payload || payload.doNotShowAddedProductPopup !== true) {
+                return;
+            }
+
+            shouldFailNext = !shouldFailNext;
+
+            window.setTimeout(function () {
+                resolve(shouldFailNext ? RESPONSE_MESSAGES.error : RESPONSE_MESSAGES.success);
+            }, 2000);
+        });
+}
+
+$(document).ready(function () {
+    bindDontForgetAddToCartEvent();
+});