@mjhls/mjh-framework 1.0.436 → 1.0.438

package/README.md

@@ -1,5 +1,5 @@
 
-# mjh-framework v. 1.0.436
+# mjh-framework v. 1.0.438
 
 > Foundation Framework 
 

package/dist/cjs/ADlgInfeed-be0e0bde.js

@@ -0,0 +1,48 @@
+'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);
+require('react-bootstrap/Card');
+var AdSlot = require('./AdSlot-4d22aad4.js');
+
+var ADlgInfeed = function ADlgInfeed(props) {
+  var className = props.className,
+      slotId = props.slotId,
+      adUnit = props.adUnit,
+      _props$targeting = props.targeting,
+      targeting = _props$targeting === undefined ? {} : _props$targeting,
+      networkID = props.networkID,
+      sizes = props.sizes,
+      index = props.index;
+
+  var collapseAd = function collapseAd() {
+    var parent = document.getElementById('lg-infeed-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('lg-infeed-wrapper-' + (index + 1));
+      parent.style.display = 'flex';
+    } else {
+      collapseAd();
+    }
+  };
+
+  return React__default.createElement(
+    'div',
+    { id: 'lg-infeed-wrapper-' + (index + 1), className: 'lg-infeed-wrapper', style: { display: 'none', flex: '1 0 auto' } },
+    React__default.createElement(AdSlot.DFPAdSlot, { className: className, networkID: networkID, adUnit: adUnit, slotId: slotId, targeting: targeting, sizes: sizes, checkIsAdFound: checkIsAdFound, refreshFlag: false }),
+    React__default.createElement(
+      'style',
+      { jsx: 'true' },
+      '\n        .lg-infeed-wrapper {\n          flex-direction: row;\n          margin-bottom: 1.25rem;\n          padding-bottom: 1.25rem;\n          border-bottom: 1px solid rgb(221, 221, 221);\n        }\n      '
+    )
+  );
+};
+
+exports.ADlgInfeed = ADlgInfeed;

package/dist/cjs/{GridContent-f401c40f.js → GridContent-068c0b1c.js}

@@ -22,6 +22,8 @@ var index$1 = require('./index-fa0fb52c.js');
 var main = require('./main-bc4db521.js');
 var entities = require('./entities-310b46ee.js');
 var ADInfeed = require('./ADInfeed-494f5e6b.js');
+var lodash = require('./lodash-fc2922d0.js');
+var ADlgInfeed = require('./ADlgInfeed-be0e0bde.js');
 var get$1 = require('./get-5aa7468c.js');
 var AuthorComponent = require('./AuthorComponent-4706f297.js');
 
@@ -71,7 +73,9 @@ var GridContent = function (_React$Component) {
       total_pages: null,
       scrolling: true,
       query: _this.query,
-      currentPage: _this.props.currentPage || 1
+      currentPage: _this.props.currentPage || 1,
+      lgInfeedAd: _this.props.lgInfeedAd ? _this.props.lgInfeedAd : false,
+      desktopView: false
     }, _this.loadMore = debounce.debounce_1(function () {
       _this.setState(function (state) {
         var page = state.page,
@@ -86,6 +90,13 @@ var GridContent = function (_React$Component) {
         };
       }, _this.loadData);
     }, 0), _this.componentDidMount = function () {
+      if (_this.state.lgInfeedAd && window && window.innerWidth >= 1200) {
+        _this.setState(function (state) {
+          return _extends$2._extends({}, state, {
+            desktopView: true
+          });
+        });
+      }
       document.addEventListener('scroll', _this.trackScrolling);
     }, _this.componentWillUnmount = function () {
       document.removeEventListener('scroll', _this.trackScrolling);
@@ -246,7 +257,7 @@ var GridContent = function (_React$Component) {
 
   inherits$2._createClass(GridContent, [{
     key: 'cardLoader',
-    value: function cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight) {
+    value: function cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight, desktopView) {
       var _this2 = this;
 
       var lgVar = Math.floor(12 / columns);
@@ -336,32 +347,74 @@ var GridContent = function (_React$Component) {
         return [].concat(toConsumableArray._toConsumableArray(arr.slice(0, index)), [newElement], toConsumableArray._toConsumableArray(arr.slice(index)));
       };
       var posts = [];
-      if (showBI) {
-        var data = this.state.data;
-        posts = data;
-        var pos = 3;
-        for (var i = 1; pos < posts.length; i++) {
-          var inFeedAd = {
+      if (brandInsight && (desktopView || showBI)) {
+        var firstThree = this.state.data.slice(0, 3);
+        var data = this.state.data.slice(3);
+
+        if (desktopView) {
+          var lgInFeedAd = {
+            _type: 'lg-infeed',
             adUnit: brandInsight.adUnit,
-            className: brandInsight.className,
+            className: 'lg-infeed',
             networkID: brandInsight.networkID,
-            sizes: brandInsight.sizes,
-            slotId: brandInsight.slotId + '_' + i,
+            sizes: [728, 90],
             targeting: {
-              pos: 'article' + i,
               content_placement: brandInsight.targeting.content_placement,
               document_url: brandInsight.targeting.document_url
-            },
-            _type: 'BrandInsight'
+            }
           };
+          var chunks = lodash.lodash.chunk(data, 6).map(function (chunk) {
+            var set = lodash.lodash.chunk(chunk, 2);
+            for (var i = 0; i < set.length; i++) {
+              if (i !== set.length - 1) {
+                set[i].push(lgInFeedAd);
+              }
+            }
+            return lodash.lodash.flattenDeep(set);
+          });
 
-          posts = insert(posts, pos, inFeedAd);
-          pos += brandInsight.interval + 1;
+          posts = lodash.lodash.flatten(chunks);
         }
+
+        if (showBI) {
+          if (desktopView) {
+            brandInsight.interval = 8;
+          } else {
+            brandInsight.interval = 5;
+            posts = data;
+          }
+
+          var pos = 0;
+          for (var i = 1; pos < posts.length; i++) {
+            var inFeedAd = {
+              adUnit: brandInsight.adUnit,
+              className: brandInsight.className,
+              networkID: brandInsight.networkID,
+              sizes: brandInsight.sizes,
+              slotId: brandInsight.slotId + '_' + i,
+              targeting: {
+                pos: 'article' + i,
+                content_placement: brandInsight.targeting.content_placement,
+                document_url: brandInsight.targeting.document_url
+              },
+              _type: 'BrandInsight'
+            };
+
+            posts = insert(posts, pos, inFeedAd);
+            pos += brandInsight.interval + 1;
+          }
+        }
+        posts = firstThree.concat(posts);
+        posts = posts.map(function (ele, i) {
+          if (ele._type === 'lg-infeed') {
+            return _extends$2._extends({}, ele, { slotId: 'lg-infeed_' + i, targeting: _extends$2._extends({}, ele.targeting, { pos: 'lg-infeed_' + i }) });
+          } else {
+            return ele;
+          }
+        });
       } else {
         posts = this.state.data;
       }
-
       var itemsPerPage = this.props.params && this.props.params.itemsPerPage ? this.props.params.itemsPerPage : 10;
       var heroContent = this.props.heroContent ? this.props.heroContent : 0;
       var featureCount = 0;
@@ -503,10 +556,12 @@ var GridContent = function (_React$Component) {
                 main.main_39 && _this2.props.rightItems && (index + 1) % numberOfItemsBeforeAd === 0 && _this2.renderMobileAd(index, numberOfItemsBeforeAd)
               );
             }
+          } else if (row._type === 'lg-infeed' && row.adUnit) {
+            return React__default.createElement(ADlgInfeed.ADlgInfeed, _extends$2._extends({ index: index }, row));
           } else if (row._type === 'BrandInsight' && row.adUnit) {
             return React__default.createElement(ADInfeed.ADInfeed, { index: index, infeedAd: row });
           }
-          if (index + 1 > heroContent + featureCount) {
+          if (index + 1 > heroContent + featureCount && row._type && !['lg-infeed', 'brandInsightAd'].includes(row._type)) {
             return React__default.createElement(
               React__default.Fragment,
               { key: itemCounter },
@@ -610,7 +665,7 @@ var GridContent = function (_React$Component) {
           React__default.createElement(
             Container,
             null,
-            this.cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight)
+            this.cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight, this.state.desktopView)
           )
         ) : React__default.createElement(
           React__default.Fragment,
@@ -618,7 +673,7 @@ var GridContent = function (_React$Component) {
           React__default.createElement(
             Container,
             null,
-            this.cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight)
+            this.cardLoader(page, columns, variant, showVideo, VideoPlayer, showBI, brandInsight, this.state.desktopView)
           ),
           React__default.createElement(
             'div',

package/dist/cjs/GridContent.js

@@ -30,8 +30,10 @@ require('./slicedToArray-419d467a.js');
 require('./AdSlot-4d22aad4.js');
 require('./promise-0a493c7a.js');
 require('./ADInfeed-494f5e6b.js');
+require('./lodash-fc2922d0.js');
+require('./ADlgInfeed-be0e0bde.js');
 require('./get-5aa7468c.js');
-var GridContent = require('./GridContent-f401c40f.js');
+var GridContent = require('./GridContent-068c0b1c.js');
 require('./AuthorComponent-4706f297.js');
 
 

package/dist/cjs/{Normal-54dd4121.js → Normal-62915103.js}

@@ -2087,7 +2087,6 @@ var AD728x90 = function AD728x90(_ref) {
       _ref$fixedPos = _ref.fixedPos,
       fixedPos = _ref$fixedPos === undefined ? '60px' : _ref$fixedPos;
 
-
   var mobileView = false;
   if (main.main_39) {
     pos = 'top-mobile';