Skip to content

Instantly share code, notes, and snippets.

@whs
Created April 3, 2011 03:57
Show Gist options
  • Save whs/900162 to your computer and use it in GitHub Desktop.
Save whs/900162 to your computer and use it in GitHub Desktop.
libimageloader loads image from photo upload services
/**
* @license The imageloader.js library is licensed under GNU Lesser General Public License v3 or later
*/
(function(){
/**
* TwitPic Image Loader
* Example: ldr = new TwitPicLoader("http://twitpic.com/asdf123");
* @param {string} URL of the TwitPic page. Eg. http://twitpic.com/asdf123
* @constructor
*/
TwitPicLoader = function(url){
this.url = url.replace(/^http:/, "https:");
};
/**
* Get the large image URL from TwitPic
* Note that TwitPic API doesn't offer JSONP
* @param {Function} Callback function. Will be called with first argument is the image's URL and second argument is the description
*/
TwitPicLoader.prototype.getURL = function(cb){
return $.get(this.url+"/full", function(r){
d = r.match(/<img src="(.*?)" alt="(.*?)">/);
cb(d[1], d[2]);
})
};
/**
* Plixi Image Loader
* Example: ldr = new PlixiLoader("https://plixi.com/p/asdf");
* @param {string} URL of the Plixi page. Eg. https://plixi.com/p/asdf
* @constructor
*/
PlixiLoader = function(url){
this.url = url.replace(/^https:/, "http:");
};
/**
* Get the image URL from Plixi API
* @param {Function} Callback function. Will be called with first argument is the image's URL and second argument is the description
*/
PlixiLoader.prototype.getURL = function(cb){
$.getJSON("https://api.plixi.com/api/tpapi.svc/jsonp/metadatafromurl?callback=?", {"url": this.url}, function(d){
cb(d['BigImageUrl'], d['Message']);
});
};
/**
* OEmbed Image Loader
* @param {string} Image URL
* @param {string} OEmbed endpoint for that URL
* @constructor
*/
OEmbedLoader = function(url, endpoint){
this.url = url;
this.endpoint = endpoint;
}
/**
* Get the image URL from OEmbed endpoint
* @param {Function} Callback function. Will be called with first argument is the image's URL and second argument is the description
*/
OEmbedLoader.prototype.getURL = function(cb){
join = this.endpoint.indexOf("?") == -1 ? "?" : "&"
$.getJSON(this.endpoint+join+"callback=?", {"url": this.url}, function(d){
cb(d['url'], d['title']);
})
}
/**
* picplz Image Loader
* Example: ldr = new PicPlzLoader("https://picplz.com/Jn22");
* @param {string} URL of the PicPlz page.
* @constructor
*/
PicPlzLoader = function(url){
if(url.match(/http[s]{0,1}:\/\/picplz\.com\/user\/[^\/]+\/pic\/([^\/]+)/)){
this.urlType = "longurl";
}else{
this.urlType = "shorturl";
}
this.code = url.match(/\/([^\/]+)[\/]{0,1}$/)[1];
};
/**
* Get the image URL from Plixi API
* @param {Function} Callback function. Will be called with first argument is the image's URL and second argument is the description
*/
PicPlzLoader.prototype.getURL = function(cb){
data = {};
data[this.urlType+"_id"] = this.code;
$.getJSON("https://api.picplz.com/api/v2/pic.json?callback=?", data, function(d){
pic = d['value']['pics'][0];
cb(pic['pic_files']['640r']['img_url'], pic['caption']);
});
};
/**
* twitgoo Image Loader
* Note: No HTTPS support.
* Example: ldr = new TwitGooLoader("http://twitgoo.com/a05dh");
* @param {string} URL of the twitgoo page.
* @constructor
*/
TwitGooLoader = function(url){
this.code = url.match(/^http:\/\/twitgoo\.com\/([0-9a-zA-Z]+)/)[1];
};
/**
* Get the image URL from twitgoo API
* @param {Function} Callback function. Will be called with first argument is the image's URL and second argument is the description
*/
TwitGooLoader.prototype.getURL = function(cb){
$.getJSON("http://twitgoo.com/api/message/info/"+this.code+"?format=json&callback=?", function(d){
cb(d['imageurl'], d['text']);
});
};
/* Main class */
window['ImageLoader'] = {
/**
* Get the image provider class from specified URL
* @todo Make it extensible
* @param {String} The image URL
*/
"getProvider": function(url){
if(url.match(/^http[s]{0,1}:\/\/twitpic\.com\/([0-9a-zA-Z]+)/)){
// oohEmbed doesn't offer title
return new TwitPicLoader(url);
}else if(url.match(/^http[s]{0,1}:\/\/plixi\.com\/p\/([0-9]+)/)||
url.match(/^http[s]{0,1}:\/\/lockerz\.com\/s\/([0-9]+)/)||
url.match(/^http[s]{0,1}:\/\/tweetphoto\.com\/([0-9]+)/)){
return new PlixiLoader(url);
}else if(url.match(/^http[s]{0,1}:\/\/upic\.me\/(show\/([0-9]+)|e[^\/]+)/)){
return new OEmbedLoader(url.replace(/^https:/, "http:"), "http://upic.me/api/oembed");
}else if(url.match(/^http[s]{0,1}:\/\/instagr\.am\/p\/([^\/]+)/)){
return new OEmbedLoader(url, "https://api.instagram.com/oembed");
}else if(url.match(/^http[s]{0,1}:\/\/picplz\.com\/([^\/]+)/) ||
url.match(/http[s]{0,1}:\/\/picplz\.com\/user\/[^\/]+\/pic\/([^\/]+)/)){
return new PicPlzLoader(url);
}else if(url.match(/^http[s]{0,1}:\/\/(www\.|)flickr\.com\/photos\/(.*?)\/([0-9]+)/)){
// 1: flic.kr is not supported by oembed
// 2: flickr oembed doesn't support JSONP
return new OEmbedLoader(url.replace(/^https:/, "http:"), "http://oohembed.com/oohembed/");
}else if(url.match(/^http[s]{0,1}:\/\/(www\.|)xkcd\.com\/([0-9]+)/)){
return new OEmbedLoader(url.replace(/^https:/, "http:"), "http://oohembed.com/oohembed/");
}else if(url.match(/^http:\/\/twitgoo\.com\/([0-9a-zA-Z]+)/)){
// no HTTPS support
return new TwitGooLoader(url);
}
/*else if(url.match(/^http[s]{0,1}:\/\/(www\.|)yfrog\.(com|ru|com.tr|it|fr|co.il|co.uk|com.pl|pl|eu|us)\/(.+)/)){
// yfrog doesn't offer JSONP
return new OEmbedLoader(url.replace(/^https:/, "http:"), "http://oohembed.com/oohembed/");
}*/
},
"viewer": {
/**
* Connect to frame and show the image
* @param {String} The image's URL
* @param {Frame}
*/
"frame": function(url, wnd){
provider = ImageLoader['getProvider'](url);
provider.getURL(function(url, desc){
wnd.document.write("<style>body{text-align:center;margin:0;padding:0;}img{border:none;}</style>");
wnd.document.write("<p style='text-align: left;'></p>");
$("p", wnd.document).text(desc);
wnd.document.write("<img src='"+url+"' />");
});
},
/**
* Show the image in Shadowbox (required seperately)
* @param {String} The image's URL
* @param {Frame}
*/
"shadowbox": function(url){
provider = ImageLoader['getProvider'](url);
if(!provider) return false;
provider.getURL(function(url, desc){
Shadowbox.open({
content: url,
player: "img",
title: desc
//"width": $(window).width() * 6/7, "height": $(window).height() * 3/4,
});
});
return true;
}
}
};
})();
if(!$) alert("jQuery is required!")
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment