@mjhls/mjh-framework 1.0.217 → 1.0.219

package/README.md

@@ -1,5 +1,5 @@
 
-# mjh-framework v. 1.0.217
+# mjh-framework v. 1.0.219
 
 
 

package/dist/cjs/MasterDeck.js

@@ -201,7 +201,7 @@ var MasterDeck = function (_React$Component) {
                 onChange: function onChange(isVisible) {
                   isVisible && _this.changePageNumber(pageNumber);
                 } },
-              React__default.createElement(_this2.Deck, { data: row, variant: variant, index: index, client: _this.props.client, defaultImage: defaultImage })
+              React__default.createElement(_this2.Deck, { data: row, variant: variant, index: index, client: _this.props.client, defaultImage: _this.defaultImage })
             ),
             main.main_36 && _this.rightItems && (index + 1) % numberOfItemsBeforeAd === 0 && React__default.createElement(
               'div',

package/dist/cjs/index.js

@@ -11404,7 +11404,7 @@ var fbsHero = function fbsHero(props) {
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n        .article-hero {\n          margin-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n          padding-bottom: 0.5rem;\n        }\n        .fbs-top-article {\n          width: 100%;\n          margin-bottom: 1rem;\n          padding-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n        }\n        .fbs-top-article img {\n          width: 100%;\n          height: auto;\n          max-height: 375px;\n          object-fit: cover;\n        }\n        \n        .fbs-top-article--body {\n        }\n        .fbs-top-article--body h1 {\n          color: #252525 !important;\n          font-size: 1.6rem;\n          font-weight: bold;\n          text-align: center;\n          margin-top: 1rem;\n        }\n        .fbs-top-article--body p {\n          text-align: center;\n          margin-bottom: 0;\n          color: #252525;\n        }\n        .fbs-top-article--body p:first-of-type {\n          font-size: 0.9rem;\n        }\n        .fbs-sub-article-container {\n          display: flex;\n          flex-direction: row;\n          flex-wrap: wrap;\n\n          padding-top: 1.75rem;\n          margin-left: -1rem;\n          margin-rigth: -1rem;\n        }\n        .fbs-sub-article {\n          width: calc(50% - 2rem);\n          min-width: 350px;\n          display: flex;\n          flex-direction: row;\n          flex: 1 1 auto;\n          margin: 0 1rem 1.75rem;\n        }\n        .fbs-sub-article img {\n          margin-right: 1rem;\n          width: 100px;\n          max-height: 100px;\n          object-fit: contain;\n        }\n        .fbs-sub-article p {\n          margin-bottom: 0;\n          font-size: 0.8rem;\n          color: #252525;\n        }\n        .fbs-sub-article .fbs-sub-article--title {\n          font-weight: bold;\n          font-size: 1rem;\n          color: #252525;\n        }\n      '
+      '\n        .article-hero {\n          margin-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n          padding-bottom: 0.5rem;\n        }\n        .fbs-top-article {\n          width: 100%;\n          margin-bottom: 1rem;\n          padding-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n        }\n        .fbs-top-article img {\n          width: 100%;\n\n          max-height: 300px;\n          min-height: 275px;\n          object-fit: cover;\n          height: 112.5px;\n        }\n\n        .fbs-top-article--body {\n        }\n        .fbs-top-article--body h1 {\n          color: #252525 !important;\n          font-size: 1.6rem;\n          font-weight: bold;\n          text-align: center;\n          margin-top: 1rem;\n        }\n        .fbs-top-article--body p {\n          text-align: center;\n          margin-bottom: 0;\n          color: #252525;\n        }\n        .fbs-top-article--body p:first-of-type {\n          font-size: 0.9rem;\n        }\n        .fbs-sub-article-container {\n          display: flex;\n          flex-direction: row;\n          flex-wrap: wrap;\n\n          padding-top: 1.75rem;\n          margin-left: -1rem;\n          margin-rigth: -1rem;\n        }\n        .fbs-sub-article {\n          width: calc(50% - 2rem);\n          min-width: 350px;\n          display: flex;\n          flex-direction: row;\n          flex: 1 1 auto;\n          margin: 0 1rem 1.75rem;\n        }\n        .fbs-sub-article img {\n          margin-right: 1rem;\n          width: 100px;\n          max-height: 100px;\n          object-fit: contain;\n        }\n        .fbs-sub-article p {\n          margin-bottom: 0;\n          font-size: 0.8rem;\n          color: #252525;\n        }\n        .fbs-sub-article .fbs-sub-article--title {\n          font-weight: bold;\n          font-size: 1rem;\n          color: #252525;\n        }\n      '
     )
   );
 };
@@ -12326,13 +12326,17 @@ var ArticleQueue = function (_React$Component) {
 
     _initialiseProps.call(_this);
 
-    var _this$props$article$s = _this.props.article.seo;
+    var _this$props$article = _this.props.article,
+        summary = _this$props$article.summary,
+        _this$props$article$s = _this$props$article.seo;
     _this$props$article$s = _this$props$article$s === undefined ? {
       meta_description: null
     } : _this$props$article$s;
     var description = _this$props$article$s.meta_description;
 
     var targeting = _this.getTargeting(_this.props.article);
+    var metaDescription = description ? description : summary ? summary : _this.getFirstLine(_this.props.article);
+
     _this.state = {
       config: {
         navComponent: _this.props.website.navigation,
@@ -12344,7 +12348,7 @@ var ArticleQueue = function (_React$Component) {
         isLiveSite: _this.props.isLiveSite
       },
       title: _this.props.article.title,
-      summary: description ? description : _this.props.article.summary,
+      summary: metaDescription,
       queueData: [_this.props.article],
       relatedArticles: [],
       keywords: []
@@ -12378,6 +12382,8 @@ var ArticleQueue = function (_React$Component) {
     value: function componentWillUnmount() {
       window.removeEventListener('scroll', this.scrollDirectionDetect);
     }
+    // To return the 1st Line of text in the article body
+
   }, {
     key: 'render',
     value: function render() {
@@ -12385,11 +12391,11 @@ var ArticleQueue = function (_React$Component) {
 
       var _state = this.state,
           config = _state.config,
-          _state$keywords = _state.keywords,
-          keywords = _state$keywords === undefined ? [] : _state$keywords,
           queueData = _state.queueData,
           title = _state.title,
-          summary = _state.summary;
+          summary = _state.summary,
+          _state$keywords = _state.keywords,
+          keywords = _state$keywords === undefined ? [] : _state$keywords;
       var _props = this.props,
           website = _props.website,
           shareOptions = _props.shareOptions;
@@ -12548,18 +12554,47 @@ var _initialiseProps = function _initialiseProps() {
     return null;
   };
 
+  this.getFirstLine = function (article) {
+    var _article$body = article.body,
+        body = _article$body === undefined ? [] : _article$body;
+
+    var desc = '';
+    body.some(function (children) {
+      children.children && children.children.some(function (item) {
+        if (item.text && String(item.text).trim().length > 0 && desc == '') {
+          console.log(String(item.text));
+          desc = String(item.text);
+          return true;
+        }
+      });
+      if (desc !== '') {
+        return true;
+      }
+    });
+    return desc;
+  };
+
   this.refreshAdd = function (path) {
     var article = _this3.state.queueData.find(function (item) {
       return item.url.current == path;
     });
     var title = article.title,
         summary = article.summary,
+        _article$internalTag2 = article.internalTag,
+        internalTag = _article$internalTag2 === undefined ? [] : _article$internalTag2,
+        _article$userDefinedT2 = article.userDefinedTag,
+        userDefinedTag = _article$userDefinedT2 === undefined ? [] : _article$userDefinedT2,
+        _article$SponsorshipT2 = article.SponsorshipTag,
+        SponsorshipTag = _article$SponsorshipT2 === undefined ? [] : _article$SponsorshipT2,
+        _article$seoTag2 = article.seoTag,
+        seoTag = _article$seoTag2 === undefined ? [] : _article$seoTag2,
         _article$seo = article.seo;
     _article$seo = _article$seo === undefined ? {
       meta_description: null
     } : _article$seo;
     var description = _article$seo.meta_description;
 
+    var keywords = [].concat(_babelHelpers.toConsumableArray(internalTag), _babelHelpers.toConsumableArray(userDefinedTag), _babelHelpers.toConsumableArray(SponsorshipTag), _babelHelpers.toConsumableArray(seoTag));
     var config = _babelHelpers._extends({}, _this3.state.config);
     var targeting = _this3.getTargeting(article);
     var rightItems = [];
@@ -12572,7 +12607,8 @@ var _initialiseProps = function _initialiseProps() {
     var horizontalAD = _this3.props.Ads.getHorizontal(targeting);
     config.rightItems = rightItems;
     config.horizontalAD = horizontalAD;
-    _this3.setState({ config: config, title: title, summary: description ? description : summary }, function () {
+    var metaDescription = description ? description : summary ? summary : _this3.getFirstLine(article);
+    _this3.setState({ config: config, title: title, summary: metaDescription }, function () {
       index.lib_3.refresh();
     });
   };
@@ -12580,19 +12616,26 @@ var _initialiseProps = function _initialiseProps() {
   this.changeUrl = function (path, visibility) {
     var isScrollDown = _this3.isScrollDown;
 
+    var newPath = '/view/' + path;
     if (!isScrollDown) {
       if (visibility == 'top') {
-        window.history.pushState({ page: path }, path, '/view/' + path);
-        _this3.setState({ keywords: [1] });
+        // Router.push('/view/[url]', newPath, {shallow:true})
+        window.history.pushState({ page: path }, path, newPath);
+        if (_this3.props.pageview) {
+          _this3.props.pageview(newPath);
+        }
+
         _this3.refreshAdd(path);
-        // Router.push('/view/[url]', `/view/${path}`, {shallow:true})
       }
     } else {
       if (visibility == 'bottom') {
-        window.history.pushState({ page: path }, path, '/view/' + path);
-        _this3.setState({ keywords: [1] });
+        // Router.push('/view/[url]', newPath, {shallow:true})
+        window.history.pushState({ page: path }, path, newPath);
+        if (_this3.props.pageview) {
+          _this3.props.pageview(newPath);
+        }
+
         _this3.refreshAdd(path);
-        // Router.push('/view/[url]', `/view/${path}`, {shallow:true})
       }
     }
   };

package/dist/esm/MasterDeck.js

@@ -195,7 +195,7 @@ var MasterDeck = function (_React$Component) {
                 onChange: function onChange(isVisible) {
                   isVisible && _this.changePageNumber(pageNumber);
                 } },
-              React__default.createElement(_this2.Deck, { data: row, variant: variant, index: index, client: _this.props.client, defaultImage: defaultImage })
+              React__default.createElement(_this2.Deck, { data: row, variant: variant, index: index, client: _this.props.client, defaultImage: _this.defaultImage })
             ),
             main_36 && _this.rightItems && (index + 1) % numberOfItemsBeforeAd === 0 && React__default.createElement(
               'div',

package/dist/esm/index.js

@@ -11402,7 +11402,7 @@ var fbsHero = function fbsHero(props) {
     React__default.createElement(
       'style',
       { jsx: 'true' },
-      '\n        .article-hero {\n          margin-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n          padding-bottom: 0.5rem;\n        }\n        .fbs-top-article {\n          width: 100%;\n          margin-bottom: 1rem;\n          padding-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n        }\n        .fbs-top-article img {\n          width: 100%;\n          height: auto;\n          max-height: 375px;\n          object-fit: cover;\n        }\n        \n        .fbs-top-article--body {\n        }\n        .fbs-top-article--body h1 {\n          color: #252525 !important;\n          font-size: 1.6rem;\n          font-weight: bold;\n          text-align: center;\n          margin-top: 1rem;\n        }\n        .fbs-top-article--body p {\n          text-align: center;\n          margin-bottom: 0;\n          color: #252525;\n        }\n        .fbs-top-article--body p:first-of-type {\n          font-size: 0.9rem;\n        }\n        .fbs-sub-article-container {\n          display: flex;\n          flex-direction: row;\n          flex-wrap: wrap;\n\n          padding-top: 1.75rem;\n          margin-left: -1rem;\n          margin-rigth: -1rem;\n        }\n        .fbs-sub-article {\n          width: calc(50% - 2rem);\n          min-width: 350px;\n          display: flex;\n          flex-direction: row;\n          flex: 1 1 auto;\n          margin: 0 1rem 1.75rem;\n        }\n        .fbs-sub-article img {\n          margin-right: 1rem;\n          width: 100px;\n          max-height: 100px;\n          object-fit: contain;\n        }\n        .fbs-sub-article p {\n          margin-bottom: 0;\n          font-size: 0.8rem;\n          color: #252525;\n        }\n        .fbs-sub-article .fbs-sub-article--title {\n          font-weight: bold;\n          font-size: 1rem;\n          color: #252525;\n        }\n      '
+      '\n        .article-hero {\n          margin-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n          padding-bottom: 0.5rem;\n        }\n        .fbs-top-article {\n          width: 100%;\n          margin-bottom: 1rem;\n          padding-bottom: 1rem;\n          border-bottom: 1px solid #ddd;\n        }\n        .fbs-top-article img {\n          width: 100%;\n\n          max-height: 300px;\n          min-height: 275px;\n          object-fit: cover;\n          height: 112.5px;\n        }\n\n        .fbs-top-article--body {\n        }\n        .fbs-top-article--body h1 {\n          color: #252525 !important;\n          font-size: 1.6rem;\n          font-weight: bold;\n          text-align: center;\n          margin-top: 1rem;\n        }\n        .fbs-top-article--body p {\n          text-align: center;\n          margin-bottom: 0;\n          color: #252525;\n        }\n        .fbs-top-article--body p:first-of-type {\n          font-size: 0.9rem;\n        }\n        .fbs-sub-article-container {\n          display: flex;\n          flex-direction: row;\n          flex-wrap: wrap;\n\n          padding-top: 1.75rem;\n          margin-left: -1rem;\n          margin-rigth: -1rem;\n        }\n        .fbs-sub-article {\n          width: calc(50% - 2rem);\n          min-width: 350px;\n          display: flex;\n          flex-direction: row;\n          flex: 1 1 auto;\n          margin: 0 1rem 1.75rem;\n        }\n        .fbs-sub-article img {\n          margin-right: 1rem;\n          width: 100px;\n          max-height: 100px;\n          object-fit: contain;\n        }\n        .fbs-sub-article p {\n          margin-bottom: 0;\n          font-size: 0.8rem;\n          color: #252525;\n        }\n        .fbs-sub-article .fbs-sub-article--title {\n          font-weight: bold;\n          font-size: 1rem;\n          color: #252525;\n        }\n      '
     )
   );
 };
@@ -12324,13 +12324,17 @@ var ArticleQueue = function (_React$Component) {
 
     _initialiseProps.call(_this);
 
-    var _this$props$article$s = _this.props.article.seo;
+    var _this$props$article = _this.props.article,
+        summary = _this$props$article.summary,
+        _this$props$article$s = _this$props$article.seo;
     _this$props$article$s = _this$props$article$s === undefined ? {
       meta_description: null
     } : _this$props$article$s;
     var description = _this$props$article$s.meta_description;
 
     var targeting = _this.getTargeting(_this.props.article);
+    var metaDescription = description ? description : summary ? summary : _this.getFirstLine(_this.props.article);
+
     _this.state = {
       config: {
         navComponent: _this.props.website.navigation,
@@ -12342,7 +12346,7 @@ var ArticleQueue = function (_React$Component) {
         isLiveSite: _this.props.isLiveSite
       },
       title: _this.props.article.title,
-      summary: description ? description : _this.props.article.summary,
+      summary: metaDescription,
       queueData: [_this.props.article],
       relatedArticles: [],
       keywords: []
@@ -12376,6 +12380,8 @@ var ArticleQueue = function (_React$Component) {
     value: function componentWillUnmount() {
       window.removeEventListener('scroll', this.scrollDirectionDetect);
     }
+    // To return the 1st Line of text in the article body
+
   }, {
     key: 'render',
     value: function render() {
@@ -12383,11 +12389,11 @@ var ArticleQueue = function (_React$Component) {
 
       var _state = this.state,
           config = _state.config,
-          _state$keywords = _state.keywords,
-          keywords = _state$keywords === undefined ? [] : _state$keywords,
           queueData = _state.queueData,
           title = _state.title,
-          summary = _state.summary;
+          summary = _state.summary,
+          _state$keywords = _state.keywords,
+          keywords = _state$keywords === undefined ? [] : _state$keywords;
       var _props = this.props,
           website = _props.website,
           shareOptions = _props.shareOptions;
@@ -12546,18 +12552,47 @@ var _initialiseProps = function _initialiseProps() {
     return null;
   };
 
+  this.getFirstLine = function (article) {
+    var _article$body = article.body,
+        body = _article$body === undefined ? [] : _article$body;
+
+    var desc = '';
+    body.some(function (children) {
+      children.children && children.children.some(function (item) {
+        if (item.text && String(item.text).trim().length > 0 && desc == '') {
+          console.log(String(item.text));
+          desc = String(item.text);
+          return true;
+        }
+      });
+      if (desc !== '') {
+        return true;
+      }
+    });
+    return desc;
+  };
+
   this.refreshAdd = function (path) {
     var article = _this3.state.queueData.find(function (item) {
       return item.url.current == path;
     });
     var title = article.title,
         summary = article.summary,
+        _article$internalTag2 = article.internalTag,
+        internalTag = _article$internalTag2 === undefined ? [] : _article$internalTag2,
+        _article$userDefinedT2 = article.userDefinedTag,
+        userDefinedTag = _article$userDefinedT2 === undefined ? [] : _article$userDefinedT2,
+        _article$SponsorshipT2 = article.SponsorshipTag,
+        SponsorshipTag = _article$SponsorshipT2 === undefined ? [] : _article$SponsorshipT2,
+        _article$seoTag2 = article.seoTag,
+        seoTag = _article$seoTag2 === undefined ? [] : _article$seoTag2,
         _article$seo = article.seo;
     _article$seo = _article$seo === undefined ? {
       meta_description: null
     } : _article$seo;
     var description = _article$seo.meta_description;
 
+    var keywords = [].concat(toConsumableArray(internalTag), toConsumableArray(userDefinedTag), toConsumableArray(SponsorshipTag), toConsumableArray(seoTag));
     var config = _extends$2({}, _this3.state.config);
     var targeting = _this3.getTargeting(article);
     var rightItems = [];
@@ -12570,7 +12605,8 @@ var _initialiseProps = function _initialiseProps() {
     var horizontalAD = _this3.props.Ads.getHorizontal(targeting);
     config.rightItems = rightItems;
     config.horizontalAD = horizontalAD;
-    _this3.setState({ config: config, title: title, summary: description ? description : summary }, function () {
+    var metaDescription = description ? description : summary ? summary : _this3.getFirstLine(article);
+    _this3.setState({ config: config, title: title, summary: metaDescription }, function () {
       lib_3.refresh();
     });
   };
@@ -12578,19 +12614,26 @@ var _initialiseProps = function _initialiseProps() {
   this.changeUrl = function (path, visibility) {
     var isScrollDown = _this3.isScrollDown;
 
+    var newPath = '/view/' + path;
     if (!isScrollDown) {
       if (visibility == 'top') {
-        window.history.pushState({ page: path }, path, '/view/' + path);
-        _this3.setState({ keywords: [1] });
+        // Router.push('/view/[url]', newPath, {shallow:true})
+        window.history.pushState({ page: path }, path, newPath);
+        if (_this3.props.pageview) {
+          _this3.props.pageview(newPath);
+        }
+
         _this3.refreshAdd(path);
-        // Router.push('/view/[url]', `/view/${path}`, {shallow:true})
       }
     } else {
       if (visibility == 'bottom') {
-        window.history.pushState({ page: path }, path, '/view/' + path);
-        _this3.setState({ keywords: [1] });
+        // Router.push('/view/[url]', newPath, {shallow:true})
+        window.history.pushState({ page: path }, path, newPath);
+        if (_this3.props.pageview) {
+          _this3.props.pageview(newPath);
+        }
+
         _this3.refreshAdd(path);
-        // Router.push('/view/[url]', `/view/${path}`, {shallow:true})
       }
     }
   };

package/package.json

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