Each photo you get from Flickr has a page associated with it. In this chapter, you are going to update PhotoGallery so that users can press a photo to see its Flickr page. You will learn two different ways to integrate web content into your apps, shown in Figure 30.1. The first works with the device’s browser app (left), and the second uses a WebView to display web content within PhotoGallery (right).
For both ways, you need to get the URL for a photo’s Flickr page. If you look at the JSON you are currently receiving for each photo, you can see that the photo page is not part of those results.
{
"photos": {
...,
"photo": [
{
"id": "9452133594",
"owner": "44494372@N05",
"secret": "d6d20af93e",
"server": "7365",
"farm": 8,
"title": "Low and Wisoff at Work",
"ispublic": 1,
"isfriend": 0,
"isfamily": 0,
"url_s":"https://farm8.staticflickr.com/7365/9452133594_d6d20af93e_m.jpg"
}, ...
]
},
"stat": "ok"
}
You might think that you are in for some more JSON request writing. Fortunately, that is not the case. If you look at the “Web Page URLs” section of Flickr’s documentation at www.flickr.com/services/api/misc.urls.xhtml, you will see that you can create the URL for an individual photo’s page like so:
https://www.flickr.com/photos/user-id/photo-id
The photo-id seen here is the same as the value of the id attribute from your JSON.
You are already stashing that in mId in GalleryItem. What about user-id?
If you poke around the documentation, you will find that the owner attribute in your JSON is a user ID.
So if you pull out the owner attribute, you should be able to build the URL from your photo JSON:
https://www.flickr.com/photos/owner/id
Update GalleryItem to put this plan into action.
Listing 30.1 Adding code for photo page (GalleryItem.java)
public class GalleryItem {
private String mCaption;
private String mId;
private String mUrl;
private String mOwner;
...
public void setUrl(String url) {
mUrl = url;
}
public String getOwner() {
return mOwner;
}
public void setOwner(String owner) {
mOwner = owner;
}
public Uri getPhotoPageUri() {
return Uri.parse("https://www.flickr.com/photos/")
.buildUpon()
.appendPath(mOwner)
.appendPath(mId)
.build();
}
@Override
public String toString() {
return mCaption;
}
}
Here, you create a new mOwner property and add a short method called getPhotoPageUri() to generate photo page URLs as discussed above.
Now change parseItems(…) to read in the owner attribute.
Listing 30.2 Reading in owner attribute (FlickrFetchr.java)
public class FlickrFetchr {
...
private void parseItems(List<GalleryItem> items, JSONObject jsonBody)
throws IOException, JSONException {
JSONObject photosJsonObject = jsonBody.getJSONObject("photos");
JSONArray photoJsonArray = photosJsonObject.getJSONArray("photo");
for (int i = 0; i < photoJsonArray.length(); i++) {
JSONObject photoJsonObject = photoJsonArray.getJSONObject(i);
GalleryItem item = new GalleryItem();
item.setId(photoJsonObject.getString("id"));
item.setCaption(photoJsonObject.getString("title"));
if (!photoJsonObject.has("url_s")) {
continue;
}
item.setUrl(photoJsonObject.getString("url_s"));
item.setOwner(photoJsonObject.getString("owner"));
items.add(item);
}
}
}
Easy peasy. Now to have fun with your new photo page URL.