Reputation: 13812
How can I reset an embed Vimeo video to how it was onload after it's done playing?
The Vimeo API offers an unload method
player.api("unload")
But it isn't working for non-flash players.
Upvotes: 2
Views: 7709
Reputation: 481
Variation of Steve Robbins solution, with Vimeo specific solution. You don't have to reach the end of the video, but anytime the user bails out, including clicking on a button:
Simple Javascript solution with Vimeo Library loaded: https://player.vimeo.com/api/player.js
function ResetVideo()
{
var Field = "iframe-video"; // <iframe id=iframe-video
var iframe = document.getElementById(Field);
var bLoad = LoadVimeoLib(); // Is the Vimeo lib loaded
if(bLoad > 0)
{
var Videoplayer = new Vimeo.Player(iframe);
Videoplayer.pause(); // Pause the video and audio
Videoplayer.setCurrentTime(0); // Reset the video position
// Reset the video back to the iframe
VideoSrc = Videoplayer.element.src; // Save the video source
Videoplayer.element.src = ""; // Empty the source
Videoplayer.element.src = VideoSrc; // Reset the video source
}
}
function LoadVimeoLib()
{
if (typeof jQuery === 'undefined')
{
alert('no jquery installed');
return 0;
}
var scriptlen = jQuery('script[src="https://player.vimeo.com/api/player.js"]').length;
if (scriptlen == 0)
{
jQuery.ajax({
type: "GET",
url: "https://player.vimeo.com/api/player.js",
dataType: "script"
});
}
return 1;
}
Upvotes: 0
Reputation: 13812
Using the Vimeo API, you can add an event for finish
to trigger the reload. The Vimeo API includes a method unload()
, but it isn't supported in HTML players. Instead, reset the URL in the iframe to return the video to it's original state.
HTML
<iframe src="//player.vimeo.com/video/77984632?api=1" id="video"></iframe>
JS
var iframe = document.getElementById("video"),
player = $f(iframe);
player.addEvent("ready", function() {
player.addEvent('finish', function() {
player.element.src = player.element.src;
});
});
Upvotes: 8