wickes-css2 2.111.0-develop.4 → 2.111.0-dont-forget-widget.1

package/build/js/emulation.min.js

@@ -4997,9 +4997,9 @@ var Wick = window.Wick || {};
 $(document).ready(function () {
   window.setTimeout(function () {
     var $container = $('[data-complete-widget]');
-    var contextKey = $container.data('context-key');
+    var contextKey = $container.data('mock-key');
     var payloadData = Wick.FEMock.dataBloomreach[contextKey];
-    Wick.BloomreachWidget.init(payloadData);
+    Wick.BloomreachWidget.init('completeYourProject', payloadData);
   }, 3000);
 });
 
@@ -5760,7 +5760,7 @@ function waitFor(getter, cb, opts) {
   });
 })();
 
-},{"../page/utils/show-more-less":97}],52:[function(require,module,exports){
+},{"../page/utils/show-more-less":99}],52:[function(require,module,exports){
 "use strict";
 
 var Wick = Wick || {};
@@ -12932,6 +12932,294 @@ Wick.FEMock = {
     }));
   },
   dataBloomreach: {
+    whyNotAddRecommendationsSingle: {
+      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'
+          },
+          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: '16',
+            currencySymbol: '£',
+            vatRatePercentage: 20,
+            valueInPence: 999900,
+            wasPrice: 30
+          },
+          displayPriceExclusiveVat: {
+            currencyIso: 'GBP',
+            value: 9998,
+            priceType: 'BUY',
+            formattedValue: '£9,998.00',
+            formattedPriceWithoutCurrencySymbol: '13.33',
+            currencySymbol: '£',
+            valueInPence: 999800,
+            wasPrice: 25
+          }
+        }
+      }]
+    },
+    whyNotAddRecommendations: {
+      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'
+          },
+          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: '16',
+            currencySymbol: '£',
+            vatRatePercentage: 20,
+            valueInPence: 999900,
+            wasPrice: 3000
+          },
+          displayPriceExclusiveVat: {
+            currencyIso: 'GBP',
+            value: 9998,
+            priceType: 'BUY',
+            formattedValue: '£9,998.00',
+            formattedPriceWithoutCurrencySymbol: '13.33',
+            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'
+          },
+          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: 9999,
+            priceType: 'BUY',
+            formattedValue: '£7.5220',
+            formattedPriceWithoutCurrencySymbol: '7.50',
+            currencySymbol: '£',
+            vatRatePercentage: 20,
+            valueInPence: 999900
+          },
+          displayPriceExclusiveVat: {
+            currencyIso: 'GBP',
+            value: 9998,
+            priceType: 'BUY',
+            formattedValue: '£6.25',
+            formattedPriceWithoutCurrencySymbol: '6.25',
+            currencySymbol: '£',
+            valueInPence: 999800
+          }
+        }
+      }, {
+        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'
+          },
+          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'
+          },
+          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'
+          },
+          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
+          }
+        }
+      }]
+    },
     completeYourProject3Recomendations: [{
       baseProduct: {
         code: '191018',
@@ -16973,7 +17261,7 @@ $(document).ready(function () {
   initStoreLocatorLoadMore();
 });
 
-},{"../page/utils/loader":96}],88:[function(require,module,exports){
+},{"../page/utils/loader":98}],88:[function(require,module,exports){
 "use strict";
 
 var Wick = window.Wick || {};
@@ -17123,6 +17411,44 @@ window.ACC.app.isVatToggleAvailable = !!$('.switch-vat input').length;
 },{}],94:[function(require,module,exports){
 "use strict";
 
+var Wick = window.Wick || {};
+$(document).ready(function () {
+  window.setTimeout(function () {
+    var $container = $('[data-why-not-add-widget]');
+    var mockDataKey = $container.data('mock-key');
+    var payloadData = Wick.FEMock.dataBloomreach[mockDataKey];
+    Wick.BloomreachWidget.init('whyNotAdd', payloadData);
+  }, 3000);
+});
+
+},{}],95:[function(require,module,exports){
+"use strict";
+
+var Wick = window.Wick || {};
+function simulateHybrisSendingHtml() {
+  var htmlFromHybris = Wick.FEMock.cartPDP;
+  window.dispatchEvent(new CustomEvent('productAddedToCart', {
+    detail: {
+      html: htmlFromHybris
+    }
+  }));
+}
+function bindWhyNotAddToCartEvent() {
+  $(window).off('addToCart.whyNotAddEmulation').on('addToCart.whyNotAddEmulation', function (_ref) {
+    var resolve = _ref.detail.resolve;
+    setTimeout(function () {
+      resolve();
+      simulateHybrisSendingHtml();
+    }, 3000);
+  });
+}
+$(document).ready(function () {
+  bindWhyNotAddToCartEvent();
+});
+
+},{}],96:[function(require,module,exports){
+"use strict";
+
 var Wick = window.Wick = window.Wick || {};
 Wick.Wismo = function () {
   Wick.SnackBar.init();
@@ -17152,7 +17478,7 @@ Wick.Wismo = function () {
   });
 }();
 
-},{}],95:[function(require,module,exports){
+},{}],97:[function(require,module,exports){
 "use strict";
 
 var Wick = Wick || {};
@@ -17231,7 +17557,7 @@ Wick.YourDetails = function () {
   });
 }();
 
-},{}],96:[function(require,module,exports){
+},{}],98:[function(require,module,exports){
 "use strict";
 
 Object.defineProperty(exports, "__esModule", {
@@ -17257,7 +17583,7 @@ function hideLoader(loaderSelector) {
   $(defineLoaderWrapper(loaderSelector)).addClass(HIDDEN_CLASS_NAME);
 }
 
-},{"../../../elements/loader.hbs":25}],97:[function(require,module,exports){
+},{"../../../elements/loader.hbs":25}],99:[function(require,module,exports){
 "use strict";
 
 Object.defineProperty(exports, "__esModule", {
@@ -17494,4 +17820,4 @@ function createShowMoreLess() {
   };
 }
 
-},{"../../../elements/btn.hbs":24}]},{},[26,27,28,29,30,31,32,33,34,35,36,37,38,39,44,40,41,42,43,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95]);
+},{"../../../elements/btn.hbs":24}]},{},[26,27,28,29,30,31,32,33,34,35,36,37,38,39,44,40,41,42,43,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79,80,81,82,83,84,85,86,87,88,89,90,91,92,93,94,95,96,97]);

package/build/js/page/bloomreach-widget/bloomreach-widget.js

@@ -0,0 +1,241 @@
+var Wick = window.Wick || {};
+
+import { createEvent } from '../utils/create-event';
+import CompleteYourProjectWidget from './complete-your-project-widget';
+import WhyNotAddWidget from './why-not-add-widget';
+
+Wick.BloomreachWidget = {
+    widgets: {},
+
+    el: {
+        loadingButtonText: '.loading-button__text',
+        loadingButtonLoader: '.loading-button__loader',
+        ratingOverlay: '.rating-overlay',
+        starOverlay: '.star-overlay',
+        vatInc: '.including-vat-inherit',
+        vatExc: '.excluding-vat-inherit',
+    },
+
+    registerWidgets(widgetList) {
+        widgetList.forEach(function ({ type, widget }) {
+            Wick.BloomreachWidget.widgets[type] = widget;
+        });
+    },
+
+    getWidget(type) {
+        return Wick.BloomreachWidget.widgets[type];
+    },
+
+    init(type, payloadData) {
+        const widget = Wick.BloomreachWidget.getWidget(type);
+
+        if (!widget || typeof widget.init !== 'function') {
+            return;
+        }
+
+        widget.init(payloadData, Wick.BloomreachWidget);
+    },
+
+    normalizePayload(payloadData) {
+        if (Array.isArray(payloadData)) {
+            return payloadData;
+        }
+
+        if (payloadData && Array.isArray(payloadData.recommendedProducts)) {
+            return payloadData.recommendedProducts;
+        }
+
+        return [];
+    },
+
+    hasRecommendations(payloadData) {
+        return Wick.BloomreachWidget.normalizePayload(payloadData).length > 0;
+    },
+
+    getDisplayPrice(product) {
+        return product.displayPrice || product.price || {};
+    },
+
+    getDisplayPriceExcVat(product) {
+        return product.displayPriceExclusiveVat || product.priceExclusiveVat || null;
+    },
+
+    getPriceValue(price) {
+        return price && typeof price.value === 'number' ? price.value : 0;
+    },
+
+    getPriceFormattedValue(price) {
+        if (!price) {
+            return '';
+        }
+
+        if (price.formattedValue) {
+            return price.formattedValue;
+        }
+
+        if (typeof price.value === 'number') {
+            return Wick.BloomreachWidget.formatPrice(price.value);
+        }
+
+        return '';
+    },
+
+    getWasPrice(product) {
+        const displayPrice = Wick.BloomreachWidget.getDisplayPrice(product);
+
+        return displayPrice && displayPrice.wasPrice ? displayPrice.wasPrice : null;
+    },
+
+    getWasPriceFormatted(product) {
+        const displayPrice = Wick.BloomreachWidget.getDisplayPrice(product);
+        const wasPrice = Wick.BloomreachWidget.getWasPrice(product);
+
+        if (wasPrice && wasPrice.formattedValue) {
+            return wasPrice.formattedValue;
+        }
+
+        if (typeof wasPrice === 'number') {
+            return Wick.BloomreachWidget.formatPrice(wasPrice);
+        }
+
+        if (wasPrice) {
+            return `${displayPrice.currencySymbol || '£'}${wasPrice}`;
+        }
+
+        return '';
+    },
+
+    getExcVatWasPrice(product) {
+        const priceExclusiveVat = product.priceExclusiveVat || null;
+        const displayPriceExclusiveVat = product.displayPriceExclusiveVat || null;
+        const wasPrice =
+            (displayPriceExclusiveVat && displayPriceExclusiveVat.wasPrice) ||
+            (priceExclusiveVat && priceExclusiveVat.wasPrice);
+
+        if (wasPrice && wasPrice.formattedValue) {
+            return wasPrice.formattedValue;
+        }
+
+        if (typeof wasPrice === 'number') {
+            return Wick.BloomreachWidget.formatPrice(wasPrice);
+        }
+
+        return wasPrice || '';
+    },
+
+    getProductImage(product, fallbackProduct) {
+        const productImages = product.images || [];
+        const fallbackImages = fallbackProduct ? fallbackProduct.images || [] : [];
+        const images = productImages.length ? productImages : fallbackImages;
+
+        return (
+            images.find(function (item) {
+                return item.format === 'product';
+            }) ||
+            images.find(function (item) {
+                return item.imageType === 'PRIMARY';
+            }) ||
+            images[0] ||
+            {}
+        );
+    },
+
+    getProductRenderData(product, options = {}) {
+        const displayPrice = Wick.BloomreachWidget.getDisplayPrice(product);
+        const displayPriceExcVat = Wick.BloomreachWidget.getDisplayPriceExcVat(product);
+        const wasPriceFormatted = Wick.BloomreachWidget.getWasPriceFormatted(product);
+        const excVatWasPriceFormatted = Wick.BloomreachWidget.getExcVatWasPrice(product);
+        const isSwitchVat = !!(window.ACC && window.ACC.app && window.ACC.app.isVatToggleAvailable);
+
+        return {
+            ...product,
+            price: displayPrice,
+            image:
+                options.image ||
+                Wick.BloomreachWidget.getProductImage(product, options.fallbackProduct),
+            wasPriceFormatted,
+            'switch-vat': isSwitchVat,
+            incVatFormattedValue: Wick.BloomreachWidget.getPriceFormattedValue(displayPrice),
+            incVatValue: Wick.BloomreachWidget.getPriceValue(displayPrice),
+            excVatFormattedValue: Wick.BloomreachWidget.getPriceFormattedValue(displayPriceExcVat),
+            excVatValue: Wick.BloomreachWidget.getPriceValue(displayPriceExcVat),
+            incVatWasPriceFormatted: wasPriceFormatted,
+            excVatWasPriceFormatted: Wick.BloomreachWidget.getExcVatWasPrice(product),
+        };
+    },
+
+    drawRating($root) {
+        const { ratingOverlay, starOverlay } = Wick.BloomreachWidget.el;
+
+        $root.find(ratingOverlay).each(function () {
+            let rating = parseFloat($(this).attr('data-rating')) || 0;
+            const $stars = $(this).children(starOverlay);
+
+            $stars.each(function () {
+                const $star = $(this);
+
+                if (rating >= 1) {
+                    rating--;
+                } else if (rating > 0) {
+                    const width = Math.asin(2 * rating - 1) / Math.PI + 0.5;
+                    $star.css('width', width + 'rem');
+                    rating = 0;
+                } else {
+                    $star.css('width', '0rem');
+                }
+            });
+        });
+    },
+
+    dispatchWidgetEvent(eventName, payload) {
+        return new Promise(function (resolve, reject) {
+            const eventDetail = { resolve, reject };
+            const event = createEvent(eventName, payload, eventDetail);
+
+            window.dispatchEvent(event);
+        });
+    },
+
+    reapplyVatDisplay() {
+        if (!Wick.VatToggle || typeof Wick.VatToggle.isActive !== 'function') {
+            return;
+        }
+
+        const { vatInc, vatExc } = Wick.BloomreachWidget.el;
+        const hiddenClassName = Wick.VatToggle.HIDDEN_CLASS_NAME || 'd-none';
+        const isExcVatActive = Wick.VatToggle.isActive();
+
+        $(vatInc).toggleClass(hiddenClassName, isExcVatActive);
+        $(vatExc).toggleClass(hiddenClassName, !isExcVatActive);
+    },
+
+    bindVatToggle(namespace) {
+        if (!Wick.VatToggle || !Wick.VatToggle.TOGGLE_VAT_EVENT_NAME) {
+            return;
+        }
+
+        const eventName = `${Wick.VatToggle.TOGGLE_VAT_EVENT_NAME}.${namespace}`;
+
+        $(window).off(eventName).on(eventName, Wick.BloomreachWidget.reapplyVatDisplay);
+    },
+
+    formatPrice(value) {
+        return new Intl.NumberFormat('en-GB', {
+            style: 'currency',
+            currency: 'GBP',
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+        }).format(value);
+    },
+};
+
+Wick.BloomreachWidget.registerWidgets([
+    {
+        type: 'completeYourProject',
+        widget: CompleteYourProjectWidget,
+    },
+    {
+        type: 'whyNotAdd',
+        widget: WhyNotAddWidget,
+    },
+]);