12.5 Drag and Drop with the “draggable” Attribute 287for (var key in exif) {
exifInfo.innerHTML += _asRow(key,exif[key]);
}
};
binaryReader.readAsBinaryString(file);
As you can see in the screen shot in Figure 12.4, only selected EXIF info is listed
in our example. Apart from information about camera type, date and time, ex-
posure time, ISO speed, use of flash, or image dimensions, there are even GPS
coordinates that were recorded by the camera when taking the picture. A glance
at the coordinates and the image name reveals the location: the Senderstal valley
near the Kalkkögel in the Stubai Alps (southwest of Innsbruck, Tyrol, Austria).
The prominent peak in the center of the image is called Schwarzhorn.
If you want to display all EXIF information of your own images while testing the
application shown in Figure 12.4, you simply need to remove the comment
characters from the item //showTags = '*' in the file extract_exif.js!Although the FileAPI specification is rather short, it offers several interesting fea-
tures. In addition to the already familiar methods for reading files in binary mode
or as data: URI , you have the option of reading text files via readAsText(). The
onprogress event serves as user feedback for implementing a progress display
during loading, and if loading takes too long, you can also abort it with abort().
Additionally, the FileAPI can also be used for forms via .
The same applies here as for drag and drop: If you want to implement more com-
plex applications, you will have to study the details in the specification. The rel-
evant contents for the FileAPI and drag and drop can be found at these links:
z http://www.w3.org/TR/FileAPI
z http://www.w3.org/TR/html5/dnd.html
After this excursion into the world of the FileAPI, there are still two interesting
global attributes that we want to mention in this chapter. Similar to drag and
drop, they open up a new and unknown world, only encountered previously
through word-processing programs. Who would have thought a few years ago
that the content of an HTML page could be edited directly in the browser and the
spelling checked immediately?
TIP