nothing yet | jason madsen

The good folks behind the Swiz framework just dropped a nice little beta build of Swiz 2.0. The beta release introduces Aspect Oriented Programming (AOP) into Swiz. I’ve only put together an initial proof of concept application that tests the waters, but am real excited about the work they have done. If you haven’t done so already go check it out. Swiz is already a great framework, adding in AOP puts it over the top. Check out the intro to AOP article they have posted as well — Part 1, and Part 2.

On September 8th at 6:00pm I’ll be presenting on using Swiz for the Full Sail Flash Platform User Group (FSFPUG). If you are in Orlando, stop by (see group site for room details). If not be sure to check out the presentation online at: http://www.wddbs.com/go/fsfpug-connect

Lastly, I’ve begun work on a screen cast series that introduces and overviews the features of Swiz. I’ll post up information here when it’s ready… stay tuned.

Over the last year or two I have seen several different methodologies on creating ActionScript documentation using ASDoc. Jesse Freeman shows a quick example of creating documentation using ANT tasks in his recent article 5 Tips for Documenting Code . ANT tasks are nice in that they can be transfered with the code base as it moves from developer to developer. When I need to quickly create ASDocs however, I typically use the External Tools dialogue directly in Flash Builder.

I thought I would document how to create a simple ASDoc configuration within Flash Builder’s External Tools dialogue.

External Tools

In Flash Builder, select Run –> External Tools –> External Tools Configurations

Create a new configuration by double clicking on the “Programs” button. Next, give the new configuration a name, I’ll choose something generic like “Generic ASDoc”.

Location

The External Tools Configurations window needs a bit of information. The first is “Location”. Select the “Browse File System” button and locate the the asdoc compiler.

On a Mac it is typically located at:

/Applications/Adobe Flash Builder Beta 2/sdks/4.0.0/bin/aasdoc

On windows (XP) I believe it is located at:

C:\Program Files\Adobe\Flex Builder 3\sdks\3.2.0\bin\asdoc.exe

I don’t have a PC to test this with currently, so if I am wrong, please feel free to correct me.

Working Directory

Next we need to add our “Working Directory”. You can think of this as your base directory, the directory from which any relative paths will be resolved. For this field I typically want it to be my “src” folder within the project I am working on. Eclipse has some interesting variables that can help here. You can see them by clicking the “Variables” button. I usually end up with my working directory set as “The currently selected project’s ‘src’ directory” like so:

${project_loc}/src

ASDoc Arguments

Lastly we need to add the necessary compiler arguments for ASDoc. I’ll document the basic arguments here, and then point you toward a more in depth resource created by Adobe that discusses all of the arguments.

-source-path
In this example I will set this to a period (.), meaning the same directory as the “Working Directory” from the previous step.

-doc-sources
Again here I will set this to a period (.), meaning document all of the classes found within the source path (which in this case is our ‘src’ folder)

-output
This is the directory in which ASDoc will build the documentation. If the directory doesn’t exist, ASDoc will create it for you. You could also use a relative path (relative from the Working Directory). I’m setting it to DOCS, meaning that it will create a directory named “DOCS” within the “src” directory.

Other compiler arguments you can use

For simple projects the previously named compiler arguments should get you started. There are several other arguments you may need. I’ll list a few of them here

-window-title
This argument takes a String, be sure to enclose your value within double quotes if it will contain spaces. The -window-title argument gets concatenated to the HTML title tag.

-main-title
This argument also takes a String (use double quotes for spaces). This argument value gets placed at the top of the documentation HTML

-library-path
A relative path to any SWC file dependancies. For example if you have a SWC file being used in the build path of your project found within the “libs” directory you would add “../libs” as the argument.

-exclude-classes
The fully qualified name of any class file that you do no wish to have included in the documentation

Running your configuration

When you have your configuration set up, select “Apply”, and then “Run”. You should see some feedback on the documentation process in Flash Builder’s console. From now on, you should see the name of the configuration when you select Run–>External Tools. Selecting the configuration will run it. You can also run the configuration from the toolbar icon as well.

More Info

For more information you should check out this document created by Adobe that discusses options for using ASDoc including both compiler arguments and options for commenting your code.

A couple of things fell together for me in the last few days, and I started thinking about attending Flash Camp Atlanta. I posted on twitter that I was trying to work things out to attend. Turns out an email from David Tucker was just the motivation I needed, and I am officially going. As part of that, I was asked to help out during the Introductory Session by giving a “Introduction To Flex” presentation. There are some great speakers lined up for this camp. You can see a listing of speakers and the schedule here.

I’m excited to be going to ATL. The last Adobe event I attended there was the “On Air Bus Tour” a few years back. My impression of the Flash / Flex community there has always been a good one, and based on some recent Twitter chatter it seems that there are over 200 tickets sold. Should be a great event. If you are in the area, or want to get away for a few days it looks like there are still tickets available.

See you there.

Jason

When you create a new project in Flex Builder, the IDE updates a config file buried in the preferences that marks the project’s ‘bin-debug’ folder as a trusted resource. In so doing when you run the project you are able to access local resources (i.e. a local XML file), and remote services at the same time. When you import a Flex Builder archive it is supposed to update the same config file with the ‘bin-debug’ folder of the newly imported project.

There is an apparent issue with Flex Builder (I am running FB on a Mac, but apparently it exists on Windows as well) in that when you import, move, or rename a project, it doesn’t update the config file. When the config file isn’t updated and you try to load a local resource the player will throw a “Security Error”. This isn’t a problem if you are only using local resources ( -use-network compiler flag ). But when you need to access local files and remote files or services this can be a real pain.

I had some time recently, and decided to look into the issue. In doing so I came across a couple of past articles:

This one by Mark Walters, and this one by Jesse Warden

The fix is easy enough, go add the path of your bin-debug folder to the config file. In case you skipped the links, you can find the file in the following location:

Mac:
/Users/userAccount/Library/Preferences/Macromedia/Flash Player/#Security/FlashPlayerTrust/flexbuilder.cfg

PC:
C:\Documents and Settins\userName\Application Data\Macromedia\Flash Player\#Security\FlashPlayerTrust\flexbuilder.cfg

Updating the config file isn’t too big of a deal. However, to expedite a quicker fix, I have built an AIR app called bugrd! that will add a project’s debug folder to the config file for the user. Once the app is installed you simply drag your project folder and drop it on the interface. The interface will confirm the project that you have selected. Click the ‘un-bugr’ button, and it adds your debug folder to the local trusted list in the config file.

I am assuming that this will be cleared up some time (Flash Builder 4?), until then hopefully this’ll speed up the process.

You can install the bugrd from the install badge above, or you can download the .air installer here

Jason

Not to far back I built a small application for the University that I work for. I called it the HelpDesk. I wrote the technical end of an article for Adobe about the application, how Flex was involved and other details. I didn’t realize that the article had gone live at Adobe’s site until this morning when I got an email from a colleague who mentioned the article. The app is described pretty thoroughly in the article so I won’t go into details here. The article is live at Adobe’s site, you can check it out here.

I’m heading to the Garden State this weekend to attend 360 | Flex Camp New Jersey, and the Farata Systems Flex training. I’m looking forward to the two day event. I missed out on going to San Jose this year, I figure this is the next best thing.

I’m looking forward to the sessions of Fluint, and also Drupal. Both of which I keep hearing about, but have yet to work with.

For more details visit http://www.360conferences.com/360flexcamp/

-jason

As mentioned in my previous post, I’ve been putting together an Adobe AIR application that allows the user to quickly create a Badge Install HTML file by filling out a simple form. The aim of Badge Builder is to give access to all of the options available for utilizing the Badge Installer, while not drowning the user with parameters that they don’t wish to change.

You can toggle between the necessary, and optional parameters. It has a built in preview function that will open your browser and display the HTML file. Once you are satisfied with your settings, you simply build the file to the folder of your choice. All of the fields have tool-tips to get you up to speed quickly on the information that is needed. The application is just another way to be more productive.

I’ve set up a page with an Install Badge, screen shots, and a bit more by way of features here.

I have been testing it as I develop and use it. So far is has been pretty stable for me. If you find any issues, please let me know.

With the Flash / Flex community buzzing about Adobe’s partnering with the PHP Zend framework, Lee Brimelow has put up two fantastic introductions to using AMFPHP within Flash at theFlashBlog.com. Both of the video screen cast are geared towards getting developers familiar with using AMFPHP, and as usual are quick, to the point, and efficient. Absolutely worth a look.

Jason

I’ve been using the Flex Integration Kit to create my own custom components in Flash for use in Flex lately. Coming from an all ActionScript (not necessarily MXML) background there are a few things to watch for. One of them being Custom Events in your newly created component.

In order for Flex to recognize your Custom Event you need to include the event meta data in your AS Class file. For example, in an AS setting your class could fire off an event like so:

private function updateHandler(e:MouseEvent):void
{
    var evt:MyEvent = new MyEvent(MyEvent.VOLUME);
    evt.volume =//some volume value;
    this.dispatchEvent(evt);
}

In an all ActionScript setting this works fine. However when you compile this UIMovieClip into a swc file and use it in a Flex Project, Flex has no way to recognize the MyEvent.VOLUME. In the Flex Editor it won’t appear as a code hint. If you manually force it into the MXML, you’ll get an error. In order to allow Flex to know of the event you will need to include some Event meta data at the top of your ActionScript Class. For example:

[Event (name="volume", type="com.knomedia.events.MyEvent")]
public class VolumeControl extends UIMovieClip
{
    //Class members here
}

The meta data needs the ‘name’ of the Event. This is the string literal that the event constant holds. In this case MyEvent.VOLUME holds the value “volume”. The type attribute is the fully qualified name of your Custom Event Class. The placement of the meta data is important, it needs to be on the line above your class declaration. Once you have that in place you can compile your swc.

My only beef with the technique is that you need to use the actual string literal. I understand the need (for ease of use in MXML), but I am more comfortable using class constants of the Event Class… Anyway.

In MXML you can now set the volume attribute to listen for the event to fire:

<swc:VolumeControl id="vol" volume="{volumeHandler(event);}" />

The switch from all ActionScript to MXML is pretty painless. Occasionally a small issue like this will make you feel stupid, but overall it isn’t a big jump.

Jason

I put together a simple AIR app in Flex for a co-worker the other day. It’s a simple panel that allows the user to enter a number in any form (binary, octal, decimal, hexadecimal) and it will display all of the other number types for you. At first I didn’t think it was all that useful. But in a recent project I needed to double check that a value that I had entered as hex was correct. When I traced out the value, the output window displayed it as a decimal number… Hey, my little app came in handy!!! I thought I’d make it available.

The icons were made using Clockmaker Icon Generator another widget type AIR app.

One of the things I love about AIR and Flex is how quickly you can put together a simple little ‘widget’ type of app like this. As I continue to learn more and more about the Flex framework, the more I’m liking it.

You can download the application using the install badge below. (If you haven’t seen it yet, you should check out Peter Elst’s AIR Badge WordPress plugin)

jason