air | Alain Hufkens

21Feb/100

Playing with Maven & NativeProcess API in AIR 2.0

I have been playing with Adobe AIR 2.0 beta 2 for a couple of weeks now. And because we use Maven for our bigger development projects at Nascom, I decided to create a small proof of concept app to wrap the most used Maven commands. Off course Maven is a very powerful asset when building big Java based applications, but for a some of my colleague Flex developers it can be a frustrating experience. Working with the command line is not the preferred thing to do for a developer that is working most of the time on building user interfaces.

So to avoid these frustrations and to experiment with Adobe AIR 2.0 beta 2, I created this small app that calls some of our most used maven commands:

mvn flexmojos:flexbuilder (generates the Flex Builder project settings)
mvn jetty:run (starts the Jetty webserver)
mvn jetty:stop (you will need to and an extra setting in the project's pom.xml file)
...

So what's this post all about?

First it's about the code that uses the new NativeProcess API available in Adobe AIR 2.0 to call Maven commands and process (display) the output of these commands. On the other hand I have built a small tool that could be useful for all you frustrated Flex developers that have to know commands to start and stop servers, and all that magic mojo stuff (Flexmojos). The current example only has a very limited list of commands (see above). But it could be a start for another great productivity app, because with the NativeProcess API you can now take advantage of almost everything on your OS. Only be aware that when doing this you are mostly writing OS specific code.

How does it work?

Start the application in Flash Builder and drag and drop the pom.xml (this is a Maven project file) file from the root of the project to the app, and then the xml file will be parsed. There are normally al least two modules: a server (war) module and a flex (swf) module. And they each support different commands.

There are however still a couple of issues. So if anybody can help me out here, that would be very appreciated.

Because the NativeProcess can't call .bat files directly, you need to use a workaround calling cmd.exe and passing the mvn.bat file as a parameter. It works great while running from Flash Builder. But in the installed app it shows the cmd.exe window. Read more about this issue here. So if anybody has a solution, that would be appreciated.
At the moment there is only support for windows. Of I figure out how to run the Maven process from a Mac I will add Mac support. More about issue that here.
If you run the server and close the app, then the server (java.exe) still keeps running in the background.
And it lacks a lot of features, so feedback is welcome.

If you are interested, check out the code on Google Code: it's called The Ma(ven)trix.

Filed under: air, flex, other No Comments

30Jul/098

Testing PureMVC code with FlexUnit

The PureMVC FlexUnit Testing project is already quite old (last update was June 2008), but I just discovered it because I am currently working on a big Adobe AIR project that currently does not have a User Interface yet. We use the PureMVC framework for most of our bigger applications, and because it depends on Notifications it's not that easy to Unit Test. Proxies don't return results synchronously, but send notifications with the result in the body.

Well this small library helps connecting your PureMVC implementation code to the FlexUnit framework. The following example code shows the code for a Test Class for a DataProxy that has a method getSomeData(). As you can see, you need to write some code to access the facade, proxy, ... but it's all pretty straight forward.

package unitTests
{
import net.hufkens.example.ApplicationFacade;
import net.hufkens.example.config.ApplicationNotifications;
import net.hufkens.example.model.DataProxy;

import com.andculture.puremvcflexunittesting.*;

import org.puremvc.as3.core.View;
import org.puremvc.as3.interfaces.IView;

public class DataProxyTest extends PureMVCTestCase
{
private var timeout:int = 0;

public function DataProxyTest(methodName:String=null)
{
super(methodName);
}

protected function get facade():ApplicationFacade
{
return ApplicationFacade.getInstance();
}

public override function setUp():void
{
facade.registerProxy(new DataProxy());
}

protected function get proxy():DataProxy
{
var proxy:DataProxy =
DataProxy(facade.retrieveProxy(DataProxy.NAME));
return proxy;
}

protected function get view():IView
{
return View.getInstance() as IView;
}

public function testGetSomeData():void
{
registerObserver(view, proxy,
ApplicationNotifications.GET_SOME_DATA_DONE,
response, timeout);

proxy.getSomeData();
}

private function response(e:PureMVCNotificationEvent):void
{
assertTrue("data is not available",
e.notification.getBody().data.length>0);
}
}
}

It worked great for this project. I hope it will still be supported for Flex 4 so we can use the built-in unit testing features of Flash Builder.

Make sure you checkout the latest version from Google Code, because the swc file has an issue with multicore namespaces. The latest version in svn works fine.

Filed under: air, flex 8 Comments

15Jul/095

FlexMonkey 1.0 released (adding AIR support)

This week the guys from Gorilla Logic released FlexMonkey version 1.0 beta. I have been testing the previous version on one of my Flex applications and now that they have released it as an AIR application I will definitely start using it more and more for future projects.

So, what exactly is it?

FlexMonkey is an Adobe AIR application used for testing Flex- and AIR-based applications. Providing the functionality to record, playback and verify Flex UI interactions, FlexMonkey also generates ActionScript-based testing scripts that you can easily include within a continuous integration environment.

How does it help a developer like me build better applications? Well, you need to test your application right, and in the end you always end up doing the same actions over and over again. FlexMonkey can record those repetitive actions so you can replay this if you need to test. From those recorded actions, FlexMonkey can generate AS3 code that you can add to your project. And if you use some kind of continuous integration solution (like Cruise Control, Hudson, ...), these test cases can be plugged in and automatically executed. FlexMonkey supports Fluint and FlexUnit 4 for unit test creation and has support for Ant and Hudson. The source code is available on Google Code.

You can read more about testing your Flex application in this article on Adobe Developer Connection or check out this introduction video. It should give you an impression of what the application can do.

Congratz guys and keep up the good work!

Filed under: air, flex 5 Comments

26Jun/097

Timy – Time tracking in 7th gear using Adobe AIR

Recently my company (Nascom) released Timy beta, an Adobe AIR desktop client that we have been using internally for more than a year now. The application has a long history and was initially built to gain knowledge about Adobe AIR and to make time tracking using Basecamp easier to do. I don't know if any of you use Basecamp for time tracking but it is not the easiest thing to do. Probably most of you use Basecamp for the project management and collaboration features, but you can also use it for time tracking. The web interface doesn't provide you with a quick overview of projects and todo items.

The main idea was that if we had a simple way of adding hours to a project for a certain day, we could loose less time filling in our time sheets. Development started before Adobe AIR was released and at the time this seemed the perfect technology for such an application. We could leverage the power of Adobe AIR because it uses SQLite for local data, shows notifications, and runs in the system tray so that we don't forget to fill in out time sheets. The application is built using Flex 3 and the Cairngorm framework. Credits for the design of the application go completely to Kristof who did a great job.

One of the biggest reasons for using Adobe AIR, is that the Basecamp API doesn't allow you to get the data that's necessary for the Timy projects tab in one API call. You need to first get all the projects, and then for all the projects the to-do lists, and then you can get the to-do items. If you work in a company that does a lot of projects this can take a while to retrieve. That's why the application synchronizes this data (projects, to-do lists and to-do items) with a local cached SQLite database. Only when the app detects that there is a new (or removed) project it asks the user to synchronize again. Does this make any sense? Well it did for us and that's why we released this application as it is. If you might find a use for it or not, it was still fun to develop.

We also track the usage of the AIR application in real-time itself using Pubblegum. So if you see some extra outgoing API calls, then this is what is going on. We don't log any sensitive data, only basic actions like: open, error, sync, login and close. We also send along the version number to see which versions are running in the field. You can compare it with Google Analytics for Adobe AIR applications with offline support.

But before you get all enthusiastic and start installing the app, you should now a few things. Timy is a Basecamp client, so if you are not a Basecamp user then Timy is of no use for you. You also need to use Basecamp in certain way, and enable time tracking on your to-do lists. It's pretty easy to do, but if you don't work like this, there will be no tasks for your users. Also important to know is that we see the to-do item for a project as a profile (ex. Development, Design, Html, ...) and not individual tickets, tasks or to-do items that you can check off. This is very important. But you can still use both normal to-do items and time tracking enabled to-do items because Timy only looks at time tracking enabed to-do lists.

You can read more about how to configure your Basecamp projects in the "get started" section, and you can find more info on how to use Timy in the "documentation" section of the site. I don't normally read these kind of pages either, but I would strongly suggest to read the get started page. If you have any feedback for the app please add it to the feedback forum or drop me a comment here.

Filed under: air, flex 7 Comments

8Jun/090

Useful actionscript libraries part 2

swc A while ago I wrote a blog post about a list of useful actionscript libraries on Google Code. So this is a follow up post, and an addition to the previous list. Not all projects are hosted on Google Code, so hence the slightly different title.

Here's the list:

AlivePdf is a client side AS3 PDF generation library for Adobe Flash, Flex and AIR. It can also be used to display PDF files.
HydraMVC is the result of a total rewrite of the PureMVC API exclusively for Flex, allowing Flex developers to take advantage of the PureMVC paradigm while leveraging native Flex features. Currently we mostly use the PureMVC framework, but this could be interesting for big Flex applications.
FlexMonkey is a testing framework for Flex apps that provides for the capture, replay and verification of Flex UI functionality. FlexMonkey can record and playback Flex UI interactions, and generates ActionScript-based testing scripts that can easily be included within a continuous integration process.
Open Flash Chart is a library that contains a number of frequently used charts like line, bar, pie, scatter charts and some more.
Merapi is a Java™ application, intended to run on a user's (client) computer. Merapi connects other Java™ applications on the user's computer to Adobe AIR™ applications that the user has installed. In May, Merapi has officially become Open Source!
Efflex is a library with a list of effect that can be used in Flex applications. Here's a list of available effects: Slide, CoverFlowPapervision3D, FlipPapervision3D, GridZoom, Grid, List, Squash, FadeZoom, Fade,TileFade, MovieClipEffect,...
Spring Actionscript aims to bring Inversion of Control to ActionScript for use in Flex, AIR and even Flash applications. It contains an IoC container, based on that of Spring, a reflection API, extensions for the Cairngorm and PureMVC frameworks and several interesting utilities.
The last one is actually not an actionscript library, but still very interesting if you are into application development using Flex. flex-mojos is a collection of maven plugins to allow maven to compile, optimize, test and ... Flex SWF, Flex SWC, Air SWF and Air SWC.We are currently using it for Flex projects that rely heavy on a Java back-end.

Some of the libraries I have used or played with already, and others I still need to checkout. Hope you find something useful here.

Filed under: air, flex No Comments

14May/093

Retrieve Basecamp data with BasecampAS3Lib

One of the projects I am currently working on is an open source Actionscript library that wraps the Basecamp REST API in an easy to use AS3 classes. The project is called BasecampAS3Lib an can be found on Google Code. The project is still in development and I did some serious refactoring yesterday.

At this point the services can only retrieve data from Basecamp and you can already experiment with the ProjectService, CategoryService and TodoListService classes. The other services still need to be implemented. But this post will give you a sneak peak on how simple it can be to retrieve data (in this case project data) from Basecamp with this lib.

NOTE: This code only works in an Adobe AIR application (see below for more details why).

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:basecamp="net.hufkens.basecamp.*"
xmlns:services="net.hufkens.basecamp.services.*"
layout="absolute" viewSourceURL="srcview/index.html">

<mx:VBox width="100%" height="100%">
<mx:HBox width="100%">
<mx:Label text="url:"/>
<mx:TextInput id="apiurl" width="100"/>
<mx:Label text="username:"/>
<mx:TextInput id="username" width="100"/>
<mx:Label text="password:"/>
<mx:TextInput id="password" width="100"/>
<mx:Button label="get projects"
click="getProjects()"/>
</mx:HBox>
<mx:DataGrid dataProvider="{projects}"
width="100%" height="100%"/>
</mx:VBox>

<basecamp:BasecampAPI id="api"
url="{apiurl.text}"
username="{username.text}"
password="{password.text}"/>

<mx:ArrayCollection id="projects"/>

<mx:Script>
<![CDATA[
import net.hufkens.basecamp.events.BasecampEvent;

private function getProjects():void {
api.projectService.addEventListener(
BasecampEvent.GET_LIST, handleGetList);

api.projectService.addEventListener(
BasecampEvent.FAIL, handleFail);

api.projectService.getList();
}

private function handleGetList(event:BasecampEvent):void {
projects = new ArrayCollection(event.data as Array);
}

private function handleFail(event:BasecampEvent):void {
Alert.show(event.data as String);
}

]]>
</mx:Script>

</mx:WindowedApplication>

However there is still an issue with the authentication. Apparently using basic authentication from a Flash/Flex application is not that trivial as it would sound. A while ago I wrote a blog post about this (read it here), but this approach only works when you run it from an AIR application. The same code doesn't work when running from a url on a web site.

So, if you have any suggestions or a solution for the basic authentication issue please let me know.

Filed under: air, flex 3 Comments

28Apr/092

Tracking AIR applications with pubblegum

I don't have a lot of experience yet with tracking AIR applications developed with Flash or Flex. Adhese has a service called pubblegum that can be used directly from Flash without calling an external Javascript (which is the case with Google Analytics). So we decided to give it a try.

What exactly is pubblegum?

Whether it is Adobe® Flash®, Adobe® Air®, Microsoft® Silverlight®, Javascript or something as basic as an image. Pubblegum tracks your content in real-time from within the file and reports all available info, from custom interactions to URLs where your content was published.

Cool is that they have a specific API for AIR applications built in Actionscript 3 and the API also takes care of the fact that your application can be disconnected. If you want to use it, you can send them a mail to get a free trial. In our case we used the specific API for tracking user actions in the AIR application. And it is fairly easy to use. You only need to include the com.adhese.pubblegum.PubblegumAir class in your source code (a .swc file for Flex projects would also be nice guys) and write these two lines of code:

var api:PubblegumAir =
new PubblegumAir("companyID", "campaignID", "creativeID", true);
api.action("action");

The first variable is provided by Adhese and should be your company name/identifier, the second and third parameter can be chosen freely. The last parameter specifies whether you are tracking an application. So true tells the API, that the client is an application.

That isn't all that bad is it, and on top of that you get a nice dashboard where you can analyze your results.

Filed under: air, flex 2 Comments

31Mar/091

Be careful with transparent AIR apps

At my company I developed an Adobe AIR application created in Flex for internal use. The application uses custom chrome because it has a specific designed interface. At the time we also decided to enable the transparency. To achieve this, you only need to change some settings in the AIR configuration file. This file is located in the root of your Flex project and ends with "-app.xml". The first setting turns off the default OS specific chrome and the second one make the application transparent.

This is all very cool, and it worked out great for me. Sure, the application used a bit more CPU then expected, but that's a known issue for AIR applications. But some of my colleagues complained that their CPU went through the roof (more than 50% while doing nothing) and the application became unstable. Wouter Martens (currently doing his internship) stumbled upon this blog post because he also had the CPU issue on his machine. It turns out that the problem is depended on hardware, and that explains why some people have issues and others don't. We tested the same application without the transparency and the CPU issue was gone.

Luckily it turns out that we don't really need the transparency, and that we can easily change the design without a lot of impact. Changing the transparent setting in the xml file to "false" did the trick.

<systemChrome>none</systemChrome>
<transparent>false</transparent>

This demonstrates that it's not that trivial to create a cross-platform run-time, that also behaves consistent over all platforms and all hardware.

Filed under: air, flex 1 Comment

17Mar/090

Flex HTTPService and Basic Authentication

For an internal project I created an Adobe AIR application that connects to the Basecamp API. We have been using the application since the launch of Adobe AIR. Back then I had a problem connecting to the API using the HTTPService, because the combination of Basic Authentication and the https protocol was not supported. After several unsuccessful experiments I decided to go for an approach that uses a PHP Proxy on the server that delegates the calls to the Basecamp API. However the downside of this approach is that this setup needs extra configuration and a server-side deployment.

This week I got the chance to pick it up again and I stumbled upon this forum post on the Basecamp Forum. I found this piece of code posted on Verveguy's blog. And it actually did the trick.

private function addAuthHeader(service:HTTPService,
username:String, password:String):void
{
//add the header to request
var enc:Base64Encoder = new Base64Encoder();
enc.encode(username + ":" + password);
service.headers["Authorization"] = "Basic " + enc.toString();
}

For everybody who needs to connect a Flex application to an API that uses https in combination with Basic Authentication, here is the solution. All credits to the original blog post.

Filed under: air, flex No Comments

14Mar/090

Useful SQLite Administration Tool: Lita

I have been working on a couple of AIR applications, one of them being Airbob an open source Cruise Control monitor tool. This was the first AIR application I wrote way back when Adobe AIR 1.0 was released. For local data I also used SQLite which is very useful for saving state and preferences of your application.

There are several administration tools available, but none of them were really that good. David Deraedt wrote a complete SQLite Administration Tool using Flex and Adobe AIR called Lita, and it is very good and pretty useful when you need to dive into thise .db files.

Check out the list of features: