HTML and CSS Reference
In-Depth Information
The code adds the
format
function to the
prototype
of the JavaScript's native
String
object. By
doing this, any string manipulated under the scope of the
helpers.js
file will expose an additional
format
method. After you reference
helpers.js
, you can write the following code:
flickrApp.searchClick = function () {
var tags = document.getElementById("subject").value;
flickrApp.download(tags);
}
flickrApp.download = function (tags) {
// Add tags to the Flickr URL
var url = flickrApp.Source.format(tags);
// Get photos
WinJS.xhr({ url: url }).then(function (json) {
// Parse the JSON feed here
});
}
In the click handler of the Search button, you get any text typed into the input field and pass it
down to the newly created
download
function. Internally, this function composes and invokes the
Flickr URL via
WinJS.xhr
. Note that if you pass an empty tag list, you will still get some photos in
response; that's why it is not strictly required that you check the
tags
variable for
null
or
empty
.
Getting the JSON data
You use the
WinJS.xhr
function to download the JSON string that describes selected photos. Using the
WinJS.xhr
function is the same as in the previous exercise. You define two functions: one that executes
when the download completes successfully and one when the request fails, and pass them to the
then
method on the promise object returned by
WinJS.xhr
.
WinJS.xhr({ url: url }).then(
function (response) {
flickrApp.parseFeed(response.responseText);
},
function (response) {
var message = "Error downloading photos.";
if (response.message != null)
message += response.message;
flickrApp.alert(message);
}
);
The
then
method passes to its functions an object that represents the response retrieved from
the remote source. To get the plain text contained in the body of a JSON response, query the
responseText
property.
Search WWH ::
Custom Search