Contents
FlickrRestStore is an implementation of the dojo.data API provides access to the Flickr photo sharing site's REST API. Many advanced features are available, including tag search, sorting on numerous attributes, full text search, support for simultaneous clients, result caching and more.
Dojo has several examples of browser in-memory stores, such as dojo.data.ItemFileReadStore, dojox.data.CsvStore, and dojox.data.OmplStore. While these stores are useful and great examples of how data stores can be used to wrapper accessing data, they are not the only way data is served and processed. In many cases, data stores can wrapper external services. It is those services that perform the querying and filtering of data, and then provide only that as a subset back to the data store for presentation as items.
FlickrRestStore is one such store. The purpose of FlickrRestStore is to wrapper the public photo feed of the Flickr service. Then by simply using the FlickrRestStore store, as you would any data store in Dojo, you now have access to querying the vast repository of public photos made available by others on the Web. Look at this demo to see it in action, or look here for some example usages.
The following dojo.data APIs are implemented by FlickrRestStore
FlickrRestStore is built upon FlickrStore, a store which reads from Flickr's more simplistic public API. However, FlickrRestStore provides many more features:
Note: While this store wraps making calls to the Flickr service, as a user, you should still verify that you agree to the terms and conditions by which you are using the public Flickr photo service. Review their terms and conditions, and the API terms and conditions, here.
Another difference between FlickrRestStore and FlickrStore is that, due to the fact that FlickrRestStore works with the Flickr REST APIs, you will need to get a free API key from Flickr. You can do so at http://www.flickr.com/services/api/keys/apply/.
The Flickr service provides its data back in a wide variety of formats (for example, ATOM, RSS, and JSON) but FlickrRestStore only makes use of the JSON format. The following example shows a query that FlickrRestStore processes and the response: Example
Query the first three photos from a user:
Response:
jsonFlickrApi({
"photos":{
"page":1,
"pages":98,
"perpage":3,
"total":"489",
"photo":[
{
"id":"1352049918",
"owner":"44153025@N00",
"secret":"5636009306",
"server":"1111",
"farm":2,
"title":"The Liffey Panorama",
"ispublic":1,
"isfriend":0,
"isfamily":0
},
{
"id":"1351120079",
"owner":"44153025@N00",
"secret":"880bf6a003",
"server":"1027",
"farm":2,
"title":"Many Hands make pretty flowers",
"ispublic":1,
"isfriend":0,
"isfamily":0
},
{
"id":"1322051485",
"owner":"44153025@N00",
"secret":"b7c529335d",
"server":"1110",
"farm":2,
"title":"Wok'n'Roll baby!",
"ispublic":1,
"isfriend":0,
"isfamily":0
}
]
},
"stat":"ok"}
)
FlickrRestStore's role is to process the query parameters passed to the dojo.data.api.Read API and generate the appropriate service URL. It then processes the response from the service and handles accessing the items returned from the query. It also provides simple attribute access to all the values.
| Attribute | Description | Since |
| label | The item attribute to use as the label of the Flickr item. Defaults to 'title' | Dojo 1.1 |
| urlPreventCache | Flag controlling whether preventCache of dojo.io.script is used to prevent browser caching. Default is true. | Dojo 1.4 |
| apikey | Your Flickr service API key. | Dojo 1.1 |
| title | The title of the photo. |
| author | The person who published the photo to Flickr. |
| dateTaken | A JavaScript date object representing the date the photo was taken. |
| datePublished | A JavaScript date object representing the date the photo was published to Flickr. |
| imageUrl | A URL to the full resolution photo image. |
| imageUrlSmall | A URL to the small (icon sized) resolution photo image. |
| imageUrlMedium | A URL to the medium resolution photo image. |
| imageUrlLarge | A URL to the large resolution photo image. New to dojo 1.5 |
| imageUrlOriginal | A URL to the original resolution photo image. New to dojo 1.5 |
| imageUrlThumb | A URL to the thumbnail sized resolution photo image. |
| link | A URL linking to the Flickr page displaying the image. |
The fetch method query syntax for FlickrRestStore is simple and straightforward. It allows the following attributes to be set and queried against:
The order to sort the results in. This is a JSON object with two fields, as specified by the dojo.data API.
If an attribute is not specified, the default is date-posted
Note: Unlike many of the other example stores, the FlickrRestStore store cannot do wild-card matching of the attributes. This is because the Flickr public photo feed service cannot do it. In an ideal service implementation, the Flickr service would provide a mechanism by with to pass in wild cards as part of its query parameters.
dojo.require("dojox.data.FlickrRestStore");
dojo.require("dijit.form.Button");
// This function performs some basic dojo initialization. In this case it connects the button
// onClick to a function which invokes the fetch(). The fetch function queries for all items
// and provides callbacks to use for completion of data retrieval or reporting of errors.
// Set the init function to run when dojo loading and page parsing has completed.
dojo.ready(function(){
// Function to perform a fetch on the datastore when a button is clicked
function getAllItems(){
// Callback to perform an action when the data items are starting to be returned:
function clearOldList(size, request){
var list = dojo.byId("list");
if(list){
while(list.firstChild){
list.removeChild(list.firstChild);
}
}
}
// Callback for processing a returned list of items.
function gotItems(items, request){
var list = dojo.byId("list");
if(list){
var i;
for(i = 0; i < items.length; i++){
var item = items[i];
var image = document.createElement("img");
list.appendChild(image);
image.setAttribute("src", flickrStore.getValue(item, "imageUrlMedium"));
list.appendChild(document.createElement("br"));
}
}
}
// Callback for if the lookup fails.
function fetchFailed(error, request){
alert("lookup failed.");
}
// Fetch the images. Note the API key used is not for general usage. It's here to demo the store, ONLY.
flickrStore.fetch({query:{ tags: "nature", apikey: "8c6803164dbc395fb7131c9d54843627"}, onBegin: clearOldList, onComplete: gotItems, onError: fetchFailed});
}
// Link the click event of the button to driving the fetch.
dojo.connect(button, "onClick", getAllItems);
});
<div data-dojo-type="dojox.data.FlickrRestStore" data-dojo-id="flickrStore"></div>
<div data-dojo-type="dijit.form.Button" data-dojo-id="button">Find nature pictures!</div>
<br>
<br>
<span id="list">
</span>