Weddingtracker launched on June 12th around 2:30PM CST and it has been about 8 long months of development and battle to get it out the door. With over 18,000 lines of code, over 400 files and 64mb in size this has been by far my most complicated Flash project ever. You can see the 13 template files in action on the Weddingtracker sample sites page. We did not design the sites so be sure to look past the front-end user interface when continuing through this post. I want to detail some of the finer points of the production and elements that I am happy with.

The entire project was coded using ActionScript 3.0 and the underlying framework that was used was PureMVC for Flash CS3. It was very stable once we got comfortable with working in its rather verbose arena. Each of the components that made up a users website existed in external files. Template layout, page type content, template colors, menu types, custom media display files and embedded font resource files. All of this makes for an extremely extensible code base that will allow for much more complicated designs without endangering the underlining controller code that sets up how the user interacts with the different pages.

All of the colors and text formatting are loaded in from CSS files that are defined in the initial XML file loading process. These CSS classes are accessed by the different page type controllers when they format themselves. Placeholder movieclips are used in the template resource files to define the location and size of the page type elements. The first class in the CSS files defines a list of used embedded font files required for accurate rendering. These font files are loaded from external SWF files and then registered to the Flash application for usage on embedded TextFields. Many of the ideas that made up this runtime font loader came from this post Runtime font loading with AS3 Flash CS3 not Flex.

I think that this code base is a great start to what could be an excellent product with some more attention to the design and user interface components. I expect to be working on it for the next couple of weeks for post launch issues and into the future when new templates are designed. All of the work over the last 8 months will be extremely helpful when it comes to fixing bugs or making improvements in the future.

I wanted to say thank you to everyone who helped code this impressive project and see it through launch. Susannah was with me in development from the very beginning and the project would not have launched without her help. Andres and Hal came in at the end of the project and worked two weekends in a row to get the template css and skin files setup for me while I finished the components and Susannah worked on custom template elements. I am already looking forward to my next major project but needed to reflect on over half a years work and a successful launch. Congratulations to everyone who worked on this project in the .NET development, all the HTML and CSS work and thank you to the IT project manager for being there from beginning to end of the marathon project.

I launched my new portfolio site for Barrett Sonntag Online and wanted to talk a little on the technical aspects of the new all Flash site. After doing my analysis on the World of Warcraft website (worldofwarcraftcom front and back-end analysis) I wanted to see what it would take to combine a little JavaScript, HTML and Flash to create a SEO compliant full page Flash site. I have been shy about using full page Flash since getting my name listed in the major search engines, Flash is notoriously bad at SEO because it’s content is not usually indexable.

I wanted Flash to take the content straight from the page it was loaded it, to make it’s containing page have the XML data it would load. JavaScript provided the method required already, innerHTML. The innerHTML functionality works to take a HTML DOM elements subnodes and copy the structure and body text as a string. It worked great in Firefox and Safari but IE was screwing with the output forcing element names to uppercase and stripping quotes (“) from attribute values. Flash choked on this malformed XML data and I was stuck. I looked for a couple hours for how I could remedy IE’s nasty way of handling innerHTML and decided to sleep on it after posting on a popular online forum WebDeveloper.com. I didn’t get the answer handed so much as the path shown when I woke up the next morning, regular expressions. You can see the thread and my terrible but working solution http://www.webdeveloper.com/forum/showthread.php?t=182391.

With the IE innerHTML issue out of the way I was able to move on to the design of the site. Multiple columns with minimum wide items that auto adjusted just like inline elements in HTML. I don’t envy web browser developers this was no easy task. The next issue I ran into was setting up the Actionscript 3.0 event MouseWheel.MOUSE_SCROLL to fire allowing for the rows to move via the mousewheel or trackpad scrolling. It worked wonderfully in all browsers on my PC and failed completely on the test Macs I had access too. Lucky for me someone had already done the footwork and setup a JavaScript function that told the Flash file when the MOUSE_SCROLL event was being fired since Firefox and Safari on the Mac were not. Gabriel is to thank for this wonderfully easy to setup solution you can find on his site http://blog.pixelbreaker.com/flash/as30-mousewheel-on-mac-os-x/.

I am extremely happy with the outcome of this site as it is that full page Flash I was hoping for while still allowing search engines to see the full content of the site laid out in divs using class and id attributes.