EXIF
To Flash: Reading EXIF data (or any CSV-formatted
data) from a jpg into Flash
Introduction If you have a digital camera, chances
are it saves pictures as exif-jpgs, which
are jpgs with data about the camera settings
saved along with the image. You can read
more about the Exchangeable Image File Format
at exif.org.
If you want to capture the EXIF data saved
with your jpgs for use in a Flash movie (like
the simple example below), you can do so
in several ways. You can use the file viewer
utility that came with your camera (if one
did) and copy the exif data manually into
a text or XML file. Or you can be quite ambitious
and write a serverside script to parse
the exif data and return it to Flash
using the loadVars load command. A third
way is to create a text file of exif data
for all photos in a directory and have Flash
parse that with the loadVars onData method;
that is the method we chose for the sample
above. An alternate of this would be to create
a text file of exif data and an intermediate
Flash movie which reads that data, allows
a user to add more supplementary information,
and outputs a text or XML file from that,
which is what I did to make the input XML
file for my photolog at
i-Technica.
Because Flash can natively read only ascii,
not binary files, if we want to avoid serverside
scripts we have to create a text file of
EXIF data from the exif jpgs. There are
probably many utilities that do this; I
chose to use EXIFUtils because
it is well-documented and easy to use,
and I figured it was worth $ 18.50 since
the photography bug is turning out to be
nearly as addictive as the Flash bug and
I like to have a record of how I took each
photo. Using EXIFUtils, I created a csv
(comma-separated variable) file with data
for all photos in a directory with this
one command (which assumes that my photo
jpgs are in directory c:\pix and that that
is where I want the info file to end up
also):
Reading
the text file into Flash and displaying
the picture and data
Once the text file is created (and the
empty blank last line removed), all you
need to do is provide a holder for the
movieclip, read the data (and format it
if you want), and display it. Add some
button movieclips to navigate and that's
it. The same method used to parse this
file may also be used to parse any spreadsheet
data saved in csv format.
These are some things to note when looking at the code in the downloaded
fla:
Because the text file is not in the
form var1=value1&var2=value2&etc
we can not use the loadVars onLoad method
to get variables. Instead, we still use
a LoadVars object, but we use its onData
method for parsing instead of onLoad.
onData can be used to parse ascii (text)
data in whatever form it arrives in.
Notice that it takes one parameter, which
is the data (file contents) itself.
The first step in the parsing is to
separate each line into a separate element
of an array (input_arr). This is done
with the array split command on the string
'\r\n' (carriage return/linefeed, which
separates each of the lines).
[Note: This works fine when the txt file is created in Windows and
resides on a Windows-based webserver. I discovered when I uploaded
all the files to my Linux-based server, that it no longer works. To
get a correct split on a Windows-created file uploaded to a Linux server,
I had to split on '\n' instead of '\r\n'. I used the following code
to make sure it works in either case:]
// try splitting on \r\n
(ok for file on windows server)
var input_arr = dat.split('\r\n');
// if that doesn't work, split on \n (file on linux server)
if (input_arr.length==1) {
input_arr = dat.split('\n');
}
In the second step, input_arr is divided
up further, into fieldnames_arr, which
has a list of all fieldnames in the file,
and photoinfo_arr which has a list of
all photos with information about each.
photoinfo_arr is an array of objects,
where each object has one property per
fieldname.
To make the transfer of data from
file to Flash textfield straightforward,
I named the textfields with exactly the
same names as the exif fields I'm reading
in. That way, I don't have to keep track
of the order they're read or what I named
them -- data will automatically be put
into the correct corresponding textfield
for every field name.
Be careful using variable names with
hyphens. It took me awhile to realize
that Flash does not interpret photoarray[i].date-taken
as I would expect. It sees the hyphen
as a minus sign instead of as part of
a variable name. Instead, you must refer
to that variable as photoarray[i]['date-taken'].
Normally, I wouldn't use variable names
with hyphens, but that is what the names
of the fields are in the EXIF file, and
I wanted to make the transfer as seamless
as possible.
Data doesn't always come in in the
format you'd like to display it in. In
this sample, I used a switch/case command
to look for and reformat the date-taken
and shutter fields before displaying
them. You can similarly format whichever
fields you want (there can be hundreds).
Once you have a parsing routine worked
out to get all the data you want to display,
you could incorporate this with the slideshow
component to enable reading and display
of data in interesting ways.
Wildform
provides a 100% satisfaction guarantee on all our software.
If you are not completely satisfied with our software
for any reason you may request a refund within 15 days
of purchase.
