It has been a little slower at Realeyes latley so I’ve had time to play a bit. While playing I’ve run into some pretty interesting things over the past week, so I thought I’d share a few of the links I liked.
Development: RealEyes Media . RED|bug Release an updated version recently. Nifty debugging/logger AIR app that we’ve built.
Selenium
A test tool for web applications. Selenium tests run directly in a browser, just like real users do. It runs in Internet Explorer, Mozilla and Firefox on Windows, Linux, and Macintosh, Safari on the Mac. We have plans to target Safari on the iPhone in some months.
Random Resources: Digsby = IM + Email + Social Networks
Instant messaging, email notifications and social networking all in one client (Twitter, Facebook and MySpace)
“Metadata is data about data” in the case of Flex it is going to describe our components, classes and their interactions/uses. For example the most familiar metadata tag in Flex and AS3 code is [Bindable] this describes a property that can be bound to (obviously). But metadata is not limited to properties in Flex, you can describe all sorts of things with metadata to make your application code much easier to decipher, easier to user as well and add functionality that might otherwise be missed. I’ll try to describe a few of these so you can be on your way to using Flex metadata to improve how you write and use Flex code.
When creating metadata keep in mind that the metadata is bound to the next line in code. So if you are creating metadata for a class property or method, it should immediately precede the property declaration or method definition.
The [Bindable] metadata tag is great for class properties created in declarations but what about Getters and Setters - This is probably the next most used metadata tag that in my code and is an addition of the [Bindable] tag. In order to bind to a property that has a getter/setter you need to declare the event type that is dispatched when the property changes. We add the event="changePropertyName" to the [Bindable] tag: [Bindable(event="changePropertyName")]
changePropertyName can be any string, but by convention “change” and then the name of the property (in hungarian notation).
Speaking of events, when a class broadcasts and event. You can add metadata for code hinting. To specify the event and its type for a class you can add the [Event] metadata tag. You’ll need to specify a name and a type for this tag so FlexBuilder knows what event and type it will present in the code hinting. So the [Event] metadata tag will look like: [Event(name='changePropertyName' type='flash.events.Event')]
One note about the name value - you’ll need to use hungarian notation again so the code hinting displays correctly. So the event above changePropertyName may have a static const on the class CHANGE_PROPERTY_NAME if you follow the changePropertyName (lowercase for the first character and then uppercase for additional words) the code hinting in FlexBuilder will wake up just fine.
For Example - the following event metadata [Event(name="CHANGPROPERTYNAME", type="flash.events.Event")] results in the following code hinting: Not very code-hinting’ish
Where as this [Event(name="changePropertyName", type="flash.events.Event")] results in: Much better!
When building compoenents in AS3 you’ll want to expose information about your component, default values, property names etc. In comes the [Inspectable] metadata tag. This tag is not required and there are a few rules that apply with how Flex Builder displays the information. You can check out the details in the live docs. There are many definitions that you can add to the [Inspectable] tag, but some of the more used declaration in my code are:
defaultValue - The initial value that is determined by the property declaration.
enumeration - A comma-delimited list of values that are accepted for that property’s value.
type - Specifies the type of the value. Useful if you need a specific type instead of a generic type
variable - Specifies the variable to which the parameter is bound
These are just a few of the metadata tags. There is quite a lot you can do with metadata and it has solved some problems for me. If you’d like to learn more check out the live docs!
<ahref="http://us.rd.yahoo.com/dailynews/rss/weather/Sunnyvale__CA/* http://weather.yahoo.com/forecast/94089_f.html">Full Forecast at Yahoo! Weather</a>
(provided by The Weather Channel)
]]>
94089_2007_11_06_18_56_PST
When you need to access the nodes with complex node names such as yweather:location think XML namespaces.
In the above example, look for the xmlns declaration in the rss node
- xmlns:yweather='http://xml.weather.yahoo.com/ns/rss/1.0'.
Creating a Namespace object using the declaration will allow us to access the nodes with complex names.
Creating a Namespace object is a pretty simple process:
With the preceding example we need to know the namespace url ahead of time. E4X gives us the namespaceDeclarations() method that will return an array that contains the namespace declarations associated with the XML document
Using the namespaceDeclarations() method from the XML object:
Setting up Cruisecontrol is a pretty simple process. Make sure you check out the Cruisecontrol site for info on getting started and installation. The basic steps are:
Download the Cruisecontrol ZIP file (cruisecontrol-src-x.x.x.zip) and unzip the files to a directory on your computer. I've un-ziped the files to C:/cruisecontrol271
Then build the Cruisecontrol code using the BAT file build.bat in {INSTALL_DIR}/main/
Verify the install by running the following command in the command prompt:java -jar {INSTALL_DIR}/cruisecontrol-launcher.jarYou should get a error about a missing config file. If there are any other errors, you'll need to figure out what's missing (I've seen the missing tools.jar). Usually pretty easy things to fix though.
Cruise control is set up and ready to run.
*There is also a windows installer but I like the command line install, it gives the feeling of more control.
Now you've got Cruisecontrol installed. In my next post, I'll show you how we set up an ActionScript 2.0 project and build loop in Cruisecontrol.
I finally have some time to post about our Continuous Integration (CI) set up for ActionScript 2.0 and Flex/ ActionScript 3.0 projects. To continue on from the first post, I'll explain all of the pieces & parts that are needed to get a similar CI system rolling.
First, the parts that you'll need for any project:
The project files - I've created a very simple same project that you can download for testing.
Next if you are going to build ActionScript 2.0 projects you'll need:
Flash IDE for ActionScript 2.0 projects - Yeah a little bit of a bummer. You'll need to install the IDE on the CI server so the projects can be built. I'm sure you could set it up with MTASC, but we needed to compile in the IDE.
FlashCommand to build ActionScript 2.0 projects using the IDE (Mac Version) - Mike Chambers built this nifty tool and I've been using it for a while since I work in Eclipse with my ActionScript 2.0 projects.
ASUnit for unit testing your ActionScript 2.0 projects
The stand-alone flash player
Finally if you are going to build Flex Projects you'll want the following:
Yeah, that seems like a lot, but once everything is set up it is easy to maintain...almost set and forget. As a note, this is all going to be set up on a PC, I'm not a Mac guys, so sorry there, but I would hope the set up would translate nicely from PC to Mac. We now have the basic moving parts of the system. In my next few posts, I'll explain setting up the system:
Keep your code flexible - program to interfaces. What does this mean? Well there are a few things that we need to discuss before we can really answer that question. For this discussion you'll need a decent understanding of Object Oriented programming…but, hey if you don't have that it still may make some sense anyhow and you might even get something that you don't understand explained for you as we go along.
First things first, Polymorphism - The ability for one class to stand in for another, kind of. By "kind of" I mean that by programming to an interface, a variable or property's value can be assigned to an object that conforms to a "formal interface", more on that in a second. This means that if you crate a property or variable that is typed to an interface - myPet:IAnimal; - (where IAnimal is the interface) that item can be any number of classes that follow the "interface" defined by IAnimal .
Each of the classes, Dog, Fish, Camel, Giraffe must "implement" the IAnimal interface.
Okay, so what is a formal interface you say?
First off, a formal interface is a definition, some might say a contract, but I think that is confusing, of what a class's publically accessible methods should be and what they should look like. ActionScript 3 provides a construct to create these interfaces that is very similar to classes. Basically you create the public methods, their parameters and their return types, but nothing that has to do with what happens inside the method.
Notice that there is nothing that tells you what you need to do in the methods, or anything about properties or private methods. That is determined by the needs of the class that implements the interface. This is a good point to take hold of and knock into your head:
A class has an implementation (what the class does ) and an interface (how the outside world interacts with it).
This is what allows your code to be flexible. If you program to interfaces, you can crate objects that are much more flexible and powerful by have the ability to "stand in" for any property or variable.
You can also create an "interface" through inheritance by using something called an "abstract" class. An abstract class isn't intended for instantiation, so it is up to you to manage that. But abstract classes do allow for a default implementation (what the class does) as well as allowing for the type of interface implementation mentioned above because sub-classes inherit the interface of their parent classes.
So, keep your code flexible, program to interfaces!
Lately I've been working with CruiseControl, a continuous integration tool, and unit testing (ASUnit and FlexUnit) for our ActionScript 2, ActionScript 3/Flex projects. With the help of a couple of some great posts from eyefodder and Peter Martin, I've finally come up with a nice little system that isn't too much of a headache to set up and is very easy to maintain once it is set up.
When I get some real time, I'll be sure to blog about the set up and give some walk-throughs on how to get everything up and running.
The basic 'gist' of continuous integration is:
To build your code as soon as it changes. This helps to identify problems with the source code as quickly as possible after the problem is introduced. By introducting unit tests into the build process, you add more integrity to the build as well as your code.
So, like I said as soon as I get some real time, I'll be sure to put together some set up information.
I'm a senior developer at RealEyes Media, Adobe Certified Instructor and Adobe Certified Professional. Here you'll get my ideas and experience Flex, Flash, ColdFusion and related technologies as well as some generally off the wall stuff.
It has been a little slower at Realeyes latley so I’ve had time to play a bit. While playing I’ve run into some pretty interesting things over the past week, so I thought I’d share a few of the links I liked.
Setting up Cruisecontrol is a pretty simple process. Make sure you check out the 
I finally have some time to post about our Continuous Integration (CI) set up for ActionScript 2.0 and Flex/ ActionScript 3.0 projects. To continue on from the 
