wickes-css2 2.98.0-develop.15 → 2.98.0-develop.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wickes-css2",
-  "version": "2.98.0-develop.15",
+  "version": "2.98.0-develop.16",
   "description": "CSS and JS and page templates in use by Wickes",
   "main": "index.js",
   "scripts": {

package/src/js/components/general/offer-banner.js

@@ -1,16 +1,67 @@
 $(document).ready(function () {
   Wick.OfferBanner = (function () {
     var offerBanner = $('.offer-banner')[0],
-        offer;
+      offer;
 
-    var init = function(){
+    var selectors = [
+      'main > div > div > div:nth-child(1) > div > h1',
+      'main > div.hybris-class > div > h1:nth-child(1)',
+      'main > div.cartMessages',
+      'main div.checkout-header',
+      'main.my-account',
+      'div.new-usp-container',
+      'div.breadcrumbs'
+    ];
+
+    var targetContainers = ['main', 'div.new-usp-container', 'div.breadcrumbs'];
+
+    Wick.applyTopMarginIfBanner = function () {
+      if (!Wick.isTradePro) {
+        return;
+      }
+
+      if (!offerBanner) {
+        return;
+      }
+
+      let bannerHeight = $(offerBanner).outerHeight();
+
+      var containers = new Set();
+      var containersSelector = targetContainers.join(', ');
+
+      selectors.forEach(function (sel) {
+        var elements = $(sel);
+        if (!elements.length) return;
+
+        elements.each(function () {
+          var container = $(this).closest(containersSelector);
+          if (container.length) {
+            containers.add(container[0]);
+          }
+        });
+      });
+
+      var hasBreadcrumbs = Array.from(containers).some(el => $(el).is('div.breadcrumbs'));
+
+      if (hasBreadcrumbs) {
+        containers = new Set(
+          Array.from(containers).filter(el => $(el).is('div.breadcrumbs'))
+        );
+      }
+
+      containers.forEach(function (el) {
+        $(el).css('margin-top', bannerHeight + 'px');
+      });
+    }
+
+    var init = function () {
       offer = new Waypoint.Sticky({
         element: offerBanner
       });
     };
 
-    var toggle = function(){
-      if (offer){
+    var toggle = function () {
+      if (offer) {
         offer.destroy();
         offer = null;
       } else {
@@ -18,21 +69,19 @@ $(document).ready(function () {
       }
     };
 
-    function handleResize(){o
-      if (!offer){
+    function handleResize() {
+      if (!offer) {
         return;
       }
-
       var elHeight = offer.$element.outerHeight(true);
-      if (elHeight !== offer.$wrapper.outerHeight(true)){
+      if (elHeight !== offer.$wrapper.outerHeight(true)) {
         offer.$wrapper.height(elHeight);
       }
-    };
+    }
 
-    var bindEvents = function(){
+    var bindEvents = function () {
       $(window).on('resize', handleResize);
       $(window).on('orientationchange', handleResize);
-
       $(document).on('mobileNav.toggle', toggle);
     };
 
@@ -40,13 +89,11 @@ $(document).ready(function () {
       return;
     }
 
-    //Workaround for sticky banner functionality in IE
+    // Workaround for sticky banner functionality in IE
     function isIE() {
-      ua = navigator.userAgent;
+      var ua = navigator.userAgent;
       /* MSIE used to detect old browsers and Trident used to newer ones*/
-      var is_ie = ua.indexOf("MSIE ") > -1 || ua.indexOf("Trident/") > -1;
-
-      return is_ie;
+      return ua.indexOf("MSIE ") > -1 || ua.indexOf("Trident/") > -1;
     }
 
     if (isIE()) {
@@ -54,6 +101,8 @@ $(document).ready(function () {
       bindEvents();
     }
 
+    Wick.applyTopMarginIfBanner();
+
     return offer;
   })();
 });