@mjhls/mjh-framework 1.0.695 → 1.0.696-1034-2

package/dist/esm/View.js

@@ -24,6 +24,7 @@ import './isSymbol-807e927e.js';
 import './debounce-1a993acf.js';
 import { I as InfiniteScroll } from './index.es-938a3a58.js';
 import 'react-dom';
+import { V as VisibilitySensor } from './visibility-sensor-0baa4eea.js';
 import './index-51a80699.js';
 import './index-5f9f807a.js';
 import { m as main_39 } from './main-0465b2a0.js';
@@ -44,11 +45,12 @@ import './index.esm-29e48d38.js';
 import Button from 'react-bootstrap/Button';
 import { _ as _defineProperty } from './defineProperty-b798470d.js';
 import Form from 'react-bootstrap/Form';
-import { I as InscreenSensor, r as renderAuthor, g as getSerializers } from './index-754010eb.js';
+import { r as renderAuthor, g as getSerializers } from './index-d3fdad5e.js';
 import './util-7700fc59.js';
 import './brightcove-react-player-loader.es-83f53e4e.js';
 import 'react-bootstrap/Pagination';
 import Head from 'next/head';
+import 'react-bootstrap/Figure';
 import 'react-share';
 import SocialShare from './SocialShare.js';
 import FormControl from 'react-bootstrap/FormControl';
@@ -390,7 +392,10 @@ var Article = function Article(props) {
       _props$sponsoredFlag = props.sponsoredFlag,
       sponsoredFlag = _props$sponsoredFlag === undefined ? false : _props$sponsoredFlag,
       _props$authorImgHeigh = props.authorImgHeight,
-      authorImgHeight = _props$authorImgHeigh === undefined ? 270 : _props$authorImgHeigh;
+      authorImgHeight = _props$authorImgHeigh === undefined ? 270 : _props$authorImgHeigh,
+      active = props.active,
+      containerHeight = props.containerHeight;
+
 
   var targeting = getTargeting(props);
   var onChangeArticle = props.onChangeArticle;
@@ -804,16 +809,16 @@ var Article = function Article(props) {
       React__default.Fragment,
       null,
       React__default.createElement(
-        InscreenSensor,
+        VisibilitySensor,
         {
-          offSetTop: 120,
-          className: 'inscreen-wrapper',
-          id: 'article-' + title,
-          onChange: function onChange(visible) {
-            if (visible === 'top' || visible === 'bottom' || visible === 'small-top') {
-              onChangeArticle(url, visible, meta);
-              //  Setting 'visibleFlag' to know that the article is visible.
-              setVisibleFlag(true);
+          partialVisibility: true,
+          offset: { bottom: 100, top: containerHeight - 100 },
+          onChange: function onChange(isVisible) {
+            if (isVisible && queueData.length > 1) {
+              onChangeArticle(url, meta);
+              setVisibleFlag(function () {
+                return true;
+              });
             }
           } },
         React__default.createElement(
@@ -1017,16 +1022,16 @@ var Article = function Article(props) {
             )
           ),
           renderIsiContent(props.article)
-        ),
-        showIsi && Array.isArray(isi) && isi.length > 0 && React__default.createElement(
-          ISI,
-          null,
-          React__default.createElement(BlockContent, {
-            serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, false, false, null, props.article.Ads, targeting),
-            blocks: isi
-          })
         )
       ),
+      showIsi && Array.isArray(isi) && isi.length > 0 && React__default.createElement(
+        ISI,
+        null,
+        React__default.createElement(BlockContent, {
+          serializers: getSerializers(client, pageview, videoAccountIDs, onVote, true, drupalLeadSettings, currentPage, false, false, null, props.article.Ads, targeting),
+          blocks: isi
+        })
+      ),
       main_39 && !sponsoredFlag && props.article.Ads && props.article.Ads.length > 0 && props.article.Ads.map(function (ad, index) {
         if (index > 0) {
           return React__default.createElement(
@@ -1081,7 +1086,25 @@ var ArticleQueue = function ArticleQueue(props) {
       showRelatedArticles = props.showRelatedArticles,
       canonicalTag = props.canonicalTag;
 
+  var _useState = useState(0),
+      _useState2 = _slicedToArray(_useState, 2),
+      containerHeight = _useState2[0],
+      setContainerHeight = _useState2[1];
 
+  useEffect(function () {
+    setContainerHeight(function () {
+      return window.innerHeight;
+    });
+    var handleResize = function handleResize() {
+      return setContainerHeight(function () {
+        return window.innerHeight;
+      });
+    };
+    window.addEventListener('resize', handleResize);
+    return function () {
+      return window.removeEventListener('resize', handleResize);
+    };
+  }, []);
   var firstArticle = function firstArticle() {
     var article = _Object$assign({}, props.article);
     var targeting = getTargeting(props);
@@ -1089,10 +1112,15 @@ var ArticleQueue = function ArticleQueue(props) {
     return article;
   };
 
-  var _useState = useState([firstArticle()]),
-      _useState2 = _slicedToArray(_useState, 2),
-      queueData = _useState2[0],
-      setQueueData = _useState2[1];
+  var _useState3 = useState([firstArticle()]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      queueData = _useState4[0],
+      setQueueData = _useState4[1];
+
+  var _useState5 = useState(queueData[0]._id),
+      _useState6 = _slicedToArray(_useState5, 2),
+      active = _useState6[0],
+      setActive = _useState6[1];
 
   var refreshAD = function refreshAD(path) {
     var activeArticle = queueData.find(function (item) {
@@ -1142,16 +1170,11 @@ var ArticleQueue = function ArticleQueue(props) {
   };
 
   var preVscroll = 0;
-  var isScrollDown = true;
 
   var scrollDirectionDetect = function scrollDirectionDetect(e) {
     var window = e.currentTarget;
 
-    if (preVscroll > window.scrollY) {
-      isScrollDown = false;
-    } else if (preVscroll < window.scrollY) {
-      isScrollDown = true;
-    }
+    if (preVscroll > window.scrollY) ; else if (preVscroll < window.scrollY) ;
     preVscroll = window.scrollY;
   };
 
@@ -1241,38 +1264,23 @@ var ArticleQueue = function ArticleQueue(props) {
     }
   };
 
-  var onChangeArticle = function onChangeArticle(path, visibility, meta) {
+  var onChangeArticle = function onChangeArticle(path, meta) {
     var currentPath = window && window.location && window.location.pathname ? window.location.pathname.replace('/view/', '') : '';
     var newPath = '/view/' + path;
-
+    var activeArticle = queueData.find(function (item) {
+      return item.url.current === path;
+    });
+    setActive(function () {
+      return activeArticle._id;
+    });
     // Change URL and do other changes
-    var doChanges = function doChanges() {
-      window.history.pushState({ page: path }, meta.shareTitle, newPath);
-      changeMeta(meta);
-      if (props.setCustomDimensions) {
-        var activeArticle = queueData.find(function (item) {
-          return item.url.current === path;
-        });
-        props.setCustomDimensions(activeArticle, '200', prevUrl);
-      }
-      if (props.pageview) props.pageview(newPath);
-      refreshAD(path);
-    };
-
-    if (currentPath !== path) {
-      if (isScrollDown) {
-        if (visibility === 'top') {
-          doChanges();
-        }
-      } else {
-        if (visibility === 'bottom') {
-          doChanges();
-        }
-      }
-      if (visibility === 'small-top') {
-        doChanges();
-      }
+    window.history.pushState({ page: path }, meta.shareTitle, newPath);
+    changeMeta(meta);
+    if (props.setCustomDimensions) {
+      props.setCustomDimensions(activeArticle, '200', prevUrl);
     }
+    if (props.pageview) props.pageview(newPath);
+    refreshAD(path);
   };
 
   return React__default.createElement(
@@ -1282,10 +1290,12 @@ var ArticleQueue = function ArticleQueue(props) {
       return React__default.createElement(Article, _extends({
         key: index
       }, props, {
+        containerHeight: containerHeight,
         onChangeArticle: onChangeArticle,
         authorPrfix: authorPrefix,
         article: article,
-        cpModificationRequired: cpModificationRequired
+        cpModificationRequired: cpModificationRequired,
+        active: active === article._id
         // Passing queueData to check for single article
         , queueData: queueData,
         showRelatedArticles: showRelatedArticles

package/dist/esm/YoutubeGroup.js

@@ -69,7 +69,7 @@ var YoutubeGroup = function YoutubeGroup(props) {
     var tileHeight = tileArray.current.map(function (tile) {
       return tile.scrollHeight;
     });
-    console.log(tileArray.current);
+
     for (var ele in tileArray.current) {
       var eleHeight = tileHeight[ele] < 185 ? 185 : tileHeight[ele];
       tileArray.current[ele].style.height = eleHeight + 'px';

package/dist/esm/getSerializers.js

@@ -41,8 +41,9 @@ import 'react-bootstrap';
 import './iconBase-602d52fe.js';
 import './index.esm-29e48d38.js';
 import 'react-bootstrap/Button';
-export { g as default } from './index-754010eb.js';
+export { g as default } from './index-d3fdad5e.js';
 import './util-7700fc59.js';
 import './brightcove-react-player-loader.es-83f53e4e.js';
 import 'react-bootstrap/Pagination';
 import 'next/head';
+import 'react-bootstrap/Figure';