Markdown (marked.js) Media Extras - Youtube, Vimeo, DailyMotion, Viddler

1-table-of-contents.md

Table Of Contents

• this.gist (this gist, haha)
• About enhancement
• Usage
• JsBin Demo
• Integrate with chjj/[email protected]

Most powerful GFM(-ish) markdown compilier/parser, chjj/[email protected] already with VIDEO MEDIA EXTRAS!

2-marked-extras-enhancement.md

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.

3-media-parse-id-from-url.js

/**
 * 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;
  }
}

4-usage-of-marked-extras.md

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'));