The Space For App Developers

After I published the NativeApplicationUpdater library I received a lot of questions how to display a UI showing download and install progress. Unfortunately NAU doesn’t come with a built-in UI yet So I decided to put together this short blog post to explain how you can build it yourself. Below you can see how the demo app with the custom UI looks (project source code is available here in SVN):

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
					   xmlns:s="library://ns.adobe.com/flex/spark" 
					   xmlns:mx="library://ns.adobe.com/flex/mx"
					   xmlns:updater="http://updater.riaspace.com/">
 
	<fx:Script>
		<![CDATA[
			import air.update.events.DownloadErrorEvent;
			import air.update.events.StatusUpdateEvent;
			import air.update.events.UpdateEvent;
 
			import mx.controls.Alert;
 
			[Bindable]
			protected var downlaoding:Boolean = false;
 
			protected function isNewerFunction(currentVersion:String, updateVersion:String):Boolean
			{
				// Example of custom isNewerFunction function, it can be omitted if one doesn't want
				// to implement it's own version comparison logic. Be default it does simple string
				// comparison.
				return true;
			}
 
			protected function updater_errorHandler(event:ErrorEvent):void
			{
				Alert.show(event.text);
			}
 
			protected function btnCheckNow_clickHandler(event:MouseEvent):void
			{
				// First initialize NativeApplicationUpdater
				updater.initialize();
			}
 
			protected function updater_initializedHandler(event:UpdateEvent):void
			{
				// When NativeApplicationUpdater is initialized you can call checkNow function
				updater.checkNow();
			}
 
			protected function updater_updateStatusHandler(event:StatusUpdateEvent):void
			{
				if (event.available)
				{
					// In case update is available prevent default behavior of checkNow() function 
					// and switch to the view that gives the user ability to decide if he wants to
					// install new version of the application.
					event.preventDefault();
					currentState = "updaterView";
				}
				else
				{
					Alert.show("Your application is up to date!");
				}
			}
 
			protected function btnYes_clickHandler(event:MouseEvent):void
			{
 
				// In case user wants to download and install update display download progress bar
				// and invoke downloadUpdate() function.
				downlaoding = true;
				updater.addEventListener(DownloadErrorEvent.DOWNLOAD_ERROR, updater_downloadErrorHandler);
				updater.addEventListener(UpdateEvent.DOWNLOAD_COMPLETE, updater_downloadCompleteHandler);
				updater.downloadUpdate();
			}
 
			protected function btnNo_clickHandler(event:MouseEvent):void
			{
				currentState = "mainView";
			}
 
			private function updater_downloadCompleteHandler(event:UpdateEvent):void
			{
				// When update is downloaded install it.
				updater.installUpdate();
			}
 
			private function updater_downloadErrorHandler(event:DownloadErrorEvent):void
			{
				Alert.show("Error downloading update file, try again later.");
			}
 
		]]>
	</fx:Script>
 
	<s:states>
		<s:State name="mainView"/>
		<s:State name="updaterView"/>
	</s:states>
 
	<fx:Declarations>
		<updater:NativeApplicationUpdater id="updater" 
					updateURL="http://riaspace.com/native-application-updater/update-1.1.xml" 
					isNewerVersionFunction="{isNewerFunction}"
 
					initialized="updater_initializedHandler(event)"
					updateStatus="updater_updateStatusHandler(event)"
 
					error="updater_errorHandler(event)"
					downloadError="updater_errorHandler(event)"
					updateError="updater_errorHandler(event)"
					/>
	</fx:Declarations>
 
	<s:Button id="btnCheckNow" label="Check for updates" includeIn="mainView" 
			  horizontalCenter="0" verticalCenter="0" 
			  click="btnCheckNow_clickHandler(event)"/>
 
	<s:HGroup verticalCenter="0" includeIn="updaterView" horizontalCenter="0" verticalAlign="top">
		<s:BitmapImage source="@Embed(source='/assets/icon128.png')" />
		<s:VGroup width="100%" horizontalAlign="center">
			<s:Label text="New version ({updater.updateVersion}) is available." />
			<s:Label text="Do you want to download it and install?" />
			<mx:ProgressBar id="prgBar" source="{updater}" label="Downloading %3%" visible="{downlaoding}" />
			<s:HGroup>
				<s:Button id="btnYes" label="Yes" click="btnYes_clickHandler(event)" />
				<s:Button id="btnNo" label="No" click="btnNo_clickHandler(event)" />
			</s:HGroup>
		</s:VGroup>
	</s:HGroup>
 
</s:WindowedApplication>

I just posted a new version (0.4) of the NativeApplicationUpdater library. It fixes some minor bugs and removes a workaround for the different URLStream events sequence between Win OS and other OSes.

Stay tuned for my next post that explains how to build NAU custom UI.

I’m very pleased to announce the release of as3term 2.0.0. For those who don’t know it, as3term is a terminal-like application that lets you compile and execute simple snippets of AS3 code. It was built with Flex/AIR 2.0 and it uses the NativeProcess API to launch the fcsh compiler, which is part of the Flex SDK. You can check out one of my previous post with the screen cast showing it in action.

This release includes several important changes and improvements:

• AS3 syntax coloring based on AS3TextArea (another open source project that I released recently)
• Using the fcsh.jar compiler from the Flex SDK instead of mxmlc, which provides an enormous improvement in compilation time.
• Added window resize gripper
• Window centering
• Updated Swiz to version 1.0 RC2

You can download as3term from here. If you have it already installed you just need to run it and it should update itself using the NativeApplicationUpdater.

With this post I wanted to do a preview of a new AIR application that I was involved building. It is called Tetrapod and its main purpose is assisting in PDF/Flash forms submission and response management. When building it some inspirations were taken from e-Deklaracje application that was released by Polish Ministry of Finance back in 2009. I think this is really cool demo app itself and also a cool demo of its powering technologies, which include Adobe AIR/Flex, Adobe LiveCycle Content Services and Adobe LiveCycle Process Management.

Go ahead and checkout the video below demonstrating Tetrapod in action. Also you can find more information about it here & here.

The part that you can’t see well in the video above is the logic on the server side. First of all documents that are displayed in the “Forms directory” are downloaded from LiveCycle Content Services when the application starts. This ensures that the user always has the latest version of the forms.

Next when the form is submitted, it is processed by the LiveCycle Process Management component. Of course in the video above processing is done automatically, but in a real-world scenario this could require human interaction and use of LiveCycle Workspace, for example.
Here is a video with a simple animation that demonstrates the server side processes a bit better:

UPDATE 28.09.2010 Below I included a video recorded by Tadeusz Chełkowski with more detailed Tetrapod overview:

Last week I released the as3term project, which is a simple AS3 Terminal application. This week as part of my work on as3term 2.0 I’m publishing this simple AS3 syntax coloring Flex/Spark component. Actually I was inspired by my colleague Anirudh Sasikumar and his powerful as3syntaxhighlight library. My initial thought was to use the library, but for as3term I needed something really simple, so I thought that I would write it myself using a few RegExp statements ;)

This component can be used to colorize source code of other programing languages. I defined multiple types of language keywords that should be recognized and styled. For each type you can specify your own styling as well.

• .default styles all keywords that don’t have style specified
• .text styles non-keyword text
• .var exceptional var styling
• .function exceptional function styling
• .strings exceptional string styling
• .asDocComment multiline comments /** comment **/
• .comment single and multiline comments: /* comment */ and // comment
• .accessModifiers styles: public, private, protected, internal
• .classMethodVariableModifiers styles: class, const, extends, final, function, get, dynamic, implements, interface, native, new, set, static
• .flowControl styles: break, case, continue, default, do, else, for, for\ each, if, is, label, typeof, return, switch, while, in
• .errorHandling styles: catch, finally, throw, try
• .packageControl styles: import, package
• .variableKeywords styles: super, this, var
• .returnTypeKeyword styles: void
• .namespaces styles: default xml namespace, namespace, use namespace
• .literals styles: null, true, false
• .primitives styles: Boolean, int, Number, String, uint

Below is a demo application that actually colors the syntax of its own logic. You can also checkout the source code over here.

UPDATE 09.09.2010 – I submitted the source code to the github.

You can paste or type in your own AS3 code into it and it will do coloring as you type.

And this is how as3term will look very soon:

This is really great news for all the Visual Studio fans that want to do Flash/Flex development with their favorite IDE. Amethyst IDE brings the really incredible feature set of Visual Studio to the Flash/Flex world. I really love how it handles component AS3 in a separate file. I wish something similar was available out of the box with Flash Builder! Really, really incredible!

Key Features of Amethyst Professional:

• Powerful editor with code coloring (76 options) and code folding
• Customizable code formatting
• IntelliSense with code completion and auto-expanding snippets
• Drag-and-drop Designer for Flex and AIR
• Designer integrates with Property panels, Event panels and Layout toolbar
• Multi-level undo/redo in editor and Designer
• Fast ‘Cylon’ debugger with breakpoints and call stack
• Step into/over/out in Debugger
• Conditional breakpoints and break-on-hitcount
• Expression evaluation in Immediate and Watch windows
• Hover and drill-down debugging in editor and Watch windows
• Debug multiple SWFs concurrently
• Find All References/Go To Definition
• Quick-find ToDo comments and User Tasks
• Auto-generate getter/setter ‘property’ methods
• Sophisticated refactoring with rename, move to package and refactoring previewer
• Source control support (TeamServer etc.)
• Import FLA to edit and debug Flash IDE projects
• Convert existing Flex or Flash Builder projects

All that is available at $249.

Check out this video of the Amethyst IDE in action:

Today I’m releasing to the world my new open source project called as3term, a simple terminal-like application that lets you compile and execute ActionScript code. It’s very handy when you want to check some AS3 constructs without launching your IDE and creating new project.

It was built with Flex/AIR 2.0 and it uses the NativeProcess API to launch mxmlc compiler, which is part of the Flex SDK. The primary reason that I have built it was that I needed a simple app that I could code in few hours and that would serve me as a test and a showcase for my other open source project called NativeApplicationUpdater. You can download the installers for different OSs from its Google Code site as well as source code from SVN. In the video below you can also see it in action:

I just released on Google Code a new project called NativeApplicationUpdater. Basically the name explains its purpose but for those that don’t know, AIR 2.0 brings new capability of packaging applications with native installers. This is necessary when you want to use the new NativeProcess APIs. Unfortunately Update Framework that comes with AIR 2.0 SDK doesn’t bring yet capability of updating this type of applications. That is why I decided to build it myself and publish it as open source library.

Here is a video explaining how it works:

I’m proud to announce Flerry 1.2.0, which brings following new features and changes:

• Java discovery process has been completely rewritten. Now it looks into default location on given operating system:
  • Windows – c:\Windows\System32\javaw.exe (starting from version 6 this is the default Java location)
  • Mac – /usr/bin/java if that doesn’t exist it checks /System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands/java
  • Linux – /usr/bin/java if that doesn’t exist it checks /etc/alternatives/java
  • In case any of these default locations fail it tries fallback mechanism, on Windows it is a native code compiled into FindJava.exe utility. This utility checks the registry on users machine and returns path to the location where java is installed. This was contributed by my colleague Serge Jespers; he used it for his Package Assistant Pro application. In case of Mac and Linux it uses native „/usr/bin/whereis java“ command to discover where Java is installed.
• The default location where to place jar files has been renamed to libs as it no longer contains only jar files. Now it also contains FindJava.exe utility. It can be customized by setting libsDirectory property on NativeObject class.
• Adding all jars under libsDirectory folder into the classpath automatically. Specifying it explicitly is no longer required.
• Compiled java code can be placed under classes folder. It is not required to package it into a jar anymore. This makes debugging and testing the application much easier.
• Out-of-the-box support for java code debugging. Flerry Getting Started (part 2) video tutorial covers how this can be used.
• Improved communication from AIR to Java, now it can support large objects transfer. This is due to object splitting into 256 bytes chunks.
• Added basic set of FlexUnit tests.
• Added Ant build script.
• Updated AMF serialization jars from BlazeDS 4.0.
• Removed reference between flerry and flerry-demo projects. Now flerry-demo is a standalone project referenced by flerry.swc.

This time kudos go to Jhonny Everson, Serge Jespers and Erko Bridee for their contributions and support.

Watch getting started video tutorials to get up to speed with Flerry.

Today I also started working on the 1.2 release, which will improve java path discovery on the Windows platform. I’m planning to reuse code written by my colleague Serge Jespers for Package Assistant Pro. It is simple native C code that checks the Windows registry to find where Java is installed.