What were the best photos of 2013? Flickr’s “interestingness” rating offers one way to judge the best, based on a special sauce made up of the number of views, faves, and comments. I wrote Flickr Calend’r for discovering the best pix of the year, breaking it down into the best of each month, and displaying the results in a calendar format. The Flickr Calend’r lets you narrow down which photos to search, filtering by user (or group), a search term, a WOE code, or others.
Oh, yeah, “WOE code” – not a commonly-known term. A Yahoo invention, which they normally call WOE IDs, for Where On Earth identifiers. Read Using “Where on Earth” Codes in Flickr for more info. This of course works only on photos that have been geo-tagged, so using this field will greatly reduce the available pool of photos.
You can leave any of these fields blank. When you hit “get calendar” it’ll fire off a request to search each month. This takes a while. I wrote a proxy script in PHP to handle the Flickr API calls, and of course this calendar requires 12 separate calls. I’m not sure if the problem is Flickr’s slow servers, or my own.
If you search for a user’s photos using the NSID (network services ID, or user ID) instead of the user’s name, the results should come back slightly faster. An NSID look like 35591378@N03.
The proxy script uses the phpFlickr library. It turns the URL’s query string parameters into an array of criteria. The PHP program is larger than I’d like, but here is the gist of it:
$f = new phpFlickr("YOUR FLICKR API KEY"); if (isset($_GET["text"])) $criteria["text"] = $_GET["text"]; if (isset($_GET["woe"])) $criteria["woe_id"] = $_GET["woe"]; $photos = $f->photos_search($criteria); echo json_encode($photos);
I pushed as much into HTML5 and CSS as possible. The progress bar is just a simple <progress> tag. The images are posted as the background images for a <div> tag. To get it to fit the box, I used the newish “background-size” CSS property. Setting it to “cover” means all the scaling and cropping is handled for you – voilà, no unnecessary code.
months[i].element.style.backgroundPosition = "center"; months[i].element.style.backgroundSize = "cover";
Try resizing the browser window to see how easily the images are changed to keep the calendar format.
I’ve also been getting a bunch of 500 server errors. But most of the time, the program works just fine.
Explore Flickr’s gigantic collection of photos with the Flickr Calend’r.