wickes-css2 2.113.0-develop.2 → 2.113.0-develop.5

package/src/js/emulation/mock.js

@@ -9,10 +9,382 @@ Wick.FEMock = {
         );
     },
     dataBloomreach: {
+        dontForgetRecommendations: {
+            recommendedProducts: [
+                {
+                    baseProduct: {
+                        code: '153731',
+                        name: 'Wickes Trade Paint Roller Set - 9in',
+                        url: '/Wickes-Trade-Paint-Roller-Set---9in/p/153731',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: '15% off',
+                                    overlayBackgroundColor: 'yellow',
+                                    overlayTextColor: 'gray',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=roller',
+                                altText: 'Wickes Trade Paint Roller Set - 9in',
+                            },
+                        ],
+                        externalAverageRating: 5,
+                        externalReviewCount: 100,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 9999,
+                            priceType: 'BUY',
+                            formattedValue: '£9,999.00',
+                            formattedPriceWithoutCurrencySymbol: '9999',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 999900,
+                            wasPrice: 3000,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 9998,
+                            priceType: 'BUY',
+                            formattedValue: '£9,998.00',
+                            formattedPriceWithoutCurrencySymbol: '9998',
+                            currencySymbol: '£',
+                            valueInPence: 999800,
+                            wasPrice: 2500,
+                        },
+                    },
+                },
+                {
+                    baseProduct: {
+                        code: '349137',
+                        name: 'Wickes Microfibre Paint Roller Sleeve - 9in',
+                        url: '/Wickes-Microfibre-Paint-Roller-Sleeve---9in/p/349137',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: 'Multi-buy',
+                                    overlayBackgroundColor: 'green',
+                                    overlayTextColor: 'gray',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=sleeve',
+                                altText: 'Wickes Microfibre Paint Roller Sleeve - 9in',
+                            },
+                        ],
+                        externalAverageRating: 4.2,
+                        externalReviewCount: 48,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 7.5,
+                            priceType: 'BUY',
+                            formattedValue: '£7.50',
+                            formattedPriceWithoutCurrencySymbol: '7.50',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 750,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 6.25,
+                            priceType: 'BUY',
+                            formattedValue: '£6.25',
+                            formattedPriceWithoutCurrencySymbol: '6.25',
+                            currencySymbol: '£',
+                            valueInPence: 625,
+                        },
+                    },
+                },
+                {
+                    baseProduct: {
+                        code: '221048',
+                        name: 'Wickes Paint Tray - 9in',
+                        url: '/Wickes-Paint-Tray---9in/p/221048',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: 'Offer Ends Wednesday',
+                                    overlayBackgroundColor: 'red',
+                                    overlayTextColor: 'white',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=tray',
+                                altText: 'Wickes Paint Tray - 9in',
+                            },
+                        ],
+                        externalAverageRating: 3.8,
+                        externalReviewCount: 19,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 4,
+                            priceType: 'BUY',
+                            formattedValue: '£4',
+                            formattedPriceWithoutCurrencySymbol: '4',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 400,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 3.33,
+                            priceType: 'BUY',
+                            formattedValue: '£3.33',
+                            formattedPriceWithoutCurrencySymbol: '3.33',
+                            currencySymbol: '£',
+                            valueInPence: 333,
+                        },
+                    },
+                },
+                {
+                    baseProduct: {
+                        code: '654221',
+                        name: 'Wickes Professional Masking Tape - 48mm x 50m',
+                        url: '/Wickes-Professional-Masking-Tape---48mm-x-50m/p/654221',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: 'Online Only',
+                                    overlayBackgroundColor: 'blue',
+                                    overlayTextColor: 'white',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=tape',
+                                altText: 'Wickes Professional Masking Tape - 48mm x 50m',
+                            },
+                        ],
+                        externalAverageRating: 4.6,
+                        externalReviewCount: 72,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 5.5,
+                            priceType: 'BUY',
+                            formattedValue: '£5.50',
+                            formattedPriceWithoutCurrencySymbol: '5.50',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 550,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 4.58,
+                            priceType: 'BUY',
+                            formattedValue: '£4.58',
+                            formattedPriceWithoutCurrencySymbol: '4.58',
+                            currencySymbol: '£',
+                            valueInPence: 458,
+                        },
+                    },
+                },
+                {
+                    baseProduct: {
+                        code: '782913',
+                        name: 'Wickes Dust Sheet Cotton Twill - 3.6m x 2.7m Extra Long Product Name For Two Line Truncation Test',
+                        url: '/Wickes-Dust-Sheet-Cotton-Twill---3-6m-x-2-7m/p/782913',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: 'Clearance',
+                                    overlayBackgroundColor: 'gray',
+                                    overlayTextColor: 'white',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=sheet',
+                                altText: 'Wickes Dust Sheet Cotton Twill - 3.6m x 2.7m',
+                            },
+                        ],
+                        externalAverageRating: 4.1,
+                        externalReviewCount: 34,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 12,
+                            priceType: 'BUY',
+                            formattedValue: '£12',
+                            formattedPriceWithoutCurrencySymbol: '12',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 1200,
+                            wasPrice: 18,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 10,
+                            priceType: 'BUY',
+                            formattedValue: '£10',
+                            formattedPriceWithoutCurrencySymbol: '10',
+                            currencySymbol: '£',
+                            valueInPence: 1000,
+                            wasPrice: 15,
+                        },
+                    },
+                },
+            ],
+            widgetMetadata: {
+                responseId: 'mock-df-response',
+                id: 'df12345',
+                type: 'df',
+            },
+        },
+        dontForgetRecommendationsSingle: {
+            recommendedProducts: [
+                {
+                    baseProduct: {
+                        code: '153731',
+                        name: 'Wickes Trade Paint Roller Set - 9in',
+                        url: '/Wickes-Trade-Paint-Roller-Set---9in/p/153731',
+                        purchasable: true,
+                        productType: 'ProductModel',
+                        isBaseProduct: false,
+                        availabilityRestriction: 'NO_RESTRICTIONS',
+                        fulfilmentType: 'STANDARD',
+                        stock: {
+                            stockLevelStatus: {
+                                code: 'inStock',
+                            },
+                        },
+                        fulfillmentAttributes: {
+                            type: 'STANDARD',
+                        },
+                        potentialPromotions: [
+                            {
+                                customAttributes: {
+                                    overlayText: '15% off',
+                                    overlayBackgroundColor: 'yellow',
+                                    overlayTextColor: 'gray',
+                                },
+                            },
+                        ],
+                        images: [
+                            {
+                                imageType: 'PRIMARY',
+                                format: 'product',
+                                url: 'https://placehold.co/68x68?text=roller',
+                                altText: 'Wickes Trade Paint Roller Set - 9in',
+                            },
+                        ],
+                        externalAverageRating: 5,
+                        externalReviewCount: 100,
+                        displayPrice: {
+                            currencyIso: 'GBP',
+                            value: 9999,
+                            priceType: 'BUY',
+                            formattedValue: '£9,999.00',
+                            formattedPriceWithoutCurrencySymbol: '9999',
+                            currencySymbol: '£',
+                            vatRatePercentage: 20,
+                            valueInPence: 999900,
+                            wasPrice: 3000,
+                        },
+                        displayPriceExclusiveVat: {
+                            currencyIso: 'GBP',
+                            value: 9998,
+                            priceType: 'BUY',
+                            formattedValue: '£9,998.00',
+                            formattedPriceWithoutCurrencySymbol: '9998',
+                            currencySymbol: '£',
+                            valueInPence: 999800,
+                            wasPrice: 2500,
+                        },
+                    },
+                },
+            ],
+            widgetMetadata: {
+                responseId: 'mock-df-single-response',
+                id: 'dfSingle12345',
+                type: 'df',
+            },
+        },
         whyNotAddRecommendationsSingle: {
             widgetMetadata: {
                 responseId: 'mock-wna-single-response',
-                id: 'wna12345',
+                id: 'wnaSingle12345',
                 type: 'wna',
             },
             recommendedProducts: [
@@ -3495,7 +3867,7 @@ Wick.FEMock = {
         },
     ],
     cartPDP: `
-          <div class="custom-slider__wrap slider-mini-basket popover-mini-basket">
+          <div class="custom-slider__wrap slider-mini-basket popover-mini-basket" data-mock-key="dontForgetRecommendations">
                 <div class="custom-slider__header">
                 <a href="#" type="button" class="link close-popup">
                     <span class="icon-wrap">
@@ -3544,8 +3916,61 @@ Wick.FEMock = {
                   </div>
                 </div>
             </div>
-            <div class="custom-slider__content">
-              <p>Product description Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget. Product description Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus pronin sapien nunc accuan eget.</p>
+          </div>
+          <div class="custom-slider__footer">
+              <button class="btn btn_full btn-secondary close-popup">Continue Shopping</button>
+              <a href="/cart" class="btn btn-action btn_full btn-view-basket-cta" type="button">View Basket</a>
+          </div>
+      `,
+    cartPDPSingle: `
+          <div class="custom-slider__wrap slider-mini-basket popover-mini-basket" data-mock-key="dontForgetRecommendationsSingle">
+                <div class="custom-slider__header">
+                <a href="#" type="button" class="link close-popup">
+                    <span class="icon-wrap">
+                        <svg class="svg-inline--fa fa-angle-left fa-w-6" aria-hidden="true" focusable="false" data-prefix="far" data-icon="angle-left" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" data-fa-i2svg="">
+                            <path fill="currentColor" d="M4.2 247.5L151 99.5c4.7-4.7 12.3-4.7 17 0l19.8 19.8c4.7 4.7 4.7 12.3 0 17L69.3 256l118.5 119.7c4.7 4.7 4.7 12.3 0 17L168 412.5c-4.7 4.7-12.3 4.7-17 0L4.2 264.5c-4.7-4.7-4.7-12.3 0-17z"></path>
+                        </svg>
+                    </span>
+                    Continue Shopping
+                </a>
+                <a href="#" type="button" class="icon-wrap close-popup">
+                    <svg class="svg-inline--fa fa-times fa-w-10 icon" aria-hidden="true" focusable="false" data-prefix="far" data-icon="times" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" data-fa-i2svg="">
+                        <path fill="currentColor" d="M207.6 256l107.72-107.72c6.23-6.23 6.23-16.34 0-22.58l-25.03-25.03c-6.23-6.23-16.34-6.23-22.58 0L160 208.4 52.28 100.68c-6.23-6.23-16.34-6.23-22.58 0L4.68 125.7c-6.23 6.23-6.23 16.34 0 22.58L112.4 256 4.68 363.72c-6.23 6.23-6.23 16.34 0 22.58l25.03 25.03c6.23 6.23 16.34 6.23 22.58 0L160 303.6l107.72 107.72c6.23 6.23 16.34 6.23 22.58 0l25.03-25.03c6.23-6.23 6.23-16.34 0-22.58L207.6 256z"></path>
+                    </svg>
+                </a>
+            </div>
+            <div class="custom-slider__message">
+                <span class="icon-wrap success">
+                    <svg class="svg-inline--fa fa-check-circle fa-w-16" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check-circle" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M504 256c0 136.967-111.033 248-248 248S8 392.967 8 256 119.033 8 256 8s248 111.033 248 248zM227.314 387.314l184-184c6.248-6.248 6.248-16.379 0-22.627l-22.627-22.627c-6.248-6.249-16.379-6.249-22.628 0L216 308.118l-70.059-70.059c-6.248-6.248-16.379-6.248-22.628 0l-22.627 22.627c-6.248 6.248-6.248 16.379 0 22.627l104 104c6.249 6.249 16.379 6.249 22.628.001z"></path></svg><!-- <i class="fas fa-check-circle"></i> Font Awesome fontawesome.com -->
+                </span>
+            
+                <div class="messages popover-mini-basket__added">
+                    <p class="messages__text">
+                        <span>
+                            You've just added</span>
+                        </p>
+            
+                    <span class="messages__notice">
+                            Excluding items already in basket</span>
+                    </div>
+            </div>
+            <div class="products popover-mini-basket__cards-holder">
+              <div class="card product-card-preview">
+                <div class="products__item card__inner" data-name="Blue Circle Ready To Use Postcrete - 20kg" data-id="221100" data-price="7.50" data-brand="Blue Circle" data-category="Building Materials/Cement &amp; Aggregates/Cement" data-position="0">
+                    <a href="/Blue-Circle-Ready-To-Use-Postcrete---20kg/p/221100" class="card__img-wrap card__img-wrap_link products__image">
+                        <img loading="lazy" class="product-img" src="//media.wickes.co.uk/is/image/wickes/B3182_221100_00?$thumbnail$" alt="Blue Circle Ready To Use Postcrete - 20kg" title="Blue Circle Ready To Use Postcrete - 20kg">
+                    </a>
+        
+                    <div class="products__details">
+                        <a href="/Blue-Circle-Ready-To-Use-Postcrete---20kg/p/221100" class="title product-card__title">Blue Circle Ready To Use Postcrete - 20kg</a>
+                        <p class="item">Added for delivery</p>
+                        <p class="item pdp-price__control-holder">Qty:
+                          <span class="value product-card__quantity-value">1</span>
+                        </p>
+                        <p class="price product-card__price-value">£7.50</p>
+                    </div>
+                  </div>
+                </div>
             </div>
           </div>
           <div class="custom-slider__footer">

package/src/js/emulation/why-not-add-loading.js

@@ -2,9 +2,20 @@ var Wick = window.Wick || {};
 
 $(document).ready(function () {
     window.setTimeout(function () {
-        const $container = $('[data-why-not-add-widget]');
-        const mockDataKey = $container.data('mock-key');
-        const payloadData = Wick.FEMock.dataBloomreach[mockDataKey];
+        const $container = $('[data-why-not-add-widget]').first();
+
+        if (!$container.length) {
+            return;
+        }
+
+        const mockDataKey = $container.attr('data-mock-key');
+        const payloadData =
+            Wick.FEMock && Wick.FEMock.dataBloomreach && Wick.FEMock.dataBloomreach[mockDataKey];
+
+        if (!payloadData) {
+            $container.empty().hide();
+            return;
+        }
 
         Wick.BloomreachWidget.init('whyNotAdd', payloadData);
     }, 3000);

package/src/js/emulation/why-not-add.js

@@ -1,24 +1,22 @@
 var Wick = window.Wick || {};
 
-function simulateHybrisSendingHtml() {
-    const htmlFromHybris = Wick.FEMock.cartPDP;
-
-    window.dispatchEvent(
-        new CustomEvent('productAddedToCart', {
-            detail: {
-                html: htmlFromHybris,
-            },
-        })
-    );
-}
+import { getNextCartAddScenario, dispatchCartScenario } from './just-added-scenarios-emulation';
 
 function bindWhyNotAddToCartEvent() {
     $(window)
         .off('addToCart.whyNotAddEmulation')
-        .on('addToCart.whyNotAddEmulation', function ({ detail: { resolve } }) {
-            setTimeout(function () {
+        .on('addToCart.whyNotAddEmulation', function ({ detail }) {
+            const { payload, resolve } = detail;
+
+            if (payload && payload.doNotShowAddedProductPopup === true) {
+                return;
+            }
+
+            const scenario = getNextCartAddScenario();
+
+            window.setTimeout(function () {
                 resolve();
-                simulateHybrisSendingHtml();
+                dispatchCartScenario(Wick.FEMock.cartPDP, scenario);
             }, 3000);
         });
 }