@mjhls/mjh-framework 1.0.293 → 1.0.295

package/README.md

@@ -1,5 +1,5 @@
 
-# mjh-framework v. 1.0.293
+# mjh-framework v. 1.0.295
 
 > Foundation Framework
 

package/dist/cjs/ADInfeed-824fcfb6.js

@@ -0,0 +1,54 @@
+'use strict';
+
+function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
+
+var React = require('react');
+var React__default = _interopDefault(React);
+var Card = _interopDefault(require('react-bootstrap/Card'));
+var AdSlot = require('./AdSlot-405b39eb.js');
+
+var ADInfeed = function ADInfeed(_ref) {
+  var index = _ref.index,
+      infeedAd = _ref.infeedAd;
+  var className = infeedAd.className,
+      slotId = infeedAd.slotId,
+      adUnit = infeedAd.adUnit,
+      _infeedAd$targeting = infeedAd.targeting,
+      targeting = _infeedAd$targeting === undefined ? {} : _infeedAd$targeting,
+      networkID = infeedAd.networkID,
+      sizes = infeedAd.sizes;
+
+
+  var collapseAd = function collapseAd() {
+    var parent = document.getElementById('brand-insight-wrapper-' + (index + 1));
+    parent.style.height = '0%';
+    parent.style.width = '0%';
+    parent.style.display = 'none';
+  };
+
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('brand-insight-wrapper-' + (index + 1));
+      parent.style.display = 'flex';
+    } else {
+      collapseAd();
+    }
+  };
+
+  return React__default.createElement(
+    'div',
+    { id: 'brand-insight-wrapper-' + (index + 1), className: 'brand-insight-wrapper', style: { display: 'none', flex: '1 0 auto' } },
+    React__default.createElement(
+      Card,
+      { className: 'ad-wrapper', style: { display: 'block !important', flexDirection: index === 0 || index % 4 === 0 ? 'top' : 'row' } },
+      React__default.createElement(AdSlot.DFPAdSlot, { className: className, networkID: networkID, adUnit: adUnit, slotId: slotId, targeting: targeting, sizes: sizes, checkIsAdFound: checkIsAdFound })
+    ),
+    React__default.createElement(
+      'style',
+      { jsx: 'true' },
+      ''
+    )
+  );
+};
+
+exports.ADInfeed = ADInfeed;

package/dist/cjs/{AdSlot-0cd6f861.js → AdSlot-405b39eb.js}

@@ -1085,7 +1085,7 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
       targeting = _ref$targeting === undefined ? {} : _ref$targeting,
       _ref$refreshFlag = _ref.refreshFlag,
       refreshFlag = _ref$refreshFlag === undefined ? true : _ref$refreshFlag,
-      setShowAd = _ref.setShowAd;
+      checkIsAdFound = _ref.checkIsAdFound;
 
   var _useState = React.useState(false),
       _useState2 = slicedToArray._slicedToArray(_useState, 2),
@@ -1122,13 +1122,14 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
       sizeMapping: sizeMapping,
       targetingArguments: targeting,
       onSlotRender: function onSlotRender(eventData) {
-        if (eventData && eventData.slotId && ['floating-ad', 'infeed', 'welcome-ad'].includes(eventData.slotId)) {
+        if (eventData && eventData.slotId && eventData.slotId === slotId && checkIsAdFound) {
           if (eventData.event && eventData.event.creativeId == null) {
-            setShowAd(false);
+            checkIsAdFound(false);
           } else {
-            setShowAd(true);
+            checkIsAdFound(true);
           }
         }
+
         setAdRendered(true);
         if (eventData && eventData.event) {
           var cID = eventData.event.creativeId;

package/dist/cjs/DeckContent.js

@@ -27,9 +27,9 @@ var index = require('./index-39beccb3.js');
 var index$1 = require('./index-fa0fb52c.js');
 var entities = require('./entities-310b46ee.js');
 require('./slicedToArray-e38fb29d.js');
-require('./AdSlot-0cd6f861.js');
+require('./AdSlot-405b39eb.js');
 require('./promise-2c453658.js');
-var ADInfeed = require('./ADInfeed-db54195d.js');
+var ADInfeed = require('./ADInfeed-824fcfb6.js');
 
 var DeckContent = function (_React$Component) {
   inherits$2._inherits(DeckContent, _React$Component);

package/dist/cjs/{GridContent-02acbd72.js → GridContent-929798bf.js}

@@ -20,7 +20,7 @@ var Router__default = _interopDefault(Router);
 var index = require('./index-39beccb3.js');
 var index$1 = require('./index-fa0fb52c.js');
 var entities = require('./entities-310b46ee.js');
-var ADInfeed = require('./ADInfeed-db54195d.js');
+var ADInfeed = require('./ADInfeed-824fcfb6.js');
 var get$1 = require('./get-de2660c3.js');
 
 var Dfp = React__default.lazy(function () {

package/dist/cjs/GridContent.js

@@ -23,11 +23,11 @@ require('./index-39beccb3.js');
 require('./index-fa0fb52c.js');
 require('./entities-310b46ee.js');
 require('./slicedToArray-e38fb29d.js');
-require('./AdSlot-0cd6f861.js');
+require('./AdSlot-405b39eb.js');
 require('./promise-2c453658.js');
-require('./ADInfeed-db54195d.js');
+require('./ADInfeed-824fcfb6.js');
 require('./get-de2660c3.js');
-var GridContent = require('./GridContent-02acbd72.js');
+var GridContent = require('./GridContent-929798bf.js');
 
 
 

package/dist/cjs/{Normal-c6ad2f0a.js → Normal-d3a56ac1.js}

@@ -10,7 +10,7 @@ var Row = _interopDefault(require('react-bootstrap/Row'));
 var Col = _interopDefault(require('react-bootstrap/Col'));
 var Link = _interopDefault(require('next/link'));
 var slicedToArray = require('./slicedToArray-e38fb29d.js');
-var AdSlot = require('./AdSlot-0cd6f861.js');
+var AdSlot = require('./AdSlot-405b39eb.js');
 var get$1 = require('./get-de2660c3.js');
 var reactSocialIcons = require('./react-social-icons-cd0d9d3b.js');
 var reactBootstrap = require('react-bootstrap');

package/dist/cjs/QueueDeckExpanded.js

@@ -23,9 +23,9 @@ var index = require('./index-39beccb3.js');
 var index$1 = require('./index-fa0fb52c.js');
 var entities = require('./entities-310b46ee.js');
 var slicedToArray = require('./slicedToArray-e38fb29d.js');
-require('./AdSlot-0cd6f861.js');
+require('./AdSlot-405b39eb.js');
 require('./promise-2c453658.js');
-var ADInfeed = require('./ADInfeed-db54195d.js');
+var ADInfeed = require('./ADInfeed-824fcfb6.js');
 var reactBootstrap = require('react-bootstrap');
 
 var urlFor = function urlFor(source, builder) {

package/dist/cjs/TemplateNormal.js

@@ -13,14 +13,14 @@ require('react-bootstrap/Row');
 require('react-bootstrap/Col');
 require('next/link');
 require('./slicedToArray-e38fb29d.js');
-require('./AdSlot-0cd6f861.js');
+require('./AdSlot-405b39eb.js');
 require('./promise-2c453658.js');
 require('./get-de2660c3.js');
 require('./react-social-icons-cd0d9d3b.js');
 require('react-bootstrap');
 require('./index.esm-340d3792.js');
 require('react-bootstrap/Button');
-var TemplateNormal = require('./Normal-c6ad2f0a.js');
+var TemplateNormal = require('./Normal-d3a56ac1.js');
 require('react-bootstrap/ListGroup');
 require('next/head');
 require('react-bootstrap/Nav');

package/dist/cjs/VideoSeriesListing.js

@@ -66,8 +66,8 @@ var VideoSeriesListing = function (_React$Component) {
           query = _this$state.query,
           page = _this$state.page;
       var client = _this.props.client;
+      //this.changePageNumber(page)
 
-      _this.changePageNumber(page);
       var params = _extends$2._extends({}, _this.params, { from: from, to: to
         // const queryUpdated = query.replace('$from', params.from).replace('$to', params.to)
         // const query = '*[_type == "article" && defined(title) && defined(thumbnail)][$from...$to] { title, summary, thumbnail { asset-> }, url }'
@@ -221,22 +221,24 @@ var VideoSeriesListing = function (_React$Component) {
 
       return React__default.createElement(
         visibilitySensor.InfiniteScroll,
-        { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.9 },
+        { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.8 },
         React__default.createElement(
           Container,
           null,
           this.state.data && this.state.data.map(function (series, index) {
-            var page = series[0].pageNumber !== 1 ? series[0].pageNumber : index + 1;
+            var page = series[0].pageNumber !== 1 ? series[0].pageNumber : 1;
 
             return React__default.createElement(
-              visibilitySensor.VisibilitySensor,
-              {
-                partialVisibility: true,
-                offset: { bottom: 400, top: 200 },
-                key: index,
-                onChange: function onChange(isVisible) {
-                  isVisible && _this2.changePageNumber(page);
-                } },
+              React__default.Fragment,
+              { key: index },
+              React__default.createElement(
+                visibilitySensor.VisibilitySensor,
+                {
+                  onChange: function onChange(isVisible) {
+                    isVisible && _this2.changePageNumber(page);
+                  } },
+                React__default.createElement('div', { className: 'visibility-sensor', style: { minHeight: '.25rem' } })
+              ),
               React__default.createElement(
                 'div',
                 null,

package/dist/cjs/index.js

@@ -29,12 +29,12 @@ var index = require('./index-39beccb3.js');
 require('./index-fa0fb52c.js');
 var entities = require('./entities-310b46ee.js');
 var slicedToArray = require('./slicedToArray-e38fb29d.js');
-var AdSlot = require('./AdSlot-0cd6f861.js');
+var AdSlot = require('./AdSlot-405b39eb.js');
 require('./promise-2c453658.js');
-require('./ADInfeed-db54195d.js');
+require('./ADInfeed-824fcfb6.js');
 var DeckContent = require('./DeckContent.js');
 var get$1 = require('./get-de2660c3.js');
-var GridContent = require('./GridContent-02acbd72.js');
+var GridContent = require('./GridContent-929798bf.js');
 var DeckQueue = require('./DeckQueue.js');
 require('react-bootstrap/Media');
 var ThumbnailCard = require('./ThumbnailCard.js');
@@ -53,7 +53,7 @@ var IssueDeck = require('./IssueDeck.js');
 require('react-bootstrap/Badge');
 var IssueContentDeck = require('./IssueContentDeck.js');
 var Spinner = _interopDefault(require('react-bootstrap/Spinner'));
-var TemplateNormal = require('./Normal-c6ad2f0a.js');
+var TemplateNormal = require('./Normal-d3a56ac1.js');
 require('react-bootstrap/ListGroup');
 var Head = _interopDefault(require('next/head'));
 var Accordion = _interopDefault(require('react-bootstrap/Accordion'));
@@ -2921,7 +2921,6 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
       _floatingAd$sizes = floatingAd.sizes,
       sizes = _floatingAd$sizes === undefined ? [[728, 90]] : _floatingAd$sizes;
 
-
   var adTargeting = {
     content_placement: targeting.content_placement,
     tags: targeting.tags,
@@ -2931,15 +2930,10 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     campaign_id: targeting.campaign_id
   };
 
-  var _useState = React.useState(false),
+  var _useState = React.useState(true),
       _useState2 = slicedToArray._slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
-
-  var _useState3 = React.useState(true),
-      _useState4 = slicedToArray._slicedToArray(_useState3, 2),
-      widthFlag = _useState4[0],
-      setWidthFlag = _useState4[1];
+      widthFlag = _useState2[0],
+      setWidthFlag = _useState2[1];
 
   React.useEffect(function () {
     if (window && window.innerWidth < minScreenWidth) {
@@ -2947,17 +2941,42 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     }
   }, [minScreenWidth]);
 
+  var collapseAd = function collapseAd() {
+    var parent = document.getElementById('floating-ad-wrapper');
+    parent.style.height = '0%';
+    parent.style.width = '0%';
+    parent.style.display = 'none';
+  };
+
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('floating-ad-wrapper');
+      parent.style.display = 'block';
+    } else {
+      collapseAd();
+    }
+  };
+
   return React__default.createElement(
     React__default.Fragment,
     null,
-    showAd && widthFlag && React__default.createElement(
+    widthFlag && React__default.createElement(
       'div',
-      { className: 'floating-ad-wrapper ' + title },
-      React__default.createElement(AdSlot.DFPAdSlot, { className: className, slotId: slotId, networkID: networkID, sizes: sizes, adUnit: adUnit, targeting: adTargeting, refreshFlag: false, setShowAd: setShowAd }),
+      { id: 'floating-ad-wrapper', className: 'floating-ad-wrapper ' + title },
+      React__default.createElement(AdSlot.DFPAdSlot, {
+        className: className,
+        slotId: slotId,
+        networkID: networkID,
+        sizes: sizes,
+        adUnit: adUnit,
+        targeting: adTargeting,
+        refreshFlag: false,
+        checkIsAdFound: checkIsAdFound
+      }),
       React__default.createElement(
         'div',
         { className: 'closeButton', onClick: function onClick() {
-            return setShowAd(false);
+            return collapseAd();
           } },
         'x'
       )
@@ -2965,7 +2984,7 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n          .floating-ad-wrapper {\n            width: auto;\n            margin: 0;\n            background-color: #f5f5f5;\n            position: fixed;\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            z-index: 9000;\n          }\n          .closeButton {\n            position: absolute;\n            top: -10px;\n            right: -10px;\n            background: grey;\n            color: white;\n            font-weight: 500;\n            border: 2px solid white;\n            border-radius: 50%;\n            width: 30px;\n            height: 30px;\n            text-align: center;\n            font-size: 17px;\n            cursor: pointer;\n          }\n        '
+      '\n          .floating-ad-wrapper {\n            width: auto;\n            margin: 0;\n            background-color: #f5f5f5;\n            position: fixed;\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            z-index: 9000;\n            display: none;\n          }\n          .closeButton {\n            position: absolute;\n            top: -10px;\n            right: -10px;\n            background: grey;\n            color: white;\n            font-weight: 500;\n            border: 2px solid white;\n            border-radius: 50%;\n            width: 30px;\n            height: 30px;\n            text-align: center;\n            font-size: 17px;\n            cursor: pointer;\n          }\n        '
     )
   );
 };
@@ -3051,21 +3070,15 @@ var ADWelcome = function ADWelcome(_ref) {
     pos: position,
     campaign_id: targeting.campaign_id
   };
-  var adRef = React.useRef(null);
-
-  var _useState = React.useState(),
-      _useState2 = slicedToArray._slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
 
   var calculateTimeLeft = function calculateTimeLeft(timeLeft) {
     return --timeLeft;
   };
 
-  var _useState3 = React.useState(calculateTimeLeft(counter + 1)),
-      _useState4 = slicedToArray._slicedToArray(_useState3, 2),
-      timeLeft = _useState4[0],
-      setTimeLeft = _useState4[1];
+  var _useState = React.useState(calculateTimeLeft(counter + 1)),
+      _useState2 = slicedToArray._slicedToArray(_useState, 2),
+      timeLeft = _useState2[0],
+      setTimeLeft = _useState2[1];
 
   React.useEffect(function () {
     if (timeLeft > 0) {
@@ -3077,17 +3090,18 @@ var ADWelcome = function ADWelcome(_ref) {
     }
   });
 
-  React.useEffect(function () {
-    if (typeof showAd !== 'undefined' && showAd) {
-      adRef.current.style.opacity = '1';
-    } else if (typeof showAd !== 'undefined' && !showAd) {
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('welcome-modal');
+      parent.style.display = 'block';
+    } else {
       setFlag(true);
     }
-  }, [showAd]);
+  };
 
   return React__default.createElement(
     'div',
-    { ref: adRef, style: { outline: 'none', opacity: 0 }, className: 'welcome-modal' },
+    { style: { outline: 'none', display: 'none' }, className: 'welcome-modal', id: 'welcome-modal' },
     React__default.createElement(
       'div',
       { className: 'right-top', style: { position: 'absolute', top: 0, right: 0, textAlign: 'center', margin: '2rem' } },
@@ -3124,7 +3138,16 @@ var ADWelcome = function ADWelcome(_ref) {
     React__default.createElement(
       'div',
       { className: title, style: { position: 'relative', width: '300px', height: '250px', margin: 'auto', top: '10rem' } },
-      React__default.createElement(AdSlot.DFPAdSlot, { className: className, slotId: slotId, networkID: networkID, sizes: sizes, adUnit: adUnit, targeting: adTargeting, refreshFlag: false, setShowAd: setShowAd })
+      React__default.createElement(AdSlot.DFPAdSlot, {
+        className: className,
+        slotId: slotId,
+        networkID: networkID,
+        sizes: sizes,
+        adUnit: adUnit,
+        targeting: adTargeting,
+        refreshFlag: false,
+        checkIsAdFound: checkIsAdFound
+      })
     ),
     React__default.createElement(
       'style',

package/dist/esm/ADInfeed-a1d8cb44.js

@@ -0,0 +1,49 @@
+import React__default from 'react';
+import Card from 'react-bootstrap/Card';
+import { D as DFPAdSlot } from './AdSlot-b4f04c96.js';
+
+var ADInfeed = function ADInfeed(_ref) {
+  var index = _ref.index,
+      infeedAd = _ref.infeedAd;
+  var className = infeedAd.className,
+      slotId = infeedAd.slotId,
+      adUnit = infeedAd.adUnit,
+      _infeedAd$targeting = infeedAd.targeting,
+      targeting = _infeedAd$targeting === undefined ? {} : _infeedAd$targeting,
+      networkID = infeedAd.networkID,
+      sizes = infeedAd.sizes;
+
+
+  var collapseAd = function collapseAd() {
+    var parent = document.getElementById('brand-insight-wrapper-' + (index + 1));
+    parent.style.height = '0%';
+    parent.style.width = '0%';
+    parent.style.display = 'none';
+  };
+
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('brand-insight-wrapper-' + (index + 1));
+      parent.style.display = 'flex';
+    } else {
+      collapseAd();
+    }
+  };
+
+  return React__default.createElement(
+    'div',
+    { id: 'brand-insight-wrapper-' + (index + 1), className: 'brand-insight-wrapper', style: { display: 'none', flex: '1 0 auto' } },
+    React__default.createElement(
+      Card,
+      { className: 'ad-wrapper', style: { display: 'block !important', flexDirection: index === 0 || index % 4 === 0 ? 'top' : 'row' } },
+      React__default.createElement(DFPAdSlot, { className: className, networkID: networkID, adUnit: adUnit, slotId: slotId, targeting: targeting, sizes: sizes, checkIsAdFound: checkIsAdFound })
+    ),
+    React__default.createElement(
+      'style',
+      { jsx: 'true' },
+      ''
+    )
+  );
+};
+
+export { ADInfeed as A };

package/dist/esm/{AdSlot-03043ffb.js → AdSlot-b4f04c96.js}

@@ -1080,7 +1080,7 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
       targeting = _ref$targeting === undefined ? {} : _ref$targeting,
       _ref$refreshFlag = _ref.refreshFlag,
       refreshFlag = _ref$refreshFlag === undefined ? true : _ref$refreshFlag,
-      setShowAd = _ref.setShowAd;
+      checkIsAdFound = _ref.checkIsAdFound;
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -1117,13 +1117,14 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
       sizeMapping: sizeMapping,
       targetingArguments: targeting,
       onSlotRender: function onSlotRender(eventData) {
-        if (eventData && eventData.slotId && ['floating-ad', 'infeed', 'welcome-ad'].includes(eventData.slotId)) {
+        if (eventData && eventData.slotId && eventData.slotId === slotId && checkIsAdFound) {
           if (eventData.event && eventData.event.creativeId == null) {
-            setShowAd(false);
+            checkIsAdFound(false);
           } else {
-            setShowAd(true);
+            checkIsAdFound(true);
           }
         }
+
         setAdRendered(true);
         if (eventData && eventData.event) {
           var cID = eventData.event.creativeId;

package/dist/esm/DeckContent.js

@@ -21,9 +21,9 @@ import { i as imageUrlBuilder } from './index-3849e3fe.js';
 import { L as LazyLoad } from './index-5f9f807a.js';
 import { c as clean_html_1 } from './entities-7cc3bf45.js';
 import './slicedToArray-d0a9593a.js';
-import './AdSlot-03043ffb.js';
+import './AdSlot-b4f04c96.js';
 import './promise-e3480f1c.js';
-import { A as ADInfeed } from './ADInfeed-ac3ac372.js';
+import { A as ADInfeed } from './ADInfeed-a1d8cb44.js';
 
 var DeckContent = function (_React$Component) {
   _inherits(DeckContent, _React$Component);

package/dist/esm/{GridContent-96716e42.js → GridContent-862176ac.js}

@@ -14,7 +14,7 @@ import { withRouter } from 'next/router';
 import { i as imageUrlBuilder } from './index-3849e3fe.js';
 import { L as LazyLoad } from './index-5f9f807a.js';
 import { c as clean_html_1 } from './entities-7cc3bf45.js';
-import { A as ADInfeed } from './ADInfeed-ac3ac372.js';
+import { A as ADInfeed } from './ADInfeed-a1d8cb44.js';
 import { g as get_1 } from './get-9c285a85.js';
 
 var Dfp = React__default.lazy(function () {

package/dist/esm/GridContent.js

@@ -21,8 +21,8 @@ import './index-3849e3fe.js';
 import './index-5f9f807a.js';
 import './entities-7cc3bf45.js';
 import './slicedToArray-d0a9593a.js';
-import './AdSlot-03043ffb.js';
+import './AdSlot-b4f04c96.js';
 import './promise-e3480f1c.js';
-import './ADInfeed-ac3ac372.js';
+import './ADInfeed-a1d8cb44.js';
 import './get-9c285a85.js';
-export { G as default } from './GridContent-96716e42.js';
+export { G as default } from './GridContent-862176ac.js';

package/dist/esm/{Normal-73a8596f.js → Normal-4180d06d.js}

@@ -5,7 +5,7 @@ import Row from 'react-bootstrap/Row';
 import Col from 'react-bootstrap/Col';
 import Link from 'next/link';
 import { _ as _slicedToArray } from './slicedToArray-d0a9593a.js';
-import { D as DFPAdSlot } from './AdSlot-03043ffb.js';
+import { D as DFPAdSlot } from './AdSlot-b4f04c96.js';
 import { g as get_1 } from './get-9c285a85.js';
 import { r as reactSocialIcons_1 } from './react-social-icons-a7d5c5c7.js';
 import { Dropdown } from 'react-bootstrap';

package/dist/esm/QueueDeckExpanded.js

@@ -17,9 +17,9 @@ import { i as imageUrlBuilder } from './index-3849e3fe.js';
 import { L as LazyLoad } from './index-5f9f807a.js';
 import { c as clean_html_1 } from './entities-7cc3bf45.js';
 import { _ as _slicedToArray } from './slicedToArray-d0a9593a.js';
-import './AdSlot-03043ffb.js';
+import './AdSlot-b4f04c96.js';
 import './promise-e3480f1c.js';
-import { A as ADInfeed } from './ADInfeed-ac3ac372.js';
+import { A as ADInfeed } from './ADInfeed-a1d8cb44.js';
 import { Container, Media } from 'react-bootstrap';
 
 var urlFor = function urlFor(source, builder) {

package/dist/esm/TemplateNormal.js

@@ -11,14 +11,14 @@ import 'react-bootstrap/Row';
 import 'react-bootstrap/Col';
 import 'next/link';
 import './slicedToArray-d0a9593a.js';
-import './AdSlot-03043ffb.js';
+import './AdSlot-b4f04c96.js';
 import './promise-e3480f1c.js';
 import './get-9c285a85.js';
 import './react-social-icons-a7d5c5c7.js';
 import 'react-bootstrap';
 import './index.esm-536609db.js';
 import 'react-bootstrap/Button';
-export { T as default } from './Normal-73a8596f.js';
+export { T as default } from './Normal-4180d06d.js';
 import 'react-bootstrap/ListGroup';
 import 'next/head';
 import 'react-bootstrap/Nav';

package/dist/esm/VideoSeriesListing.js

@@ -60,8 +60,8 @@ var VideoSeriesListing = function (_React$Component) {
           query = _this$state.query,
           page = _this$state.page;
       var client = _this.props.client;
+      //this.changePageNumber(page)
 
-      _this.changePageNumber(page);
       var params = _extends({}, _this.params, { from: from, to: to
         // const queryUpdated = query.replace('$from', params.from).replace('$to', params.to)
         // const query = '*[_type == "article" && defined(title) && defined(thumbnail)][$from...$to] { title, summary, thumbnail { asset-> }, url }'
@@ -215,22 +215,24 @@ var VideoSeriesListing = function (_React$Component) {
 
       return React__default.createElement(
         InfiniteScroll,
-        { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.9 },
+        { dataLength: this.state.data.length, next: this.loadMore, hasMore: this.state.scrolling, scrollThreshold: 0.8 },
         React__default.createElement(
           Container,
           null,
           this.state.data && this.state.data.map(function (series, index) {
-            var page = series[0].pageNumber !== 1 ? series[0].pageNumber : index + 1;
+            var page = series[0].pageNumber !== 1 ? series[0].pageNumber : 1;
 
             return React__default.createElement(
-              VisibilitySensor,
-              {
-                partialVisibility: true,
-                offset: { bottom: 400, top: 200 },
-                key: index,
-                onChange: function onChange(isVisible) {
-                  isVisible && _this2.changePageNumber(page);
-                } },
+              React__default.Fragment,
+              { key: index },
+              React__default.createElement(
+                VisibilitySensor,
+                {
+                  onChange: function onChange(isVisible) {
+                    isVisible && _this2.changePageNumber(page);
+                  } },
+                React__default.createElement('div', { className: 'visibility-sensor', style: { minHeight: '.25rem' } })
+              ),
               React__default.createElement(
                 'div',
                 null,

package/dist/esm/index.js

@@ -21,13 +21,13 @@ import { i as imageUrlBuilder } from './index-3849e3fe.js';
 import './index-5f9f807a.js';
 import { h as html_decode_1, c as clean_html_1 } from './entities-7cc3bf45.js';
 import { _ as _slicedToArray } from './slicedToArray-d0a9593a.js';
-import { _ as _JSON$stringify, a as _asyncToGenerator, r as regenerator, D as DFPAdSlot, B as Beam } from './AdSlot-03043ffb.js';
-export { D as AdSlot, B as Beam } from './AdSlot-03043ffb.js';
+import { _ as _JSON$stringify, a as _asyncToGenerator, r as regenerator, D as DFPAdSlot, B as Beam } from './AdSlot-b4f04c96.js';
+export { D as AdSlot, B as Beam } from './AdSlot-b4f04c96.js';
 import './promise-e3480f1c.js';
-import './ADInfeed-ac3ac372.js';
+import './ADInfeed-a1d8cb44.js';
 export { default as DeckContent } from './DeckContent.js';
 import { i as isFunction_1, a as isArray_1, _ as _arrayMap } from './get-9c285a85.js';
-export { A as AD, G as GridContent } from './GridContent-96716e42.js';
+export { A as AD, G as GridContent } from './GridContent-862176ac.js';
 export { default as DeckQueue } from './DeckQueue.js';
 import 'react-bootstrap/Media';
 export { default as ThumbnailCard } from './ThumbnailCard.js';
@@ -49,8 +49,8 @@ export { default as IssueDeck } from './IssueDeck.js';
 import 'react-bootstrap/Badge';
 export { default as IssueContentDeck } from './IssueContentDeck.js';
 import Spinner from 'react-bootstrap/Spinner';
-import { M as MdPictureAsPdf } from './Normal-73a8596f.js';
-export { A as AD728x90, C as Column1, a as Column2, b as Column3, f as HamMagazine, H as Header, L as LeftNav, e as NavDvm, c as NavMagazine, N as NavNative, d as NavNormal, P as PageFilter, S as Search, g as SideFooter, T as TemplateNormal } from './Normal-73a8596f.js';
+import { M as MdPictureAsPdf } from './Normal-4180d06d.js';
+export { A as AD728x90, C as Column1, a as Column2, b as Column3, f as HamMagazine, H as Header, L as LeftNav, e as NavDvm, c as NavMagazine, N as NavNative, d as NavNormal, P as PageFilter, S as Search, g as SideFooter, T as TemplateNormal } from './Normal-4180d06d.js';
 import 'react-bootstrap/ListGroup';
 import Head from 'next/head';
 import Accordion from 'react-bootstrap/Accordion';
@@ -2919,7 +2919,6 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
       _floatingAd$sizes = floatingAd.sizes,
       sizes = _floatingAd$sizes === undefined ? [[728, 90]] : _floatingAd$sizes;
 
-
   var adTargeting = {
     content_placement: targeting.content_placement,
     tags: targeting.tags,
@@ -2929,15 +2928,10 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     campaign_id: targeting.campaign_id
   };
 
-  var _useState = useState(false),
+  var _useState = useState(true),
       _useState2 = _slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
-
-  var _useState3 = useState(true),
-      _useState4 = _slicedToArray(_useState3, 2),
-      widthFlag = _useState4[0],
-      setWidthFlag = _useState4[1];
+      widthFlag = _useState2[0],
+      setWidthFlag = _useState2[1];
 
   useEffect(function () {
     if (window && window.innerWidth < minScreenWidth) {
@@ -2945,17 +2939,42 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     }
   }, [minScreenWidth]);
 
+  var collapseAd = function collapseAd() {
+    var parent = document.getElementById('floating-ad-wrapper');
+    parent.style.height = '0%';
+    parent.style.width = '0%';
+    parent.style.display = 'none';
+  };
+
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('floating-ad-wrapper');
+      parent.style.display = 'block';
+    } else {
+      collapseAd();
+    }
+  };
+
   return React__default.createElement(
     React__default.Fragment,
     null,
-    showAd && widthFlag && React__default.createElement(
+    widthFlag && React__default.createElement(
       'div',
-      { className: 'floating-ad-wrapper ' + title },
-      React__default.createElement(DFPAdSlot, { className: className, slotId: slotId, networkID: networkID, sizes: sizes, adUnit: adUnit, targeting: adTargeting, refreshFlag: false, setShowAd: setShowAd }),
+      { id: 'floating-ad-wrapper', className: 'floating-ad-wrapper ' + title },
+      React__default.createElement(DFPAdSlot, {
+        className: className,
+        slotId: slotId,
+        networkID: networkID,
+        sizes: sizes,
+        adUnit: adUnit,
+        targeting: adTargeting,
+        refreshFlag: false,
+        checkIsAdFound: checkIsAdFound
+      }),
       React__default.createElement(
         'div',
         { className: 'closeButton', onClick: function onClick() {
-            return setShowAd(false);
+            return collapseAd();
           } },
         'x'
       )
@@ -2963,7 +2982,7 @@ var ADFloatingFooter = function ADFloatingFooter(_ref) {
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n          .floating-ad-wrapper {\n            width: auto;\n            margin: 0;\n            background-color: #f5f5f5;\n            position: fixed;\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            z-index: 9000;\n          }\n          .closeButton {\n            position: absolute;\n            top: -10px;\n            right: -10px;\n            background: grey;\n            color: white;\n            font-weight: 500;\n            border: 2px solid white;\n            border-radius: 50%;\n            width: 30px;\n            height: 30px;\n            text-align: center;\n            font-size: 17px;\n            cursor: pointer;\n          }\n        '
+      '\n          .floating-ad-wrapper {\n            width: auto;\n            margin: 0;\n            background-color: #f5f5f5;\n            position: fixed;\n            bottom: 0;\n            left: 50%;\n            transform: translateX(-50%);\n            z-index: 9000;\n            display: none;\n          }\n          .closeButton {\n            position: absolute;\n            top: -10px;\n            right: -10px;\n            background: grey;\n            color: white;\n            font-weight: 500;\n            border: 2px solid white;\n            border-radius: 50%;\n            width: 30px;\n            height: 30px;\n            text-align: center;\n            font-size: 17px;\n            cursor: pointer;\n          }\n        '
     )
   );
 };
@@ -3049,21 +3068,15 @@ var ADWelcome = function ADWelcome(_ref) {
     pos: position,
     campaign_id: targeting.campaign_id
   };
-  var adRef = useRef(null);
-
-  var _useState = useState(),
-      _useState2 = _slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
 
   var calculateTimeLeft = function calculateTimeLeft(timeLeft) {
     return --timeLeft;
   };
 
-  var _useState3 = useState(calculateTimeLeft(counter + 1)),
-      _useState4 = _slicedToArray(_useState3, 2),
-      timeLeft = _useState4[0],
-      setTimeLeft = _useState4[1];
+  var _useState = useState(calculateTimeLeft(counter + 1)),
+      _useState2 = _slicedToArray(_useState, 2),
+      timeLeft = _useState2[0],
+      setTimeLeft = _useState2[1];
 
   useEffect(function () {
     if (timeLeft > 0) {
@@ -3075,17 +3088,18 @@ var ADWelcome = function ADWelcome(_ref) {
     }
   });
 
-  useEffect(function () {
-    if (typeof showAd !== 'undefined' && showAd) {
-      adRef.current.style.opacity = '1';
-    } else if (typeof showAd !== 'undefined' && !showAd) {
+  var checkIsAdFound = function checkIsAdFound(isFound) {
+    if (isFound) {
+      var parent = document.getElementById('welcome-modal');
+      parent.style.display = 'block';
+    } else {
       setFlag(true);
     }
-  }, [showAd]);
+  };
 
   return React__default.createElement(
     'div',
-    { ref: adRef, style: { outline: 'none', opacity: 0 }, className: 'welcome-modal' },
+    { style: { outline: 'none', display: 'none' }, className: 'welcome-modal', id: 'welcome-modal' },
     React__default.createElement(
       'div',
       { className: 'right-top', style: { position: 'absolute', top: 0, right: 0, textAlign: 'center', margin: '2rem' } },
@@ -3122,7 +3136,16 @@ var ADWelcome = function ADWelcome(_ref) {
     React__default.createElement(
       'div',
       { className: title, style: { position: 'relative', width: '300px', height: '250px', margin: 'auto', top: '10rem' } },
-      React__default.createElement(DFPAdSlot, { className: className, slotId: slotId, networkID: networkID, sizes: sizes, adUnit: adUnit, targeting: adTargeting, refreshFlag: false, setShowAd: setShowAd })
+      React__default.createElement(DFPAdSlot, {
+        className: className,
+        slotId: slotId,
+        networkID: networkID,
+        sizes: sizes,
+        adUnit: adUnit,
+        targeting: adTargeting,
+        refreshFlag: false,
+        checkIsAdFound: checkIsAdFound
+      })
     ),
     React__default.createElement(
       'style',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mjhls/mjh-framework",
-  "version": "1.0.293",
+  "version": "1.0.295",
   "description": "Foundation Framework",
   "author": "mjh-framework",
   "license": "MIT",

package/dist/cjs/ADInfeed-db54195d.js

@@ -1,47 +0,0 @@
-'use strict';
-
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var React = require('react');
-var React__default = _interopDefault(React);
-var Card = _interopDefault(require('react-bootstrap/Card'));
-var slicedToArray = require('./slicedToArray-e38fb29d.js');
-var AdSlot = require('./AdSlot-0cd6f861.js');
-
-var ADInfeed = function ADInfeed(_ref) {
-  var index = _ref.index,
-      infeedAd = _ref.infeedAd;
-  var className = infeedAd.className,
-      slotId = infeedAd.slotId,
-      adUnit = infeedAd.adUnit,
-      _infeedAd$targeting = infeedAd.targeting,
-      targeting = _infeedAd$targeting === undefined ? {} : _infeedAd$targeting,
-      networkID = infeedAd.networkID,
-      sizes = infeedAd.sizes;
-
-  var _useState = React.useState(true),
-      _useState2 = slicedToArray._slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
-
-  return React__default.createElement(
-    React__default.Fragment,
-    null,
-    showAd && React__default.createElement(
-      'div',
-      { className: 'brand-insight-wrapper', style: { display: 'flex', flex: '1 0 auto' } },
-      React__default.createElement(
-        Card,
-        { className: 'ad-wrapper', style: { display: 'block !important', flexDirection: index === 0 || index % 4 === 0 ? 'top' : 'row' } },
-        React__default.createElement(AdSlot.DFPAdSlot, { className: className, networkID: networkID, adUnit: adUnit, slotId: slotId, targeting: targeting, sizes: sizes, setShowAd: setShowAd })
-      ),
-      React__default.createElement(
-        'style',
-        { jsx: 'true' },
-        ''
-      )
-    )
-  );
-};
-
-exports.ADInfeed = ADInfeed;

package/dist/esm/ADInfeed-ac3ac372.js

@@ -1,42 +0,0 @@
-import React__default, { useState } from 'react';
-import Card from 'react-bootstrap/Card';
-import { _ as _slicedToArray } from './slicedToArray-d0a9593a.js';
-import { D as DFPAdSlot } from './AdSlot-03043ffb.js';
-
-var ADInfeed = function ADInfeed(_ref) {
-  var index = _ref.index,
-      infeedAd = _ref.infeedAd;
-  var className = infeedAd.className,
-      slotId = infeedAd.slotId,
-      adUnit = infeedAd.adUnit,
-      _infeedAd$targeting = infeedAd.targeting,
-      targeting = _infeedAd$targeting === undefined ? {} : _infeedAd$targeting,
-      networkID = infeedAd.networkID,
-      sizes = infeedAd.sizes;
-
-  var _useState = useState(true),
-      _useState2 = _slicedToArray(_useState, 2),
-      showAd = _useState2[0],
-      setShowAd = _useState2[1];
-
-  return React__default.createElement(
-    React__default.Fragment,
-    null,
-    showAd && React__default.createElement(
-      'div',
-      { className: 'brand-insight-wrapper', style: { display: 'flex', flex: '1 0 auto' } },
-      React__default.createElement(
-        Card,
-        { className: 'ad-wrapper', style: { display: 'block !important', flexDirection: index === 0 || index % 4 === 0 ? 'top' : 'row' } },
-        React__default.createElement(DFPAdSlot, { className: className, networkID: networkID, adUnit: adUnit, slotId: slotId, targeting: targeting, sizes: sizes, setShowAd: setShowAd })
-      ),
-      React__default.createElement(
-        'style',
-        { jsx: 'true' },
-        ''
-      )
-    )
-  );
-};
-
-export { ADInfeed as A };