<script>
// Support-any-video-hosting script - part 1 of 2
var script = document.querySelector('script[src*="tilda-catalog-1."]');
if (script) {
script.onload = loadHandler;
}
function loadHandler(){
if(window.t_store_get_productcard_oneSlide_html) {
if (String(t_store_get_productcard_oneSlide_html) === `function t_store_get_productcard_oneSlide_html(options,element){var iconColor=options.slider_opts.videoPlayerIconColor||\"#fff\",str=\"\";return str+='<div class=\"t-slds__item [[activeClass]]\" data-slide-index=\"[[index]]\">',str+=' <div class=\"t-slds__wrapper\" itemscope itemtype=\"http://schema.org/ImageObject\">',str+=' <meta itemprop=\"image\" content=\"[[imgsource]]\">',str+=' <div class=\"t-slds__imgwrapper [[zoomClass]]\" [[zoomAttrs]]>',str+=' <div class=\"t-slds__bgimg [[containClass]] t-bgimg [[productClass]]\" data-original=\"[[imgsource]]\" style=\"padding-bottom:[[paddingBottomVal]]; background-image: url(\\'[[imgsource_lazy]]\\');\">',str+=\" </div>\",str+=\" </div>\",element.video&&(str+='<div class=\"t-slds__videowrapper\">',str+='<div class=\"t-slds__play_icon\" data-slider-video-url=\"'+element.videoid+'\" data-slider-video-type=\"'+element.vtype+'\" style=\"width:70px; height: 70px; \">',str+='<svg width=\"70px\" height=\"70px\" viewBox=\"0 0 60 60\">',str+='<g stroke=\"none\" stroke-width=\"1\" fill=\"\" fill-rule=\"evenodd\">',str+='<g transform=\"translate(-691.000000, -3514.000000)\" fill=\"'+iconColor+'\">',str+='<path d=\"M721,3574 C737.568542,3574 751,3560.56854 751,3544 C751,3527.43146 737.568542,3514 721,3514 C704.431458,3514 691,3527.43146 691,3544 C691,3560.56854 704.431458,3574 721,3574 Z M715,3534 L732,3544.5 L715,3555 L715,3534 Z\"></path>',str+=\"</g>\",str+=\"</g>\",str+=\"</svg>\",str+=\"</div>\",str+='<div class=\"t-slds__frame-wrapper\"></div>',str+=\"</div>\"),str+=\" </div>\",str=(str+=\"</div>\").replace(\"[[zoomAttrs]]\",options.slider_slidesOpts.zoomable?'data-zoom-target=\"[[index]]\" data-zoomable=\"yes\" data-img-zoom-url=\"[[imgsource]]\"':\"\").replace(\"[[zoomClass]]\",options.slider_slidesOpts.zoomable?\"t-zoomable\":\"\").replace(\"[[containClass]]\",\"contain\"===options.slider_slidesOpts.bgsize?\"t-slds__bgimg-contain\":\"\").replace(\"[[paddingBottomVal]]\",100*options.slider_slidesOpts.ratio+\"%\")}`){
t_store_get_productcard_oneSlide_html = modified_t_store_get_productcard_oneSlide_html;
} else {
console.log("Seems like 't_store_get_productcard_oneSlide_html' function was changed. Support-any-video-hosting script needs to be reworked.")
}
}
}
function modified_t_store_get_productcard_oneSlide_html(options, element) {
var iconColor = options.slider_opts.videoPlayerIconColor || "#fff"
, str = "";
var videoLink = element.vtype ? "" : element.video;
return str += '<div class="t-slds__item [[activeClass]]" data-slide-index="[[index]]">',
str += ' <div class="t-slds__wrapper" itemscope itemtype="http://schema.org/ImageObject">',
str += ' <meta itemprop="image" content="[[imgsource]]">',
str += ' <div class="t-slds__imgwrapper [[zoomClass]]" [[zoomAttrs]]>',
str += ' <div class="t-slds__bgimg [[containClass]] t-bgimg [[productClass]]" data-original="[[imgsource]]" style="padding-bottom:[[paddingBottomVal]]; background-image: url(\'[[imgsource_lazy]]\');">',
str += " </div>",
str += " </div>",
element.video && (str += '<div class="t-slds__videowrapper">',
str += '<div class="t-slds__play_icon" data-slider-video-link="'+ videoLink +'" data-slider-video-url="' + element.videoid + '" data-slider-video-type="' + element.vtype + '" style="width:70px; height: 70px; ">',
str += '<svg width="70px" height="70px" viewBox="0 0 60 60">',
str += '<g stroke="none" stroke-width="1" fill="" fill-rule="evenodd">',
str += '<g transform="translate(-691.000000, -3514.000000)" fill="' + iconColor + '">',
str += '<path d="M721,3574 C737.568542,3574 751,3560.56854 751,3544 C751,3527.43146 737.568542,3514 721,3514 C704.431458,3514 691,3527.43146 691,3544 C691,3560.56854 704.431458,3574 721,3574 Z M715,3534 L732,3544.5 L715,3555 L715,3534 Z"></path>',
str += "</g>",
str += "</g>",
str += "</svg>",
str += "</div>",
str += '<div class="t-slds__frame-wrapper"></div>',
str += "</div>"),
str += " </div>",
str = (str += "</div>").replace("[[zoomAttrs]]", options.slider_slidesOpts.zoomable ? 'data-zoom-target="[[index]]" data-zoomable="yes" data-img-zoom-url="[[imgsource]]"' : "").replace("[[zoomClass]]", options.slider_slidesOpts.zoomable ? "t-zoomable" : "").replace("[[containClass]]", "contain" === options.slider_slidesOpts.bgsize ? "t-slds__bgimg-contain" : "").replace("[[paddingBottomVal]]", 100 * options.slider_slidesOpts.ratio + "%")
}
</script>
<script>
// Support-any-video-hosting script - part 2 of 2
window.addEventListener('load', createVideoTagScript);
function createVideoTagScript(){
var SEL = {
slidesSelector: ".t-slds__item .t-slds__videowrapper",
btnSelector: ".t-slds__play_icon",
videoWrapSelector: ".t-slds__frame-wrapper"
}
setTimeout(()=>{
var slides = document.querySelectorAll(SEL.slidesSelector);
if(slides.length){
slides.forEach(addEventForGenVideo);
}
}, 1000)
function addEventForGenVideo(slide){
var btn = slide.querySelector(SEL.btnSelector);
if(btn.dataset.sliderVideoLink){
btn.addEventListener('click', addVideoTag)
}
}
function addVideoTag(e){
var wrapper = e.currentTarget.parentElement.querySelector(SEL.videoWrapSelector);
var videoTag = document.createElement('video');
videoTag.loop = true;
videoTag.autoplay = true;
videoTag.style.height = '100%';
videoTag.style.width = '100%';
videoTag.innerHTML = `<source src=${e.currentTarget.dataset.sliderVideoLink}><source src=${e.currentTarget.dataset.sliderVideoLink.slice(0, -3) + "webm"}><p>Ваш браузер не поддерживает тег video :(</p>`;
wrapper.appendChild(videoTag);
videoTag.play()
}
}
</script>