@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/README.md
CHANGED
package/dist/index.es.js
CHANGED
|
@@ -5519,23 +5519,23 @@ var GroupDeck = function GroupDeck(props) {
|
|
|
5519
5519
|
return React__default.createElement(
|
|
5520
5520
|
'div',
|
|
5521
5521
|
{ id: 'vid-slider', className: 'col' },
|
|
5522
|
+
React__default.createElement(
|
|
5523
|
+
'div',
|
|
5524
|
+
{ onClick: function onClick(e) {
|
|
5525
|
+
return scrollSlider(e, 'prev');
|
|
5526
|
+
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5527
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5528
|
+
),
|
|
5529
|
+
React__default.createElement(
|
|
5530
|
+
'div',
|
|
5531
|
+
{ onClick: function onClick(e) {
|
|
5532
|
+
return scrollSlider(e, 'next');
|
|
5533
|
+
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5534
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5535
|
+
),
|
|
5522
5536
|
React__default.createElement(
|
|
5523
5537
|
'div',
|
|
5524
5538
|
{ className: 'row' },
|
|
5525
|
-
React__default.createElement(
|
|
5526
|
-
'div',
|
|
5527
|
-
{ onClick: function onClick(e) {
|
|
5528
|
-
return scrollSlider(e, 'prev');
|
|
5529
|
-
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5530
|
-
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5531
|
-
),
|
|
5532
|
-
React__default.createElement(
|
|
5533
|
-
'div',
|
|
5534
|
-
{ onClick: function onClick(e) {
|
|
5535
|
-
return scrollSlider(e, 'next');
|
|
5536
|
-
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5537
|
-
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5538
|
-
),
|
|
5539
5539
|
React__default.createElement(
|
|
5540
5540
|
'div',
|
|
5541
5541
|
{ className: 'row__inner' },
|
|
@@ -5627,7 +5627,207 @@ var GroupDeck = function GroupDeck(props) {
|
|
|
5627
5627
|
React__default.createElement(
|
|
5628
5628
|
'style',
|
|
5629
5629
|
{ jsx: true },
|
|
5630
|
-
'\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:
|
|
5630
|
+
'\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 '
|
|
5631
|
+
)
|
|
5632
|
+
);
|
|
5633
|
+
};
|
|
5634
|
+
|
|
5635
|
+
var getYoutubeId = createCommonjsModule(function (module, exports) {
|
|
5636
|
+
(function (root, factory) {
|
|
5637
|
+
{
|
|
5638
|
+
module.exports = factory();
|
|
5639
|
+
}
|
|
5640
|
+
}(commonjsGlobal, function (exports) {
|
|
5641
|
+
|
|
5642
|
+
return function (url, opts) {
|
|
5643
|
+
if (opts == undefined) {
|
|
5644
|
+
opts = {fuzzy: true};
|
|
5645
|
+
}
|
|
5646
|
+
|
|
5647
|
+
if (/youtu\.?be/.test(url)) {
|
|
5648
|
+
|
|
5649
|
+
// Look first for known patterns
|
|
5650
|
+
var i;
|
|
5651
|
+
var patterns = [
|
|
5652
|
+
/youtu\.be\/([^#\&\?]{11})/, // youtu.be/<id>
|
|
5653
|
+
/\?v=([^#\&\?]{11})/, // ?v=<id>
|
|
5654
|
+
/\&v=([^#\&\?]{11})/, // &v=<id>
|
|
5655
|
+
/embed\/([^#\&\?]{11})/, // embed/<id>
|
|
5656
|
+
/\/v\/([^#\&\?]{11})/ // /v/<id>
|
|
5657
|
+
];
|
|
5658
|
+
|
|
5659
|
+
// If any pattern matches, return the ID
|
|
5660
|
+
for (i = 0; i < patterns.length; ++i) {
|
|
5661
|
+
if (patterns[i].test(url)) {
|
|
5662
|
+
return patterns[i].exec(url)[1];
|
|
5663
|
+
}
|
|
5664
|
+
}
|
|
5665
|
+
|
|
5666
|
+
if (opts.fuzzy) {
|
|
5667
|
+
// If that fails, break it apart by certain characters and look
|
|
5668
|
+
// for the 11 character key
|
|
5669
|
+
var tokens = url.split(/[\/\&\?=#\.\s]/g);
|
|
5670
|
+
for (i = 0; i < tokens.length; ++i) {
|
|
5671
|
+
if (/^[^#\&\?]{11}$/.test(tokens[i])) {
|
|
5672
|
+
return tokens[i];
|
|
5673
|
+
}
|
|
5674
|
+
}
|
|
5675
|
+
}
|
|
5676
|
+
}
|
|
5677
|
+
|
|
5678
|
+
return null;
|
|
5679
|
+
};
|
|
5680
|
+
|
|
5681
|
+
}));
|
|
5682
|
+
});
|
|
5683
|
+
|
|
5684
|
+
/*
|
|
5685
|
+
GROQ query -
|
|
5686
|
+
accepts an array of title, URL
|
|
5687
|
+
`http://img.youtube.com/vi/${getYouTubeId(vid.url)}/hqdefault.jpg`
|
|
5688
|
+
*/
|
|
5689
|
+
var YoutubeGroup = function YoutubeGroup(props) {
|
|
5690
|
+
// Props should be an array of objects containing Thumbnail, title, and URL
|
|
5691
|
+
var get2 = props.get2 ? '/' + props.get2 + '/' : '/view/';
|
|
5692
|
+
|
|
5693
|
+
var variant = props.dark ? 'white' : '#383838';
|
|
5694
|
+
function scrollSlider(e, direction) {
|
|
5695
|
+
var slide = e.target.parentElement;
|
|
5696
|
+
var scrollOffset = slide.scrollLeft;
|
|
5697
|
+
var viewableWidth = slide.clientWidth > 700 ? 3 * (document.querySelector('.tile').scrollWidth + 8) : document.querySelector('.tile').scrollWidth + 8;
|
|
5698
|
+
var scrollDirection = void 0;
|
|
5699
|
+
if (direction === 'next') {
|
|
5700
|
+
scrollDirection = scrollOffset + viewableWidth;
|
|
5701
|
+
}
|
|
5702
|
+
if (direction === 'prev') {
|
|
5703
|
+
scrollDirection = scrollOffset - viewableWidth;
|
|
5704
|
+
}
|
|
5705
|
+
slide.scrollTo({
|
|
5706
|
+
left: scrollDirection,
|
|
5707
|
+
behavior: 'smooth'
|
|
5708
|
+
});
|
|
5709
|
+
}
|
|
5710
|
+
function handleClick(url, vidIndex) {
|
|
5711
|
+
props.setState(url, vidIndex);
|
|
5712
|
+
}
|
|
5713
|
+
var _props$current = props.current,
|
|
5714
|
+
current = _props$current === undefined ? '' : _props$current;
|
|
5715
|
+
|
|
5716
|
+
|
|
5717
|
+
return React__default.createElement(
|
|
5718
|
+
'div',
|
|
5719
|
+
{ id: 'vid-slider', className: 'col' },
|
|
5720
|
+
React__default.createElement(
|
|
5721
|
+
'div',
|
|
5722
|
+
{ onClick: function onClick(e) {
|
|
5723
|
+
return scrollSlider(e, 'prev');
|
|
5724
|
+
}, className: 'tile__slider-prev', style: { color: variant } },
|
|
5725
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow left' })
|
|
5726
|
+
),
|
|
5727
|
+
React__default.createElement(
|
|
5728
|
+
'div',
|
|
5729
|
+
{ onClick: function onClick(e) {
|
|
5730
|
+
return scrollSlider(e, 'next');
|
|
5731
|
+
}, className: 'tile__slider-next', style: { color: variant } },
|
|
5732
|
+
React__default.createElement('i', { style: { border: 'solid ' + variant, borderWidth: '0 4px 4px 0' }, className: 'arrow right' })
|
|
5733
|
+
),
|
|
5734
|
+
React__default.createElement(
|
|
5735
|
+
'div',
|
|
5736
|
+
{ className: 'row' },
|
|
5737
|
+
React__default.createElement(
|
|
5738
|
+
'div',
|
|
5739
|
+
{ className: 'row__inner' },
|
|
5740
|
+
props.dataset && props.dataset.map(function (video, index) {
|
|
5741
|
+
// If there is a current prop, means this will overlay a currently playing video
|
|
5742
|
+
if (current !== '') {
|
|
5743
|
+
var url = video.url;
|
|
5744
|
+
var thumbnail = 'http://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
|
|
5745
|
+
|
|
5746
|
+
return React__default.createElement(
|
|
5747
|
+
'div',
|
|
5748
|
+
{ key: index, className: 'tile' },
|
|
5749
|
+
current && current === url ? React__default.createElement(
|
|
5750
|
+
'div',
|
|
5751
|
+
{ className: 'now-playing' },
|
|
5752
|
+
'Now Playing'
|
|
5753
|
+
) : '',
|
|
5754
|
+
React__default.createElement(
|
|
5755
|
+
'a',
|
|
5756
|
+
{ onClick: function onClick() {
|
|
5757
|
+
return handleClick(url, index + 1);
|
|
5758
|
+
} },
|
|
5759
|
+
React__default.createElement(
|
|
5760
|
+
'div',
|
|
5761
|
+
{ className: 'tile__media' },
|
|
5762
|
+
React__default.createElement('img', { className: 'tile__img', src: thumbnail, alt: '' })
|
|
5763
|
+
),
|
|
5764
|
+
React__default.createElement(
|
|
5765
|
+
'div',
|
|
5766
|
+
{ className: 'tile__details' },
|
|
5767
|
+
React__default.createElement(
|
|
5768
|
+
'div',
|
|
5769
|
+
{ className: 'tile__title' },
|
|
5770
|
+
React__default.createElement(
|
|
5771
|
+
'div',
|
|
5772
|
+
{ style: { color: variant }, className: 'tile__title_text' },
|
|
5773
|
+
video.title
|
|
5774
|
+
)
|
|
5775
|
+
)
|
|
5776
|
+
),
|
|
5777
|
+
React__default.createElement(
|
|
5778
|
+
'div',
|
|
5779
|
+
{ style: { color: variant }, className: 'tile__info' },
|
|
5780
|
+
video.title
|
|
5781
|
+
)
|
|
5782
|
+
)
|
|
5783
|
+
);
|
|
5784
|
+
} else {
|
|
5785
|
+
// slider by itself
|
|
5786
|
+
var _url = '' + video.link;
|
|
5787
|
+
var _thumbnail = 'http://img.youtube.com/vi/' + getYoutubeId(video.url) + '/hqdefault.jpg';
|
|
5788
|
+
return React__default.createElement(
|
|
5789
|
+
'div',
|
|
5790
|
+
{ key: index, className: 'tile' },
|
|
5791
|
+
React__default.createElement(
|
|
5792
|
+
Link,
|
|
5793
|
+
{ href: _url },
|
|
5794
|
+
React__default.createElement(
|
|
5795
|
+
'a',
|
|
5796
|
+
null,
|
|
5797
|
+
React__default.createElement(
|
|
5798
|
+
'div',
|
|
5799
|
+
{ className: 'tile__media' },
|
|
5800
|
+
React__default.createElement('img', { className: 'tile__img', src: _thumbnail, alt: '' })
|
|
5801
|
+
),
|
|
5802
|
+
React__default.createElement(
|
|
5803
|
+
'div',
|
|
5804
|
+
{ className: 'tile__details' },
|
|
5805
|
+
React__default.createElement(
|
|
5806
|
+
'div',
|
|
5807
|
+
{ className: 'tile__title' },
|
|
5808
|
+
React__default.createElement(
|
|
5809
|
+
'div',
|
|
5810
|
+
{ style: { color: variant }, className: 'tile__title_text' },
|
|
5811
|
+
video.title
|
|
5812
|
+
)
|
|
5813
|
+
)
|
|
5814
|
+
),
|
|
5815
|
+
React__default.createElement(
|
|
5816
|
+
'div',
|
|
5817
|
+
{ style: { color: variant }, className: 'tile__info' },
|
|
5818
|
+
video.title
|
|
5819
|
+
)
|
|
5820
|
+
)
|
|
5821
|
+
)
|
|
5822
|
+
);
|
|
5823
|
+
}
|
|
5824
|
+
})
|
|
5825
|
+
)
|
|
5826
|
+
),
|
|
5827
|
+
React__default.createElement(
|
|
5828
|
+
'style',
|
|
5829
|
+
{ jsx: true },
|
|
5830
|
+
'\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 '
|
|
5631
5831
|
)
|
|
5632
5832
|
);
|
|
5633
5833
|
};
|
|
@@ -5805,7 +6005,8 @@ var Column3 = function Column3(props) {
|
|
|
5805
6005
|
var Header = function Header(props) {
|
|
5806
6006
|
var title = props.title,
|
|
5807
6007
|
keyword = props.keyword,
|
|
5808
|
-
description = props.description
|
|
6008
|
+
description = props.description,
|
|
6009
|
+
isLiveSite = props.isLiveSite;
|
|
5809
6010
|
|
|
5810
6011
|
|
|
5811
6012
|
return React__default.createElement(
|
|
@@ -5816,6 +6017,7 @@ var Header = function Header(props) {
|
|
|
5816
6017
|
null,
|
|
5817
6018
|
title
|
|
5818
6019
|
),
|
|
6020
|
+
!isLiveSite && React__default.createElement('meta', { name: 'robots', content: 'noindex, nofollow' }),
|
|
5819
6021
|
React__default.createElement('meta', { name: 'keywords', content: keyword }),
|
|
5820
6022
|
React__default.createElement('meta', { name: 'description', content: description }),
|
|
5821
6023
|
React__default.createElement('link', { rel: 'stylesheet', href: '/bootstrap.min.css' }),
|
|
@@ -12538,7 +12740,7 @@ var TemplateNormal = function TemplateNormal(props) {
|
|
|
12538
12740
|
return React__default.createElement(
|
|
12539
12741
|
'section',
|
|
12540
12742
|
null,
|
|
12541
|
-
React__default.createElement(Header, { title: title ? title + ' | ' + website.title : '' + website.title, keyword: keywords, description: description }),
|
|
12743
|
+
React__default.createElement(Header, { title: title ? title + ' | ' + website.title : '' + website.title, isLiveSite: config.isLiveSite, keyword: keywords, description: description }),
|
|
12542
12744
|
navigation(),
|
|
12543
12745
|
horizontalAD && horizontalAD.networkID && horizontalAD.adUnit && React__default.createElement(
|
|
12544
12746
|
Container,
|
|
@@ -12694,55 +12896,6 @@ var Slideshow = function Slideshow(_ref) {
|
|
|
12694
12896
|
);
|
|
12695
12897
|
};
|
|
12696
12898
|
|
|
12697
|
-
var getYoutubeId = createCommonjsModule(function (module, exports) {
|
|
12698
|
-
(function (root, factory) {
|
|
12699
|
-
{
|
|
12700
|
-
module.exports = factory();
|
|
12701
|
-
}
|
|
12702
|
-
}(commonjsGlobal, function (exports) {
|
|
12703
|
-
|
|
12704
|
-
return function (url, opts) {
|
|
12705
|
-
if (opts == undefined) {
|
|
12706
|
-
opts = {fuzzy: true};
|
|
12707
|
-
}
|
|
12708
|
-
|
|
12709
|
-
if (/youtu\.?be/.test(url)) {
|
|
12710
|
-
|
|
12711
|
-
// Look first for known patterns
|
|
12712
|
-
var i;
|
|
12713
|
-
var patterns = [
|
|
12714
|
-
/youtu\.be\/([^#\&\?]{11})/, // youtu.be/<id>
|
|
12715
|
-
/\?v=([^#\&\?]{11})/, // ?v=<id>
|
|
12716
|
-
/\&v=([^#\&\?]{11})/, // &v=<id>
|
|
12717
|
-
/embed\/([^#\&\?]{11})/, // embed/<id>
|
|
12718
|
-
/\/v\/([^#\&\?]{11})/ // /v/<id>
|
|
12719
|
-
];
|
|
12720
|
-
|
|
12721
|
-
// If any pattern matches, return the ID
|
|
12722
|
-
for (i = 0; i < patterns.length; ++i) {
|
|
12723
|
-
if (patterns[i].test(url)) {
|
|
12724
|
-
return patterns[i].exec(url)[1];
|
|
12725
|
-
}
|
|
12726
|
-
}
|
|
12727
|
-
|
|
12728
|
-
if (opts.fuzzy) {
|
|
12729
|
-
// If that fails, break it apart by certain characters and look
|
|
12730
|
-
// for the 11 character key
|
|
12731
|
-
var tokens = url.split(/[\/\&\?=#\.\s]/g);
|
|
12732
|
-
for (i = 0; i < tokens.length; ++i) {
|
|
12733
|
-
if (/^[^#\&\?]{11}$/.test(tokens[i])) {
|
|
12734
|
-
return tokens[i];
|
|
12735
|
-
}
|
|
12736
|
-
}
|
|
12737
|
-
}
|
|
12738
|
-
}
|
|
12739
|
-
|
|
12740
|
-
return null;
|
|
12741
|
-
};
|
|
12742
|
-
|
|
12743
|
-
}));
|
|
12744
|
-
});
|
|
12745
|
-
|
|
12746
12899
|
var isArray$3 = Array.isArray;
|
|
12747
12900
|
var keyList = Object.keys;
|
|
12748
12901
|
var hasProp = Object.prototype.hasOwnProperty;
|
|
@@ -15572,7 +15725,8 @@ var IFrame = function IFrame(_ref) {
|
|
|
15572
15725
|
};
|
|
15573
15726
|
|
|
15574
15727
|
var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
15575
|
-
var nodes = _ref.nodes
|
|
15728
|
+
var nodes = _ref.nodes,
|
|
15729
|
+
client = _ref.client;
|
|
15576
15730
|
|
|
15577
15731
|
|
|
15578
15732
|
var router = useRouter();
|
|
@@ -15584,13 +15738,18 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
|
15584
15738
|
vidUrl = _useState2[0],
|
|
15585
15739
|
setVidUrl = _useState2[1];
|
|
15586
15740
|
|
|
15741
|
+
var _useState3 = useState(''),
|
|
15742
|
+
_useState4 = slicedToArray(_useState3, 2),
|
|
15743
|
+
series = _useState4[0],
|
|
15744
|
+
setSeries = _useState4[1];
|
|
15587
15745
|
// Once component mounts, set the variables
|
|
15588
15746
|
|
|
15589
15747
|
|
|
15590
15748
|
useEffect(function () {
|
|
15591
|
-
|
|
15749
|
+
|
|
15592
15750
|
params = new URL(document.location).searchParams;
|
|
15593
|
-
seriesVid = params.get('
|
|
15751
|
+
seriesVid = params.get('vidSeries') || 1;
|
|
15752
|
+
setSeries(seriesVid);
|
|
15594
15753
|
setVidUrl(nodes.videos['' + (seriesVid - 1)].url);
|
|
15595
15754
|
}, []);
|
|
15596
15755
|
|
|
@@ -15692,18 +15851,38 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
|
|
|
15692
15851
|
padding: '0 1rem',
|
|
15693
15852
|
left: '0'
|
|
15694
15853
|
} },
|
|
15695
|
-
vidUrl && React__default.createElement(GroupDeck, { dark: true, dataset: seriesData, setState: setState, seriesVid:
|
|
15854
|
+
vidUrl && React__default.createElement(GroupDeck, { dark: true, dataset: seriesData, setState: setState, seriesVid: series, current: vidUrl })
|
|
15696
15855
|
)
|
|
15697
15856
|
),
|
|
15698
15857
|
React__default.createElement(
|
|
15699
15858
|
'div',
|
|
15700
15859
|
{ className: 'vid-controls', style: { width: '100%', background: 'transparent', display: 'flex', justifyContent: 'center' } },
|
|
15701
|
-
React__default.createElement(
|
|
15702
|
-
'
|
|
15703
|
-
|
|
15704
|
-
|
|
15705
|
-
|
|
15706
|
-
|
|
15860
|
+
React__default.createElement(
|
|
15861
|
+
'button',
|
|
15862
|
+
{
|
|
15863
|
+
'aria-label': 'Toggles video series',
|
|
15864
|
+
id: 'vid-series-btn',
|
|
15865
|
+
onClick: toggleSeries,
|
|
15866
|
+
className: 'btn btn-block btn-lg btn-secondary ',
|
|
15867
|
+
style: { borderRadius: '0' } },
|
|
15868
|
+
'View Series'
|
|
15869
|
+
)
|
|
15870
|
+
),
|
|
15871
|
+
React__default.createElement(
|
|
15872
|
+
'div',
|
|
15873
|
+
{ className: 'my-5' },
|
|
15874
|
+
series && React__default.createElement(
|
|
15875
|
+
'h3',
|
|
15876
|
+
null,
|
|
15877
|
+
'Episode ',
|
|
15878
|
+
series
|
|
15879
|
+
),
|
|
15880
|
+
nodes.videos[0] && React__default.createElement(
|
|
15881
|
+
'h2',
|
|
15882
|
+
{ className: 'mb-3' },
|
|
15883
|
+
nodes.videos[0].title
|
|
15884
|
+
),
|
|
15885
|
+
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()))
|
|
15707
15886
|
),
|
|
15708
15887
|
React__default.createElement(
|
|
15709
15888
|
'style',
|
|
@@ -15725,7 +15904,7 @@ var getSerializers$1 = function getSerializers(client) {
|
|
|
15725
15904
|
youtubeGallery: function youtubeGallery(_ref2) {
|
|
15726
15905
|
var node = _ref2.node;
|
|
15727
15906
|
|
|
15728
|
-
return React__default.createElement(YouTubeGallery, { nodes: node });
|
|
15907
|
+
return React__default.createElement(YouTubeGallery, { nodes: node, client: client });
|
|
15729
15908
|
},
|
|
15730
15909
|
figure: function figure(_ref3) {
|
|
15731
15910
|
var node = _ref3.node;
|
|
@@ -15785,5 +15964,5 @@ var getSerializers$1 = function getSerializers(client) {
|
|
|
15785
15964
|
};
|
|
15786
15965
|
};
|
|
15787
15966
|
|
|
15788
|
-
export { ContentCard as DeckContent, DeckQueue, ThumbnailCard, TaxonomyCard, GroupDeck, Column1, Column2, Column3, Header, LeftNav, AccordionPanel, SocialShare, NavMagazine, NavNative, NavNormal, NavDvm, TemplateNormal, AD300x250, AD300x250x600, AD728x90, getSerializers$1 as getSerializers, Search };
|
|
15967
|
+
export { ContentCard as DeckContent, DeckQueue, ThumbnailCard, TaxonomyCard, GroupDeck, YoutubeGroup, Column1, Column2, Column3, Header, LeftNav, AccordionPanel, SocialShare, NavMagazine, NavNative, NavNormal, NavDvm, TemplateNormal, AD300x250, AD300x250x600, AD728x90, getSerializers$1 as getSerializers, Search };
|
|
15789
15968
|
//# sourceMappingURL=index.es.js.map
|