< October 2006 >
SuMoTuWeThFrSa
1 2 3 4 5 6 7
8 91011121314
15161718192021
22232425262728
293031    
Sat, 07 Oct 2006:

One of the first cool things I saw in flickr was notes. They're those small boxes which you can drag across a picture to mark off a region or add some more context to something. When I recently started linking in flickr photos to my blog, these were some things I missed. Without a small box saying "That thin line is the road", a few of the more impressive photographs I'd got were quite ordinary landscapes.

While looking at the new flickr apis - especially the JSON apis, something clicked somewhere. Finally, there seemed to be a very nice way to do cross-domain requests from my blog (or literally any web-page) to flickr to read notes, tags and other information. Minimilastically, this is what my code does :


function myMethod(data) 
{
	alert(data["stat"]);
}

var photos_get_info = "http://api.flickr.com/services/rest/?"
        + "method=flickr.photos.getInfo&api_key="+api_key
        + "&format=json&jsoncallback=myMethod"
        + "&photo_id=" + photo_id + "&secret="+secret;

/* cross-domain request */
(function(url) {
	var _s = document.createElement("script");
	_s.src = url;
	document.body.appendChild(_s);
})(photos_get_info);

The photo_id and secret are the two parts in a flickr image url, the first part is the id and the second the secret. Provided you've given valid data there, flickr will respond to your data load with something like the following data.

myMethod({"photo" : .... , "stat" : "ok" });

Which when interpreted by the browser, magically seems to call your callback myMethod. Isn't that beautiful or what ? Of course, this workaround is not necessarily new information for me - but pretty damn convenient. Either way, once you've got the cross-domain data, it is only a few steps away from taking that data and displaying it.

Take a closer look at the ugly javascript if you want, or just look at the pretty pictures or funny pictures or even your own pictures.

Actually, more than being able to embed notes in my blog, this has brought along an unexpected advantage. With this script, the flickr notes are scaled according to the picture, so that you can have notes for a large or original size picture. Maybe I should make this a GM script so that I can do the same in flickr's zoom.gne pages.

Either way, the fun ends here.

--
It's difficult to see the picture when you are inside the frame.

posted at: 04:20 | path: /hacks | permalink | Tags: , , ,