@mjhls/mjh-framework 1.0.766 → 1.0.767
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/cjs/MediaSeriesLanding.js +3 -3
- package/dist/cjs/SeriesListingDeck.js +12 -9
- package/dist/cjs/{SeriesSlider-201b2289.js → SeriesSlider-8b500128.js} +18 -17
- package/dist/cjs/View.js +3 -4
- package/dist/cjs/index.js +1 -1
- package/dist/esm/MediaSeriesLanding.js +3 -3
- package/dist/esm/SeriesListingDeck.js +12 -9
- package/dist/esm/{SeriesSlider-fb768a55.js → SeriesSlider-00ad2992.js} +18 -17
- package/dist/esm/View.js +3 -4
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
# mjh-framework v. 1.0.
|
|
2
|
+
# mjh-framework v. 1.0.767
|
|
3
3
|
|
|
4
4
|
[](https://www.npmjs.com/package/mjh-framework) [](https://standardjs.com)
|
|
5
5
|
|
|
@@ -18,7 +18,7 @@ require('./toConsumableArray-cf0865fc.js');
|
|
|
18
18
|
require('./slicedToArray-db24842a.js');
|
|
19
19
|
require('./index-d48b231c.js');
|
|
20
20
|
require('./index.es-f3e47207.js');
|
|
21
|
-
require('./SeriesSlider-
|
|
21
|
+
require('./SeriesSlider-8b500128.js');
|
|
22
22
|
require('./index-187c967e.js');
|
|
23
23
|
require('./index-80f57cff.js');
|
|
24
24
|
require('react-dom');
|
|
@@ -36,7 +36,7 @@ var _this = undefined;
|
|
|
36
36
|
var Filter = function Filter(_ref) {
|
|
37
37
|
var filterData = _ref.filterData;
|
|
38
38
|
|
|
39
|
-
if (!filterData.series) return null;
|
|
39
|
+
if (!filterData.series || filterData.series.length == 0) return null;
|
|
40
40
|
return React__default['default'].createElement(
|
|
41
41
|
Dropdown__default['default'],
|
|
42
42
|
{ className: 'mb-3' },
|
|
@@ -89,7 +89,7 @@ MediaSeriesLanding.getInitialData = function () {
|
|
|
89
89
|
to: start + itemsPerPage,
|
|
90
90
|
url: pathname
|
|
91
91
|
};
|
|
92
|
-
seriesQuery = '*[_type == \'documentGroup\' && identifier.current == \'' + identifier + '\'][0]{\n _id,\n name,\n identifier,\n \'series\': *[_type == \'documentGroup\' && references(^._id) && isSeries != false]{\n _id,\n name,\n identifier,\n \'articles\': \n *[!(_id in path("drafts.**")) \n && _type == "article"\n && defined(title)\n && is_visible\n && defined(url)\n && references(^._id)\n && passwordLock != true\n && defined(published)\n && dateTime(published) <= dateTime(now())\n ] | order(published desc) {\n ...,\n title,\n summary,\n thumbnail,\n url,\n published,\n authorMapping[0]->,\n taxonomyMapping[]->,\n contentCategory->,\n \'pageNumber\': ' + currentPage + '\n }\n\n }\n}';
|
|
92
|
+
seriesQuery = '*[_type == \'documentGroup\' && identifier.current == \'' + identifier + '\'][0]{\n _id,\n name,\n identifier,\n \'series\': *[_type == \'documentGroup\' && references(^._id) && isSeries != false][$from...$to]{\n _id,\n name,\n identifier,\n \'articles\': \n *[!(_id in path("drafts.**")) \n && _type == "article"\n && defined(title)\n && is_visible\n && defined(url)\n && references(^._id)\n && passwordLock != true\n && defined(published)\n && dateTime(published) <= dateTime(now())\n ] | order(published desc) {\n ...,\n title,\n summary,\n thumbnail,\n url,\n published,\n authorMapping[0]->,\n taxonomyMapping[]->,\n contentCategory->,\n \'pageNumber\': ' + currentPage + '\n }\n\n }\n}';
|
|
93
93
|
_context.next = 9;
|
|
94
94
|
return client.fetch(seriesQuery, params);
|
|
95
95
|
|
|
@@ -6,7 +6,7 @@ var slicedToArray = require('./slicedToArray-db24842a.js');
|
|
|
6
6
|
var React = require('react');
|
|
7
7
|
require('./index-d48b231c.js');
|
|
8
8
|
var index_es = require('./index.es-f3e47207.js');
|
|
9
|
-
var SeriesSlider = require('./SeriesSlider-
|
|
9
|
+
var SeriesSlider = require('./SeriesSlider-8b500128.js');
|
|
10
10
|
require('./_commonjsHelpers-06173234.js');
|
|
11
11
|
require('./es6.string.iterator-20d42c53.js');
|
|
12
12
|
require('./_to-object-821a2927.js');
|
|
@@ -77,27 +77,26 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
77
77
|
};
|
|
78
78
|
|
|
79
79
|
var loadData = function loadData(values, query, client, params, setSeriesData, setScrolling) {
|
|
80
|
-
console.log('scrollling');
|
|
81
|
-
|
|
82
80
|
params = _extends._extends({}, params, {
|
|
83
81
|
from: values.from,
|
|
84
82
|
to: values.to
|
|
85
83
|
});
|
|
86
84
|
|
|
87
85
|
client.fetch(query, params).then(function (dataArr) {
|
|
88
|
-
if (!dataArr) {
|
|
89
|
-
dataArr = [];
|
|
86
|
+
if (!dataArr.series) {
|
|
87
|
+
dataArr.series = [];
|
|
90
88
|
}
|
|
91
89
|
|
|
92
|
-
dataArr = dataArr.map(function (item) {
|
|
90
|
+
dataArr.series = dataArr.series.map(function (item) {
|
|
93
91
|
return _extends._extends({}, item, {
|
|
94
92
|
pageNumber: values.page
|
|
95
93
|
});
|
|
96
94
|
});
|
|
97
95
|
|
|
98
|
-
if (dataArr.length > 0) {
|
|
96
|
+
if (dataArr.series.length > 0) {
|
|
99
97
|
setSeriesData(function (prevData) {
|
|
100
|
-
|
|
98
|
+
var newArr = [].concat(toConsumableArray._toConsumableArray(prevData), toConsumableArray._toConsumableArray(dataArr.series));
|
|
99
|
+
return newArr;
|
|
101
100
|
});
|
|
102
101
|
setScrolling(true);
|
|
103
102
|
} else {
|
|
@@ -111,7 +110,6 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
111
110
|
React.useEffect(function () {
|
|
112
111
|
if (prevValues) {
|
|
113
112
|
if (values.page !== prevValues.page && values.from !== prevValues.from && values.to !== prevValues.from) {
|
|
114
|
-
console.log(values, query, params, 'FROM ISNIDE USE EFFECT');
|
|
115
113
|
loadData(values, query, client, params, setSeriesData, setScrolling);
|
|
116
114
|
}
|
|
117
115
|
}
|
|
@@ -149,6 +147,11 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
149
147
|
series.name
|
|
150
148
|
)
|
|
151
149
|
),
|
|
150
|
+
series.articles && series.articles.length == 0 && React__default['default'].createElement(
|
|
151
|
+
'p',
|
|
152
|
+
{ className: 'mt-2 ml-2' },
|
|
153
|
+
'Please check back for more content.'
|
|
154
|
+
),
|
|
152
155
|
series.articles && series.articles.length > 0 && React__default['default'].createElement(SeriesSlider.SeriesSlider, _extends._extends({}, props, { dataset: series.articles, client: client }))
|
|
153
156
|
);
|
|
154
157
|
})
|
|
@@ -102,7 +102,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
102
102
|
}
|
|
103
103
|
}
|
|
104
104
|
if (viewableWindow.current.offsetWidth < 604) {
|
|
105
|
-
thumbSize = Math.floor((viewableArea.current.clientWidth - tileDividerWidth * 2) /
|
|
105
|
+
thumbSize = Math.floor((viewableArea.current.clientWidth - tileDividerWidth * 2) / 2);
|
|
106
106
|
if (dataset.length > 3) {
|
|
107
107
|
scrollerVisible = true;
|
|
108
108
|
}
|
|
@@ -124,7 +124,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
124
124
|
if (thumbSize !== tileSize) {
|
|
125
125
|
if (thumbSize > 372) thumbSize = 372;
|
|
126
126
|
setTileSize(thumbSize);
|
|
127
|
-
setTileHeight(Math.round(0.
|
|
127
|
+
setTileHeight(Math.round(0.578 * thumbSize));
|
|
128
128
|
setScrollPosition(0);
|
|
129
129
|
setShowScroller(scrollerVisible);
|
|
130
130
|
var videoRows = document.querySelectorAll('.vid-slider .row');
|
|
@@ -138,18 +138,19 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
138
138
|
}
|
|
139
139
|
};
|
|
140
140
|
//scrolls to active video
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
}
|
|
141
|
+
// useEffect(() => {
|
|
142
|
+
// let activeVideo = document.querySelector('.tile__media.active')
|
|
143
|
+
// if(activeVideo){
|
|
144
|
+
// setTimeout(() => {
|
|
145
|
+
// activeVideo.scrollIntoView({
|
|
146
|
+
// behavior: 'smooth',
|
|
147
|
+
// block: 'nearest',
|
|
148
|
+
// inline: 'nearest'
|
|
149
|
+
// })
|
|
150
|
+
// },1000)
|
|
151
|
+
|
|
152
|
+
// }
|
|
153
|
+
// },[])
|
|
153
154
|
|
|
154
155
|
var variant = dark ? 'white' : '#383838';
|
|
155
156
|
|
|
@@ -276,7 +277,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
276
277
|
),
|
|
277
278
|
nowPlaying == article.title && React__default['default'].createElement(
|
|
278
279
|
'span',
|
|
279
|
-
{ style: { position: 'absolute', top: '0', right: '0', background: 'rgba(0,0,0,.75)', color: '#
|
|
280
|
+
{ style: { position: 'absolute', padding: '0 .25rem', top: '0', right: '0', background: 'rgba(0,0,0,.75)', color: '#eee', fontWeight: 'normal', fontSize: '14px' } },
|
|
280
281
|
'Now Viewing'
|
|
281
282
|
)
|
|
282
283
|
),
|
|
@@ -287,7 +288,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
287
288
|
'span',
|
|
288
289
|
null,
|
|
289
290
|
'EP. ',
|
|
290
|
-
index$2
|
|
291
|
+
dataset.length - index$2,
|
|
291
292
|
': ',
|
|
292
293
|
article.title
|
|
293
294
|
) : article.title
|
|
@@ -300,7 +301,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
300
301
|
React__default['default'].createElement(
|
|
301
302
|
'style',
|
|
302
303
|
{ jsx: 'true' },
|
|
303
|
-
'\n .vid-slider * {\n box-sizing: border-box;\n -ms-overflow-style: none;\n }\n .vid-slider::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row {\n margin: 0 -
|
|
304
|
+
'\n .vid-slider * {\n box-sizing: border-box;\n -ms-overflow-style: none;\n }\n .vid-slider::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row {\n margin: 0 -14px;\n }\n .vid-slider .row::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider {\n position: relative;\n -ms-overflow-style: none;\n padding: 0 2.5rem;\n margin-bottom: 2rem;\n max-width: 800px;\n margin-left: auto;\n margin-right: auto;\n }\n .vid-slider.col {\n padding: 0 1.15rem 0 2.75rem;\n }\n .vid-slider .now-playing {\n position: absolute;\n top: 0.5rem;\n left: 1rem;\n color: white;\n background: rgba(0, 0, 0, 0.75);\n }\n .vid-slider h1,\n .vid-slider p {\n text-align: center;\n width: 100%;\n max-width: 500px;\n margin: auto;\n }\n .vid-slider a:link,\n .vid-slider a:hover,\n .vid-slider a:active,\n .vid-slider a:visited {\n transition: color 150ms;\n color: #95a5a6;\n text-decoration: none;\n }\n .vid-slider .contain {\n width: 100%;\n }\n .vid-slider .row {\n overflow-x: hidden;\n width: 100%;\n -ms-overflow-style: none;\n overflow-y: hidden !important;\n }\n .vid-slider .tile__info {\n white-space: normal !important;\n position: absolute;\n width: 100%;\n text-align: center;\n color: ' + (dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: 0.9rem;\n font-weight: bold;\n transition: opacity 0.25s;\n }\n .vid-slider .row__inner {\n display: flex;\n transition: 450ms -webkit-transform;\n transition: 450ms transform;\n transition: 450ms transform, 450ms -webkit-transform;\n font-size: 0;\n white-space: nowrap;\n margin-top: 1.5rem !important;\n padding-bottom: 10px;\n padding-left: 0;\n }\n .vid-slider .tile {\n position: relative;\n display: inline-block;\n height: 100%;\n margin-right: 0.5rem;\n font-size: 20px;\n cursor: pointer;\n transition: 450ms all;\n -webkit-transform-origin: center left;\n transform-origin: center left;\n }\n .vid-slider .tile:first-child {\n margin-left: 0;\n }\n .vid-slider .tile__img {\n height: auto;\n border-radius: 3px;\n -o-object-fit: cover;\n object-fit: cover;\n object-position: center;\n }\n .vid-slider .tile__details {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n top: 0;\n font-size: 10px;\n opacity: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);\n transition: 450ms opacity;\n }\n .vid-slider .tile__details:after,\n .vid-slider .tile__details:before {\n content: \'\';\n\n position: absolute;\n top: 50%;\n left: 50%;\n display: #000;\n }\n .vid-slider .tile__details:after {\n margin-top: -25px;\n margin-left: -25px;\n width: 50px;\n height: 50px;\n border: 3px solid #ecf0f1;\n line-height: 50px;\n text-align: center;\n border-radius: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1;\n }\n .vid-slider .tile__details:before {\n content: \'\';\n background: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 64 64\' width=\'64\' height=\'64\' fill=\'white\'><path d=\'M26 46 L46 32 L26 18 Z\'/></svg>")\n no-repeat center center;\n left: 0;\n width: 100%;\n height: 3rem;\n font-size: 30px;\n margin-right: 12px;\n margin-top: -24px;\n text-align: center;\n z-index: 2;\n color: white;\n }\n\n .tile__media {\n overflow: hidden;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);\n border-radius: 3px;\n }\n\n .vid-slider .tile__title {\n white-space: normal !important;\n max-width: ' + tileSize + 'px;\n text-align: center;\n color: ' + (dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: ' + (main.main_39 ? '0.75rem' : '0.9rem') + ';\n font-weight: normal;\n transition: opacity 0.25s;\n }\n\n .vid-slider .tile__slider-prev,\n .vid-slider .tile__slider-next {\n width: 30px;\n background: transparent;\n border: none;\n position: absolute;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n margin-left: 10px;\n margin-right: 10px;\n box-shadow: 1px 3px 7px rgba(0, 0, 0, 0.5);\n }\n .vid-slider .tile__slider-prev {\n left: -.9rem;\n padding: 1rem;\n }\n .vid-slider .tile__slider-next {\n right: -0.5rem;\n padding: 1rem;\n }\n .vid-slider,\n .vid-slider .row {\n padding-right: 0 1.2rem;\n }\n\n .vid-slider .row::-webkit-scrollbar-thumb {\n background-color: transparent !important;\n }\n .vid-slider i {\n border: solid ' + (dark ? 'white' : 'black') + ';\n border-width: 0 4px 4px 0;\n display: inline-block;\n padding: 4px;\n pointer-events: none;\n }\n .vid-slider .right {\n transform: rotate(-45deg);\n -webkit-transform: rotate(-45deg);\n }\n .vid-slider .left {\n transform: rotate(135deg);\n -webkit-transform: rotate(135deg);\n }\n .vidHolder {\n max-width: 805px;\n }\n @media screen and (max-width: 1399px) {\n .vid-slider {\n max-width: 615px;\n margin: 0 auto;\n }\n .vid-slider .tile__img {\n }\n }\n @media screen and (max-width: 1200px) {\n .vid-slider {\n max-width: 580px;\n }\n }\n @media screen and (max-width: 967px) {\n .vid-slider {\n max-width: 100%;\n }\n .vid-slider .tile__img {\n }\n }\n\n @media screen and (max-width: 768px) {\n #vidHolder {\n position: unset;\n width: 100%;\n }\n\n .vid-slider .tile__img {\n }\n .vid-slider .row__inner {\n margin-top: 1.5rem !important;\n }\n }\n\n @media screen and (max-width: 590px) {\n .vid-slider .tile__img {\n }\n }\n '
|
|
304
305
|
)
|
|
305
306
|
);
|
|
306
307
|
};
|
package/dist/cjs/View.js
CHANGED
|
@@ -18,7 +18,7 @@ var Button = require('react-bootstrap/Button');
|
|
|
18
18
|
var getSerializers = require('./index-33d0daca.js');
|
|
19
19
|
var SocialShare = require('./SocialShare.js');
|
|
20
20
|
var AdSlot = require('./AdSlot.js');
|
|
21
|
-
var SeriesSlider = require('./SeriesSlider-
|
|
21
|
+
var SeriesSlider = require('./SeriesSlider-8b500128.js');
|
|
22
22
|
var getTargeting = require('./getTargeting-497b581d.js');
|
|
23
23
|
var getKeywords = require('./getKeywords.js');
|
|
24
24
|
var urlFor = require('./urlFor.js');
|
|
@@ -935,9 +935,8 @@ var Article = function Article(props) {
|
|
|
935
935
|
if (!sliderData) return null;
|
|
936
936
|
var episode = null;
|
|
937
937
|
sliderData.forEach(function (seriesArticle, index) {
|
|
938
|
-
console.warn(seriesArticle.title, article.title, 'TITLESL:KJSDF:LKSJDF');
|
|
939
938
|
if (seriesArticle.title === article.title) {
|
|
940
|
-
episode =
|
|
939
|
+
episode = sliderData.length - index;
|
|
941
940
|
}
|
|
942
941
|
});
|
|
943
942
|
return episode;
|
|
@@ -1110,7 +1109,7 @@ var Article = function Article(props) {
|
|
|
1110
1109
|
thumbnail && React__default['default'].createElement(
|
|
1111
1110
|
'div',
|
|
1112
1111
|
{ style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
1113
|
-
React__default['default'].createElement('img', { style: { maxWidth: '100%' }, src: urlFor(props.client, thumbnail) })
|
|
1112
|
+
React__default['default'].createElement('img', { style: { maxWidth: '100%', maxHeight: '300px' }, src: urlFor(props.client, thumbnail) })
|
|
1114
1113
|
),
|
|
1115
1114
|
React__default['default'].createElement(SeriesSlider.SeriesSlider, { dataset: props.sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: true })
|
|
1116
1115
|
),
|
package/dist/cjs/index.js
CHANGED
|
@@ -183,7 +183,7 @@ require('./index-bd6c9f56.js');
|
|
|
183
183
|
require('swr');
|
|
184
184
|
require('passport-local');
|
|
185
185
|
require('mysql');
|
|
186
|
-
require('./SeriesSlider-
|
|
186
|
+
require('./SeriesSlider-8b500128.js');
|
|
187
187
|
require('./style-inject.es-dcee06b6.js');
|
|
188
188
|
require('disqus-react');
|
|
189
189
|
require('react-twitter-embed');
|
|
@@ -16,7 +16,7 @@ import './toConsumableArray-fa2dcda7.js';
|
|
|
16
16
|
import './slicedToArray-cdeaee08.js';
|
|
17
17
|
import './index-3f5c03b2.js';
|
|
18
18
|
import './index.es-c6222053.js';
|
|
19
|
-
import './SeriesSlider-
|
|
19
|
+
import './SeriesSlider-00ad2992.js';
|
|
20
20
|
import './index-c7e2ac95.js';
|
|
21
21
|
import './index-752d1dae.js';
|
|
22
22
|
import 'react-dom';
|
|
@@ -29,7 +29,7 @@ var _this = undefined;
|
|
|
29
29
|
var Filter = function Filter(_ref) {
|
|
30
30
|
var filterData = _ref.filterData;
|
|
31
31
|
|
|
32
|
-
if (!filterData.series) return null;
|
|
32
|
+
if (!filterData.series || filterData.series.length == 0) return null;
|
|
33
33
|
return React.createElement(
|
|
34
34
|
Dropdown,
|
|
35
35
|
{ className: 'mb-3' },
|
|
@@ -82,7 +82,7 @@ MediaSeriesLanding.getInitialData = function () {
|
|
|
82
82
|
to: start + itemsPerPage,
|
|
83
83
|
url: pathname
|
|
84
84
|
};
|
|
85
|
-
seriesQuery = '*[_type == \'documentGroup\' && identifier.current == \'' + identifier + '\'][0]{\n _id,\n name,\n identifier,\n \'series\': *[_type == \'documentGroup\' && references(^._id) && isSeries != false]{\n _id,\n name,\n identifier,\n \'articles\': \n *[!(_id in path("drafts.**")) \n && _type == "article"\n && defined(title)\n && is_visible\n && defined(url)\n && references(^._id)\n && passwordLock != true\n && defined(published)\n && dateTime(published) <= dateTime(now())\n ] | order(published desc) {\n ...,\n title,\n summary,\n thumbnail,\n url,\n published,\n authorMapping[0]->,\n taxonomyMapping[]->,\n contentCategory->,\n \'pageNumber\': ' + currentPage + '\n }\n\n }\n}';
|
|
85
|
+
seriesQuery = '*[_type == \'documentGroup\' && identifier.current == \'' + identifier + '\'][0]{\n _id,\n name,\n identifier,\n \'series\': *[_type == \'documentGroup\' && references(^._id) && isSeries != false][$from...$to]{\n _id,\n name,\n identifier,\n \'articles\': \n *[!(_id in path("drafts.**")) \n && _type == "article"\n && defined(title)\n && is_visible\n && defined(url)\n && references(^._id)\n && passwordLock != true\n && defined(published)\n && dateTime(published) <= dateTime(now())\n ] | order(published desc) {\n ...,\n title,\n summary,\n thumbnail,\n url,\n published,\n authorMapping[0]->,\n taxonomyMapping[]->,\n contentCategory->,\n \'pageNumber\': ' + currentPage + '\n }\n\n }\n}';
|
|
86
86
|
_context.next = 9;
|
|
87
87
|
return client.fetch(seriesQuery, params);
|
|
88
88
|
|
|
@@ -4,7 +4,7 @@ import { _ as _slicedToArray } from './slicedToArray-cdeaee08.js';
|
|
|
4
4
|
import React, { useState, useEffect, useRef } from 'react';
|
|
5
5
|
import './index-3f5c03b2.js';
|
|
6
6
|
import { I as InfiniteScroll } from './index.es-c6222053.js';
|
|
7
|
-
import { S as SeriesSlider } from './SeriesSlider-
|
|
7
|
+
import { S as SeriesSlider } from './SeriesSlider-00ad2992.js';
|
|
8
8
|
import './_commonjsHelpers-0c4b6f40.js';
|
|
9
9
|
import './es6.string.iterator-aa6068a3.js';
|
|
10
10
|
import './_to-object-97770c52.js';
|
|
@@ -71,27 +71,26 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
71
71
|
};
|
|
72
72
|
|
|
73
73
|
var loadData = function loadData(values, query, client, params, setSeriesData, setScrolling) {
|
|
74
|
-
console.log('scrollling');
|
|
75
|
-
|
|
76
74
|
params = _extends({}, params, {
|
|
77
75
|
from: values.from,
|
|
78
76
|
to: values.to
|
|
79
77
|
});
|
|
80
78
|
|
|
81
79
|
client.fetch(query, params).then(function (dataArr) {
|
|
82
|
-
if (!dataArr) {
|
|
83
|
-
dataArr = [];
|
|
80
|
+
if (!dataArr.series) {
|
|
81
|
+
dataArr.series = [];
|
|
84
82
|
}
|
|
85
83
|
|
|
86
|
-
dataArr = dataArr.map(function (item) {
|
|
84
|
+
dataArr.series = dataArr.series.map(function (item) {
|
|
87
85
|
return _extends({}, item, {
|
|
88
86
|
pageNumber: values.page
|
|
89
87
|
});
|
|
90
88
|
});
|
|
91
89
|
|
|
92
|
-
if (dataArr.length > 0) {
|
|
90
|
+
if (dataArr.series.length > 0) {
|
|
93
91
|
setSeriesData(function (prevData) {
|
|
94
|
-
|
|
92
|
+
var newArr = [].concat(_toConsumableArray(prevData), _toConsumableArray(dataArr.series));
|
|
93
|
+
return newArr;
|
|
95
94
|
});
|
|
96
95
|
setScrolling(true);
|
|
97
96
|
} else {
|
|
@@ -105,7 +104,6 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
105
104
|
useEffect(function () {
|
|
106
105
|
if (prevValues) {
|
|
107
106
|
if (values.page !== prevValues.page && values.from !== prevValues.from && values.to !== prevValues.from) {
|
|
108
|
-
console.log(values, query, params, 'FROM ISNIDE USE EFFECT');
|
|
109
107
|
loadData(values, query, client, params, setSeriesData, setScrolling);
|
|
110
108
|
}
|
|
111
109
|
}
|
|
@@ -143,6 +141,11 @@ var SeriesListingDeck = function SeriesListingDeck(props) {
|
|
|
143
141
|
series.name
|
|
144
142
|
)
|
|
145
143
|
),
|
|
144
|
+
series.articles && series.articles.length == 0 && React.createElement(
|
|
145
|
+
'p',
|
|
146
|
+
{ className: 'mt-2 ml-2' },
|
|
147
|
+
'Please check back for more content.'
|
|
148
|
+
),
|
|
146
149
|
series.articles && series.articles.length > 0 && React.createElement(SeriesSlider, _extends({}, props, { dataset: series.articles, client: client }))
|
|
147
150
|
);
|
|
148
151
|
})
|
|
@@ -96,7 +96,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
96
96
|
}
|
|
97
97
|
}
|
|
98
98
|
if (viewableWindow.current.offsetWidth < 604) {
|
|
99
|
-
thumbSize = Math.floor((viewableArea.current.clientWidth - tileDividerWidth * 2) /
|
|
99
|
+
thumbSize = Math.floor((viewableArea.current.clientWidth - tileDividerWidth * 2) / 2);
|
|
100
100
|
if (dataset.length > 3) {
|
|
101
101
|
scrollerVisible = true;
|
|
102
102
|
}
|
|
@@ -118,7 +118,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
118
118
|
if (thumbSize !== tileSize) {
|
|
119
119
|
if (thumbSize > 372) thumbSize = 372;
|
|
120
120
|
setTileSize(thumbSize);
|
|
121
|
-
setTileHeight(Math.round(0.
|
|
121
|
+
setTileHeight(Math.round(0.578 * thumbSize));
|
|
122
122
|
setScrollPosition(0);
|
|
123
123
|
setShowScroller(scrollerVisible);
|
|
124
124
|
var videoRows = document.querySelectorAll('.vid-slider .row');
|
|
@@ -132,18 +132,19 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
132
132
|
}
|
|
133
133
|
};
|
|
134
134
|
//scrolls to active video
|
|
135
|
-
useEffect(
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
}
|
|
135
|
+
// useEffect(() => {
|
|
136
|
+
// let activeVideo = document.querySelector('.tile__media.active')
|
|
137
|
+
// if(activeVideo){
|
|
138
|
+
// setTimeout(() => {
|
|
139
|
+
// activeVideo.scrollIntoView({
|
|
140
|
+
// behavior: 'smooth',
|
|
141
|
+
// block: 'nearest',
|
|
142
|
+
// inline: 'nearest'
|
|
143
|
+
// })
|
|
144
|
+
// },1000)
|
|
145
|
+
|
|
146
|
+
// }
|
|
147
|
+
// },[])
|
|
147
148
|
|
|
148
149
|
var variant = dark ? 'white' : '#383838';
|
|
149
150
|
|
|
@@ -270,7 +271,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
270
271
|
),
|
|
271
272
|
nowPlaying == article.title && React.createElement(
|
|
272
273
|
'span',
|
|
273
|
-
{ style: { position: 'absolute', top: '0', right: '0', background: 'rgba(0,0,0,.75)', color: '#
|
|
274
|
+
{ style: { position: 'absolute', padding: '0 .25rem', top: '0', right: '0', background: 'rgba(0,0,0,.75)', color: '#eee', fontWeight: 'normal', fontSize: '14px' } },
|
|
274
275
|
'Now Viewing'
|
|
275
276
|
)
|
|
276
277
|
),
|
|
@@ -281,7 +282,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
281
282
|
'span',
|
|
282
283
|
null,
|
|
283
284
|
'EP. ',
|
|
284
|
-
|
|
285
|
+
dataset.length - index,
|
|
285
286
|
': ',
|
|
286
287
|
article.title
|
|
287
288
|
) : article.title
|
|
@@ -294,7 +295,7 @@ var SeriesSlider = function SeriesSlider(_ref) {
|
|
|
294
295
|
React.createElement(
|
|
295
296
|
'style',
|
|
296
297
|
{ jsx: 'true' },
|
|
297
|
-
'\n .vid-slider * {\n box-sizing: border-box;\n -ms-overflow-style: none;\n }\n .vid-slider::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row {\n margin: 0 -
|
|
298
|
+
'\n .vid-slider * {\n box-sizing: border-box;\n -ms-overflow-style: none;\n }\n .vid-slider::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row::-webkit-scrollbar {\n display: none;\n }\n .vid-slider .row {\n margin: 0 -14px;\n }\n .vid-slider .row::-webkit-scrollbar-thumb {\n display: none;\n }\n .vid-slider {\n position: relative;\n -ms-overflow-style: none;\n padding: 0 2.5rem;\n margin-bottom: 2rem;\n max-width: 800px;\n margin-left: auto;\n margin-right: auto;\n }\n .vid-slider.col {\n padding: 0 1.15rem 0 2.75rem;\n }\n .vid-slider .now-playing {\n position: absolute;\n top: 0.5rem;\n left: 1rem;\n color: white;\n background: rgba(0, 0, 0, 0.75);\n }\n .vid-slider h1,\n .vid-slider p {\n text-align: center;\n width: 100%;\n max-width: 500px;\n margin: auto;\n }\n .vid-slider a:link,\n .vid-slider a:hover,\n .vid-slider a:active,\n .vid-slider a:visited {\n transition: color 150ms;\n color: #95a5a6;\n text-decoration: none;\n }\n .vid-slider .contain {\n width: 100%;\n }\n .vid-slider .row {\n overflow-x: hidden;\n width: 100%;\n -ms-overflow-style: none;\n overflow-y: hidden !important;\n }\n .vid-slider .tile__info {\n white-space: normal !important;\n position: absolute;\n width: 100%;\n text-align: center;\n color: ' + (dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: 0.9rem;\n font-weight: bold;\n transition: opacity 0.25s;\n }\n .vid-slider .row__inner {\n display: flex;\n transition: 450ms -webkit-transform;\n transition: 450ms transform;\n transition: 450ms transform, 450ms -webkit-transform;\n font-size: 0;\n white-space: nowrap;\n margin-top: 1.5rem !important;\n padding-bottom: 10px;\n padding-left: 0;\n }\n .vid-slider .tile {\n position: relative;\n display: inline-block;\n height: 100%;\n margin-right: 0.5rem;\n font-size: 20px;\n cursor: pointer;\n transition: 450ms all;\n -webkit-transform-origin: center left;\n transform-origin: center left;\n }\n .vid-slider .tile:first-child {\n margin-left: 0;\n }\n .vid-slider .tile__img {\n height: auto;\n border-radius: 3px;\n -o-object-fit: cover;\n object-fit: cover;\n object-position: center;\n }\n .vid-slider .tile__details {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n top: 0;\n font-size: 10px;\n opacity: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);\n transition: 450ms opacity;\n }\n .vid-slider .tile__details:after,\n .vid-slider .tile__details:before {\n content: \'\';\n\n position: absolute;\n top: 50%;\n left: 50%;\n display: #000;\n }\n .vid-slider .tile__details:after {\n margin-top: -25px;\n margin-left: -25px;\n width: 50px;\n height: 50px;\n border: 3px solid #ecf0f1;\n line-height: 50px;\n text-align: center;\n border-radius: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1;\n }\n .vid-slider .tile__details:before {\n content: \'\';\n background: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 64 64\' width=\'64\' height=\'64\' fill=\'white\'><path d=\'M26 46 L46 32 L26 18 Z\'/></svg>")\n no-repeat center center;\n left: 0;\n width: 100%;\n height: 3rem;\n font-size: 30px;\n margin-right: 12px;\n margin-top: -24px;\n text-align: center;\n z-index: 2;\n color: white;\n }\n\n .tile__media {\n overflow: hidden;\n display: flex;\n justify-content: center;\n align-items: flex-start;\n box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.5);\n border-radius: 3px;\n }\n\n .vid-slider .tile__title {\n white-space: normal !important;\n max-width: ' + tileSize + 'px;\n text-align: center;\n color: ' + (dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: ' + (main_39 ? '0.75rem' : '0.9rem') + ';\n font-weight: normal;\n transition: opacity 0.25s;\n }\n\n .vid-slider .tile__slider-prev,\n .vid-slider .tile__slider-next {\n width: 30px;\n background: transparent;\n border: none;\n position: absolute;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n margin-left: 10px;\n margin-right: 10px;\n box-shadow: 1px 3px 7px rgba(0, 0, 0, 0.5);\n }\n .vid-slider .tile__slider-prev {\n left: -.9rem;\n padding: 1rem;\n }\n .vid-slider .tile__slider-next {\n right: -0.5rem;\n padding: 1rem;\n }\n .vid-slider,\n .vid-slider .row {\n padding-right: 0 1.2rem;\n }\n\n .vid-slider .row::-webkit-scrollbar-thumb {\n background-color: transparent !important;\n }\n .vid-slider i {\n border: solid ' + (dark ? 'white' : 'black') + ';\n border-width: 0 4px 4px 0;\n display: inline-block;\n padding: 4px;\n pointer-events: none;\n }\n .vid-slider .right {\n transform: rotate(-45deg);\n -webkit-transform: rotate(-45deg);\n }\n .vid-slider .left {\n transform: rotate(135deg);\n -webkit-transform: rotate(135deg);\n }\n .vidHolder {\n max-width: 805px;\n }\n @media screen and (max-width: 1399px) {\n .vid-slider {\n max-width: 615px;\n margin: 0 auto;\n }\n .vid-slider .tile__img {\n }\n }\n @media screen and (max-width: 1200px) {\n .vid-slider {\n max-width: 580px;\n }\n }\n @media screen and (max-width: 967px) {\n .vid-slider {\n max-width: 100%;\n }\n .vid-slider .tile__img {\n }\n }\n\n @media screen and (max-width: 768px) {\n #vidHolder {\n position: unset;\n width: 100%;\n }\n\n .vid-slider .tile__img {\n }\n .vid-slider .row__inner {\n margin-top: 1.5rem !important;\n }\n }\n\n @media screen and (max-width: 590px) {\n .vid-slider .tile__img {\n }\n }\n '
|
|
298
299
|
)
|
|
299
300
|
);
|
|
300
301
|
};
|
package/dist/esm/View.js
CHANGED
|
@@ -16,7 +16,7 @@ import Button from 'react-bootstrap/Button';
|
|
|
16
16
|
import { I as InscreenSensor, r as renderAuthor, g as getSerializers } from './index-47730283.js';
|
|
17
17
|
import SocialShare from './SocialShare.js';
|
|
18
18
|
import DFPAdSlot from './AdSlot.js';
|
|
19
|
-
import { S as SeriesSlider } from './SeriesSlider-
|
|
19
|
+
import { S as SeriesSlider } from './SeriesSlider-00ad2992.js';
|
|
20
20
|
import { g as getTargeting, a as getContentPlacementUrl } from './getTargeting-2d402d66.js';
|
|
21
21
|
import getKeywords from './getKeywords.js';
|
|
22
22
|
import urlFor from './urlFor.js';
|
|
@@ -925,9 +925,8 @@ var Article = function Article(props) {
|
|
|
925
925
|
if (!sliderData) return null;
|
|
926
926
|
var episode = null;
|
|
927
927
|
sliderData.forEach(function (seriesArticle, index) {
|
|
928
|
-
console.warn(seriesArticle.title, article.title, 'TITLESL:KJSDF:LKSJDF');
|
|
929
928
|
if (seriesArticle.title === article.title) {
|
|
930
|
-
episode =
|
|
929
|
+
episode = sliderData.length - index;
|
|
931
930
|
}
|
|
932
931
|
});
|
|
933
932
|
return episode;
|
|
@@ -1100,7 +1099,7 @@ var Article = function Article(props) {
|
|
|
1100
1099
|
thumbnail && React.createElement(
|
|
1101
1100
|
'div',
|
|
1102
1101
|
{ style: { display: 'flex', justifyContent: 'center', alignItems: 'center' } },
|
|
1103
|
-
React.createElement('img', { style: { maxWidth: '100%' }, src: urlFor(props.client, thumbnail) })
|
|
1102
|
+
React.createElement('img', { style: { maxWidth: '100%', maxHeight: '300px' }, src: urlFor(props.client, thumbnail) })
|
|
1104
1103
|
),
|
|
1105
1104
|
React.createElement(SeriesSlider, { dataset: props.sliderData, client: client, nowPlaying: article.title, displayEpisodeNumber: true })
|
|
1106
1105
|
),
|
package/dist/esm/index.js
CHANGED
|
@@ -179,7 +179,7 @@ import './index-db3bb315.js';
|
|
|
179
179
|
import 'swr';
|
|
180
180
|
import 'passport-local';
|
|
181
181
|
import 'mysql';
|
|
182
|
-
import './SeriesSlider-
|
|
182
|
+
import './SeriesSlider-00ad2992.js';
|
|
183
183
|
import './style-inject.es-1f59c1d0.js';
|
|
184
184
|
import 'disqus-react';
|
|
185
185
|
import 'react-twitter-embed';
|