wickes-css2 2.103.0-IC-977-colors-semantic.1 → 2.103.0-IC-976-pre-commit-lint.1

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "wickes-css2",
-  "version": "2.103.0-IC-977-colors-semantic.1",
+  "version": "2.103.0-IC-976-pre-commit-lint.1",
   "description": "CSS and JS and page templates in use by Wickes",
   "main": "index.js",
   "scripts": {
+    "lint:scss": "sass-lint -v --no-exit --max-warnings=0",
     "lint:fix": "sass-lint-auto-fix",
-    "build": "gulp build"
+    "build": "gulp build",
+    "prepare": "husky install"
   },
   "keywords": [
     "css",
@@ -79,12 +81,14 @@
     "hbsfy": "^2.8.1",
     "helper": "0.0.13",
     "highlight.js": "9.13.0",
+    "husky": "8",
     "jquery": "^3.5.1",
     "jquery.scrollbar": "^0.2.11",
     "js-cookie": "^3.0.1",
     "node-gyp": "^8.0.0",
     "popper.js": "^1.12.9",
     "rebuild": "^0.1.2",
+    "sass-lint": "^1.13.1",
     "simplebar": "^6.2.5",
     "skeleton-screen-css": "^1.1.0",
     "swiper": "^4.1.6",
@@ -108,7 +112,7 @@
     "branches": [
       "alt-master",
       {
-        "name": "custom-tag/IC-977-colors-semantic",
+        "name": "custom-tag/IC-976-pre-commit-lint",
         "prerelease": "${name.replace(/^custom-tag\\//g, '')}"
       }
     ],

package/src/components/card_product_v2.hbs

@@ -19,11 +19,11 @@
                     <div class="product-card__reviews product-card__reviews-v2">
                         <div class="product-rating product-rating-v2">
                             <div class="rating-bg">
-                                    <i class="fa fa-star star-in" aria-hidden="true"></i>
-                                    <i class="fa fa-star star-in" aria-hidden="true"></i>
-                                    <i class="fa fa-star star-in" aria-hidden="true"></i>
-                                    <i class="fa fa-star star-in" aria-hidden="true"></i>
-                                    <i class="fa fa-star star-in" aria-hidden="true"></i>
+                                <i class="fa fa-star star-in" aria-hidden="true"></i>
+                                <i class="fa fa-star star-in" aria-hidden="true"></i>
+                                <i class="fa fa-star star-in" aria-hidden="true"></i>
+                                <i class="fa fa-star star-in" aria-hidden="true"></i>
+                                <i class="fa fa-star star-in" aria-hidden="true"></i>
 
                                 <div class="rating-overlay" data-rating="{{#if review-rating}}{{review-rating}}{{else}}0{{/if}}">
                                     <span class="star-overlay">
@@ -48,6 +48,11 @@
                     </div>
                 {{/if}}
             </div>
+            {{#if isSponsor}}
+              <div class="product-card__sponsored">Sponsored</div>
+            {{else}}
+              <div class="product-card__sponsored product-card__sponsored--empty">&nbsp;</div>
+            {{/if}}
             {{#if switch-vat}}
                 <div class="including-vat product-card__price {{#if sale}} product-card__price_sale {{/if}} {{#if
                         recommended}}product-card__min-height{{/if}}">

package/src/components/card_sponsor_banner.hbs

@@ -0,0 +1,8 @@
+<div class="card-sponsor-banner {{#unless show}}d-none{{/unless}}"
+  {{#if desktop-position}}data-desktop-position="{{desktop-position}}"{{/if}}
+  {{#if mobile-position}}data-mobile-position="{{mobile-position}}"{{/if}}
+>
+  <a class="card-sponsor-banner__link" href="{{href}}">
+    <img class="card-sponsor-banner__image" src="{{src}}" alt="banner">
+  </a>
+</div>

package/src/components/card_sponsor_product.hbs

@@ -0,0 +1,6 @@
+<div class="card-sponsor-product {{#unless show}}d-none{{/unless}}"
+     {{#if desktop-position}}data-desktop-position="{{desktop-position}}"{{/if}}
+  {{#if mobile-position}}data-mobile-position="{{mobile-position}}"{{/if}}
+>
+  {{>card_product_v2}}
+</div>

package/src/components/injected-content.hbs

@@ -10,4 +10,4 @@
             </div>
         {{/if}}
     {{/each}}
-</div>
+</div>

package/src/data/data_search-results_v2.json

@@ -4,25 +4,70 @@
       {
         "src": "https://eu-images.contentstack.com/v3/assets/blt066259863543a0d2/bltf2fa907eeef56dc5/62161f9af3bcce42fe002786/PLP-DecoratingTools-230222.jpg",
         "href": "/sitemap.html",
-        "desktop-position": 3,
-        "mobile-position": 2,
+        "desktop-position": 8,
+        "mobile-position": 7,
         "show": false
+      }
+    ],
+    "sponsor-product": [
+      {
+        "isSponsor": true,
+        "desktop-position": 4,
+        "mobile-position": 3,
+        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
+        "code": "492747",
+        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
+        "descr": "Offer is valid for the same product and size in a single purchase",
+        "reviews": "0",
+        "review-rating": "4.3",
+        "price": "<span class='product-card__price-value-text'>From</span> £99,009.00",
+        "perSQM": "£1,444.00",
+        "recommended": false,
+        "badge-text": "new",
+        "badge-color": "green",
+        "badge-text-color": "gray"
       },
       {
-        "src": "https://eu-images.contentstack.com/v3/assets/blt066259863543a0d2/bltf2fa907eeef56dc5/62161f9af3bcce42fe002786/PLP-DecoratingTools-230222.jpg",
-        "href": "/sitemap.html",
+        "isSponsor": true,
+        "desktop-position": 5,
+        "mobile-position": 4,
+        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
+        "code": "492747",
+        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
+        "descr": "Offer is valid for the same product and size in a single purchase",
+        "reviews": "0",
+        "review-rating": "4.3",
+        "price": "<span class='product-card__price-value-text'>From</span> £99,009.00",
+        "perSQM": "£1,444.00",
+        "recommended": false,
+        "badge-text": "new",
+        "badge-color": "green",
+        "badge-text-color": "gray"
+      },
+      {
+        "isSponsor": true,
         "desktop-position": 7,
         "mobile-position": 5,
-        "required-amount-desktop": 6,
-        "required-amount-mobile": 4,
-        "show": false
-      },
+        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
+        "code": "721657",
+        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
+        "descr": "Offer is valid for the same product and size in a single purchase",
+        "reviews": "21",
+        "review-rating": "4.4",
+        "price": "£2,009.00",
+        "SQM": "£1,555.00",
+        "click-collect-only": true,
+        "badge-text": "Clearance",
+        "badge-color": "yellow",
+        "badge-text-color": "white"
+      }
+    ],
+    "sponsor-banner": [
       {
         "src": "https://eu-images.contentstack.com/v3/assets/blt066259863543a0d2/bltf2fa907eeef56dc5/62161f9af3bcce42fe002786/PLP-DecoratingTools-230222.jpg",
         "href": "/sitemap.html",
-        "required-amount-desktop": 11,
-        "required-amount-mobile": 9,
-        "show": false
+        "desktop-position": 6,
+        "mobile-position": 8
       }
     ],
     "products": [
@@ -196,136 +241,6 @@
         "recommended": false,
         "new": true,
         "new-range": true
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "737934",
-        "src": "./img/placeholders/map-2.png",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "price": "£2,009.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker - Black with Chrome Trim ",
-        "code": "247767",
-        "src": "./img/placeholders/map-2.png",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "price": "£2,009.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "978004",
-        "src": "./img/placeholders/map-2.png",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "price": "£2,009.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "523586",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "perSQM": "£1,444.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "729112",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "price": "£2,315.00",
-        "recommended": false
-      },
-      {
-        "sale": {
-          "discount": "15% off",
-          "price": "£2,315.00"
-        },
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "279966",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "813053",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "SQM": "£1,555.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "655972",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "757775",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "276523",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "334333",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "597258",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Alder-Trainer-7~GPID_1100568095_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "806538",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-        "perSQM": "£1,444.00",
-        "recommended": false
-      },
-      {
-        "title": "Rangemaster Classic Deluxe 90 Ceramic Range Cooker",
-        "code": "276521",
-        "src": "https://media.wickes.co.uk/is/image/wickes/normal/Footwear-Tough-Grit-Oak-Boot-7~GPID_1100568107_00",
-        "descr": "Offer is valid for the same product and size in a single purchase",
-        "reviews": "0",
-
-        "recommended": false
       }
     ]
   }

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

@@ -0,0 +1,258 @@
+var Wick = Wick || {};
+Wick.BannerPlacementManager = {
+  SPONSOR_BANNERS_DISPLAYED_EVENT: 'sponsorAdsDisplayedEvent',
+  el: {
+    banners: '.card-product-banner',
+    sponsorBanners: '.card-sponsor-banner',
+    sponsorProducts: '.card-sponsor-product',
+    allBanners: '.card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productCard: '.product-card',
+    allListSlots: '.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product',
+    productsWrap: '.products-list-v2',
+    $products: $('.product-card'),
+    attrPositionDesktop: 'data-desktop-position',
+    attrPositionMobile: 'data-mobile-position',
+    attrRequiredAmountDesktop: 'data-required-amount-desktop',
+    attrRequiredAmountMobile: 'data-required-amount-mobile',
+    hide: 'd-none',
+    sponsoredAdvBanners: '.sponsored-ad'
+  },
+  classes: {
+    sponsorBanners: 'card-sponsor-banner',
+    sponsorProducts: 'card-sponsor-product',
+    productBanners: 'card-product-banner',
+    bannerInactiveClass: 'card-product-banner--inactive'
+  },
+  isEventSent: false,
+  currentBreakpoint: null,
+  checkProductsInColumn() {
+    Wick.BannerPlacementManager.addInactiveClasses();
+    Wick.BannerPlacementManager.arrangeBannersInRightOrder();
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+    const totalProducts = Wick.BannerPlacementManager.getListLength();
+    const totalSlots = totalProducts + $allBanners.length;
+    $allBanners.each((index, banner) => {
+      const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+      if ($(banner).hasClass('card-product-banner')) {
+        if (bannerPosition > totalSlots) {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+        if (bannerPosition > totalProducts) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+          return;
+        }
+      }
+
+      Wick.BannerPlacementManager.hideBannerDueLimit(banner, index);
+      Wick.BannerPlacementManager.moveBannerToSpecifiedPosition(banner);
+    });
+  },
+  moveBannerToSpecifiedPosition(banner) {
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner) - 2;
+    const listSlotsLength = $listSlots.length;
+
+    if (Wick.BannerPlacementManager.isBannerVisible(banner)) {
+      if (bannerPosition <= listSlotsLength) {
+        if ($listSlots[bannerPosition]) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          Wick.BannerPlacementManager.moveBanner(banner, $listSlots[bannerPosition]);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+          Wick.BannerPlacementManager.coverEdgeCases(banner);
+        }
+      } else {
+        if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners) || $(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+          Wick.BannerPlacementManager.showBanner(banner);
+          Wick.BannerPlacementManager.removeInactiveClass(banner);
+          $(Wick.BannerPlacementManager.el.productsWrap).append(banner);
+        } else {
+          Wick.BannerPlacementManager.hideBanner(banner);
+        }
+      }
+    }
+  },
+  moveBanner(banner, targetElement) {
+    $(banner).remove();
+    $(targetElement).after(banner);
+  },
+  hideBanner(banner) {
+    $(banner).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  showBanner(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.el.hide);
+  },
+  isBannerVisible(banner) {
+    return !$(banner).hasClass(Wick.BannerPlacementManager.el.hide);
+  },
+  hideBannerDueLimit(banner) {
+    const bannerMinLimit = Wick.BannerPlacementManager.getBannerLimit(banner) - 1;
+    const $listSlots = Wick.BannerPlacementManager.getListSlots();
+    const listProductsLength = $listSlots.length;
+    Wick.BannerPlacementManager.showBanner(banner);
+
+    if (bannerMinLimit > listProductsLength) {
+      Wick.BannerPlacementManager.hideBanner(banner);
+    }
+  },
+  getBannerPosition(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+    const positionAttribute = isMobile
+      ?  Wick.BannerPlacementManager.el.attrPositionMobile
+      : Wick.BannerPlacementManager.el.attrPositionDesktop
+
+    return banner.hasAttribute(positionAttribute)
+      ? Number(banner.getAttribute(positionAttribute))
+      : Number(Wick.BannerPlacementManager.getListLength() + Wick.BannerPlacementManager.getBannersAmount());
+  },
+  getBannerLimit(banner) {
+    const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+
+    const limitAttribute = isMobile
+      ? Wick.BannerPlacementManager.el.attrRequiredAmountMobile
+      : Wick.BannerPlacementManager.el.attrRequiredAmountDesktop;
+
+    return banner.hasAttribute(limitAttribute)
+      ? Number(banner.getAttribute(limitAttribute))
+      : 0;
+  },
+  isMobileResolution() {
+    return Wick.Responsive.getCurrentBreakpoint() !== 'up-lg';
+  },
+  getListLength() {
+    const $listItems = $(Wick.BannerPlacementManager.el.productsWrap).children(Wick.BannerPlacementManager.el.productCard);
+    return $listItems.length;
+  },
+  getBannersAmount() {
+    return $(Wick.BannerPlacementManager.el.allBanners).length;
+  },
+  getProductsAmount() {
+    return Wick.BannerPlacementManager.el.$products.length;
+  },
+  arrangeBannersInRightOrder() {
+    const $allBanners = $(Wick.BannerPlacementManager.el.allBanners);
+
+    const sponsorProducts = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)
+    );
+    const sponsorBanners = $allBanners.filter((i, el) =>
+      $(el).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)
+    );
+
+    const firstSponsorProductPos = sponsorProducts.length > 0
+      ? Math.min(...sponsorProducts.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+    const firstSponsorBannerPos = sponsorBanners.length > 0
+      ? Math.min(...sponsorBanners.map((i, el) => Wick.BannerPlacementManager.getBannerPosition(el)).get())
+      : Infinity;
+
+    let groupOrder;
+    if (firstSponsorProductPos < firstSponsorBannerPos) {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    } else {
+      groupOrder = [
+        Wick.BannerPlacementManager.classes.sponsorBanners,
+        Wick.BannerPlacementManager.classes.sponsorProducts,
+        Wick.BannerPlacementManager.classes.productBanners
+      ];
+    }
+
+    $allBanners.sort((a, b) => {
+      function getGroupIndex(el) {
+        if ($(el).hasClass(groupOrder[0])) return 0;
+        if ($(el).hasClass(groupOrder[1])) return 1;
+        if ($(el).hasClass(groupOrder[2])) return 2;
+        return 3;
+      }
+
+      const groupA = getGroupIndex(a);
+      const groupB = getGroupIndex(b);
+
+      if (groupA !== groupB) {
+        return groupA - groupB;
+      }
+
+      const positionA = Wick.BannerPlacementManager.getBannerPosition(a);
+      const positionB = Wick.BannerPlacementManager.getBannerPosition(b);
+
+      return positionA - positionB;
+    }).appendTo(Wick.BannerPlacementManager.el.productsWrap);
+  },
+  addInactiveClasses() {
+    $(Wick.BannerPlacementManager.el.allBanners).addClass(Wick.BannerPlacementManager.el.hide);
+  },
+  removeInactiveClass(banner) {
+    $(banner).removeClass(Wick.BannerPlacementManager.classes.bannerInactiveClass)
+  },
+  insertFirstBanner(banner) {
+    const bannerPosition = Wick.BannerPlacementManager.getBannerPosition(banner);
+
+    if (bannerPosition === 1) {
+      Wick.BannerPlacementManager.showBanner(banner);
+      Wick.BannerPlacementManager.removeInactiveClass(banner);
+      $(banner).remove();
+      $(Wick.BannerPlacementManager.el.productsWrap).prepend(banner);
+    }
+  },
+  coverEdgeCases(banner) {
+    Wick.BannerPlacementManager.insertFirstBanner(banner);
+  },
+  getListSlots() {
+    return $(Wick.BannerPlacementManager.el.productsWrap)
+      .children(Wick.BannerPlacementManager.el.allListSlots);
+  },
+  getBannerPriority(banner) {
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorProducts)) {
+      return 1;
+    }
+    if ($(banner).hasClass(Wick.BannerPlacementManager.classes.sponsorBanners)) {
+      return 2;
+    }
+    return 3;
+  },
+  dispatchSponsorAdsDisplayedEvent() {
+    return new Promise((resolve, reject) => {
+      const eventDetail = { resolve, reject };
+      const sponsorAdsEvent = createEvent(Wick.BannerPlacementManager.SPONSOR_BANNERS_DISPLAYED_EVENT, { displayed: true }, eventDetail);
+      window.dispatchEvent(sponsorAdsEvent);
+    });
+  },
+  init() {
+    Wick.Responsive.onResize(function () {
+      if(Wick.BannerPlacementManager.currentBreakpoint !== Wick.Responsive.getCurrentBreakpoint()) {
+        Wick.BannerPlacementManager.currentBreakpoint = Wick.Responsive.getCurrentBreakpoint()
+        Wick.BannerPlacementManager.checkProductsInColumn();
+
+        if (
+          !Wick.BannerPlacementManager.isEventSent && $(Wick.BannerPlacementManager.el.sponsoredAdvBanners).length
+        ) {
+          Wick.BannerPlacementManager.dispatchSponsorAdsDisplayedEvent();
+          Wick.BannerPlacementManager.isEventSent = true;
+        }
+
+        $(window).trigger('productBannerPositionChanged');
+      }
+    });
+  }
+};
+
+$(document).ready(function () {
+  if (!Wick.BannerPlacementManager.getBannersAmount() || !Wick.BannerPlacementManager.getProductsAmount()) {
+    return;
+  }
+
+  Wick.BannerPlacementManager.init();
+})

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

@@ -0,0 +1,53 @@
+// Simulate prompt for input
+function getInputs() {
+  const productBannerPositions = prompt("Enter Product Banner Positions:", "2") || "";
+  const sponsorProductPositions = prompt("Enter Sponsor Product Positions (comma-separated):", "6,7,8") || "";
+  const sponsorBannerPositions = prompt("Enter Sponsor Banner Positions:", "10") || "";
+
+  return {
+    productBannerPositions: productBannerPositions ? productBannerPositions.split(",").map(Number) : [],
+    sponsorProductPositions: sponsorProductPositions ? sponsorProductPositions.split(",").map(Number) : [],
+    sponsorBannerPositions: sponsorBannerPositions ? sponsorBannerPositions.split(",").map(Number) : [],
+  };
+}
+
+function getPositionAttr() {
+  const isMobile = Wick.BannerPlacementManager.isMobileResolution();
+  return isMobile
+    ? 'data-mobile-position'
+    : 'data-desktop-position';
+}
+
+function updatePositions(inputs) {
+  const productBannerElements = document.querySelectorAll(".card-product-banner");
+  productBannerElements.forEach((el, index) => {
+    if (inputs.productBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.productBannerPositions[index]);
+    }
+  });
+
+  const sponsorProductElements = document.querySelectorAll(".card-sponsor-product");
+  sponsorProductElements.forEach((el, index) => {
+    if (inputs.sponsorProductPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorProductPositions[index]);
+    }
+  });
+
+  const sponsorBannerElements = document.querySelectorAll(".card-sponsor-banner");
+  sponsorBannerElements.forEach((el, index) => {
+    if (inputs.sponsorBannerPositions[index] !== undefined) {
+      el.setAttribute(getPositionAttr(), inputs.sponsorBannerPositions[index]);
+    }
+  });
+}
+
+function init() {
+  const inputs = getInputs();
+  updatePositions(inputs);
+}
+
+$(document).ready(function () {
+  if ($('.retail-media .products-list.products-list-v2').length) {
+    setTimeout(() => init(), 100)
+  }
+});

package/src/js/page/plp-cards-v2.js

@@ -6,7 +6,9 @@ $(document).ready(function () {
     }
 
     function cardsContent(itemsInRow) {
-        let card = $('.content .product-card, .content .card-product-banner');
+        let card = $('.content .product-card, .content .card-product-banner, .content .card-sponsor-banner, .content .card-sponsor-product').filter(function() {
+            return $(this).parents('.product-card, .card-product-banner, .card-sponsor-banner, .card-sponsor-product').length === 0;
+        });
         let priceSelectors = [
             '.including-vat .product-card__price__old-price',
             '.excluding-vat .product-card__price__old-price',
@@ -17,6 +19,7 @@ $(document).ready(function () {
         revealAll(card, ['.product-card__price__old-price',
                                     '.product-card__price-sqm',
                                     '.product-card__price-value',
+                                    '.product-card__sponsored',
                                     '.energy-efficiency',
                                     '.energy-efficiency__link']);
 
@@ -33,6 +36,8 @@ $(document).ready(function () {
                 hideEmptiness(currentRow, '.product-card__price-sqm');
             }
             hideEmptiness(currentRow, '.product-card__price-value');
+            hideEmptiness(currentRow, '.product-card__sponsored');
+            hideEmptiness(currentRow, '.product-card__price__old-price');
             hideEmptiness(currentRow, '.energy-efficiency');
             hideEmptiness(currentRow, '.energy-efficiency__link');
 
@@ -43,11 +48,15 @@ $(document).ready(function () {
     function hideEmptiness(query, className) {
         let currentQuery = query.find(className);
         let rowContent = currentQuery.text();
-
-        if (className === '.energy-efficiency') {
-            let isEnergyQueryEmpty = isClassPresentInQuery(currentQuery, "energy-efficiency--empty");
-
-            if (isEnergyQueryEmpty) {
+        const classEmptyCheckMap = {
+            '.energy-efficiency': 'energy-efficiency--empty',
+            '.product-card__sponsored': 'product-card__sponsored--empty',
+            '.product-card__price__old-price': 'product-card__price_empty'
+        };
+
+        if (classEmptyCheckMap[className]) {
+            let isClassEmpty = isClassPresentInQuery(currentQuery, classEmptyCheckMap[className]);
+            if (isClassEmpty) {
                 currentQuery.hide();
             }
             return;