S W
S W

Reputation: 13

loadVideo() + setCurrentTime() in one onclick-Event

By clicking a button i want an embeded vimeo-player to:

At first i tried: onclick="player.loadVideo(12345678); player.setCurrentTime(5); player.play()."

This obviously didn't work. I already learned that the loadVideo()-function fires an event - so the second function has to run after this event was caught. Since my understanding of JavaScript is still pretty limited i would love to learn how this would work.

Upvotes: 0

Views: 1745

Answers (2)

duc mai
duc mai

Reputation: 1422

as the previous mentioned about promise. All you need is to wait for the methods complete properly. Beside writing then and catch as the old way I can recommend async await way which is more readable. you can see as following

const playVideo = async (id, time) => {
   try {
     await player.loadVideo(id);
     await player.setCurrentTime(time);
     await player.play();
   } catch (err) {
     console.log(err);
   } 
}
onclick="playVideo(309565369, 5)"

Upvotes: 1

Matt Fisher
Matt Fisher

Reputation: 21

All of the calls you are making are Promises. You will want to ensure you wait for the successful return of each request before making the next. Here is an example for you

var player = new Vimeo.Player('player', { id:76979871, muted: true });
player.loadVideo(309565369).then(function(id) {
    player.setCurrentTime(30).then(function(seconds) {
        player.play().then(function() {
            console.log('the video was played');
        }).catch(function(error) {
            console.log(error);
        });
    }).catch(function(error) {
        console.log(error);
    });
}).catch(function(error) {
    console.log(error);
});

Upvotes: 0

Related Questions