Skip to content

Instantly share code, notes, and snippets.

@tunnckoCore
Last active September 1, 2021 17:07
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save tunnckoCore/9374172 to your computer and use it in GitHub Desktop.
Save tunnckoCore/9374172 to your computer and use it in GitHub Desktop.
Markdown (marked.js) Media Extras - Youtube, Vimeo, DailyMotion, Viddler

Markdown (marked.js) Media Extras

I don't know how practical it is implemented, but I fork marked.js and add simple function mediaParseIdFromUrl() to parse url of YouTube, Viddler, DailyMotion and Vimeo videos and returns Video ID only. For now are only that, but if someone want can add more with simple if-else conditions.

/**
* Parse url of video to return Video ID only
* if video exists and matches to media's host
* else undefined
*
* @example mediaParseIdFromUrl('youtube', 'https://www.youtube.com/watch?v=fgQRaRqOTr0')
* //=> fgQRaRqOTr0
*
* @param {string} provider name of media/video site
* @param {string} url url of video
* @return {string|undefined} the parsed id of video, if not match - undefined
*/
function mediaParseIdFromUrl(provider, url) {
if (provider === 'youtube') {
var youtubeRegex = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
var youtubeMatch = url.match(youtubeRegex);
if (youtubeMatch && youtubeMatch[7].length == 11) {
return youtubeMatch[7];
} else {
return undefined;
}
} else if (provider === 'vimeo') {
var vimeoRegex = /^.*vimeo.com\/(\d+)/;
var vimeoMatch = url.match(vimeoRegex);
if (vimeoMatch && vimeoMatch[1].length == 8) {
return vimeoMatch[1];
} else {
return undefined;
}
} else if (provider === 'viddler') {
var viddlerRegex = /^.*((viddler.com\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
var viddlerMatch = url.match(viddlerRegex);
if (viddlerMatch && viddlerMatch[7].length == 8) {
return viddlerMatch[7];
} else {
return undefined;
}
} else if (provider === 'dailymotion') {
var dailymotionRegex = /^.+dailymotion.com\/((video|hub)\/([^_]+))?[^#]*(#video=([^_&]+))?/;
var dailymotionMatch = url.match(dailymotionRegex);
if (dailymotionMatch && (dailymotionMatch[5] || dailymotionMatch[3])) {
if (dailymotionMatch[5]) {
return dailymotionMatch[5];
}
if (dailymotionMatch[3]) {
return dailymotionMatch[3];
}
return undefined;
} else {
return undefined;
}
}/* not works yet
else if (provider === 'html5') {
var html5Regex = /.(?:wav|mp3|ogg|mp4|wma|webm|mp3)$/i;
var html5Match = url.match(html5Regex);
var data = {
extension: html5Match,
link: url
};
return data;
}*/ else {
return;
}
}

Usage

or visit tugeb/66 and click Run with JS to preview live demo

console.log("YouTube 1: " + mediaParseIdFromUrl('youtube', 'https://www.youtube.com/watch?v=fgQRaRqOTr0'));
console.log("YouTube 2: " + mediaParseIdFromUrl('youtube', 'http://youtube.com/v/GtGJnXB972I'));
console.log("Vimeo: " + mediaParseIdFromUrl('vimeo', 'https://www.vimeo.com/11918221'));
console.log("Viddler: " + mediaParseIdFromUrl('viddler', 'https://www.viddler.com/v/d6c37b62'));
console.log("DailyMotion: " + mediaParseIdFromUrl('dailymotion', 'http://www.dailymotion.com/video/x1eqps5_shadows-heretic-kingdoms-trailer_videogames'));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment