@mjhls/mjh-framework 1.0.73 → 1.0.75
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/index.es.js +257 -78
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +257 -77
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -5526,23 +5526,23 @@ var GroupDeck = function GroupDeck(props) {
|
|
|
5526
5526
|
return React__default.createElement(
|
|
5527
5527
|
'div',
|
|
5528
5528
|
{ id: 'vid-slider', className: 'col' },
|
|
5529
|
+
React__default.createElement(
|
|
5530
|
+
'div',
|
|
5531
|
+
{ onClick: function onClick(e) {
|
|
5532
|
+
return scrollSlider(e, 'prev');
|
|
5533
|
+
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5534
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5535
|
+
),
|
|
5536
|
+
React__default.createElement(
|
|
5537
|
+
'div',
|
|
5538
|
+
{ onClick: function onClick(e) {
|
|
5539
|
+
return scrollSlider(e, 'next');
|
|
5540
|
+
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5541
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5542
|
+
),
|
|
5529
5543
|
React__default.createElement(
|
|
5530
5544
|
'div',
|
|
5531
5545
|
{ className: 'row' },
|
|
5532
|
-
React__default.createElement(
|
|
5533
|
-
'div',
|
|
5534
|
-
{ onClick: function onClick(e) {
|
|
5535
|
-
return scrollSlider(e, 'prev');
|
|
5536
|
-
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5537
|
-
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5538
|
-
),
|
|
5539
|
-
React__default.createElement(
|
|
5540
|
-
'div',
|
|
5541
|
-
{ onClick: function onClick(e) {
|
|
5542
|
-
return scrollSlider(e, 'next');
|
|
5543
|
-
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5544
|
-
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5545
|
-
),
|
|
5546
5546
|
React__default.createElement(
|
|
5547
5547
|
'div',
|
|
5548
5548
|
{ className: 'row__inner' },
|
|
@@ -5634,7 +5634,207 @@ var GroupDeck = function GroupDeck(props) {
|
|
|
5634
5634
|
React__default.createElement(
|
|
5635
5635
|
'style',
|
|
5636
5636
|
{ jsx: true },
|
|
5637
|
-
'\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: 1rem;\n left: 1rem;\n color: white;\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: scroll;\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:
|
|
5637
|
+
'\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: 1rem;\n left: 1rem;\n color: white;\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: scroll;\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: 2px;\n margin-top: -23px;\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 '
|
|
5638
|
+
)
|
|
5639
|
+
);
|
|
5640
|
+
};
|
|
5641
|
+
|
|
5642
|
+
var getYoutubeId = createCommonjsModule(function (module, exports) {
|
|
5643
|
+
(function (root, factory) {
|
|
5644
|
+
{
|
|
5645
|
+
module.exports = factory();
|
|
5646
|
+
}
|
|
5647
|
+
}(commonjsGlobal, function (exports) {
|
|
5648
|
+
|
|
5649
|
+
return function (url, opts) {
|
|
5650
|
+
if (opts == undefined) {
|
|
5651
|
+
opts = {fuzzy: true};
|
|
5652
|
+
}
|
|
5653
|
+
|
|
5654
|
+
if (/youtu\.?be/.test(url)) {
|
|
5655
|
+
|
|
5656
|
+
// Look first for known patterns
|
|
5657
|
+
var i;
|
|
5658
|
+
var patterns = [
|
|
5659
|
+
/youtu\.be\/([^#\&\?]{11})/, // youtu.be/<id>
|
|
5660
|
+
/\?v=([^#\&\?]{11})/, // ?v=<id>
|
|
5661
|
+
/\&v=([^#\&\?]{11})/, // &v=<id>
|
|
5662
|
+
/embed\/([^#\&\?]{11})/, // embed/<id>
|
|
5663
|
+
/\/v\/([^#\&\?]{11})/ // /v/<id>
|
|
5664
|
+
];
|
|
5665
|
+
|
|
5666
|
+
// If any pattern matches, return the ID
|
|
5667
|
+
for (i = 0; i < patterns.length; ++i) {
|
|
5668
|
+
if (patterns[i].test(url)) {
|
|
5669
|
+
return patterns[i].exec(url)[1];
|
|
5670
|
+
}
|
|
5671
|
+
}
|
|
5672
|
+
|
|
5673
|
+
if (opts.fuzzy) {
|
|
5674
|
+
// If that fails, break it apart by certain characters and look
|
|
5675
|
+
// for the 11 character key
|
|
5676
|
+
var tokens = url.split(/[\/\&\?=#\.\s]/g);
|
|
5677
|
+
for (i = 0; i < tokens.length; ++i) {
|
|
5678
|
+
if (/^[^#\&\?]{11}$/.test(tokens[i])) {
|
|
5679
|
+
return tokens[i];
|
|
5680
|
+
}
|
|
5681
|
+
}
|
|
5682
|
+
}
|
|
5683
|
+
}
|
|
5684
|
+
|
|
5685
|
+
return null;
|
|
5686
|
+
};
|
|
5687
|
+
|
|
5688
|
+
}));
|
|
5689
|
+
});
|
|
5690
|
+
|
|
5691
|
+
/*
|
|
5692
|
+
GROQ query -
|
|
5693
|
+
accepts an array of title, URL
|
|
5694
|
+
`http://img.youtube.com/vi/${getYouTubeId(vid.url)}/hqdefault.jpg`
|
|
5695
|
+
*/
|
|
5696
|
+
var YoutubeGroup = function YoutubeGroup(props) {
|
|
5697
|
+
// Props should be an array of objects containing Thumbnail, title, and URL
|
|
5698
|
+
var get2 = props.get2 ? '/' + props.get2 + '/' : '/view/';
|
|
5699
|
+
|
|
5700
|
+
var variant = props.dark ? 'white' : '#383838';
|
|
5701
|
+
function scrollSlider(e, direction) {
|
|
5702
|
+
var slide = e.target.parentElement;
|
|
5703
|
+
var scrollOffset = slide.scrollLeft;
|
|
5704
|
+
var viewableWidth = slide.clientWidth > 700 ? 3 * (document.querySelector('.tile').scrollWidth + 8) : document.querySelector('.tile').scrollWidth + 8;
|
|
5705
|
+
var scrollDirection = void 0;
|
|
5706
|
+
if (direction === 'next') {
|
|
5707
|
+
scrollDirection = scrollOffset + viewableWidth;
|
|
5708
|
+
}
|
|
5709
|
+
if (direction === 'prev') {
|
|
5710
|
+
scrollDirection = scrollOffset - viewableWidth;
|
|
5711
|
+
}
|
|
5712
|
+
slide.scrollTo({
|
|
5713
|
+
left: scrollDirection,
|
|
5714
|
+
behavior: 'smooth'
|
|
5715
|
+
});
|
|
5716
|
+
}
|
|
5717
|
+
function handleClick(url, vidIndex) {
|
|
5718
|
+
props.setState(url, vidIndex);
|
|
5719
|
+
}
|
|
5720
|
+
var _props$current = props.current,
|
|
5721
|
+
current = _props$current === undefined ? '' : _props$current;
|
|
5722
|
+
|
|
5723
|
+
|
|
5724
|
+
return React__default.createElement(
|
|
5725
|
+
'div',
|
|
5726
|
+
{ id: 'vid-slider', className: 'col' },
|
|
5727
|
+
React__default.createElement(
|
|
5728
|
+
'div',
|
|
5729
|
+
{ onClick: function onClick(e) {
|
|
5730
|
+
return scrollSlider(e, 'prev');
|
|
5731
|
+
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5732
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5733
|
+
),
|
|
5734
|
+
React__default.createElement(
|
|
5735
|
+
'div',
|
|
5736
|
+
{ onClick: function onClick(e) {
|
|
5737
|
+
return scrollSlider(e, 'next');
|
|
5738
|
+
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5739
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5740
|
+
),
|
|
5741
|
+
React__default.createElement(
|
|
5742
|
+
'div',
|
|
5743
|
+
{ className: 'row' },
|
|
5744
|
+
React__default.createElement(
|
|
5745
|
+
'div',
|
|
5746
|
+
{ className: 'row__inner' },
|
|
5747
|
+
props.dataset && props.dataset.map(function (video, index) {
|
|
5748
|
+
// If there is a current prop, means this will overlay a currently playing video
|
|
5749
|
+
if (current !== '') {
|
|
5750
|
+
var url = video.url;
|
|
5751
|
+
var thumbnail = 'http://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
|
|
5752
|
+
|
|
5753
|
+
return React__default.createElement(
|
|
5754
|
+
'div',
|
|
5755
|
+
{ key: index, className: 'tile' },
|
|
5756
|
+
current && current === url ? React__default.createElement(
|
|
5757
|
+
'div',
|
|
5758
|
+
{ className: 'now-playing' },
|
|
5759
|
+
'Now Playing'
|
|
5760
|
+
) : '',
|
|
5761
|
+
React__default.createElement(
|
|
5762
|
+
'a',
|
|
5763
|
+
{ onClick: function onClick() {
|
|
5764
|
+
return handleClick(url, index + 1);
|
|
5765
|
+
} },
|
|
5766
|
+
React__default.createElement(
|
|
5767
|
+
'div',
|
|
5768
|
+
{ className: 'tile__media' },
|
|
5769
|
+
React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: '' })
|
|
5770
|
+
),
|
|
5771
|
+
React__default.createElement(
|
|
5772
|
+
'div',
|
|
5773
|
+
{ className: 'tile__details' },
|
|
5774
|
+
React__default.createElement(
|
|
5775
|
+
'div',
|
|
5776
|
+
{ className: 'tile__title' },
|
|
5777
|
+
React__default.createElement(
|
|
5778
|
+
'div',
|
|
5779
|
+
{ style: { color: variant }, className: 'tile__title_text' },
|
|
5780
|
+
video.title
|
|
5781
|
+
)
|
|
5782
|
+
)
|
|
5783
|
+
),
|
|
5784
|
+
React__default.createElement(
|
|
5785
|
+
'div',
|
|
5786
|
+
{ style: { color: variant }, className: 'tile__info' },
|
|
5787
|
+
video.title
|
|
5788
|
+
)
|
|
5789
|
+
)
|
|
5790
|
+
);
|
|
5791
|
+
} else {
|
|
5792
|
+
// slider by itself
|
|
5793
|
+
var _url = '' + video.link;
|
|
5794
|
+
var _thumbnail = 'http://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
|
|
5795
|
+
return React__default.createElement(
|
|
5796
|
+
'div',
|
|
5797
|
+
{ key: index, className: 'tile' },
|
|
5798
|
+
React__default.createElement(
|
|
5799
|
+
Link,
|
|
5800
|
+
{ href: _url },
|
|
5801
|
+
React__default.createElement(
|
|
5802
|
+
'a',
|
|
5803
|
+
null,
|
|
5804
|
+
React__default.createElement(
|
|
5805
|
+
'div',
|
|
5806
|
+
{ className: 'tile__media' },
|
|
5807
|
+
React__default.createElement('img', { className: 'tile__img', src: _thumbnail, alt: '' })
|
|
5808
|
+
),
|
|
5809
|
+
React__default.createElement(
|
|
5810
|
+
'div',
|
|
5811
|
+
{ className: 'tile__details' },
|
|
5812
|
+
React__default.createElement(
|
|
5813
|
+
'div',
|
|
5814
|
+
{ className: 'tile__title' },
|
|
5815
|
+
React__default.createElement(
|
|
5816
|
+
'div',
|
|
5817
|
+
{ style: { color: variant }, className: 'tile__title_text' },
|
|
5818
|
+
video.title
|
|
5819
|
+
)
|
|
5820
|
+
)
|
|
5821
|
+
),
|
|
5822
|
+
React__default.createElement(
|
|
5823
|
+
'div',
|
|
5824
|
+
{ style: { color: variant }, className: 'tile__info' },
|
|
5825
|
+
video.title
|
|
5826
|
+
)
|
|
5827
|
+
)
|
|
5828
|
+
)
|
|
5829
|
+
);
|
|
5830
|
+
}
|
|
5831
|
+
})
|
|
5832
|
+
)
|
|
5833
|
+
),
|
|
5834
|
+
React__default.createElement(
|
|
5835
|
+
'style',
|
|
5836
|
+
{ jsx: true },
|
|
5837
|
+
'\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: .5rem;\n left: 1rem;\n color: white;\n background: rgba(0,0,0,.5);\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: scroll;\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: 2px;\n margin-top: -23px;\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 '
|
|
5638
5838
|
)
|
|
5639
5839
|
);
|
|
5640
5840
|
};
|
|
@@ -5812,7 +6012,8 @@ var Column3 = function Column3(props) {
|
|
|
5812
6012
|
var Header = function Header(props) {
|
|
5813
6013
|
var title = props.title,
|
|
5814
6014
|
keyword = props.keyword,
|
|
5815
|
-
description = props.description
|
|
6015
|
+
description = props.description,
|
|
6016
|
+
isLiveSite = props.isLiveSite;
|
|
5816
6017
|
|
|
5817
6018
|
|
|
5818
6019
|
return React__default.createElement(
|
|
@@ -5823,6 +6024,7 @@ var Header = function Header(props) {
|
|
|
5823
6024
|
null,
|
|
5824
6025
|
title
|
|
5825
6026
|
),
|
|
6027
|
+
!isLiveSite && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
|
|
5826
6028
|
React__default.createElement('meta', { name: 'keywords', content: keyword }),
|
|
5827
6029
|
React__default.createElement('meta', { name: 'description', content: description }),
|
|
5828
6030
|
React__default.createElement('link', { rel: 'stylesheet', href: '/bootstrap.min.css' }),
|
|
@@ -12545,7 +12747,7 @@ var TemplateNormal = function TemplateNormal(props) {
|
|
|
12545
12747
|
return React__default.createElement(
|
|
12546
12748
|
'section',
|
|
12547
12749
|
null,
|
|
12548
|
-
React__default.createElement(Header, { title: title ? title + ' | ' + website.title : '' + website.title, keyword: keywords, description: description }),
|
|
12750
|
+
React__default.createElement(Header, { title: title ? title + ' | ' + website.title : '' + website.title, isLiveSite: config.isLiveSite, keyword: keywords, description: description }),
|
|
12549
12751
|
navigation(),
|
|
12550
12752
|
horizontalAD && horizontalAD.networkID && horizontalAD.adUnit && React__default.createElement(
|
|
12551
12753
|
Container,
|
|
@@ -12701,55 +12903,6 @@ var Slideshow = function Slideshow(_ref) {
|
|
|
12701
12903
|
);
|
|
12702
12904
|
};
|
|
12703
12905
|
|
|
12704
|
-
var getYoutubeId = createCommonjsModule(function (module, exports) {
|
|
12705
|
-
(function (root, factory) {
|
|
12706
|
-
{
|
|
12707
|
-
module.exports = factory();
|
|
12708
|
-
}
|
|
12709
|
-
}(commonjsGlobal, function (exports) {
|
|
12710
|
-
|
|
12711
|
-
return function (url, opts) {
|
|
12712
|
-
if (opts == undefined) {
|
|
12713
|
-
opts = {fuzzy: true};
|
|
12714
|
-
}
|
|
12715
|
-
|
|
12716
|
-
if (/youtu\.?be/.test(url)) {
|
|
12717
|
-
|
|
12718
|
-
// Look first for known patterns
|
|
12719
|
-
var i;
|
|
12720
|
-
var patterns = [
|
|
12721
|
-
/youtu\.be\/([^#\&\?]{11})/, // youtu.be/<id>
|
|
12722
|
-
/\?v=([^#\&\?]{11})/, // ?v=<id>
|
|
12723
|
-
/\&v=([^#\&\?]{11})/, // &v=<id>
|
|
12724
|
-
/embed\/([^#\&\?]{11})/, // embed/<id>
|
|
12725
|
-
/\/v\/([^#\&\?]{11})/ // /v/<id>
|
|
12726
|
-
];
|
|
12727
|
-
|
|
12728
|
-
// If any pattern matches, return the ID
|
|
12729
|
-
for (i = 0; i < patterns.length; ++i) {
|
|
12730
|
-
if (patterns[i].test(url)) {
|
|
12731
|
-
return patterns[i].exec(url)[1];
|
|
12732
|
-
}
|
|
12733
|
-
}
|
|
12734
|
-
|
|
12735
|
-
if (opts.fuzzy) {
|
|
12736
|
-
// If that fails, break it apart by certain characters and look
|
|
12737
|
-
// for the 11 character key
|
|
12738
|
-
var tokens = url.split(/[\/\&\?=#\.\s]/g);
|
|
12739
|
-
for (i = 0; i < tokens.length; ++i) {
|
|
12740
|
-
if (/^[^#\&\?]{11}$/.test(tokens[i])) {
|
|
12741
|
-
return tokens[i];
|
|
12742
|
-
}
|
|
12743
|
-
}
|
|
12744
|
-
}
|
|
12745
|
-
}
|
|
12746
|
-
|
|
12747
|
-
return null;
|
|
12748
|
-
};
|
|
12749
|
-
|
|
12750
|
-
}));
|
|
12751
|
-
});
|
|
12752
|
-
|
|
12753
12906
|
var isArray$3 = Array.isArray;
|
|
12754
12907
|
var keyList = Object.keys;
|
|
12755
12908
|
var hasProp = Object.prototype.hasOwnProperty;
|
|
@@ -15579,7 +15732,8 @@ var IFrame = function IFrame(_ref) {
|
|
|
15579
15732
|
};
|
|
15580
15733
|
|
|
15581
15734
|
var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
15582
|
-
var nodes = _ref.nodes
|
|
15735
|
+
var nodes = _ref.nodes,
|
|
15736
|
+
client = _ref.client;
|
|
15583
15737
|
|
|
15584
15738
|
|
|
15585
15739
|
var router$$1 = router.useRouter();
|
|
@@ -15591,13 +15745,18 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
|
15591
15745
|
vidUrl = _useState2[0],
|
|
15592
15746
|
setVidUrl = _useState2[1];
|
|
15593
15747
|
|
|
15748
|
+
var _useState3 = React.useState(''),
|
|
15749
|
+
_useState4 = slicedToArray(_useState3, 2),
|
|
15750
|
+
series = _useState4[0],
|
|
15751
|
+
setSeries = _useState4[1];
|
|
15594
15752
|
// Once component mounts, set the variables
|
|
15595
15753
|
|
|
15596
15754
|
|
|
15597
15755
|
React.useEffect(function () {
|
|
15598
|
-
|
|
15756
|
+
|
|
15599
15757
|
params = new URL(document.location).searchParams;
|
|
15600
|
-
seriesVid = params.get('
|
|
15758
|
+
seriesVid = params.get('vidSeries') || 1;
|
|
15759
|
+
setSeries(seriesVid);
|
|
15601
15760
|
setVidUrl(nodes.videos['' + (seriesVid - 1)].url);
|
|
15602
15761
|
}, []);
|
|
15603
15762
|
|
|
@@ -15699,18 +15858,38 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
|
15699
15858
|
padding: '0 1rem',
|
|
15700
15859
|
left: '0'
|
|
15701
15860
|
} },
|
|
15702
|
-
vidUrl && React__default.createElement(GroupDeck, { dark: true, dataset: seriesData, setState: setState, seriesVid:
|
|
15861
|
+
vidUrl && React__default.createElement(GroupDeck, { dark: true, dataset: seriesData, setState: setState, seriesVid: series, current: vidUrl })
|
|
15703
15862
|
)
|
|
15704
15863
|
),
|
|
15705
15864
|
React__default.createElement(
|
|
15706
15865
|
'div',
|
|
15707
15866
|
{ className: 'vid-controls', style: { width: '100%', background: 'transparent', display: 'flex', justifyContent: 'center' } },
|
|
15708
|
-
React__default.createElement(
|
|
15709
|
-
'
|
|
15710
|
-
|
|
15711
|
-
|
|
15712
|
-
|
|
15713
|
-
|
|
15867
|
+
React__default.createElement(
|
|
15868
|
+
'button',
|
|
15869
|
+
{
|
|
15870
|
+
'aria-label': 'Toggles video series',
|
|
15871
|
+
id: 'vid-series-btn',
|
|
15872
|
+
onClick: toggleSeries,
|
|
15873
|
+
className: 'btn btn-block btn-lg btn-secondary ',
|
|
15874
|
+
style: { borderRadius: '0' } },
|
|
15875
|
+
'View Series'
|
|
15876
|
+
)
|
|
15877
|
+
),
|
|
15878
|
+
React__default.createElement(
|
|
15879
|
+
'div',
|
|
15880
|
+
{ className: 'my-5' },
|
|
15881
|
+
series && React__default.createElement(
|
|
15882
|
+
'h3',
|
|
15883
|
+
null,
|
|
15884
|
+
'Episode ',
|
|
15885
|
+
series
|
|
15886
|
+
),
|
|
15887
|
+
nodes.videos[0] && React__default.createElement(
|
|
15888
|
+
'h2',
|
|
15889
|
+
{ className: 'mb-3' },
|
|
15890
|
+
nodes.videos[0].title
|
|
15891
|
+
),
|
|
15892
|
+
nodes.videos[0].text && React__default.createElement(BlockContent, _extends({ serializers: getSerializers$1(client), blocks: nodes.videos[0].text, imageOptions: { w: 320, h: 240, fit: 'max' } }, client.config()))
|
|
15714
15893
|
),
|
|
15715
15894
|
React__default.createElement(
|
|
15716
15895
|
'style',
|
|
@@ -15732,7 +15911,7 @@ var getSerializers$1 = function getSerializers(client) {
|
|
|
15732
15911
|
youtubeGallery: function youtubeGallery(_ref2) {
|
|
15733
15912
|
var node = _ref2.node;
|
|
15734
15913
|
|
|
15735
|
-
return React__default.createElement(YouTubeGallery, { nodes: node });
|
|
15914
|
+
return React__default.createElement(YouTubeGallery, { nodes: node, client: client });
|
|
15736
15915
|
},
|
|
15737
15916
|
figure: function figure(_ref3) {
|
|
15738
15917
|
var node = _ref3.node;
|
|
@@ -15797,6 +15976,7 @@ exports.DeckQueue = DeckQueue;
|
|
|
15797
15976
|
exports.ThumbnailCard = ThumbnailCard;
|
|
15798
15977
|
exports.TaxonomyCard = TaxonomyCard;
|
|
15799
15978
|
exports.GroupDeck = GroupDeck;
|
|
15979
|
+
exports.YoutubeGroup = YoutubeGroup;
|
|
15800
15980
|
exports.Column1 = Column1;
|
|
15801
15981
|
exports.Column2 = Column2;
|
|
15802
15982
|
exports.Column3 = Column3;
|