In this version I have added a very simple button FormButton. There is also an example of how the event management works.

// new button class
var formButton:FormButton = new FormButton(base, "formButton", "Submit", depth++);
formButton.setPos(10,600);
formButton.event = "buttonClicked";
formButton.render();

// setup event manager
var em:EventManager = com.hugeobject.eventManager.EventManager.getInstance();
em.listen("buttonClicked", this, sendResults);

Check it out here.

technorati tags: ASForms, Flash

ASForms is a very lightweight Actionscript component set. They are basically very similar to forms in HTML, but done in flash. (You know, radio buttons, checkboxes – that kind of thing). This release is fairly stable yet lacks accessibility and the button class which I’m still tweaking. The code examples give a basic indication of how it all works and I’ll make an effort to fill in some of the commenting holes over the next couple of weeks.

The code is released under the GPL MIT and was developed with MTASC strict in a AMES dev environment.  

Check it out here.

technorati tags: Flash, ASForms, Components

While working for the CSIRO a couple of years ago, I was developing 7 education type games (with a scientific emphasis). The games engine was constantly being improved and tweaked as the requirements for the games were really tough. Basically the games had to be completely accessible (tabIndex hell), all text had to be read as sound, they contained video and all of this had to load within 7 seconds (well the user wasn’t allowed to wait longer than 7 seconds initially so everything had to be streamed strategically). I ended up developing an extensive loading manager which was controllable and smart enough to know what to load next based on user interaction.

ANYWAY, my point is that the core engine which controlled these 7 games was constantly being improved. They of course all shared the same core class, but due to the nature of the flash IDE every time I made a change in the core code I had to compile every fla again. As you can imagine this became annoying. And worse because of the time pressures and dynamic deadlines it was hard to keep track of what had been recompiled and what hadn’t. 

Today with ANT builds this situation can easily be avoided. By using ANT you can have multiple projects compile with the single ANT build. In other words if the CSIRO games above were being developed in a osflash environment, every time there was a change to the core code, I would only need to run the one ant build which would compile all the movies. As you can imagine this saves so much time and mucking about.

This drawn out example   is to bring attention to simon wackers new as2ant release which you can read more about here. And find out how to implement here. Basically as2ant is a very smart and easy way to use ANT files to build flash movies. The latest release even allows you to include swfmill details within the one ANT build. Previously you had to include a separate swfmill xml for each movie.  I’m in the process of updating my old ANT files to use this latest version of as2ant, but as an example heres a ANT file using the previous version of as2ant. Its compiling 3 swfs using swfmill. I’ve included at the bottom a method for viewing the swfs in either firefox or the flashviewer. Obviously once I convert it to the new version of as2ant I wont need the separate swfmill files.

<project name="PhotoFade" default="compile" basedir=".">

<!-- Declares references to needed directories. -->
<property name="src.dir" location="src"/>
<property name="build.dir" location="build"/>
<property name="logger.dir" location="C:\Program Files\eclipse\plugins\org.asdt.logger_0.0.8.build5\lib\flash_classes"/>
<property name="first.swf" value="HomePage"/>
<property name="second.swf" value="SubPage"/>
<property name="third.swf" value="Logos"/>

<!-- Define the SWFMILL task -->

<exec executable="C:\swfmill\swfmill.exe">
<arg line="simple swfmill1.xml ${build.dir}\${ant.project.name}${first.swf}.swf"/>
</exec>
<exec executable="C:\swfmill\swfmill.exe">
<arg line="simple swfmill2.xml ${build.dir}\${ant.project.name}${second.swf}.swf"/>
</exec>
<exec executable="C:\swfmill\swfmill.exe">
<arg line="simple swfmill3.xml ${build.dir}\${ant.project.name}${third.swf}.swf"/>
</exec>

<!-- Define the MTASC ant task -->
<taskdef name="mtasc" classname="org.as2lib.ant.Mtasc" classpath="C:\anttasks\src"/>

<!-- Target that uses the MTASC Ant Task. -->
<!-- header="${width}:${height}:${framerate}:${bgcolor}" -->
<target name="compile" description="builds swfs">
<mtasc src="${src.dir}/com/hugeobject/PhotoFade/Application${first.swf}.as" classpath="${src.dir}:${logger.dir}" swf="${build.dir}\${ant.project.name}${first.swf}.swf" main="true" trace="Log.addMessage"/>
<mtasc src="${src.dir}/com/hugeobject/PhotoFade/Application${second.swf}.as" classpath="${src.dir}:${logger.dir}" swf="${build.dir}\${ant.project.name}${second.swf}.swf" main="true" trace="Log.addMessage"/>
<mtasc src="${src.dir}/com/hugeobject/PhotoFade/Application${third.swf}.as" classpath="${src.dir}:${logger.dir}" swf="${build.dir}\${ant.project.name}${third.swf}.swf" main="true" trace="Log.addMessage"/>
</target>


<!-- auto show the swf-->
<exec executable="C:\Program Files\Macromedia\Flash MX 2004\Players\SAFlashPlayer.exe">
<arg line="${build.dir}/${ant.project.name}.swf"/>
</exec>

<!-- show the swf in a html page in firefox -->
<exec executable="C:\Program Files\Mozilla Firefox\firefox.exe">
<arg line="${build.dir}/${ant.project.name}_index.html"/>
</exec>

</project>

technorati tags: as2ant, flash, ant

After swapping to an open Source flash solution for a RIA, the following advantages were achieved:

• saved over 110 working hours in compile time (that’s crazy stuff!!!)
• integrated into the overall dotnet web application a million times better
• less bugs, tighter code, better code
• better development environment

technorati tags: Flash, FAMES, AMES, Open source

Last year I was working for the Trading Post with a group of five flash developers. The Trading Post is similar to ebay in design but has the bonus of reproducing its ads in print around Australia (The print version is very popular). In other words, when you place an ad on Trading Post you can choose whether it goes online only or online and in the Trading Post print versions.

We were rebuilding a flash application that allowed people to create ads. The flash RIA was called PlaceAd and was a small part of the whole Trading Post rebuild. The rest of the website was also being recoded (C# dotnet). The dotnet team were using NANT (a dotnet version of ant) to build their application and because of the nature of the Flash IDE we were providing pre-compiled swfs for the build. This meant that the build never truly represented the latest flash codebase. It also created an annoying task for us in the flash team to keep on top of what swf was in the build process. Basically in a fully automated process, Flash was the only thing not automated.

The Flash team was full of some very competent people including Dan Webb (that suckerfish guy), Dave Rosen (that xhtmlised guy), David Wyss (a very cluey java programmer) and Nivantha (UI king). We started developing the application with the Flash IDE as normal. However, about a month into the project, the lead flash programmer left and I was put in his place.

The first thing I did as lead programmer was provide a use case for swapping to the FAMES open source flash development environment. (Note: Don’t use FAMES anymore, use AMES). It took one whole day to convert the code base over into the new environment. However the bulk of this work was fixing bugs which the Flash IDE didn’t seem to worry about. MTASC wasn’t as forgiving . I was confident that using FAMES would save us time and that by using MTASC we would get cleaner code however the big selling point was that we could now integrate PlaceAd into the automatic NANT builds. This meant that when the NANT build was run it would grab the latest flash class files and compile them with MTASC as part of the build. It felt a bit like all of a sudden Flash was now a serious development tool. (Email me for a copy of the NANT files to build swfs.)

So, after convincing management we got the go ahead to install Eclipse and FAMES on the development machines. The other Flash devs were a little wary about such a rash move but when they first compiled the PlaceAd swf in FAMES they were instantly converted. PlaceAd is a big app with lots of classes and business logic. With the Flash IDE it took approximately 20 seconds to compile (on beefy machines). With MTASC it took two seconds!!!!!!!!!!!!!!!!

What does this convert to?:

Four developers, 90 classes, 26 weeks, five days a week, eight hours a day, five times an hour = PlaceAd is compiled 20,800 times (approximately).

At 20 seconds per compile that equals 115 hours waiting with the Flash IDE.

At 2 seconds per compile that equals 11 hours with FAMES.

104 hours saved (That’s over two and a half working weeks).

Apart from the gigantic savings in speed, using FAMES provided a better, more stable PlaceAd. MTASC enforces better code logic and is critical of ambiguous code. The logging provided with FAMES is far superior to the Flash IDE. We were able to tag traces as Error, Fatal, Info etc. This makes debugging a huge application with five developers a hell of a lot easier. And of course using Eclipse is far better than using the Flash IDE (but that wouldn’t be hard). The compare function in Eclipse is so useful when developing in a team environment. We were able to compare a class file against local versions, checked in versions, older versions in SourceSafe to quickly identify what code had changed.

One of the requirements for PlaceAd was to adhere to fairly strict code guidelines. Dave the java guru hacked JavaDoc to make a application that would parse every line of code in every class and made a note if it did not meet coding guidelines. It even provided a ranking system so we could see which class (and class author) was the worst offending. It also checked to see if a function was being used and if it wasn’t it was commented as such and a report made so we could trim the unused classes where necessary. Of course it also provided a complete overview (in html) of the RIA in AsDoc style. Again – all of this was WITHIN the development environment, Eclipse.
Although I have moved on from Trading Post (It was a contract job) they are still using OS Flash and have smartly switched to Subversion instead of SourceSafe. For those Flash developers still toying with the Flash IDE, you really need to consider switching. Its such a superior and professional way to program Flash that once you try it out over an extended period of time you will never go back. Having said that, I would differentiate between Flash programmers and Flash animators at this point. Animators should probably stick with the Flash IDE. To learn more about Open Source Flash check out http://osflash.org/

Notes:

PlaceAd is alive and functioning. Check it out by going here: http://www.tradingpost.com.au/ and clicking on the PlaceAd link. NOTE: because of some dodgy javascript code, it seems that the only way to access PlaceAd from firefox is by following this method: (I no longer work at tradingpost and neither myself or the flash team are responsible for such dodginess )

1. Go to https://www.tradingpost.com.au/MyTradingPost/MyTradingPost.aspx
2. Click on PlaceAd

I did not have influence over the interface design for PlaceAd. I find that its not intuitive and that a richer user experience could have been included.

PlaceAd was developed last year. FAMES is no longer the best option for Flash development. Instead I use and encourage other Flash developers to use AMES.

One of the biggest headaches with PlaceAd was using the Macromedia components. They are buggy and bloated. There is a list of open source components here and I have recently created some open source components as well which are very lightweight and skinnable (here).

• The presentation swf – made from OS Flash of course (AMES). You will need to click on the swf to make it active, then use left, right arrows to navigate (or spacebar).
• The code that made the swf, raw and loosely commented (I was in a rush back then )

technorati tags: Open source, flash

The project was basically a online registration form- the app had to capture data, process some of it then post it to a server. For something like this a full blown component framework was overkill. And because of the older userbase the components had to look very similar to existing html components so that there would be no confusion (hopefully ).

My requirements were:

- they had to look like established user interface components (a radio button had to look like a html radio button).

- they had to be very small in size (anything over 40k was way too big)

- they had to be as fast as using a browsers components (that is, they draw with no lag whatsoever)

- they needed to be skinnable (in regards to colours and size mainly)

- they had to respond to events and be easily redrawn

Although all of the open source flash alternatives were of a high quality they just didn’t quite fit my requirements.

So, I set about creating my own. Below you will find an example of what I have temporarily called As Forms (until I can think of a snappier name).

They are small in size – the movie below is only 12k.
Its super simple to change the colours, size and fonts. However changing the shape requires getting your hands dirty in the core code. For example if you dont like the arrow in the combobox then you will need to edit the draw code for it.
They are really snappy which I’m really happy with. The reason I think they are snappy is because of the hard coded shapes. By limiting how much you can change, you gain speed improvements. They are also quite independent in terms of kb size. For example the movie below with all components in it is 12k, a movie with only the radio buttons is 4k. With macromedia just the radio buttons comes in at 90k last time I tried

These components are designed for people who just want quick and easy components – rather than the more full blown one. Over the coming week I will tidy up the code and release it under the GPL. They are already being used in production without any issues, but I’d hate to release something without tidying up my abusive comments in code
Here is an example of the flash forms. When you click the submit button (which isn’t apart of AS Forms) it will email me your response

[kml_flashembed movie="/flashForms/FormExamples.swf" height="650" width="333" /]

technorati tags: flash components, open source, flash