Stop all vimeo videos

When I embed videos from vimeo, each video rectangle ID is different eg vimeoplayer1

I am then using this script to pause the video when the scene is exited or another event takes place, but can I rewrite this to stop many videos (with different unique IDs) in one go?

	var videoRectangle = hypeDocument.getElementById('vimeoplayer1')
		var iframe = videoRectangle.childNodes[0];
	var player = $f(iframe);
	player.api("pause");

I'd probably do something like look at the src of all iframes on the page, and find any that use "player.vimeo.com" URL.

// get all iframes in the scene
var sceneElement = hypeDocument.getElementById(hypeDocument.currentSceneId());
var allIframesOnScene = sceneElement.getElementsByTagName("iframe");

// loop over each
for(var i = 0; i < allIframesOnScene.length; i++) {
	// filter out anything without player.vimeo.com in the src
	if(allIframesOnScene[i].src == null || allIframesOnScene[i].src.indexOf("player.vimeo.com") == -1) {
		continue;
	}
	
	// we have a vimeo iframe
	var iframe = allIframesOnScene[i];
	var player = $f(iframe);
	player.api("pause");
}

Thanks Jonathan, now to see if I can implement that :flushed:

Works beautifully Jonathan- one question…does it matter what the element ID is? seems to be working regardless of what its called

Great that it works!

You don't any need explicit IDs on the Hype elements if this is all you want to do. The code does a search for all iframes in the scene and then discovers the right ones based on their URL.

1 Like