https://github.com/ain/smartbanner.js/issues/140

Added one of the few handling cases for pages with fixed nav bar.
vmstukalov · Dec 14, 2023 · 3e8cf12 · 3e8cf12
1 parent 5cc7ea3
commit 3e8cf12
Show file tree

Hide file tree

Showing 3 changed files with 102 additions and 19 deletions.
diff --git a/dist/smartbanner.js b/dist/smartbanner.js
@@ -1,7 +1,3 @@
-/*!
- * smartbanner.js v1.22.0 <https://github.com/ain/smartbanner.js#readme>
- * Copyright © 2023 Ain Tohvri, contributors. Licensed under GPL-3.0.
- */
 (function(){function r(e,n,t){function o(i,f){if(!n[i]){if(!e[i]){var c="function"==typeof require&&require;if(!f&&c)return c(i,!0);if(u)return u(i,!0);var a=new Error("Cannot find module '"+i+"'");throw a.code="MODULE_NOT_FOUND",a}var p=n[i]={exports:{}};e[i][0].call(p.exports,function(r){var n=e[i][1][r];return o(n||r)},p,p.exports,r,e,n,t)}return n[i].exports}for(var u="function"==typeof require&&require,i=0;i<t.length;i++)o(t[i]);return o}return r})()({1:[function(require,module,exports){
 "use strict";
 
@@ -13,8 +9,8 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var Bakery = exports["default"] = /*#__PURE__*/function () {
   function Bakery() {
     _classCallCheck(this, Bakery);
@@ -58,8 +54,8 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var Detector = exports["default"] = /*#__PURE__*/function () {
   function Detector() {
     _classCallCheck(this, Detector);
@@ -124,8 +120,8 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function valid(name) {
   // TODO: validate against options dictionary
   return name.indexOf('smartbanner:') !== -1 && name.split(':')[1].length > 0;
@@ -181,18 +177,20 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
 function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var DEFAULT_PLATFORMS = 'android,ios';
 var DEFAULT_CLOSE_LABEL = 'Close';
 var DEFAULT_BUTTON_LABEL = 'View';
 var datas = {
   originalTop: 'data-smartbanner-original-top',
-  originalMarginTop: 'data-smartbanner-original-margin-top'
+  originalMarginTop: 'data-smartbanner-original-margin-top',
+  smartBannerHeight: 84
 };
 function handleExitClick(event, self) {
   self.exit();
   event.preventDefault();
+  removeFixedMargin();
 }
 function handleClickout(event, self) {
   self.clickout();
@@ -202,6 +200,42 @@ function handleJQueryMobilePageLoad(event) {
     setContentPosition(event.data.height);
   }
 }
+
+/**
+ * https://github.com/ain/smartbanner.js/issues/140
+ * Add fixed margin to top of the page
+ * */
+function addFixedMargin() {
+  var styleEl = document.createElement("STYLE");
+  styleEl.id = "smartbanner_fixed_margin";
+  styleEl.innerHTML = "html{margin-top: ".concat(datas.smartBannerHeight, "px !important;}body{margin-top: ").concat(datas.smartBannerHeight, "px !important;}");
+  document.body.appendChild(styleEl);
+}
+
+/**
+ * https://github.com/ain/smartbanner.js/issues/140
+ * */
+function removeFixedMargin() {
+  var styleEl = document.getElementById("smartbanner_fixed_margin");
+  if (styleEl) {
+    styleEl.remove();
+  }
+  var fixedNavBar = findFixedNavBar();
+  console.log({
+    fixedNavBar: fixedNavBar
+  });
+  console.log("".concat(parseInt(localStorage.getItem("fixedNavBarHeight")), "px"));
+  if (fixedNavBar) {
+    fixedNavBar.style.top = '0px';
+  }
+}
+function findFixedNavBar() {
+  var _window$getComputedSt;
+  var nav = document.querySelector("nav");
+  if (nav && ((_window$getComputedSt = window.getComputedStyle(nav)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.getPropertyValue('position')) === 'fixed') {
+    return nav;
+  }
+}
 function addEventListeners(self) {
   var closeIcon = document.querySelector('.js_smartbanner__exit');
   closeIcon.addEventListener('click', function (event) {
@@ -408,6 +442,11 @@ var SmartBanner = exports["default"] = /*#__PURE__*/function () {
       if (!(this.platformEnabled || this.userAgentIncluded)) {
         return false;
       }
+      var fixedNavBar = findFixedNavBar();
+      if (fixedNavBar) {
+        addFixedMargin(datas.smartBannerHeight);
+        fixedNavBar.style.top = datas.smartBannerHeight + "px";
+      }
       var bannerDiv = document.createElement('div');
       document.querySelector('body').prepend(bannerDiv);
       bannerDiv.outerHTML = this.html;