I've shown a few examples of XML, but one of the
best is to use it to create a diary, which contains
its content in XML. For this I've designed a template
which integrates pages, such as CV pages and contact
details, into a single integrated package [Zoom].
We can then add the rings that hold the
pages:
and we can add lines to differentiate the
days:
and with the date added:
In Flash each of the text boxes are defined as Dynamic
Text, and each is given a name (such as date_monday, date_tuesday,
and so on). This will be used later, where we can read an
XML file for the date, and add this date to the text boxes.
After this we can add some more text boxes which will contain
the diary entries. The text boxes are named Monday, Tuesday,
Wednesday, Thursday and Friday.
At this time it does not really matter about the layout,
as we can finalise that at the end. The main things are
to make sure that all the elements are lined-up properly.
We can try to program the fields with some ActionScript:
function
convertXML ()
{
trace("Loading XML file" + infile);
mainTag = new XML();
elementTag = new XML();
mainTag = this.firstChild.nextSibling;
trace("Tag " + mainTag);
if (mainTag.nodeName.toLowerCase() == "diary")
{
flist = mainTag.childNodes;
trace("Number of elements: " + questionList.length);
// get tags
for (i=0; i<=flist.length; i++) {
trace("Tag : " + flist[i].nodeName.toLowerCase());
if (flist[i].nodeName.toLowerCase() == "monday")
{
date_monday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "tuesday")
{
date_tuesday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "wednesday")
{
date_wednesday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "thursday")
{
date_thursday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "friday")
{
date_friday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "mon")
{
monday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "tue")
{
tuesday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "wed")
{
wednesday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "thu")
{
thursday = flist[i].childNodes;
}
if (flist[i].nodeName.toLowerCase() == "fri")
{
friday = flist[i].childNodes;
}
}
}
}
An example of the XML file is:
<?xml
version="1.0"?>
<diary>
<monday>Mon, 18 June 2002</monday>
<tuesday>Tues, 19 June 2002</tuesday>
<wednesday>Wed, 20 June 2002</wednesday>
<thursday>Thur, 21 June 2002</thursday>
<friday>Fri, 22 June 2002</friday>
<mon>9am: Marks<BR>4pm: MSc Viva</mon>
</diary>
Next we can add a favouriate song part:
You can see a weakness in this is in the tabs at the side,
so let's redraw them as a single graphic, and integrate
them. The following shows some new tabs: