Untitled
unknown
plain_text
3 years ago
20 kB
4
Indexable
(function () {
/* main variables */
var debug = 0;
var variation_name = '';
/* all Pure helper functions */
function waitForElement(selector, trigger, delayInterval, delayTimeout) {
var interval = setInterval(function () {
if (document && document.querySelector(selector) && document.querySelectorAll(selector).length > 0
&& window.popularMysteryObj1 && window.newtoBritBox1 && window.britboxOriginal1) {
clearInterval(interval);
trigger();
}
}, delayInterval);
setTimeout(function () {
clearInterval(interval);
}, delayTimeout);
}
var popularMysteryObj ;
var newtoBritBox;
var britboxOriginal;
function getNewToBritboxHTML() {
var html = '';
for (var i = 0; i < newtoBritBox.length; i++) {
html +=
'' +
' <div class="swiper-slide">' +
' <div class="box">' +
' <div data-title="' +
newtoBritBox[i].title +
'" data-title-tracking="" data-colnumber="' +
(i + 1) +
'" class="card"><div class="ribbon Blue-normal">New</div>' +
' <a href="' +
newtoBritBox[i].link +
'">' +
' <div class="image pulsate loaded">' +
' <img src="' +
newtoBritBox[i].img +
'" class="b-lazy b-loaded" />' +
' </div>' +
' </a>' +
' <div class="card-content">' +
' <div class="card-content-inside">' +
' <div class="description">' +
' <div class="top-animation">' +
' <a href="' +
newtoBritBox[i].link +
'">' +
' <div class="top">' +
newtoBritBox[i].title +
'</div>' +
' <div class="inner-content">' +
' <div class="season">' +
' <div class="description">' +
newtoBritBox[i].description +
'</div>' +
' <div class="more-info">' +
newtoBritBox[i].info +
'</div>' +
' </div>' +
' </div>' +
' </a>' +
' </div>' +
' <div class="actions bottom">' +
' <a href="' +
newtoBritBox[i].link +
'" class="play-now">' +
' <span class="play-animation">' +
' <img src="/content/img/action-svg/play_now.svg" /> ' +
' <img src="/content/img/action-svg/continue_watching.svg" style="display: none" /> ' +
' <img src="/content/img/action-svg/trailer.svg" style="display: none" />' +
' </span>' +
' <span>Play now </span></a>' +
' <a href="' +
newtoBritBox[i].link +
'" class="discover"><i class="icon-discover-more"></i> <span>Discover more</span></a>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>';
}
return (
' <div data-name-component="ProgrammeCarousel" class="swiper episodes new-episodes new-to-britbox">' +
' <div class="row">' +
' <div class="columns">' +
' <div class="top-wrapper">' +
' <h2 class="title">New to BritBox</h2>' +
' <div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets">' +
' <span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 1"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 2"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 3"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 5"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' <div class="row">' +
' <div class="columns">' +
' <div class="swiper-horizontal">' +
' <div data-slides-per-view="4" data-slides-per-group="4" class="swiper-container swiper-container-initialized swiper-container-horizontal eg-my-swiper">' +
' <div class="swiper-wrapper init-via-slick">' +
html +
'</div>' +
' <div class="swiper-button-next" tabindex="0" role="button" aria-label="Next slide" aria-disabled="false"></div>' +
' <div class="swiper-button-prev swiper-button-disabled" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="true"></div>' +
' <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span> <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>'
);
}
function getPopularMisteryHTML() {
var html = '';
for (var i = 0; i < popularMysteryObj.length; i++) {
html +=
'' +
' <div class="swiper-slide">' +
' <div class="box">' +
' <div data-title="' +
popularMysteryObj[i].title +
'" data-title-tracking="" data-colnumber="' +
(i + 1) +
'" class="card">' +
' <a href="' +
popularMysteryObj[i].link +
'">' +
' <div class="image pulsate loaded">' +
' <img src="' +
popularMysteryObj[i].img +
'" class="b-lazy b-loaded" />' +
' </div>' +
' </a>' +
' <div class="card-content">' +
' <div class="card-content-inside">' +
' <div class="description">' +
' <div class="top-animation">' +
' <a href="' +
popularMysteryObj[i].link +
'">' +
' <div class="top">' +
popularMysteryObj[i].title +
'</div>' +
' <div class="inner-content">' +
' <div class="season">' +
' <div class="description">' +
popularMysteryObj[i].description +
'</div>' +
' <div class="more-info">' +
popularMysteryObj[i].info +
'</div>' +
' </div>' +
' </div>' +
' </a>' +
' </div>' +
' <div class="actions bottom">' +
' <a href="' +
popularMysteryObj[i].link +
'" class="play-now">' +
' <span class="play-animation">' +
' <img src="/content/img/action-svg/play_now.svg" /> ' +
' <img src="/content/img/action-svg/continue_watching.svg" style="display: none" /> ' +
' <img src="/content/img/action-svg/trailer.svg" style="display: none" />' +
' </span>' +
' <span>Play now </span></a>' +
' <a href="' +
popularMysteryObj[i].link +
'" class="discover"><i class="icon-discover-more"></i> <span>Discover more</span></a>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>';
}
return (
' <div data-name-component="ProgrammeCarousel" class="swiper episodes new-episodes popular-mystery">' +
' <div class="row">' +
' <div class="columns">' +
' <div class="top-wrapper">' +
' <h2 class="title">Popular Mystery</h2>' +
' <div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets">' +
' <span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 1"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 2"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 3"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 5"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' <div class="row">' +
' <div class="columns">' +
' <div class="swiper-horizontal">' +
' <div data-slides-per-view="4" data-slides-per-group="4" class="swiper-container swiper-container-initialized swiper-container-horizontal eg-my-swiper">' +
' <div class="swiper-wrapper init-via-slick">' +
html +
'</div>' +
' <div class="swiper-button-next" tabindex="0" role="button" aria-label="Next slide" aria-disabled="false"></div>' +
' <div class="swiper-button-prev swiper-button-disabled" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="true"></div>' +
' <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span> <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>'
);
}
function getBritboxOriginalHTML() {
var html = '';
for (var i = 0; i < britboxOriginal.length; i++) {
html +=
'' +
' <div class="swiper-slide">' +
' <div class="box">' +
' <div data-title="' +
britboxOriginal[i].title +
'" data-title-tracking="" data-colnumber="' +
(i + 1) +
'" class="card">' +
' <a href="' +
britboxOriginal[i].link +
'">' +
' <div class="image pulsate loaded">' +
' <img src="' +
britboxOriginal[i].img +
'" class="b-lazy b-loaded" />' +
' </div>' +
' </a>' +
' <div class="card-content">' +
' <div class="card-content-inside">' +
' <div class="description">' +
' <div class="top-animation">' +
' <a href="' +
britboxOriginal[i].link +
'">' +
' <div class="top">' +
britboxOriginal[i].title +
'</div>' +
' <div class="inner-content">' +
' <div class="season">' +
' <div class="description">' +
britboxOriginal[i].description +
'</div>' +
' <div class="more-info">' +
britboxOriginal[i].info +
'</div>' +
' </div>' +
' </div>' +
' </a>' +
' </div>' +
' <div class="actions bottom">' +
' <a href="' +
britboxOriginal[i].link +
'" class="play-now">' +
' <span class="play-animation">' +
' <img src="/content/img/action-svg/play_now.svg" /> ' +
' <img src="/content/img/action-svg/continue_watching.svg" style="display: none" /> ' +
' <img src="/content/img/action-svg/trailer.svg" style="display: none" />' +
' </span>' +
' <span>Play now </span></a>' +
' <a href="' +
britboxOriginal[i].link +
'" class="discover"><i class="icon-discover-more"></i> <span>Discover more</span></a>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>';
}
return (
' <div data-name-component="ProgrammeCarousel" class="swiper episodes new-episodes">' +
' <div class="row">' +
' <div class="columns">' +
' <div class="top-wrapper">' +
' <h2 class="title">Britbox Original</h2>' +
' <div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets">' +
' <span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 1"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 2"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 3"></span' +
' ><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 5"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' <div class="row">' +
' <div class="columns">' +
' <div class="swiper-horizontal">' +
' <div data-slides-per-view="4" data-slides-per-group="4" class="swiper-container swiper-container-initialized swiper-container-horizontal eg-my-swiper">' +
' <div class="swiper-wrapper init-via-slick">' +
html +
'</div>' +
' <div class="swiper-button-next" tabindex="0" role="button" aria-label="Next slide" aria-disabled="false"></div>' +
' <div class="swiper-button-prev swiper-button-disabled" tabindex="0" role="button" aria-label="Previous slide" aria-disabled="true"></div>' +
' <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span> <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>' +
' </div>' +
' </div>' +
' </div>' +
' </div>' +
' </div>'
);
}
function init() {
popularMysteryObj = window.popularMysteryObj1;
newtoBritBox = window.newtoBritBox1;
britboxOriginal = window.britboxOriginal1;
document.querySelector('.main-content > .episodes.new-episodes:nth-child(5)').insertAdjacentHTML('beforebegin', getNewToBritboxHTML());
document.querySelector('.main-content > .episodes.new-episodes:nth-child(7)').insertAdjacentHTML('beforebegin', getBritboxOriginalHTML());
document.querySelector('.main-content .new-to-britbox').insertAdjacentHTML('beforebegin', getPopularMisteryHTML());
waitForElement(
'[data-name-component="ProgrammeCarousel"] .swiper-container-initialized.swiper-container:not(.eg-my-swiper)',
function () {
document.querySelectorAll('[data-name-component="ProgrammeCarousel"] .swiper-container:not(.eg-my-swiper)').forEach(function (item) {
let slider = item.swiper;
slider.destroy();
});
waitForjQuery(function () {
addScript();
waitForSlick(function () {
var $ = window.jQuery;
$('[data-name-component="ProgrammeCarousel"] .swiper-container:not(.eg-my-swiper) .swiper-wrapper').slick({
dots: false,
infinite: true,
speed: 300,
slidesToShow: 4,
slidesToScroll: 4,
centerMode: false,
responsive: [
{
breakpoint: 767,
settings: {
slidesToShow: 1,
slidesToScroll: 1,
centerMode: true,
},
},
],
});
$('[data-name-component="ProgrammeCarousel"] .swiper-container:not(.eg-my-swiper) .swiper-wrapper').on('beforeChange', function (event, slick, currentSlide, nextSlide) {
setTimeout(function () {
window.scroll(0, window.pageYOffset + 1);
}, 200);
});
});
});
},
50,
10000
);
}
function waitForSlick(trigger) {
var interval = setInterval(function () {
if (window.jQuery.fn.slick != undefined) {
clearInterval(interval);
trigger();
}
}, 50);
setTimeout(function () {
clearInterval(interval);
}, 15000);
}
function waitForjQuery(trigger) {
var interval = setInterval(function () {
if (window.jQuery != undefined) {
clearInterval(interval);
trigger();
}
}, 50);
setTimeout(function () {
clearInterval(interval);
}, 15000);
}
function addScript() {
var cssScript = '' + "<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css'/>";
document.querySelector('head').insertAdjacentHTML('beforeend', cssScript);
var swiperScript = document.createElement('script');
swiperScript.src = 'https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js';
document.getElementsByTagName('head')[0].appendChild(swiperScript);
}
waitForElement('.main-content [data-name-component="HeroCarousel"] .swiper-container', init, 50, 10000);
})();
Editor is loading...