Jannex
/
SHX-Theme
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

test

pull/1/head
Jan Umbach 2024-05-30 13:01:24 +02:00
parent 298da82eb3
commit feda4df2cc
1 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
snippets/shx-product-desc.liquid
View File

@ -11,7 +11,7 @@
// element functionality written in here
this.currentVariant = null;
this.videoClones = {};
this.video_wrapper_Clones = {};
}
connectedCallback() {
@ -38,33 +38,33 @@
document.querySelectorAll('[thumbnail-alt-mobile]').forEach((thumbnail) => {
console.log(thumbnail.getAttribute('thumbnail-alt-mobile'));
if (thumbnail.getAttribute('thumbnail-alt-mobile') === "__" + this.currentVariant) {
let video = thumbnail.querySelector('.shx-video');
let videoWrapper = thumbnail.querySelector('.shx-video');
if (video) {
if (videoWrapper) {
// clone video to shadow dom
let videoClone = null;
if (this.videoClones[this.currentVariant]) {
videoClone = this.videoClones[this.currentVariant];
let videoWrapperClone = null;
if (this.video_wrapper_Clones[this.currentVariant]) {
videoWrapperClone = this.video_wrapper_Clones[this.currentVariant];
} else {
videoClone = video.cloneNode(true);
this.videoClones[this.currentVariant] = videoClone;
videoWrapperClone = videoWrapper.cloneNode(true);
this.video_wrapper_Clones[this.currentVariant] = videoWrapperClone;
}
this.appendChild(videoClone);
this.appendChild(videoWrapperClone);
// get video element
let videoElement = this.querySelector('.shx-video');
videoElement.classList.add('shx-video-for-desc');
let videoElement = videoElement.querySelector('video');
videoWrapper.classList.add('shx-video-for-desc');
// pause all video
Object.keys(this.videoClones).forEach((key) => {
Object.keys(this.video_wrapper_Clones).forEach((key) => {
if (key !== this.currentVariant) {
this.videoClones[key].pause();
this.video_wrapper_Clones[key].pause();
}
});
});
videoClone.play();
videoElement.play();
if(openAnimation) {
videoElement.style.height = '0px';