I'm working on a way for the client (user) to get the iFrame from vimeo to play a different video.. this is proving more difficult for me than previously anticipated. the changing of the video has to be done via a text-box.
if at all possible, how can i extract the embed code like this:
<iframe src="https://player.vimeo.com/video/22439234?title=0&byline=0&portrait=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
from a url such as: https://vimeo.com/22439234 ?
How can i retrieve the iframe, src attribute value or anything i can use from the above example?
I've googled around a bunch, but all instructions I have found are directed at developers...
(I'm using Angularjs, so any Javascript or Angular solutions are acceptable)
EDIT: I found a website that does what i want, might help you understand what i want to do..
if you paste https://vimeo.com/22439234 in there and press generate, it outputs:
<object type="application/x-shockwave-flash" style="width:450px; height:366px;" data="http://vimeo.com/moogaloop.swf?clip_id=22439234&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=ff9933&fullscreen=1" allowfullscreen="true" allowscriptaccess="always">
Get your own valid XHTML Vimeo embed code
that's exactly what i need, except for the fact that it's not an iFrame...
Here's a fiddle with the solution: http://jsfiddle.net/ost9y204/
If you have an input where the user pastes the URL:
<input id="video">
You can parse the Vimeo URL with this function:
function parseUrl(){
var val = document.getElementById('video').value;
var vimeoRegex = /(?:vimeo)\.com.*(?:videos|video|channels|)\/([\d]+)/i;
var parsed = val.match(vimeoRegex);
return "//player.vimeo.com/video/" + parsed[1];
};
And whenever you need to get the URL, just call parseUrl()
. Then put the returned value in the iframe's src.