@mjhls/mjh-framework 1.0.321 → 1.0.323

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.
Files changed (60) hide show
  1. package/README.md +1 -1
  2. package/dist/cjs/{ADInfeed-a7a5e9f3.js → ADInfeed-b042a194.js} +1 -1
  3. package/dist/cjs/{AdSlot-fef815e9.js → AdSlot-c5bff604.js} +3 -3
  4. package/dist/cjs/DeckContent.js +8 -9
  5. package/dist/cjs/DeckQueue.js +4 -5
  6. package/dist/cjs/{Dfp-f5e04360.js → Dfp-9ede68c7.js} +2 -3
  7. package/dist/cjs/{Figure-36e6957e.js → Figure-a47ec3a7.js} +2 -3
  8. package/dist/cjs/{GridContent-98e9ab78.js → GridContent-139bbe70.js} +5 -5
  9. package/dist/cjs/GridContent.js +9 -10
  10. package/dist/cjs/GroupDeck.js +119 -21
  11. package/dist/cjs/MasterDeck.js +5 -6
  12. package/dist/cjs/{Normal-972b1cc8.js → Normal-e7423a52.js} +12 -7
  13. package/dist/cjs/QueueDeckExpanded.js +7 -8
  14. package/dist/cjs/{TaxonomyCard-22b72261.js → TaxonomyCard-d8eed035.js} +2 -2
  15. package/dist/cjs/TaxonomyCard.js +1 -1
  16. package/dist/cjs/TemplateNormal.js +6 -7
  17. package/dist/cjs/{Ustream-3a3c56b8.js → Ustream-f5f53782.js} +1 -1
  18. package/dist/cjs/Ustream.js +3 -4
  19. package/dist/cjs/VideoSeriesListing.js +6 -4
  20. package/dist/cjs/YoutubeGroup.js +244 -4
  21. package/dist/cjs/index.js +53 -21
  22. package/dist/cjs/{inherits-be59e8ae.js → inherits-37d5840f.js} +1 -1
  23. package/dist/cjs/{main-753fb093.js → main-987c23c6.js} +1 -1
  24. package/dist/cjs/{promise-e50b2d19.js → promise-3b44b2a3.js} +4 -5
  25. package/dist/cjs/{slicedToArray-bed4d943.js → slicedToArray-879ab2fb.js} +3 -4
  26. package/dist/cjs/smoothscroll-95231a70.js +488 -0
  27. package/dist/cjs/{toConsumableArray-18281c61.js → toConsumableArray-34b5e9a7.js} +3 -4
  28. package/dist/cjs/{web.dom.iterable-0998bdc3.js → web.dom.iterable-8b02d65e.js} +34 -0
  29. package/dist/esm/{ADInfeed-2aaf8622.js → ADInfeed-aadcfc25.js} +1 -1
  30. package/dist/esm/{AdSlot-028b040f.js → AdSlot-8946358f.js} +3 -3
  31. package/dist/esm/DeckContent.js +8 -9
  32. package/dist/esm/DeckQueue.js +4 -5
  33. package/dist/esm/{Dfp-f518314c.js → Dfp-9293acfb.js} +2 -3
  34. package/dist/esm/{Figure-af6a1f2d.js → Figure-584ac0c8.js} +2 -3
  35. package/dist/esm/{GridContent-dd8fe8d1.js → GridContent-ceb53300.js} +5 -5
  36. package/dist/esm/GridContent.js +9 -10
  37. package/dist/esm/GroupDeck.js +120 -22
  38. package/dist/esm/MasterDeck.js +5 -6
  39. package/dist/esm/{Normal-ed829d1e.js → Normal-ff7a10ab.js} +12 -7
  40. package/dist/esm/QueueDeckExpanded.js +7 -8
  41. package/dist/esm/{TaxonomyCard-7e9aae2d.js → TaxonomyCard-35127639.js} +2 -2
  42. package/dist/esm/TaxonomyCard.js +1 -1
  43. package/dist/esm/TemplateNormal.js +6 -7
  44. package/dist/esm/{Ustream-c153a835.js → Ustream-d8cc3cbd.js} +1 -1
  45. package/dist/esm/Ustream.js +3 -4
  46. package/dist/esm/VideoSeriesListing.js +5 -3
  47. package/dist/esm/YoutubeGroup.js +244 -3
  48. package/dist/esm/index.js +52 -21
  49. package/dist/esm/{inherits-9d26445c.js → inherits-cb536901.js} +1 -1
  50. package/dist/esm/{main-d550db5e.js → main-cb86f95d.js} +1 -1
  51. package/dist/esm/{promise-8fc46e97.js → promise-86cb8313.js} +2 -3
  52. package/dist/esm/{slicedToArray-d1db3163.js → slicedToArray-a47a84a4.js} +1 -2
  53. package/dist/esm/smoothscroll-4b699764.js +485 -0
  54. package/dist/esm/{toConsumableArray-a096ca06.js → toConsumableArray-2718dc16.js} +2 -3
  55. package/dist/esm/{web.dom.iterable-3be50d6c.js → web.dom.iterable-7e9bebf9.js} +34 -2
  56. package/package.json +1 -1
  57. package/dist/cjs/YoutubeGroup-24ec8af9.js +0 -693
  58. package/dist/cjs/core.get-iterator-method-e049ca4a.js +0 -39
  59. package/dist/esm/YoutubeGroup-13d88f43.js +0 -687
  60. package/dist/esm/core.get-iterator-method-31c1fb1a.js +0 -36
@@ -1,12 +1,11 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
4
  import './debounce-702eb224.js';
5
- import './main-d550db5e.js';
6
- import './toConsumableArray-a096ca06.js';
7
- import './core.get-iterator-method-31c1fb1a.js';
5
+ import './main-cb86f95d.js';
6
+ import './toConsumableArray-2718dc16.js';
8
7
  import './extends-dbbe308d.js';
9
- import './inherits-9d26445c.js';
8
+ import './inherits-cb536901.js';
10
9
  import 'react';
11
10
  import 'prop-types';
12
11
  import 'react-bootstrap/Container';
@@ -20,9 +19,9 @@ import 'react-dom';
20
19
  import './index-51a80699.js';
21
20
  import './index-5f9f807a.js';
22
21
  import './entities-7cc3bf45.js';
23
- import './slicedToArray-d1db3163.js';
24
- import './AdSlot-028b040f.js';
25
- import './promise-8fc46e97.js';
26
- import './ADInfeed-2aaf8622.js';
22
+ import './slicedToArray-a47a84a4.js';
23
+ import './AdSlot-8946358f.js';
24
+ import './promise-86cb8313.js';
25
+ import './ADInfeed-aadcfc25.js';
27
26
  import './get-36d03764.js';
28
- export { G as default } from './GridContent-dd8fe8d1.js';
27
+ export { G as default } from './GridContent-ceb53300.js';
@@ -1,37 +1,120 @@
1
- import React__default from 'react';
1
+ import './_commonjsHelpers-0c4b6f40.js';
2
+ import './_to-object-b9b796ec.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
+ import React__default, { useRef, useState, useEffect } from 'react';
5
+ import 'prop-types';
2
6
  import 'next/link';
7
+ import 'react-dom';
8
+ import { L as LazyLoad } from './index-5f9f807a.js';
9
+ import { _ as _slicedToArray } from './slicedToArray-a47a84a4.js';
10
+ import { s as smoothscroll, g as getYoutubeId } from './smoothscroll-4b699764.js';
11
+
12
+ /*
13
+ GROQ query -
14
+ accepts an array of title, URL
15
+ `https://img.youtube.com/vi/${getYouTubeId(vid.url)}/hqdefault.jpg`
16
+ */
3
17
 
4
18
  var GroupDeck = function GroupDeck(props) {
5
19
  // Props should be an array of objects containing Thumbnail, title, and URL
20
+ var innerSlider = useRef(null);
21
+ var tile = useRef(null);
22
+ var viewableWindow = useRef(null);
23
+
24
+ var _useState = useState(0),
25
+ _useState2 = _slicedToArray(_useState, 2),
26
+ tileSize = _useState2[0],
27
+ setTileSize = _useState2[1];
28
+
29
+ useEffect(function () {
30
+ //IE11 Polyfill
31
+ smoothscroll.polyfill();
32
+ setThumbSize();
33
+
34
+ window.addEventListener('resize', setThumbSize);
35
+
36
+ return function () {
37
+ return window.removeEventListener('resize', setThumbSize);
38
+ };
39
+ }, []);
40
+
41
+ var setThumbSize = function setThumbSize() {
42
+
43
+ var thumbSize = void 0;
44
+ if (window.innerWidth > 1399) {
45
+ thumbSize = Math.floor(viewableWindow.current.clientWidth / 2 - 48);
46
+ }
47
+ if (window.innerWidth < 1399 && window.innerWidth > 592) {
48
+ thumbSize = Math.floor(viewableWindow.current.clientWidth / 2 - 48);
49
+ }
50
+ if (window.innerWidth < 592) {
51
+ thumbSize = Math.floor(viewableWindow.current.clientWidth / 1.5 - 24);
52
+ }
53
+ if (thumbSize !== tileSize) {
54
+ setTileSize(thumbSize);
55
+ var videoRows = document.querySelectorAll('#vid-slider .row');
56
+ for (var i = 0; i < videoRows.length; i++) {
57
+ videoRows[i].scrollTo({
58
+ left: 0,
59
+ behavior: 'smooth'
60
+ });
61
+ }
62
+ }
63
+ };
64
+
6
65
  var get2 = props.get2 ? '/' + props.get2 + '/' : '/view/';
7
66
 
8
67
  var variant = props.dark ? 'white' : '#383838';
68
+
9
69
  function scrollSlider(e, direction) {
10
70
  var slide = e.target.parentElement;
11
71
  var scrollOffset = slide.scrollLeft;
12
- var viewableWidth = slide.clientWidth > 700 ? 3 * (document.querySelector('.tile').scrollWidth + 8) : document.querySelector('.tile').scrollWidth + 8;
72
+ var viewableWidth = slide.clientWidth;
73
+
74
+ //calculate viewable size / slide
75
+ var numberOfSlidesToScroll = Math.floor(tile.current.clientWidth + 25); //width of the tile plus margin
76
+
13
77
  var scrollDirection = void 0;
78
+
14
79
  if (direction === 'next') {
15
- scrollDirection = scrollOffset + viewableWidth;
80
+ scrollDirection = scrollOffset + numberOfSlidesToScroll;
81
+
82
+ if (scrollOffset + viewableWidth + 25 >= innerSlider.current.offsetWidth) {
83
+ scrollDirection = 0;
84
+ }
16
85
  }
17
86
  if (direction === 'prev') {
18
- scrollDirection = scrollOffset - viewableWidth;
87
+ scrollDirection = scrollOffset - numberOfSlidesToScroll;
88
+
89
+ if (scrollOffset === 0) {
90
+ if (window.innerWidth > 1399) {
91
+ scrollDirection = innerSlider.current.offsetWidth - tileSize * 2 - 40;
92
+ }
93
+ if (window.innerWidth < 1399 && window.innerWidth > 592) {
94
+ scrollDirection = innerSlider.current.offsetWidth - tileSize * 2 - 40;
95
+ }
96
+ if (window.innerWidth < 592) {
97
+ scrollDirection = innerSlider.current.offsetWidth - tileSize * 1.5 - 24;
98
+ }
99
+ }
19
100
  }
20
101
  slide.scrollTo({
21
102
  left: scrollDirection,
22
103
  behavior: 'smooth'
23
104
  });
24
105
  }
106
+
25
107
  function handleClick(url, vidIndex) {
26
108
  props.setState(url, vidIndex);
27
109
  }
110
+
28
111
  var _props$current = props.current,
29
112
  current = _props$current === undefined ? '' : _props$current;
30
113
 
31
114
 
32
115
  return React__default.createElement(
33
116
  'div',
34
- { id: 'vid-slider', className: 'col' },
117
+ { ref: viewableWindow, id: 'vid-slider', className: 'col' },
35
118
  React__default.createElement(
36
119
  'div',
37
120
  { className: 'row' },
@@ -51,15 +134,16 @@ var GroupDeck = function GroupDeck(props) {
51
134
  ),
52
135
  React__default.createElement(
53
136
  'div',
54
- { className: 'row__inner' },
137
+ { ref: innerSlider, className: 'row__inner' },
55
138
  props.dataset && props.dataset.map(function (video, index) {
56
139
  // If there is a current prop, means this will overlay a currently playing video
57
140
  if (current !== '') {
58
141
  var url = video.url;
142
+ var thumbnail = 'https://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
59
143
 
60
144
  return React__default.createElement(
61
145
  'div',
62
- { key: index, className: 'tile' },
146
+ { ref: tile, key: index, className: 'tile', style: { width: tileSize + 'px' } },
63
147
  current && current === url ? React__default.createElement(
64
148
  'div',
65
149
  { className: 'now-playing' },
@@ -73,7 +157,11 @@ var GroupDeck = function GroupDeck(props) {
73
157
  React__default.createElement(
74
158
  'div',
75
159
  { className: 'tile__media' },
76
- React__default.createElement('img', { className: 'tile__img', src: video.thumbnail, alt: '' })
160
+ React__default.createElement(
161
+ LazyLoad,
162
+ null,
163
+ React__default.createElement('img', { className: 'tile__img', src: thumbnail, style: { width: tileSize + 'px' }, alt: '' })
164
+ )
77
165
  ),
78
166
  React__default.createElement(
79
167
  'div',
@@ -90,31 +178,29 @@ var GroupDeck = function GroupDeck(props) {
90
178
  ),
91
179
  React__default.createElement(
92
180
  'div',
93
- { style: { color: variant }, className: 'tile__info' },
94
- React__default.createElement(
95
- 'span',
96
- { style: { fontWeight: 'bold' } },
97
- 'Ep ',
98
- index + 1,
99
- ': '
100
- ),
181
+ { style: { color: '#fff' }, className: 'tile__info' },
101
182
  video.title
102
183
  )
103
184
  )
104
185
  );
105
186
  } else {
106
187
  // slider by itself
107
- var _url = '' + get2 + video.url;
188
+ var _url = '' + video.link;
189
+ var _thumbnail = 'https://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
108
190
  return React__default.createElement(
109
191
  'div',
110
- { key: index, className: 'tile' },
192
+ { ref: tile, key: index, className: 'tile', style: { width: tileSize + 'px' } },
111
193
  React__default.createElement(
112
194
  'a',
113
195
  { href: _url },
114
196
  React__default.createElement(
115
197
  'div',
116
198
  { className: 'tile__media' },
117
- React__default.createElement('img', { className: 'tile__img', src: video.thumbnail, alt: '' })
199
+ React__default.createElement(
200
+ LazyLoad,
201
+ null,
202
+ React__default.createElement('img', { className: 'tile__img', src: _thumbnail, alt: '', style: { width: tileSize + 'px' } })
203
+ )
118
204
  ),
119
205
  React__default.createElement(
120
206
  'div',
@@ -124,7 +210,7 @@ var GroupDeck = function GroupDeck(props) {
124
210
  { className: 'tile__title' },
125
211
  React__default.createElement(
126
212
  'div',
127
- { style: { color: variant }, className: 'tile__title_text' },
213
+ { style: { color: '#fff' }, className: 'tile__title_text' },
128
214
  video.title
129
215
  )
130
216
  )
@@ -132,7 +218,19 @@ var GroupDeck = function GroupDeck(props) {
132
218
  React__default.createElement(
133
219
  'div',
134
220
  { style: { color: variant }, className: 'tile__info' },
135
- video.title
221
+ props.displayEpisodeNumber ? React__default.createElement(
222
+ 'span',
223
+ null,
224
+ React__default.createElement(
225
+ 'span',
226
+ { style: { fontWeight: 'bold' } },
227
+ 'Ep. ',
228
+ index + 1,
229
+ ':'
230
+ ),
231
+ ' ',
232
+ video.title
233
+ ) : video.title
136
234
  )
137
235
  )
138
236
  );
@@ -143,7 +241,7 @@ var GroupDeck = function GroupDeck(props) {
143
241
  React__default.createElement(
144
242
  'style',
145
243
  { jsx: 'true' },
146
- '\n #vid-slider * {\n box-sizing: border-box;\n }\n #vid-slider {\n position: relative;\n }\n #vid-slider .now-playing {\n position: absolute;\n top: 0.5rem;\n left: 0.5rem;\n color: white;\n padding: 0 1rem;\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 a:hover {\n color: #7f8c8d;\n text-decoration: underline;\n }\n #vid-slider .contain {\n width: 100%;\n }\n #vid-slider .row {\n overflow: hidden;\n width: 100%;\n }\n #vid-slider .tile__info {\n white-space: normal !important;\n position: absolute;\n text-align: center;\n color: ' + (props.dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: 1rem;\n transition: opacity 0.25s;\n }\n #vid-slider .row__inner {\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: 55px 0;\n padding-bottom: 10px;\n padding-left: 0;\n }\n #vid-slider .tile {\n position: relative;\n display: inline-block;\n width: 250px;\n height: 140.625px;\n margin-right: 10px;\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__img {\n width: 250px;\n height: 140.625px;\n -o-object-fit: cover;\n object-fit: cover;\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 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: \'\u25B6\';\n left: 0;\n width: 100%;\n font-size: 30px;\n margin-left: 3px;\n margin-top: -22px;\n text-align: center;\n z-index: 2;\n color: white;\n }\n #vid-slider .tile:hover .tile__details {\n opacity: 1;\n }\n #vid-slider .tile__title {\n position: absolute;\n bottom: 0;\n padding: 10px;\n max-width: 250px;\n }\n #vid-slider .tile__title_text {\n position: relative;\n left: 0;\n white-space: normal;\n }\n #vid-slider .row__inner:hover {\n -webkit-transform: translate3d(-62.5px, 0, 0);\n transform: translate3d(-62.5px, 0, 0);\n }\n #vid-slider .row__inner:hover .tile {\n opacity: 0.3;\n }\n #vid-slider .row__inner:hover .tile:hover {\n -webkit-transform: scale(1.25);\n transform: scale(1.25);\n opacity: 1;\n }\n #vid-slider .tile:hover ~ .tile {\n -webkit-transform: translate3d(62px, 0, 0);\n transform: translate3d(62px, 0, 0);\n }\n #vid-slider .tile:hover .tile__info {\n opacity: 0;\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 top: 50%;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (props.dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n }\n #vid-slider .tile__slider-prev {\n left: -3px;\n }\n #vid-slider .tile__slider-next {\n right: 0;\n }\n #vid-slider,\n #vid-slider .row {\n margin: 0;\n padding: 0 1.2rem;\n }\n #vid-slider .tile:last-child {\n margin-right: 2rem;\n }\n #vid-slider .row::-webkit-scrollbar-thumb {\n background-color: transparent !important;\n }\n #vid-slider i {\n border: solid ' + (props.dark ? 'white' : 'black') + ';\n border-width: 0 4px 4px 0;\n display: inline-block;\n padding: 4px;\n pointer-events: none;\n }\n\n #vid-slider .right {\n transform: rotate(-45deg);\n -webkit-transform: rotate(-45deg);\n }\n\n #vid-slider .left {\n transform: rotate(135deg);\n -webkit-transform: rotate(135deg);\n }\n '
244
+ '\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::-webkit-scrollbar-thumb {\n display: none;\n }\n #vid-slider {\n position: relative;\n -ms-overflow-style: none;\n padding: 0 1.5rem;\n margin-bottom: 2rem;\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,\n #vidHolder {\n max-width: 805px;\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 a:hover {\n color: #7f8c8d;\n text-decoration: underline;\n }\n #vid-slider .contain {\n width: 100%;\n }\n #vid-slider .row {\n overflow-x: scroll;\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 text-align: center;\n color: ' + (props.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 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: 25px 0 55px !important;\n padding-bottom: 10px;\n padding-left: 0;\n }\n #vid-slider .tile {\n position: relative;\n display: inline-block;\n height: 135px;\n \n margin: 0 12px;\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: 15px;\n }\n #vid-slider .tile__img {\n height: 135px;\n \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 #vid-slider .tile__title {\n position: absolute;\n bottom: 0;\n padding: 10px;\n max-width: 250px;\n }\n #vid-slider .tile__title_text {\n position: relative;\n left: 0;\n white-space: normal;\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 top: 50%;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (props.dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n }\n #vid-slider .tile__slider-prev {\n left: -0.5rem;\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 margin: 0;\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 ' + (props.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 @media screen and (max-width: 1399px) {\n #vid-slider,\n #vidHolder {\n max-width: 620px;\n }\n }\n @media screen and (max-width: 1200px) {\n #vid-slider,\n #vidHolder {\n max-width: 580px;\n }\n }\n @media screen and (max-width: 967px) {\n #vid-slider {\n max-width: 100%;\n }\n \n\n #vid-slider .tile__img {\n height: 85px;\n object-fit: cover;\n }\n }\n\n @media screen and (max-width: 768px) {\n #vidHolder {\n position: unset;\n width: 100%;\n }\n #vid-slider .tile {\n height: 180px;\n }\n\n #vid-slider .tile__img {\n height: 110px;\n object-fit: cover;\n }\n #vid-slider .row__inner{\n margin: 30px 0 60px;\n }\n }\n @media screen and (max-width: 568px) {\n #vidHolder {\n position: unset;\n width: 100%;\n }\n #vid-slider .tile {\n height: 180px;\n }\n\n #vid-slider .tile__img {\n height: 180px;\n object-fit: cover;\n }\n #vid-slider .row__inner{\n margin: 30px 0 60px;\n }\n }\n '
147
245
  )
148
246
  );
149
247
  };
@@ -1,12 +1,11 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
4
  import { d as debounce_1, l as lib_3 } from './debounce-702eb224.js';
5
- import { m as main_39 } from './main-d550db5e.js';
6
- import { _ as _toConsumableArray } from './toConsumableArray-a096ca06.js';
7
- import './core.get-iterator-method-31c1fb1a.js';
5
+ import { m as main_39 } from './main-cb86f95d.js';
6
+ import { _ as _toConsumableArray } from './toConsumableArray-2718dc16.js';
8
7
  import { _ as _extends } from './extends-dbbe308d.js';
9
- import { a as _inherits, b as _classCallCheck, c as _possibleConstructorReturn, d as _Object$getPrototypeOf, e as _createClass } from './inherits-9d26445c.js';
8
+ import { a as _inherits, b as _classCallCheck, c as _possibleConstructorReturn, d as _Object$getPrototypeOf, e as _createClass } from './inherits-cb536901.js';
10
9
  import React__default from 'react';
11
10
  import 'prop-types';
12
11
  import Container from 'react-bootstrap/Container';
@@ -18,7 +17,7 @@ import 'next/link';
18
17
  import { withRouter } from 'next/router';
19
18
  import 'react-dom';
20
19
  import './index-51a80699.js';
21
- import { _ as _Promise } from './promise-8fc46e97.js';
20
+ import { _ as _Promise } from './promise-86cb8313.js';
22
21
 
23
22
  var MasterDeck = function (_React$Component) {
24
23
  _inherits(MasterDeck, _React$Component);
@@ -1,11 +1,11 @@
1
- import { m as main_39, c as main_40 } from './main-d550db5e.js';
1
+ import { m as main_39, c as main_40 } from './main-cb86f95d.js';
2
2
  import React__default, { useState, useEffect, useRef } from 'react';
3
3
  import Container from 'react-bootstrap/Container';
4
4
  import Row from 'react-bootstrap/Row';
5
5
  import Col from 'react-bootstrap/Col';
6
6
  import 'next/link';
7
- import { _ as _slicedToArray } from './slicedToArray-d1db3163.js';
8
- import { D as DFPAdSlot } from './AdSlot-028b040f.js';
7
+ import { _ as _slicedToArray } from './slicedToArray-a47a84a4.js';
8
+ import { D as DFPAdSlot } from './AdSlot-8946358f.js';
9
9
  import { g as get_1 } from './get-36d03764.js';
10
10
  import { r as reactSocialIcons_1 } from './react-social-icons-a7d5c5c7.js';
11
11
  import { Dropdown } from 'react-bootstrap';
@@ -1855,7 +1855,8 @@ var TemplateNormal = function TemplateNormal(props) {
1855
1855
  filterParams = props.filterParams,
1856
1856
  filters = props.filters,
1857
1857
  defaultFilter = props.defaultFilter,
1858
- showRightAd = props.showRightAd;
1858
+ showRightAd = props.showRightAd,
1859
+ sponsoredFlag = props.sponsoredFlag;
1859
1860
 
1860
1861
 
1861
1862
  var navigation = function navigation() {
@@ -1928,10 +1929,14 @@ var TemplateNormal = function TemplateNormal(props) {
1928
1929
  null,
1929
1930
  React__default.createElement(Header$1, { title: title ? title + ' | ' + website.title : '' + website.title, isLiveSite: config.isLiveSite, keyword: keywords, description: description }),
1930
1931
  navigation(),
1931
- horizontalAD && horizontalAD.networkID && horizontalAD.adUnit && React__default.createElement(
1932
- Container,
1932
+ sponsoredFlag ? React__default.createElement('div', { style: { height: '50px' } }) : React__default.createElement(
1933
+ React__default.Fragment,
1933
1934
  null,
1934
- React__default.createElement(AD728x90, { networkID: horizontalAD.networkID, adUnit: horizontalAD.adUnit, targeting: adTargeting })
1935
+ horizontalAD && horizontalAD.networkID && horizontalAD.adUnit && React__default.createElement(
1936
+ Container,
1937
+ null,
1938
+ React__default.createElement(AD728x90, { networkID: horizontalAD.networkID, adUnit: horizontalAD.adUnit, targeting: adTargeting })
1939
+ )
1935
1940
  ),
1936
1941
  React__default.createElement(
1937
1942
  Container,
@@ -1,10 +1,9 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
4
  import { l as lib_3 } from './debounce-702eb224.js';
5
- import { m as main_39 } from './main-d550db5e.js';
6
- import { _ as _toConsumableArray } from './toConsumableArray-a096ca06.js';
7
- import './core.get-iterator-method-31c1fb1a.js';
5
+ import { m as main_39 } from './main-cb86f95d.js';
6
+ import { _ as _toConsumableArray } from './toConsumableArray-2718dc16.js';
8
7
  import { _ as _extends } from './extends-dbbe308d.js';
9
8
  import React__default, { useState, useEffect, useRef } from 'react';
10
9
  import 'prop-types';
@@ -16,10 +15,10 @@ import 'react-dom';
16
15
  import { i as imageUrlBuilder } from './index-51a80699.js';
17
16
  import { L as LazyLoad } from './index-5f9f807a.js';
18
17
  import { c as clean_html_1 } from './entities-7cc3bf45.js';
19
- import { _ as _slicedToArray } from './slicedToArray-d1db3163.js';
20
- import './AdSlot-028b040f.js';
21
- import './promise-8fc46e97.js';
22
- import { A as ADInfeed } from './ADInfeed-2aaf8622.js';
18
+ import { _ as _slicedToArray } from './slicedToArray-a47a84a4.js';
19
+ import './AdSlot-8946358f.js';
20
+ import './promise-86cb8313.js';
21
+ import { A as ADInfeed } from './ADInfeed-aadcfc25.js';
23
22
  import { Container, Media } from 'react-bootstrap';
24
23
 
25
24
  var urlFor = function urlFor(source, builder) {
@@ -1025,7 +1025,7 @@ var TaxonomyCard = function TaxonomyCard(props) {
1025
1025
  Row,
1026
1026
  null,
1027
1027
  React__default.createElement(
1028
- Col,
1028
+ 'div',
1029
1029
  null,
1030
1030
  row.url ? React__default.createElement(
1031
1031
  'a',
@@ -1042,7 +1042,7 @@ var TaxonomyCard = function TaxonomyCard(props) {
1042
1042
  )
1043
1043
  ),
1044
1044
  React__default.createElement(
1045
- Col,
1045
+ 'div',
1046
1046
  null,
1047
1047
  (address && address.length || companyDetails && companyDetails.length) && React__default.createElement(
1048
1048
  'div',
@@ -10,5 +10,5 @@ import 'react-bootstrap/Card';
10
10
  import 'react-dom';
11
11
  import './index-51a80699.js';
12
12
  import './index-5f9f807a.js';
13
- export { T as default } from './TaxonomyCard-7e9aae2d.js';
13
+ export { T as default } from './TaxonomyCard-35127639.js';
14
14
  import './react-social-icons-a7d5c5c7.js';
@@ -1,24 +1,23 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
4
  import './debounce-702eb224.js';
5
- import './main-d550db5e.js';
6
- import './core.get-iterator-method-31c1fb1a.js';
5
+ import './main-cb86f95d.js';
7
6
  import 'react';
8
7
  import 'prop-types';
9
8
  import 'react-bootstrap/Container';
10
9
  import 'react-bootstrap/Row';
11
10
  import 'react-bootstrap/Col';
12
11
  import 'next/link';
13
- import './slicedToArray-d1db3163.js';
14
- import './AdSlot-028b040f.js';
15
- import './promise-8fc46e97.js';
12
+ import './slicedToArray-a47a84a4.js';
13
+ import './AdSlot-8946358f.js';
14
+ import './promise-86cb8313.js';
16
15
  import './get-36d03764.js';
17
16
  import './react-social-icons-a7d5c5c7.js';
18
17
  import 'react-bootstrap';
19
18
  import './index.esm-536609db.js';
20
19
  import 'react-bootstrap/Button';
21
- export { T as default } from './Normal-ed829d1e.js';
20
+ export { T as default } from './Normal-ff7a10ab.js';
22
21
  import 'react-bootstrap/ListGroup';
23
22
  import 'next/head';
24
23
  import 'react-bootstrap/Nav';
@@ -1,5 +1,5 @@
1
1
  import React__default, { useState, useRef, useEffect } from 'react';
2
- import { _ as _slicedToArray } from './slicedToArray-d1db3163.js';
2
+ import { _ as _slicedToArray } from './slicedToArray-a47a84a4.js';
3
3
  import { G as GenIcon, d as IoIosOpen } from './index.esm-536609db.js';
4
4
 
5
5
  // THIS FILE IS AUTO GENERATED
@@ -1,8 +1,7 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
4
- import './core.get-iterator-method-31c1fb1a.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
5
4
  import 'react';
6
- import './slicedToArray-d1db3163.js';
5
+ import './slicedToArray-a47a84a4.js';
7
6
  import './index.esm-536609db.js';
8
- export { U as default } from './Ustream-c153a835.js';
7
+ export { U as default } from './Ustream-d8cc3cbd.js';
@@ -1,9 +1,9 @@
1
1
  import './_commonjsHelpers-0c4b6f40.js';
2
2
  import './_to-object-b9b796ec.js';
3
- import './web.dom.iterable-3be50d6c.js';
3
+ import './web.dom.iterable-7e9bebf9.js';
4
4
  import { d as debounce_1, l as lib_3 } from './debounce-702eb224.js';
5
5
  import { _ as _extends } from './extends-dbbe308d.js';
6
- import { a as _inherits, b as _classCallCheck, c as _possibleConstructorReturn, d as _Object$getPrototypeOf, e as _createClass } from './inherits-9d26445c.js';
6
+ import { a as _inherits, b as _classCallCheck, c as _possibleConstructorReturn, d as _Object$getPrototypeOf, e as _createClass } from './inherits-cb536901.js';
7
7
  import React__default from 'react';
8
8
  import 'prop-types';
9
9
  import Container from 'react-bootstrap/Container';
@@ -12,7 +12,9 @@ import 'next/link';
12
12
  import { withRouter } from 'next/router';
13
13
  import 'react-dom';
14
14
  import './index-5f9f807a.js';
15
- import { Y as YoutubeGroup } from './YoutubeGroup-13d88f43.js';
15
+ import './slicedToArray-a47a84a4.js';
16
+ import './smoothscroll-4b699764.js';
17
+ import YoutubeGroup from './YoutubeGroup.js';
16
18
  import { a as IoIosArrowForward } from './index.esm-536609db.js';
17
19
 
18
20
  var VideoSeriesListing = function (_React$Component) {