Posts Tagged flex

Flex & ActionScript Regex List

I’m not great with regex since I don’t use it a ton so I constantly find myself looking up simple, reusable regex statements…thought I’d just start listing them as I use them in case someone else finds them useful. This will start with just a couple examples that we’ll continue to add to.

Assume the following vars:

var myString:String;
var pattern:RegExp;
var resultString:String;
var isSuccess:Boolean;

Remove All Spaces

myString = "The quick brown fox.";
pattern = /\s+/g;
resultString = myString.replace(pattern, "");
trace(resultString); // Thequickbrownfox.

Remove Special Characters & Spaces

myString = "The 123 quick 456 brown !@#$% fox.";
pattern = /\W/g;
resultString = myString.replace(pattern, "");
trace(resultString); // The123quick456brownfox

Remove Special Characters & Numbers & Spaces

myString = "The 123 quick 456 brown !@#$% fox.";
pattern = /[^a-zA-Z]+/g;
resultString = myString.replace(pattern, "");
trace(resultString); // Thequickbrownfox

Test URL String

myString = "http://yahoo.com";
pattern = /^http(s)?:\/\/((\d+\.\d+\.\d+\.\d+)|(([\w-]+\.)+([a-z,A-Z][\w-]*)))(:[1-9][0-9]*)?(\/([\w-.\/:%+@&=]+[\w- .\/?:%+@&=]*)?)?(#(.*))?$/i;
isSuccess = pattern.test(myString);
trace(isSuccess); // true
myString = "htt://yahoo.com";
isSuccess = pattern.test(myString);
trace(isSuccess); // false

Trim String (With Tabs & Returns): Courtesy of Jeff Channel

myString = myString = "The quick brown fox.                   		";
pattern = /^\s+|\s+$/gs;
resultString = myString.replace(pattern, "");
trace(resultString); // "The quick brown fox."

Post to Twitter Tweet This Post

, , ,

No Comments

WASI AIR Logging Console v0.1.3.0 & Logging Util Tools UPDATE

Introduction

While there are several updates and changes I made to the underlying implementation, the overall functionality remains the same so please read my original post WASI AIR Logging Console & Logging Util Tools for a general overview.

See It In Action!

  • Logging Test Application — Small test app that uses the logging framework and spits out log statements every second. I have a link to the console below for quick testing.
  • Logging Console Test Application — Allows you to see the Console in action when you run it and the Logging Test Application at the same time.

Assets

Updates & Changes

  • The name of the SWC has changed from WASILogConsoleLibrary.swc to  WASILoggingLibrary.swc.
  • The LocalConnection Logger is no longer a wrapper class, but now an actual logging target called LocalConnectionTarget.
  • Added a Firebug (FireFox extension) Logging Target that outputs the same log message as the LocalConnectionTarget.
  • Created a base WASILoggingTarget with several, common helper methods for creating targets.

Since I mentioned that some of the actual impl changed a bit I’m going to show some code illustrating the changes.

Setting Up in Main App :: Example Code

The difference between this one and last version I shared has to do with the use of targets as opposed to a wrapper class. I also put all of my logging specifics into a helper class for the Test App called Logging — I could’ve just as easily put this all into the main app file, but I decided to move it into a new class for better organization.

<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	creationComplete="this.init()">

	<mx:Script>
		<![CDATA[
			import com.webappsolution.controller.FilterControllerTest;
			import com.webappsolution.delegate.FilterDelegateTest;
			import com.webappsolution.logging.Logging;

			private static var loggerSetup:* = Logging.setupLogging();

			private function init():void
			{
				var filterDelegateTest:FilterDelegateTest = new FilterDelegateTest();
				var filterControllerTest:FilterControllerTest = new FilterControllerTest();
			}

		]]>
	</mx:Script>

</mx:Application>

The line to make note of is

private static var loggerSetup:* = Logging.setupLogging();

which calls my helper Logging class that actually creates the logging targets, levels, and filters.

Helper Logger Class (Not Required)

/**
 * Web App Solution Confidential Information
 * Copyright 2010, Web App Solution, Inc.
 *
 * @date Apr 26, 2010
 */
package com.webappsolution.logging
{
	import com.webappsolution.logging.LoggingUtils;
	import com.webappsolution.logging.target.FirebugTarget;
	import com.webappsolution.logging.target.LocalConnectionTarget;

	import mx.logging.LogEventLevel;
	import mx.logging.targets.TraceTarget;

	public class Logging
	{
		/**
		 * Create your list of targets here.
		 */
		public static function setupLogging():void
		{
			var level:int = LogEventLevel.ALL;
			var filters:Array = createFilters();
			var targets:Array = createTargets();

			// set up logging for the application
			LoggingUtils.setupLogging(level, filters, targets);
		}

		/**
		 * Create your list of compile-time filters here.
		 */
		public static function createFilters():Array
		{
			var filters:Array = ["*"];

			return filters;
		}

		/**
		 * Create your list of targets here.
		 */
		public static function createTargets():Array
		{
			var traceTarget:TraceTarget;
			var firebugTarget:FirebugTarget;
			var lcTarget:LocalConnectionTarget;
			var targets:Array;

			traceTarget = new TraceTarget();
			traceTarget.level = LogEventLevel.ALL;
			traceTarget.includeDate = true;
			traceTarget.includeTime = true;
			traceTarget.includeCategory = true;
			traceTarget.includeLevel = true;

			firebugTarget = new FirebugTarget();
			firebugTarget.level = LogEventLevel.ALL;
			firebugTarget.includeDate = true;
			firebugTarget.includeTime = true;
			firebugTarget.includeCategory = true;
			firebugTarget.includeLevel = true;

			lcTarget = new LocalConnectionTarget();
			lcTarget.level = LogEventLevel.ALL;
			lcTarget.includeDate = true;
			lcTarget.includeTime = true;
			lcTarget.includeCategory = true;
			lcTarget.includeLevel = true;

			// create a list of targets
			targets = [traceTarget, firebugTarget, lcTarget];

			return targets;
		}
	}
}

Here I’m just creating the specific logging targets for my application:

  • TraceTarget — ouputs to your Flex IDE’s console
  • FirebugTarget — ouputs to your FireFox’s Firebug plugin’s console
  • LocalConnectionTarget — ouputs to WASI AIR Logging Console

The other change to make note of is the actual definition of the logger in each class you’re implementing logging. Let’s take a quick look here.

New Logger Instantiation

The OLD way was like this:

private static const logger:ILogger = LocalConnectionLog.getLogger(FilterControllerTest);;

The NEW way was like this:

private static const logger:ILogger = Log.getLogger(LoggingUtils.getFullyQualifiedClassName(FilterControllerTest));

The new design decouples the logging from our custom wrapper class LocalConnectionLog and now uses the out of the box mx.logging.Log to create a category for each logger instantiation. Notice the use of LoggingUtils.getFullyQualifiedClassName(clazz:Class):String to get the fully qualified string name for the object; one can also just pass in a string category of their choice instead of using the class name.

Post to Twitter Tweet This Post

, , , , ,

No Comments

WASI AIR Logging Console & Logging Util Tools

Introduction

About a year ago I revisited an old friend — a simple SWF with a TextArea that outputs log messages from another SWF via the LocalConnection. I wrote it for Xcelsius since it’s a black box when you’re running custom Flex Connectors and UI Components and I needed a way to not only see the errors in the Flash Debug Player, but get more info…thus, the reemergence of my old-school Flash Logger that I originally wrote in Flash 5. You can read more about it here.

Recently, however, I realized that this simple tool was actually much more valuable than I had remembered, as I’ve had several clients that have had some difficulties logging in or running the app as expected for the first time…you know the schpeel…it’s all hooked up and ready to go and you’ve been logging into the app for months from your dev machine and it works great…but then suddenly the client tries to run it and nada…and since they don’t have a Flash/Flex Builder IDE all ready to rock with debugging, you might be stuck wondering why they can’t get in…ah-ha, just fire up the good-ole WASI Logging Console and suddenly your mystery is solved.

See It In Action!

  • Logging Test Application — Small test app that uses the logging framework and spits out log statements every second. I have a link to the console below for quick testing.
  • Logging Console Test Application — Allows you to see the Console in action when you run it and the Logging Test Application at the same time.

Assets

Quick Explanation…How Does it Work?

The WASI LocalConnection (LC) Logger  consists of 2 parts:

  1. A SWF with a LC that receives messages — ie, logs statements — and displays them in a simple Flex List.
  2. A Logging Framework that provides basic logging methods you’d expect (debug, info, warn, error, and fatal) with a LC sender that pushes these messages to the receiving SWF.

Logger Basics

The WASI Logger outputs log statements to both the Flex/Flash builder IDE and the WASI AIR Logging Console with the same-old, friendly Flex logging sytax you;d expect. Here’s some sample code using it in an application:

logger.debug("entering myMethod"); // log statement in myMethod

And here’s what the output looks like to both the IDE’s console and the AIR Console:

4/12/2010 07:03:57 PM [DEBUG] com.webappsolution.controller.FilterControllerTest myMethod // output to the Flex IDE console

Compile-Time & Run-Time Logging Configuration

The Logging Framework also provides the ability to set up logging configuration for log levels and log filters at both compile-time and run-time. To configure logging for Compile time, simply add the following import and variable to your main application’s script block:

import com.webappsolution.logging.LoggingUtils;
private static var loggerSetup:* = LoggingUtils.setupLogging(LogEventLevel.ALL, ["*"]);

In the previous example, the logger is set up with log level of All and sets the filters to include all classes (even the Flex SDKs basic messaging classes for HTTPService so you might want to consider using a package level that’s appropriate to your application.)

To configure logging for Run-time, simply add the following query string to your application’s debug configuration or URL in the browser window:

http://wasi.com/app.swf?logLevel=error&logFilters=com.webappsolution.controller.*,com.webappsolution.delegate.*

Note the 2 parameters in bold; the following depicts their use and possible values:

  • logLevel — The desired log level for logging with the following values (must be in lowercase):
    • debug
    • info
    • warn
    • error
    • fatal
  • logFilters — The desired package and/or class names you’d like to see in the logger. Examples include fully qualified class names or packages with asterisks at the end.
    • Class; eg com.webappsolution.controller.MyController — Will only show log statements for the class MyController.
    • Packages; eg com.webappsolution.controller.* – Will show the log statements for all the classes in the package “com.webappsolution.controller”

You can apply multiple filters in the url by comma separating them: com.webappsolution.controller.*,com.webappsolution.delegate.*,com. webappsolution.MyClass

Using Run-time configs will override whatever was specified in the Compile-time configs.

NOTE: You must run the application from a web server in order for runtime log configs to work since Flash/Flex Builder throws an error when you try to create debug configurations with a query string at the end (again unless running from a web server).

NOTE: applying log levels and filters only effect the log statements in the IDE — all log statements are sent to the WASI AIR Logging Console as it has it’s own set of tools to do the same filtering.

WASI AIR Logging Console Features - Top Tool Bar

Since the Console receives all the logging messages, we’ll review its set of tools that help developers achieve the same functionality as aforementioned.

Log Level ComboBox — Contains a list of all log levels and allows developers to filter the list of log messages in the console by selecting these levels.

Log Filter AutoComplete Field — Allows developers to search for classes and packages to filter the list by; the list of possible filters is automatically generated for the developer at runtime once the console starts receiving messages and sorts them by alphabetical order. Smply start tpying in the full qualified name of a class or package and you’ll be presented with all matches.

To the right of the Log Filter AutoComplete Field is a helper ComboBox that allows the developer to sort the list of filters by class name, packages, or both — this is incredibly useful if you are logging to of classes. You can delete and/or remove filters by backspace the selected item in the AutoComplete field or clicking on the “Clear Filters” button.

NOTE: You can apply both log level and log filters to the list at the same time in any order.

Right-click — Developers can right-click on an item in the list and filter directly by selecting “Filter by Item” in the context menu. Coming soon — copy the individual log message with right-click.

WASI AIR Logging Console Features - Bottom Tool Bar

Clear Log Button — Simply click this to clear the entire log list.

Copy to Clipboard Button — Clicking this copies the entire list of log messages to your clipboard for easy cut and paste.

Auto Scroll CheckBox — Selecting the checkbox forces the list of log messages to scroll automatically to the bottom o the list. This can be useful if you’re watching real-time messages with logs.

Pretty Colors CheckBox — Selecting the checkbox color codes the log levels in the log list.

What it Does NOT

  • Can’t currently accept log messages over 40k — this can easily happen if you’re trying to log a large amount of data like, XML. I’ll push this out shortly by splitting up the chunks I’m sending across the wire to be < 40k.
  • Can’t run more than one of these suckers at a time (since the LC relies on a unique ID). Could allow the developer to enter in a unique ID for each version of the console and app, but I don’t think this is necessary at the moment.
  • Can’t enter multiple filters. This wouldn’t be too hard and is scheduled to come out soon.
  • No AIR badge…I’m being lazy right now and wanted to get the bare bones out for some quick feedback.
  • Not currently on Google Code but will be by EOW as an open source project.

Getting Started

This thing is pretty simple really and requires very little setup or modification to your code:

  1. Download the WASILogConsoleLibrary.swc and drop it into the libs folder of your project.
  2. In your project add the following, imports:
    1. import com.webappsolution.logging.LoggingUtils;
    2. import mx.logging.LogEventLevel;
  3. In your main application file, add the logging setup: private static var loggerSetup:* = LoggingUtils.setupLogging(LogEventLevel.ALL, ["*"]);
  4. In classes you want to log, create the following:
    1. import com.webappsolution.logging.LocalConnectionLog;
    2. import mx.logging.ILogger;
    3. private static const logger:ILogger = LocalConnectionLog.getLogger(FilterDelegateTest);
    4. Call some log methods like:
      1. logger.debug(”we are logging”);
  5. Download the WASI Logger Air Console (WASILogConsoleAIR.air).
  6. Install the AIR application, run it, and then run your project that you just added logging to.

Setting Up in Main App :: Example Code

Again, the key thing to note here is the line where we set up the logger with LoggingUtils.setupLogging(LogEventLevel.ALL, ["*"]);

<mx:Application
	xmlns:mx="http://www.adobe.com/2006/mxml"
	creationComplete="this.init()">

	<mx:Script>
		<![CDATA[
			import com.webappsolution.controller.FilterControllerTest;
			import com.webappsolution.delegate.FilterDelegateTest;
			import com.webappsolution.logging.LoggingUtils;

			import mx.logging.LogEventLevel;

			private static var loggerSetup:* = LoggingUtils.setupLogging(LogEventLevel.ALL, ["*"]);

			private function init():void
			{
				var filterDelegateTest:FilterDelegateTest = new FilterDelegateTest();
				var filterControllerTest:FilterControllerTest = new FilterControllerTest();
			}

			protected function button1_clickHandler(event:MouseEvent):void
			{
				var urlRequest:URLRequest = new URLRequest("http://www.webappsolution.com/air/wasi-logging-console/WASILogConsole.html");
				navigateToURL(urlRequest, "_blank");
			}

		]]>
	</mx:Script>

</mx:Application>

Using the Logger :: Example Code

Here you should note the instantiation of the logger as a static constant, private static const logger:ILogger = LocalConnectionLog.getLogger(FilterControllerTest);, as well as the use thereof with normal logging syntax, logger.debug("Constructor");.

Just pass in the name of the class you’re implementing logging in in the method LocalConnectionLog.getLogger(); and you’re good to go!

package com.webappsolution.controller
{
	import com.webappsolution.logging.LocalConnectionLog;

	import flash.events.TimerEvent;
	import flash.utils.Timer;

	import mx.logging.ILogger;

	public class FilterControllerTest
	{
		private static const logger:ILogger = LocalConnectionLog.getLogger(FilterControllerTest);

		public function FilterControllerTest()
		{
			// all log levels
			logger.debug("Constructor");
			logger.info("Constructor");
			logger.warn("Constructor");
			logger.error("Constructor");
			logger.fatal("Constructor");

			var timer:Timer = new Timer(5000);
			timer.addEventListener(TimerEvent.TIMER, onTimer);
			timer.start();
		}

		private function onTimer(e:TimerEvent):void
		{
			logger.debug("Constructor");
			logger.info("Constructor");
			logger.warn("Constructor");
			logger.error("Constructor");
			logger.fatal("Constructor");
		}
	}
}

NOTE: You can also fire up this Logging Test Application that allows you to play with various filters and log levels. It has a timer that spits out logs messages every second. Simply open this link up and then open up the WASI AIR Logging Console and you should see some messages start to populate the list.

Special Thanks

  • Abdul Qabiz — I used your com.abdulqabiz.utils.QueryString class to nab the parameters out of the query string.
  • Hillel Coren — I used your AutoComplete component to create the package and class filter AutoComplete Search Field.
  • Jesse Warden — We’ve been rapping back and forth about the fact that we both had one so we decided to combine some of the functionality between the two into this final tool.
  • Final Thoughts

    We’ll continue to update this enhancement requests and fix any bugs that y’all find, so let’em fly!

    Post to Twitter Tweet This Post

, , , , ,

5 Comments

Unable to export SWC oem

Been switching environments a bit lately from Flash Builder to Flex Builder and back and using different SDKs.

When importing a new project that someone had checked in from a different version, the .flexLibProperties file was causing this issue.

After much scouring, I found something that worked.

Open .flexLibProperties and find the section <includeResource/>. Remove everything in that section.

Made the problem disappear.

Post to Twitter Tweet This Post

, , ,

No Comments

FlexUnit 4 Testing Services In Flash Player Issue

We’ve created a number of FlexUnit 4 (FU4) tests for our current, large project and the suite of tests that seems to be of the most importance to both us and our client is the one that tests the services. Our client’s back-end services are simple JSPs that return XML payloads for a number of CRUD operations on various objects in the system, so we’d like to test sending good required data as well as bad required data to our delegate before hitting the service directly.

The issue we ran into was quite frustrating and it took me some time to figure it out — I actually had to explain the system of tests to my partner before it dawned on me what was going wrong. In order to actually hit the services and get data back, you need to be logged into our client’s system…except this isn’t done through a Flex login, but rather via the larger application’s HTML login in which our smaller app lives (SSO)…once you’re logged in, a cookie is sent back and forth between the client and server…such is the security design of our client’s application framework and there wasn’t any wiggle room to change this.

SWF Browser Association

Change SWF to Open With Browser

Now think about FU4 and how it actually runs the tests (when using Ant and not building and running with FlexBuilder)…it simply opens up a TestRunner.swf in the Flash Player to execute it’s tests…this means no browser wrapper for our SWF and thus no access to cookies…and ultimately no working services in my tests…grrrr.

So here’s a simple solution (on Mac)…open up Finder and locate your TestRunner.swf, right-click on it and select “Get Info”. Find the section “Open with” and change the application to your browser (I use FireFox), but don’t click the button change for all, as we just want to change this for this file and this file only. Voila! Now your TestRunner.swf will run in thr browser when your Ant buld runs and you will have access t cookies (assuming you’ve already logged into the system you need access to in the same browser session).

Post to Twitter Tweet This Post

, , , , , , ,

3 Comments

Headless Flex Builds on EC2 Using Hudson Against Remote SVN Repo on Assembla with FlexPMD

We’re doing a current project requiring continuous integration. We also maintain the SVN repo. There’s a lot here and you may/may not need all the pieces. We’re specifically doing headless Flex/DataViz Builds on Amazon EC2 Ubuntu with Hudson against a remote SVN repo on Assembla and have thrown in FlexPMD to see what it can add to our process.

First, some stuff I’ll assume you already have and know how to work with:

  • EC2 machine running in the Amazon cloud. We’re using one of the Ubuntu disty’s. I’m going to assume you have all the necessary ports open for things like email and such.
  • Hudson. We’re using version 1.326. We’ve used other CI tools but find Hudson to be very user friendly. You’ll need to have a servlet container ie Tomcat and you just pop hudson.war in and you’re ready to rock.
  • Remote SVN. You can be using a local one, but. We’re using Assembla since it’s got all the stuff we need to do business in one place and it’s simple to use. Time is money.
  • Java installed on your server. We’re using version 1.6.0_07

Stuff you’ll end up downloading/installing/configuring:

  • Flex SDK
  • Flex Dataviz components
  • SVN client
  • Ant
  • Flex Ant
  • Email

Step 1, Flex

We’re currently building with the latest stable build of Flex 3.4. Get yourself all logged into your EC2 account and let’s roll. I create a flex/3.4 directory and cd to that directory and then get the latest Flex rev. This is the latest URL:

wget http://download.macromedia.com/pub/flex/sdk/flex_sdk_3.4.zip

Let’s get the dataviz components as well since they’re a separate install

wget http://download.macromedia.com/pub/flex/sdk/datavisualization_sdk_3.4.zip

Oh yeah, and if you’re going to be doing unit testing, might as well get that sucker as well

wget http://download.macromedia.com/pub/flex/sdk/automation_sdk_3.4.zip

Great, so we have all the pieces we need so far. You’ll want to unzip and cp these to wherever you keep your software installs on the server. I’m no unix guru, but, near as I could find out, the common location is /opt.

So, create a /opt/flex directory and unzip the flex_sdk_3.4.zip files there. Then, copy the dataviz zip there and unzip it.

cp datavisualization_sdk3.4.zip /opt/flex

cd /opt/flex

unzip datavisualization_sdk3.4.zip

This will extract the following into the SDK 3 installation

  1. datavisualization.swc into the frameworkslibs folder
  2. datavisualization__3.0.9147.swz and datavisualization__3.0.9147.swf into the frameworksrsls folder
  3. datavisualization_rb.swc into the appropriate frameworkslocale<locale> folder

Let’s make sure we put the Flex compiler on the class path. On our server, the default shell is bash. You’re setup may be different, but essentially, you want to find the properties file for you shell (I’m using /root/.bashrc) and add the following line to the bottom of it:

export PATH=/opt/flex/bin:$PATH

Now let’s test it. You may need to log out and then back into your shell. At the command prompt, enter mxmlc and hit return. You should see something like

Loading configuration file /opt/flex/frameworks/flex-config.xml

Error: a target file must be specified

That’s a good error. It means that the Flex compiler is now accessible on your system. If nothing comes back, you’re just at the command prompt, you may not be using the right shell properties file.

In order to build projects that use the dataviz components without having the watermark on your charts and graphs, you’ll need to apply a Flex license to the installation. You do this in the flex-config.xml file located in /opt/flex/frameworks. Towards the bottom of the file you’ll see some commented out xml for doing so:

<licenses>
<license>
<product>string</product>
<serial-number>number</serial-number>
</license>
</licenses>

Step 2, SVN

We are accessing an SVN repo on our Assembla account. The easiest way to make this happen from the EC2 is to just install SVN. So, from the command prompt:

apt-get install subversion

If you run into any errors, I always find it helpful to refresh the list:

apt-get update


If all went well, you should be able to log into your remote repo:

svn –username <your_username> –password <your_password> –no-auth-cache checkout <some_project_name>


If successful, you’re going to have a checked out version of some_project_name in your current directory.


Step 3, Ant


We’re going to be using Ant as our build process. It will called via a Hudson job. Let’s get and install Ant.

apt-get install ant


Once that completes, you should be able to type ant at a command prompt. If it installed successfully, you should see something similar to (unless there happens to be a build.xml file in your current directory):

Buildfile: build.xml

BUILD FAILED


This is good. We now have Ant installed. The only other Ant specific thing we’ll need to do is copy the FlexTasks.jar from your Flex SDK into your new Ant install.


Let’s find where Ant was installed. At a command prompt:

which ant

(which will most likely return)

/usr/bin/ant


Now, navigate to your Flex SDK Ant lib directory. The Flex SDK now contains the flexTasks.jar we need.

cd /opt/flex/an/lib


Now just copy this to the location of your Ant install’s lib directory (typical):

cp flexTasks.jar /usr/share/ant/lib


If you do not copy this file to the lib directory, you must specify it by using Ant’s -lib

option on the command line when you make a project.

Step 4, Setup Hudson Job


Plugins

I’m assuming you have a working familiarity with Hudson. If not, there’s a ton of info via your install directly and on the web. We have a few extra plugins installed. The Violations plugin is useful for code analysis via PMD files if you structure your ant files to use it. The Email Extension gives you a bit more flexibility than the basic email tool.

plugins

Configuration

Here’s a look at few items we needed in the Hudon configuration page to get things to work smoothly

Specify the Ant location on your server.


ant

For the Extended E-mail Notification plugin. We’ve defined an email account on our system called hudson. We also use gmail for our corporate email. We’re essentially relaying to gmail which requires SMTP auth and SSL (note: we haven’t entered anything in the default Hudson E-mail section):


email

Job Setup

Go the usual steps of creating a new job. Here are the pertinent parts.

In Source Code Management, we’ll need to point to our remote SVN. When you click on the “?” next to the Repository URL, you will see the grey box and be able to provide login credentials to your SVN repo and test the connection:


svn

We’re not going to specify any build triggers. The reason is that Assembla gives the ability to access the post-commit hook in SVN via their “Webhook” plugin. In that tool, all we have to do is specify the Hudson job URL and with each check in of code, the project is checked out, built, and success/failure notification sent to our dev group. This is the key to the ‘continuous integration’ aspect of this whole setup.


webhook

We do need to tell Hudson to use Ant to do the builds. We have a target in the build.xml file (that is in the root of our Flex project) called main.hudson. To be on the safe side, I’ve specified the full path to the build file. We specify the ant install we configured in the Hudson configuration page earlier. It would probably be helpful to give it more meaningful name like ‘ant_version_x’.

jobant

FlexPMD is another great tool we use that profiles your code based upon a bunch of best practices defined by the Flex group at Adobe. You can also specify your own criteria to use in the analysis. It’s worth checking out. Note the format of the XML filename pattern used. It took a while to figure that part out!


flexpmd

We configure the Editable Email Notification accordingly:


jobemail

And that’s pretty much it. I’ll be pushing up a blog shortly that will walk through the whole ant build used for this project. It uses modules, all sorts of RSLs, FTP, and so on.

Happy Flexing.

Post to Twitter Tweet This Post

, , , , , , , , ,

4 Comments

Axiis Examples with Lots of Comments

We’ve begun using Axiis on a current client’s project. The application is loaded with graphs and charts and when we hand off the project, we needed to provide a framework for the development staff to quickly build and add new graphing components. Some of the charts are simple but there are some more complicated ones we need to build and will be built in the future. The current Flex DataViz components work fine for simple tasks. But, anyone who has had to go beyond the basics understands the pain that you quickly begin to feel.

Fortunately, I caught Tom Gonzalez’s, (BrightPoint Consulting) lecture at MAX this month and was blown away. The things they’re doing with the Axiis framework and Degrafa are off the charts! (pun intended)

I’ll leave the real discovery to you to check out the Axiis site, but, Axiis is a ’specialized framework that implements specific design patterns that can be used to create your own visualizations’. It’s not a pre-built collection of charting components. They’ve developed a great way of abstracting the basic building blocks of doing data visualization.

Axiis is currently in beta release. There are a lot of great examples on their site so check them out. If you’re new to Degrafa, it’s worth your while to do a bit of reading and check out the cool examples they have on their site as well since many of the examples use Degrafa.

Being in beta, the documentation is a work in progress. The examples from the site are great and really cover a lot of space, but I did struggle with some of the concepts at first. So I’ve taken three of the first examples we needed to borrow from and hyper-commented them for clarity.
I’ll continue to add to the collection over time.

Cluster Stack Example

Linear Series Example

Cluster Column Example

Post to Twitter Tweet This Post

, ,

2 Comments

Centering the Label Vertically in a FormItem

So you’re coding up some form items and the glorious designer is showing the label for the form item centered vertically, or, at the bottom.

centeredformlabel

Piece of cake says I and I start to look for the props to do so. Lo and behold, they don’t exist. WTF??

Google this and google that and no luck!!

Great, now what do I do?

Well, it’s kinda hacky, but it works.

I call this function on the creationComplete event of the FormItem:

private function centerLabel(evt:FlexEvent):void
{

var fi:FormItem = FormItem(evt.currentTarget) as FormItem;
var lbl:Label = fi.itemLabel as Label;
lbl.move( lbl.x, lbl.y + (lbl.height/2) );

}

Enjoy

Post to Twitter Tweet This Post

,

No Comments