@Mottie Could you please provide a solution for the below mentioned issue.
Video is not playing for single slide with video. The "var playVideo = function(slider) ", checking for currentSlider has any video. But in this case slider.find("video"); return as not found a video.
//if slider has video and then play
var playVideo = function(slider) {
var vid = slider.find("video");
if (vid.length) {
// play
vid[0].load();
vid[0].muted = true;
vid[0].play();
}
};
//if check slider has video and then pause
var pauseVideo = function(slider) {
var vid = slider.find("video");
if (vid.length && typeof vid[0].pause !== "undefined") {
//pause
vid[0].muted = true;
vid[0].pause();
vid[0].currentTime = 0;
}
};
//check slider has video and is playing
var isPlaying = function(slider) {
var vid = slider.find("video");
return (
vid.length &&
typeof vid[0].pause !== "undefined" &&
!vid[0].paused &&
!vid[0].ended
);
};
$(this.$el).anythingSlider({
resizeContents: true,
autoPlay: true,
resumeOnVisible: true,
buildStartStop: false,
buildArrows: false,
buildNavigation: false,
infiniteSlides: true,
easing: "swing",
theme: "cs-portfolio",
hashTags: false,
fade: "fade",
tooltipClass: "",
pauseOnHover: false,
expand: true,
enableKeyboard: false,
delay: 10000,
stopAtEnd: true,
// Autoplay video in initial panel, if one exists
onInitialized: function(e, slider) {
playVideo(slider.$currentPage);
},
// pause video when out of view
onSlideInit: function(e, slider) {
pauseVideo(slider.$lastPage);
},
// play video
onSlideComplete: function(slider) {
//check slider has video
var vid = slider.$currentPage.find("video");
if (vid.length) {
//vid[0].load();
//vid[0].currentTime = 0;
vid[0].muted = true;
vid[0].play();
slider.clearTimer(true); // stop slideshow
var refreshId = setInterval(function() {
if (!isPlaying(slider.$currentPage)) {
slider.clearTimer(true); // stop slideshow
vid[0].muted = true;
vid[0].pause();
vid[0].currentTime = 0;
slider.gotoPage(slider.currentPage + 1, true);
slider.startStop(slider.playing, true);
clearInterval(refreshId);
}
}, 500);
} else {
slider.clearTimer(true); // stop slideshow
setTimeout(function() {
slider.gotoPage(slider.currentPage + 1, true);
slider.startStop(slider.playing, true); // restart slideshow
}, 10000);
}
},
// pause slideshow if video is playing
isVideoPlaying: function(slider) {
return isPlaying(slider.$currentPage);
}
});
@Mottie Could you please provide a solution for the below mentioned issue.
Video is not playing for single slide with video. The "var playVideo = function(slider) ", checking for currentSlider has any video. But in this case slider.find("video"); return as not found a video.