developing the navigation for an.tidote.us
Following up to my previous post about what's been going on with the development of an.tidote.us
Getting Started
an.tidote.us is the first full flash site I've developed in over a year, and working outside of the infrastructure that Evolving Media previously provided for me, our hosting account with Daily Razor has created a few issues that I've had to take into consideration. Namely the last of Flash Remoting Support.
The site uses a basic two level navigation component that's setup like this.
- Work
- Web
- Identity
- About
- Mission
- History
- Staff
- Contact
There is a third level that only exists for the Staff section, and we're going to let that section have it's own iteration of the nav component, instead of relying on extending the main navigational component further. Doing so lets me create an xml object with one very simple SQL statement.
No Remoting? Now What?
Looking into alternatives to remoting, I came across AMFPHP. Which would be a great solution if I wasn't hell bent on developing this site in ColdFusion. The last few projects that I've done, including my own site and this blog have been in PHP, and I really wanted to use the simplicity,flexibility and power of CFCs for this site instead of layers of mangled crap that would have come from a mixed Flash/ColdFusion/PHP implementation.
Ok, so there's this little thing that I remembered about it being pretty simple to connect to a webservice in flash and retrieve whatever data, in whatever format it sends. So this is where we get to our CFC.
The World's Simplest Web Service, WSWS...
I wrote a CFC that does two simple things, runs a query against the Sections table, and parses the results to XML.
-
<cfcomponent>
-
<cffunction name="getNavXML"
-
access="remote"
-
returntype="xml"
-
output="false"
-
hint="gets an xml object that is used to build main and subnavigation components">
-
<cfquery name="GetNavItems" datasource="antidoteus">
-
SELECT *
-
FROM Sections
-
ORDER BY ParentID ASC
-
</cfquery>
-
<cfscript>
-
// create xml object
-
navXML = XmlNew();
-
navXML.XmlRoot = XmlElemNew(navXML, "navigation");
-
</cfscript>
-
<cfoutput query="GetNavItems">
-
<cfscript>
-
if (parentid eq "0"){
-
// create menu node and attach it to the root node
-
xnNavItem = XmlElemNew(navXML, "menu");
-
xnNavItem.xmlAttributes["name"] = "#name#";
-
ArrayAppend(navXML.XmlRoot.XmlChildren, xnNavItem);
-
} else {
-
// create menu node and attach it to it's parent node
-
xnNavItem = XmlElemNew(navXML, "submenu");
-
xnNavItem.xmlAttributes["name"] = "#name#";
-
ArrayAppend(navXML.XmlRoot["menu"][parentid].XmlChildren, xnNavItem);
-
}
-
</cfscript>
-
</cfoutput>
-
<cfreturn navXML />
-
</cffunction>
-
</cfcomponent>
This is what is returned, or you can check it out for yourself here.
-
<?xml version="1.0" encoding="UTF-8"?>
-
<navigation>
-
<menu name="Work">
-
<submenu name="Print"/>
-
<submenu name="Web"/>
-
<submenu name="Identity"/>
-
</menu>
-
<menu name="About">
-
<submenu name="Mission"/>
-
<submenu name="History"/>
-
<submenu name="Staff"/>
-
</menu>
-
<menu name="Contact"/>
-
</navigation>
Ok, So Now What?
So I now have my XML to build the nav from, now I need a quick way to build the nav itself, and of course keep to the specs outlined in the site's final comping design. That's where extending flash components, themes and styles comes in. I'll save that for my next post once I finish the nav in a day or two.