Request.flickr = new Class({
Extends: Request.JSONP,
options: {
callbackKey: "jsoncallback",
url: "http://www.flickr.com/services/rest/?"
},
initialize: function(params, options) {
this.parent(options);
this.options.url = this.options.url + $H(params).toQueryString();
},
success: function(data, script) {
this.parent(data, script);
},
imageURL: function(obj) {
return "http://farm{farm}.static.flickr.com/{server}/{id}_{secret}.jpg".substitute(obj);
}
});
new Request.flickr({
format: 'json',
api_key: "e7df6c74d2545f55414423463bf99723",
per_page: 10,
tags: "mountains",
method: "flickr.photos.search"
}, {
onSuccess: function(data) {
target = $("action");
data.photos.photo.each(function(el) {
new Asset.image(this.imageURL(el), {
onload: function() {
var size = this.getSize();
var $ar = ((this.width > this.height) ? this.width/(this.height/100)/100 : this.width / this.height).round(2);
// console.log(this.width, this.height, $ar);
this.set({
styles: {
width: 110,
height: 110 / $ar
},
title: this.width + "x"+ this.height + " AR: " + $ar
});
this.inject(target);
}
});
}, this);
}
}).send();
<div id="action"></div>