Vimeo - Get Duration / countdown on play&pause

Question

I've been struggling with the Vimeo API for a few days now.

I want to get the video duration and show a countdown when it's playing, and pause it when the video is paused in HTML.

Does anyone know how to do this or point me in the right direction?

Thanks, Aron

Answer 1

I developed a countdown to play at ad videos before the main video in my website. I believe the code below may help you, you should adapt it to your needs.

           $(document).on('ready',function(){

                /* PLAY AD VIDEO */
                var $video = $('#ad_video),
                player = new Vimeo.Player($video);
                player.play();  

                /* COUNTDOWN */ 
                var interval = null;

                player.getDuration().then(function(duration) {
                    var duration_val = duration;
                    $("#countdown").attr("data-countdown", duration);
                    $("#countdown").html('Video starts in  ' + (duration));

                    interval = setInterval(function(){
                        player.getCurrentTime().then(function(seconds) {
                            var seconds = Math.floor(seconds);
                            var countdown_val = $("#countdown").attr("data-countdown");

                            if(seconds == (duration_val - countdown_val - 1))
                            {
                                $("#countdown").html('Video starts in ' + (duration_val - seconds));
                                $("#countdown").attr("data-countdown", duration_val - seconds);
                            }

                            if(countdown_val == 1)
                            {
                                clearInterval(interval);
                            }
                        });
                    }); 
                }, 1000);   

                /* PLAY MAIN VIDEO */
                $(function(){
                    var $video = $('#ad_video),
                    player = new Vimeo.Player($video);
                    player.on('ended', play_main_video);           
                });

                function play_main_video() {
                    $("#countdown").hide();                 
                    $("#text_countdown").hide();                 
                    $('#ad_video).hide();
                    $('#main_video).show();

                    var $video = $('#main_video),
                    player = new Vimeo.Player($video);
                    player.play();  
                };

            });