plugins/LinkPreview/linkpreview.js

   1 /**
   2  * (c) 2010 StatusNet, Inc.
   3  */
   4
   5 $(function() {
   6     /**
   7      * Find URL links from the source text that may be interesting.
   8      *
   9      * @param {String} text
  10      * @return {Array} list of URLs
  11      */
  12     function findLinks(text)
  13     {
  14         // @fixme match this to core code
  15         var re = /(?:^| )(https?:\/\/.+?\/.+?)(?= |$)/mg;
  16         var links = [];
  17         var matches;
  18         while ((matches = re.exec(text)) !== null) {
  19             links.push(matches[1]);
  20         }
  21         return links;
  22     }
  23
  24     /**
  25      * Do an oEmbed lookup for the given URL.
  26      *
  27      * @fixme proxy through ourselves if possible?
  28      * @fixme use the global thumbnail size settings
  29      *
  30      * @param {String} url
  31      * @param {function} callback
  32      */
  33     function oEmbedLookup(url, callback)
  34     {
  35         var api = 'http://oohembed.com/oohembed';
  36         var params = {
  37             url: url,
  38             format: 'json',
  39             maxwidth: 100,
  40             maxheight: 75,
  41             callback: '?'
  42         };
  43         $.get(api, params, function(data, xhr) {
  44             callback(data);
  45         }, 'jsonp');
  46     }
  47
  48     /**
  49      * Start looking up info for a link preview...
  50      * May start async data loads.
  51      *
  52      * @param {String} id
  53      * @param {String} url
  54      */
  55     function prepLinkPreview(id, url)
  56     {
  57         oEmbedLookup(url, function(data) {
  58             var thumb = null;
  59             var width = 100;
  60             if (typeof data.thumbnail_url == "string") {
  61                 thumb = data.thumbnail_url;
  62                 if (typeof data.thumbnail_width !== "undefined") {
  63                     if (data.thumbnail_width < width) {
  64                         width = data.thumbnail_width;
  65                     }
  66                 }
  67             } else if (data.type == 'photo' && typeof data.url == "string") {
  68                 thumb = data.url;
  69                 if (typeof data.width !== "undefined") {
  70                     if (data.width < width) {
  71                         width = data.width;
  72                     }
  73                 }
  74             }
  75             if (thumb) {
  76                 var img = $('<img/>')
  77                     .attr('src', thumb)
  78                     .attr('width', width)
  79                     .attr('title', data.title || data.url || url);
  80                 $('#' + id).append(img);
  81             }
  82         });
  83     }
  84
  85     /**
  86      * Update the live preview section with links found in the given text.
  87      * May start async data loads.
  88      *
  89      * @param {String} text: free-form input text
  90      */
  91     function previewLinks(text)
  92     {
  93         var links = findLinks(text);
  94         $('#link-preview').html('');
  95         for (var i = 0; i < links.length; i++) {
  96             var id = 'link-preview-' + i;
  97             $('#link-preview').append('<span id="' + id + '"></span>');
  98             prepLinkPreview(id, links[i]);
  99         }
 100     }
 101     $('#form_notice').append('<div id="link-preview"></div>');
 102     $('#notice_data-text').change(function() {
 103        var text = $(this).val();
 104        previewLinks(text);
 105     });
 106 });