Skip to content

Single Video playing issue #663

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
binishmp opened this issue Mar 4, 2019 · 3 comments
Open

Single Video playing issue #663

binishmp opened this issue Mar 4, 2019 · 3 comments

Comments

@binishmp
Copy link

binishmp commented Mar 4, 2019

@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
Copy link
Contributor

Mottie commented Mar 4, 2019

Hi @binishprabhakar!

If a "video" isn't found maybe the video is an embedded iframe? Would you please share the HTML?

@binishmp
Copy link
Author

binishmp commented Mar 5, 2019

@Mottie its not iframe. Video included inside

@Mottie
Copy link
Contributor

Mottie commented Mar 5, 2019

Would you please share the HTML?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants