Skip to content

Instantly share code, notes, and snippets.

@pjaspers
Forked from protocool/gist:2048775
Created August 4, 2012 16:29
Show Gist options
  • Save pjaspers/3258692 to your computer and use it in GitHub Desktop.
Save pjaspers/3258692 to your computer and use it in GitHub Desktop.
Propane caveatPatchor.js snippet to display Instagram images inline
var displayInstagramImages = true;
if (displayInstagramImages) {
Campfire.InstagramExpander = Class.create({
initialize: function(chat) {
this.chat = chat;
var messages = this.chat.transcript.messages;
for (var i = 0; i < messages.length; i++) {
this.detectInstagramURL(messages[i]);
}
},
detectInstagramURL: 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() && message.kind === 'text') {
var links = message.bodyElement().select('a:not(image)');
if (links.length != 1) {
return;
}
var href = links[0].getAttribute('href');
var match = href.match(/^https?:\/\/(instagr.am|instagram.com)\/p\/[A-Za-z0-9_]+\/?$/);
if (!match) return;
window.propane.requestJSON(message.id(), 'http://api.instagram.com/oembed?url=' + href, 'window.chat.instagramexpander', 'onEmbedDataLoaded', 'onEmbedDataFailed');
}
},
onEmbedDataLoaded: function(messageID, data) {
var message = window.chat.transcript.getMessageById(messageID);
if (!message) return;
if (data['type'] === 'photo') {
var imageURL = data['url'];
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.detectInstagramURL(messages[i]);
}
},
onMessageAccepted: function(message, messageID) {
this.detectInstagramURL(message);
}
});
Campfire.Responders.push("InstagramExpander");
window.chat.installPropaneResponder("InstagramExpander", "instagramexpander");
}
@pjaspers
Copy link
Author

pjaspers commented Aug 4, 2012

Changed the regex to match the instagram.com domain.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment