Expand various image providers, without having a lot of duplicate code. Install by hand, like an animal, or use [gasoline](https://github.com/pjaspers/gasoline)

universal_image_expander.js

//
// Expand various image providers, without having a lot of duplicate code.
//
// Install by hand, like an animal, or use [gasoline](https://github.com/pjaspers/gasoline)
//
Campfire.UniversalImageExpander = Class.create({
  initialize: function(chat) {
    this.chat = chat;
    this.services = {
      dribbble: /^https?:\/\/[www.]?dribbble.com\/shots\/([A-Za-z0-9]+)/,
      cloudapp: /^https?:\/\/(cl.ly|cloud.fousa.be)\/(image\/)?([A-Za-z0-9]+)\/?$/,
      flickr: /^https?:\/\/(www.)?flickr.com\/[A-Za-z0-9]+\/[A-Za-z0-9]+\/[A-Za-z0-9]+\/?$/,
      instagram: /^https?:\/\/(instagr.am|instagram.com)\/p\/[A-Za-z0-9_]+\/?$/,
      imgur: /^https?:\/\/imgur.com\/gallery\/[A-Za-z0-9_]+\/?$/
    };
    var messages = this.chat.transcript.messages;
    for (var i = 0; i < messages.length; i++) {
      this.detectImageURL(messages[i]);
    }
  },

  fetchJSON: function(messageID, url, service) {
    console.log("Fetching %s: %s", service, url);
    var s = service.capitalize();
    window.propane.requestJSON(messageID, url, 'window.chat.universalimageexpander', 'on' + s + 'Loaded', 'on' + s + 'Failed');
  },

  fetchDribbble: function(messageID, match) {
    var url = "http://api.dribbble.com/shots/" + match[1];
    this.fetchJSON(messageID, url, 'dribbble');
  },

  onDribbbleLoaded: function(messageID, data) {
    var imageURL = data['image_url'];
    this.insertImageURL(messageID, imageURL);
  },

  fetchImgur: function(messageID, match) {
    var url = "http://noembed.com/embed?url=" + match[0];
    this.fetchJSON(messageID, url, 'imgur');
  },

  onImgurLoaded: function(messageID, data) {
    var imageURL = data['media_url'];
    this.insertImageURL(messageID, imageURL);
  },

  fetchCloudapp: function(messageID, match) {
    var url = match[0];
    this.fetchJSON(messageID, url, 'cloudapp');
  },

  onCloudappLoaded: function(messageID, data) {
    var imageURL = data['content_url'];
    this.insertImageURL(messageID, imageURL);
  },

  fetchFlickr: function(messageID, match) {
    var url = "http://www.flickr.com/services/oembed/?url=" + match[0] + "&format=json";
    this.fetchJSON(messageID, url, 'flickr');
  },

  onFlickrLoaded: function(messageID, data) {
    var imageURL = data['url'];
    this.insertImageURL(messageID, imageURL);
  },

  fetchInstagram: function(messageID, match) {
    var url = "http://api.instagram.com/oembed?url=" + match[0];
    this.fetchJSON(messageID, url, 'instagram');
  },

  onInstagramLoaded: function(messageID, data) {
    var imageURL = data['url'];
    this.insertImageURL(messageID, imageURL);
  },

  detectImageURL: function(message) {
    /* we are going to use the messageID to uniquely identify our requestJSON request
       so we don't check pending messages */
    if (message.pending()) return;
    if (message.kind !== 'text') return;

    var links = message.bodyElement().select('a:not(image)');
    if (links.length != 1) return;

    var href = links[0].getAttribute('href');
    var match = null;
    for (var service in this.services) {
      match = href.match(this.services[service])
      if (!match) continue;
      var fetcher = this["fetch" + service.capitalize()];
      if (!fetcher) {
        console.log("No fetcher found for " + service);
      } else {
        fetcher.call(this, message.id(), match);
      }
      break;
    }
  },

  insertImageURL: function(messageID, imageURL) {
    var message = window.chat.transcript.getMessageById(messageID);
    if (!message) return;
    message.resize((function() {
                      message.bodyCell.insert({bottom: '<div style="width:100%; margin-top:5px; padding-top: 5px; border-top:1px dotted #ccc;"><a href="'+imageURL+'" class="image loading" target="_blank">' + '<img src="'+imageURL+'" onload="$dispatch(&quot;inlineImageLoaded&quot;, this)" onerror="$dispatch(&quot;inlineImageLoadFailed&quot;, this)" /></a></div>'});
                    }).bind(this));

  },

  onEmbedDataFailed: function(messageID) {
    /* No cleanup required, we only alter the HTML after we get back a succesful load from the data */
  },

  onMessagesInsertedBeforeDisplay: function(messages) {
    for (var i = 0; i < messages.length; i++) {
      this.detectImageURL(messages[i]);
    }
  },

  onMessageAccepted: function(message, messageID) {
    this.detectImageURL(message);
  }
});

Campfire.Responders.push("UniversalImageExpander");
window.chat.installPropaneResponder("UniversalImageExpander", "universalimageexpander");