zoltanb.co.uk http://zoltanb.co.uk Flex and Meow Sun, 12 Feb 2012 22:21:41 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 LaunchpadCleaner 2 – The Missing Mac OS X Lion Launchpad Manager! http://zoltanb.co.uk/launchpadcleaner/?utm_source=rss&utm_medium=rss&utm_campaign=launchpadcleaner http://zoltanb.co.uk/launchpadcleaner/#comments Wed, 27 Jul 2011 14:23:52 +0000 zoltanb http://zoltanb.co.uk/?p=518 LaunchpadCleaner is a simple and effective tool for keeping your Mac OS X Launchpad organised.

News:

You can download the latest version of LaunchpadCleaner from here:

http://launchpadcleaner.com/

LaunchpadCleaner lets you remove/rename/backup/restore All your Launchpad icons, you can even transfer your Launchpad layout to another mac!

For [...]]]> LaunchpadCleaner is a simple and effective tool for keeping your Mac OS X Launchpad organised.

News:

You can download the latest version of LaunchpadCleaner from here:

http://launchpadcleaner.com/

launchpadsite LaunchpadCleaner 2 The Missing Mac OS X Lion Launchpad Manager!

LaunchpadCleaner lets you remove/rename/backup/restore All your Launchpad icons, you can even transfer your Launchpad layout to another mac!

For Downloads or Help & Support please go to the new LaunchpadCleaner Support page!

]]> http://zoltanb.co.uk/launchpadcleaner/feed/ 235 How to install Jenkins on Scientific Linux for Flex Development http://zoltanb.co.uk/how-to-install-jenkins-on-scientific-linux-for-flex-development/?utm_source=rss&utm_medium=rss&utm_campaign=how-to-install-jenkins-on-scientific-linux-for-flex-development http://zoltanb.co.uk/how-to-install-jenkins-on-scientific-linux-for-flex-development/#comments Mon, 25 Jul 2011 15:28:24 +0000 zoltanb http://zoltanb.co.uk/?p=493 Jenkins is an open source continuous integration server. Here’s how to set it up on Linux for managinf as3/flex applications/modules/libraries:

Installation Install Jenkins: Install Flash Player for running Unit tests:
in your sdk folder find: /runtimes/player/10/lnx/flashplayer.tar.gz
Extract the contents and add flashplayer to the path.
Try sudo -u jenkins flashplayer on [...]]]> Jenkins is an open source continuous integration server. Here’s how to set it up on Linux for managinf as3/flex applications/modules/libraries:

Installation

  1. Install Jenkins:
    sudo wget -O /etc/yum.repos.d/jenkins.repo http://pkg.jenkins-ci.org/redhat/jenkins.repo
sudo rpm --import http://pkg.jenkins-ci.org/redhat/jenkins-ci.org.key
yum install jenkins 
    sudo wget -O /etc/yum.repos.d/jenkins.repo http://pkg.jenkins-ci.org/redhat/jenkins.repo
sudo rpm --import http://pkg.jenkins-ci.org/redhat/jenkins-ci.org.key
yum install jenkins
  2. Install Flash Player for running Unit tests:
    in your sdk folder find: /runtimes/player/10/lnx/flashplayer.tar.gz
    Extract the contents and add flashplayer to the path.
    Try sudo -u jenkins flashplayer on the commandline to verify that it’s working correctly.
    You might need to chmod/chown it.
  3. Install XVNC Plugin In Jenkins:
    Go to Jenkins>Manage Jenkins>Mange Plugins>Available
    Find XVNC, select it and click install.
  4. Install a vnc server on the box:
    yum -y install tigervnc-server
  5. Set up the vnc password for Jenkins:
    sudo vncpasswd /var/lib/jenkins/.vnc/passwd
    Password:
    Verify:

Start/Stop Jenkins

  • sudo service jenkins start
  • sudo service jenkins stop
  • sudo service jenkins restart

Default Jenkins Config

If you installed jenkins using the steps above, you should have the following default configuration:

  • The default Jenkins installation folder is:
    /var/lib/jenkins
  • If you reboot your box, Jenkins will be automatically started as a daemon. To change/remove this, edit: /etc/init.d/jenkins
  • A jenkins user is created.
  • The default jenkins url is: http://localhost:8080

Troubleshooting

  • Error:
    Caused by: java.io.IOException: Cannot run program "xvfb-run": java.io.IOException: error=2, No such file or directory
    Caused by: java.io.IOException: Cannot run program "xvfb-run": java.io.IOException: error=2, No such file or directory

    Solution:
    yum install Xvfb
    or use xvnc…

  • Error:
    Failed to launch Flash Player. Probably java was not able to find flashplayer.
    Failed to launch Flash Player. Probably java was not able to find flashplayer.


    Solution:
    1. in your sdk folder find: /runtimes/player/10/lnx/flashplayer.tar.gz
    Extract the contents and add flashplayer to the path.

  • Error:
    [WARNING] [LAUNCHER] Using xvfb-run to launch headless tests [ERROR] Failed to delete Xvfb locking files, does the current user has access? java.io.IOException: File /tmp/.X11-unix/X0 unable to be deleted.
    Solution:
    change the ownership to the jenkins user:
    sudo chown -R jenkins:jenkins /tmp/.X11-unix
  • Error:
    [ERROR] Unexpected return code 127/var/lib/jenkins/workspace/...
    [ERROR] Unexpected return code 127/var/lib/jenkins/workspace/...

    Solution:
    Xvfb is not configured correctly.
    I found it easier to install XVNC Plugin In Jenkins:
    Go to Jenkins>Manage Jenkins>Mange Plugins>Available
    Find XVNC and install it.
    2. Install a vnc server:
    yum -y install tigervnc-server

  • Error:
    $ vncserver :15 You will require a password to access your desktops. getpassword error: Invalid argument Password:ERROR: Failed to parse POMs java.io.IOException: Failed to run 'vncserver :15' (exit code 1), blacklisting display #15; consider checking the "Clean up before start" option
    $ vncserver :15 You will require a password to access your desktops. getpassword error: Invalid argument Password:ERROR: Failed to parse POMs java.io.IOException: Failed to run 'vncserver :15' (exit code 1), blacklisting display #15; consider checking the "Clean up before start" option

    Solution:
    use vncpasswd to create a default password:
    vncpasswd /var/lib/jenkins/.vnc/passwd

]]> http://zoltanb.co.uk/how-to-install-jenkins-on-scientific-linux-for-flex-development/feed/ 1 How to calculate the Perceived Brightness of a colour http://zoltanb.co.uk/how-to-calculate-the-perceived-brightness-of-a-colour/?utm_source=rss&utm_medium=rss&utm_campaign=how-to-calculate-the-perceived-brightness-of-a-colour http://zoltanb.co.uk/how-to-calculate-the-perceived-brightness-of-a-colour/#comments Sun, 24 Jul 2011 20:22:18 +0000 zoltanb http://zoltanb.co.uk/?p=469 How would you determine programmatically  whether Black text or White text is more readable on a colour background?

Here are a few algorithms to calculate the brightness of a color: (see the interactive demo at the bottom of this page)

1. Arithmetic Mean: Formula:

AS3 Code:

It was a very simple and [...]]]> How would you determine programmatically  whether Black text or White text is more readable on a colour background?

Here are a few algorithms to calculate the brightness of a color: (see the interactive demo at the bottom of this page)

1. Arithmetic Mean:

Formula:%5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Cfrac%7Br%20%2B%20g%20%2B%20b%7D3 How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.15.09 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function arithmeticMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return (rgb[0] + rgb[1] + rgb[2])/3;
}
public static function arithmeticMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return (rgb[0] + rgb[1] + rgb[2])/3;
}

It was a very simple and effective algorithm. Unfortunately it failed between the green and turquoise region:
Screen Shot 2011 07 24 at 20.17.39 How to calculate the Perceived Brightness of a colour

 

Geometric Mean:

Formula:%5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Csqrt%5Bn%5D%7Br%20%20g%20%20b%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.30.50 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function geometricMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.pow(rgb[0] * rgb[1] * rgb[2],1/3);
}
public static function geometricMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.pow(rgb[0] * rgb[1] * rgb[2],1/3);
}

Ok, the green is a lot better, but now the brightness of the yellow is wrong:

Screen Shot 2011 07 24 at 20.31.59 How to calculate the Perceived Brightness of a colour

Quadratic Mean:

Formula:%5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Csqrt%7B%5Cfrac%7Br%5E2%20g%5E2%20b%5E2%7D%7B3%7D%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.35.00 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function quadraticMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.pow( (rgb[0]*rgb[0] + rgb[1]*rgb[1] + rgb[2]*rgb[2])/3 ,1/2);
}
public static function quadraticMean(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.pow( (rgb[0]*rgb[0] + rgb[1]*rgb[1] + rgb[2]*rgb[2])/3 ,1/2);
}

Works really well for all dark colours. Fails on purple.

HSV Value (Brightest Component):

Formula: %5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Cmax %7Br%2C%20g%2C%20b%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.43.26 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function valueFromHSV(hex:uint):Number
{
var hsv:Array = ColorUtils.hex2hsv(hex);
return hsv[2]*255;
}
public static function valueFromHSV(hex:uint):Number
{
var hsv:Array = ColorUtils.hex2hsv(hex);
return hsv[2]*255;
}

Dark colours are ok, Fails when the r, g or b value is close to 0×99

Darkest Component:

Formula: %5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Cmin %7Br%2C%20g%2C%20b%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.52.08 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function darkestComponent(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.min(rgb[0], rgb[1], rgb[2]);
}
public static function darkestComponent(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.min(rgb[0], rgb[1], rgb[2]);
}

Only the very bright colours work fine with this algorithm.

3D distance in RGB space:

Formula: %5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Csqrt%7Br%5E2%20%2B%20g%5E2%20%2B%20b%5E2%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 20.53.51 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function distanceIn3D(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.sqrt( (rgb[0]*rgb[0] + rgb[1]*rgb[1] + rgb[2]*rgb[2]));
}
public static function distanceIn3D(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.sqrt( (rgb[0]*rgb[0] + rgb[1]*rgb[1] + rgb[2]*rgb[2]));
}

Worse than using the V component of the HSV representation.

Lightness From HSL:

Screen Shot 2011 07 24 at 20.57.08 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function lightnessFromHSL(hex:uint):Number
{
var hsl:Array = ColorUtils.hex2hsl(hex);
return hsl[2]*255;
}
public static function lightnessFromHSL(hex:uint):Number
{
var hsl:Array = ColorUtils.hex2hsl(hex);
return hsl[2]*255;
}

The best unweighted formula. Fails on yellow around 0xeeee00.

Weighted Algorithms

Natural formulas don’t take into consideration that the human eye perceives some of the primary colours darker than others.

Eg pure green(0xff0000) is perceived brighter than pure blue(0x00ff00).
According to the W3C consortium, this biased perception can be modelled with the following weights:

r *= .299
g *= .587
b *= .111
r *= .299
g *= .587
b *= .111

Weighted W3C Formula:

Formula: %5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Cfrac%7Br%2A299%20%2B%20g%2A587%20%2Bg%2A117%7D%7B1000%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 21.11.02 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function weightedW3C(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return ((rgb[0] * 299) + (rgb[1] * 587) + (rgb[2] * 114)) / 1000;
}
public static function weightedW3C(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return ((rgb[0] * 299) + (rgb[1] * 587) + (rgb[2] * 114)) / 1000;
}

Very good algorithm, works really well. Source: http://www.w3.org/TR/AERT#color-contrast

Weighted Distance in 3D RGB Space:

Formula:

%5CLARGE%5C%21f%5E%5Cprime%28x%29%5C%20%3D%20%5Csqrt%7B%20r%5E2%20%2A%200.241%20%2B%20g%5E2%20%2A%200.691%20%2B%20b%5E2%20%2A%200.068%7D How to calculate the Perceived Brightness of a colour

Screen Shot 2011 07 24 at 21.17.13 How to calculate the Perceived Brightness of a colour

AS3 Code:

public static function weightedDistanceIn3D(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.sqrt(rgb[0] * rgb[0] * .241 + rgb[1] * rgb[1] * .691 + rgb[2] * rgb[2] * .068);
}
public static function weightedDistanceIn3D(hex:uint):Number
{
var rgb:Array = ColorUtils.hex2rgb(hex);
return Math.sqrt(rgb[0] * rgb[0] * .241 + rgb[1] * rgb[1] * .691 + rgb[2] * rgb[2] * .068);
}

An improved version of the W3C fomula.
Source: http://www.nbdtech.com/Blog/archive/2008/04/27/Calculating-the-Perceived-Brightness-of-a-Color.aspx

Flex demo for testing Perceived Brightness:

click on the colour picker to test the brightness of a colour:

Downloads

ColorUtils (13) ]]> http://zoltanb.co.uk/how-to-calculate-the-perceived-brightness-of-a-colour/feed/ 4 Mac os Lion Compatibility for developers http://zoltanb.co.uk/mac-os-lion-compatibility-for-flex-developers/?utm_source=rss&utm_medium=rss&utm_campaign=mac-os-lion-compatibility-for-flex-developers http://zoltanb.co.uk/mac-os-lion-compatibility-for-flex-developers/#comments Sat, 23 Jul 2011 14:27:23 +0000 zoltanb http://zoltanb.co.uk/?p=451 I’ve just migrated to Mac OS X 10.7 (Lion). Here’s what worked and what failed on OS X Lion:

Flash Builder 4.5:
Java runtime needed to be installed.
Opened a project, compiled it, ran the unit tests, everything worked fine. No major issues found
Update:
Yesterday my right click context [...]]]> I’ve just migrated to Mac OS X 10.7 (Lion). Here’s what worked and what failed on OS X Lion:

  1. tick circle Mac os Lion Compatibility for developers Flash Builder 4.5:
    Java runtime needed to be installed.
    Opened a project, compiled it, ran the unit tests, everything worked fine. No major issues found
    Update:
    Yesterday my right click context menu stopped working(ie. it didn’t appear) in the package explorer after cmd-tabbing back and forth between VMWare and FB 4.5.
    After closing and reopening package explorer it started working again….
  2. tick circle Mac os Lion Compatibility for developers FDT 4:
    Opened a project, compiled it. No issues found
  3. tick circle Mac os Lion Compatibility for developers STS – SpringSource Toolkit
    Opened a Groovy project and compiled it. No issues found
  4. tick circle Mac os Lion Compatibility for developers IntelliJ IDEA 10
    Opened a Maven project, updated dependencies, compiled it. No issues found
  5. tick circle Mac os Lion Compatibility for developers Forklift – No issues found
  6. tick circle Mac os Lion Compatibility for developers Adobe Fireworks CS5
    Opened a project, exported the image slices. No issues found
  7. cross circle Mac os Lion Compatibility for developers VMWare Fusion
    Started a Fedora Core Image. No issues found
    Update:     After restarting the computer, I got the following error message in VMWare:

    VMWare Fusion cannot connect to the virtual machine.
Make sure you have rights to run the program and to access all directories it uses and rights to access all directories for temporary files.
    VMWare Fusion cannot connect to the virtual machine.
Make sure you have rights to run the program and to access all directories it uses and rights to access all directories for temporary files.

    Screen Shot 2011 07 26 at 11.27.08 Mac os Lion Compatibility for developers
    After some googling I found 2 possible solutions:
    1. chmod all vmware image files to 777 – it didn’t work for me
    2. reinstall VMWare – which introduced a new error:

    VMware Fusion can’t be installed on this computer.
Sorry, VMware Fusion can only be installed on Macs with Intel processors.
    VMware Fusion can’t be installed on this computer.
Sorry, VMware Fusion can only be installed on Macs with Intel processors.

    Screen Shot 2011 07 26 at 12.09.38 Mac os Lion Compatibility for developersSolution: Uninstall, download VMware Fusion 3.1.3, install

  8. tick circle Mac os Lion Compatibility for developers Launchbar - No issues found
  9. cross circle Mac os Lion Compatibility for developers Visor
    Didn’t work at all. I updated to TotalTerminal, it worked fine.
  10. tick circle Mac os Lion Compatibility for developers TotalTerminal – No issues found
  11. tick circle Mac os Lion Compatibility for developers TextWrangler – No issues found
  12. tick circle Mac os Lion Compatibility for developers Maya 2009 – No issues found
    Opened a project, navigated around, did a quick software render and a mental ray render, everything worked fine.
  13. cross circle Mac os Lion Compatibility for developers tick circle Mac os Lion Compatibility for developers Little Snitch – Stopped working without any warning.
    Upgraded to the latest version and it started working again.

Pretty good start.

Now I have ugly springy elastic scrollbars and Launchpad that turns my macbook pro into a 15″ iPhone….

Oh, and I can resize windows from all 4 corners…. which is really handy because the maximise button still doesn’t maximise anything….

]]> http://zoltanb.co.uk/mac-os-lion-compatibility-for-flex-developers/feed/ 10 Flex Performance Tuning – superfast list component http://zoltanb.co.uk/flex-performance-tuning-superfast-list-component/?utm_source=rss&utm_medium=rss&utm_campaign=flex-performance-tuning-superfast-list-component http://zoltanb.co.uk/flex-performance-tuning-superfast-list-component/#comments Fri, 15 Jul 2011 16:22:17 +0000 zoltanb http://zoltanb.co.uk/?p=407 The spark List component is designed to render large datasets into a small viewport. However, when you need to display hundreds of itemrenderers at the same time, the performance can drop drastically.

Here’s a basic List component that displays >300 small itemRenderers in the viewport. The dataProvider has 10,000 items. Try dragging the scrollbar [...]]]> The spark List component is designed to render large datasets into a small viewport. However, when you need to display hundreds of itemrenderers at the same time, the performance can drop drastically.

Here’s a basic List component that displays >300 small itemRenderers in the viewport. The dataProvider has 10,000 items. Try dragging the scrollbar thumb.
(See the optimised version at the bottom of this page).

(right click to view source.)

<s:List width="100%" height="100%" top="10"
            dataProvider="{colours}" >
        <s:layout>
            <s:TileLayout horizontalGap="1" verticalGap="1" />
        </s:layout>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer width="20" height="6" >
                    <s:Rect width="100%" height="100%">
                        <s:fill>
                            <s:SolidColor color="{data}" />
                        </s:fill>
                    </s:Rect>
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:List>
<s:List width="100%" height="100%" top="10"
            dataProvider="{colours}" >
        <s:layout>
            <s:TileLayout horizontalGap="1" verticalGap="1" />
        </s:layout>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer width="20" height="6" >
                    <s:Rect width="100%" height="100%">
                        <s:fill>
                            <s:SolidColor color="{data}" />
                        </s:fill>
                    </s:Rect>
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:List>

The Spark List component is designed to use a separate itemrenderer for each item in the viewport, then – if possible – re-use them when you are scrolling up or down. So, in the example above, instead of creating 10,000 itemrenderers, the spark list component only creates ~300:
itemrenderer Flex Performance Tuning superfast list component

This approach works perfectly if you only have a few itemrenderers on stage, ie. the itemrenderers are big and/or the viewport is small.

If you have a big viewport with small itemrenderers, even if the itemRenderers are lightweight, you will end up with too many displayobjects on the stage and the invalidation phase will be painfully slow.

A Different Approach

When you want to display hundreds/thousands of items on screen simultaneously, consider using a canvas(eg. a BitmapData object), where you can “paint” your items:

    <s:BitmapImage id="bmp" width="100%" height="100%"
                   source="{itemRenderer.canvas}"  >
    </s:BitmapImage>
 
    <s:VScrollBar id="scr" skinClass="spark.skins.spark.VScrollBarSkin"
                  right="0" height="100%" >
        <s:change>
            <![CDATA[
                invalidateDisplayList();
            ]]>
        </s:change>
    </s:VScrollBar>
    <s:BitmapImage id="bmp" width="100%" height="100%"
                   source="{itemRenderer.canvas}"  >
    </s:BitmapImage>

    <s:VScrollBar id="scr" skinClass="spark.skins.spark.VScrollBarSkin"
                  right="0" height="100%" >
        <s:change>
            <![CDATA[
                invalidateDisplayList();
            ]]>
        </s:change>
    </s:VScrollBar>

itemrenderer2 Flex Performance Tuning superfast list component

When you scroll around, you can use 

bitmapdata.scroll(0,scrollAmount)
bitmapdata.scroll(0,scrollAmount)

, so you only have to render the area you scrolled into:

itemrenderer3 Flex Performance Tuning superfast list component

Optimised example:

The dataprovider is the same as the one in the previous example: 10,000 items, ~300 in the viewport. Try dragging the scrollbar thumb:

(right click to view source)

    <local:BitmapList width="100%" height="100%" top="10"
                      dataProvider="{colours}" >
        <local:itemRenderer>
            <local:BitmapListItemRenderer width="20" height="6" />
        </local:itemRenderer>
    </local:BitmapList>
    <local:BitmapList width="100%" height="100%" top="10"
                      dataProvider="{colours}" >
        <local:itemRenderer>
            <local:BitmapListItemRenderer width="20" height="6" />
        </local:itemRenderer>
    </local:BitmapList>

Here ALL items in the viewport are re-rendered on Change event. This can be further optimised by introducing bitmapdata.scroll and only rendering the area we are scrolling into.

Note: This example is just a quick mockup to demonstrate the performance improvement you can gain by replacing hundreds of itemRenderers by a single bitmap. Focus management and layout management are not implemented.

]]> http://zoltanb.co.uk/flex-performance-tuning-superfast-list-component/feed/ 3 How to pass in parameters to a Flex Air app at startup http://zoltanb.co.uk/how-to-pass-in-parameters-to-a-flex-air-app-at-startup/?utm_source=rss&utm_medium=rss&utm_campaign=how-to-pass-in-parameters-to-a-flex-air-app-at-startup http://zoltanb.co.uk/how-to-pass-in-parameters-to-a-flex-air-app-at-startup/#comments Sun, 03 Jul 2011 16:43:02 +0000 zoltanb http://zoltanb.co.uk/?p=384 Air applications ((extended)desktop, (extended)mobileDevice, (extended)TV ) can accept custom startup parameters.

To retrieve passed in parameters in a web based pure AS3 applications, you need to use:

In Flex applications:
In AS3 Air applications you can retrieve the passed in params via an InvokeEvent listener:

In Flex Air application you need to listen [...]]]> Air applications ((extended)desktop, (extended)mobileDevice, (extended)TV ) can accept custom startup parameters.

To retrieve passed in parameters in a web based pure AS3 applications, you need to use:

LoaderInfo(this.root.loaderInfo).parameters
LoaderInfo(this.root.loaderInfo).parameters

In Flex applications:

Application.application.parameters
Application.application.parameters

In AS3 Air applications you can retrieve the passed in params via an InvokeEvent listener:

NativeApplication.nativeApplication.addEventListener
               (InvokeEvent.INVOKE, onInvokeEvent);
NativeApplication.nativeApplication.addEventListener
               (InvokeEvent.INVOKE, onInvokeEvent);

In Flex Air application you need to listen to InvokeEvent.INVOKE

Flex 4 Parameter example

<?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"
                       width="200" height="200">
    <fx:Declarations>
        <s:ArrayCollection id="airParams" />
    </fx:Declarations>
 
    <s:invoke>
        <![CDATA[
        var invocation:InvokeEvent = InvokeEvent(event);
        for each(var argument:String in invocation.arguments)
            airParams.addItem(argument);
        ]]>
    </s:invoke>
 
    <s:List dataProvider="{airParams}"
            width="100%" height="100%" />
 
</s:WindowedApplication>
<?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"
                       width="200" height="200">
    <fx:Declarations>
        <s:ArrayCollection id="airParams" />
    </fx:Declarations>

    <s:invoke>
        <![CDATA[
        var invocation:InvokeEvent = InvokeEvent(event);
        for each(var argument:String in invocation.arguments)
            airParams.addItem(argument);
        ]]>
    </s:invoke>

    <s:List dataProvider="{airParams}"
            width="100%" height="100%" />

</s:WindowedApplication>

Test it from the command line:

  1. Multiple parameters:
    adl InvokeExample-app.xml ./ -- hello world
    adl InvokeExample-app.xml ./ -- hello world

    Screen shot 2011 07 03 at 13.55.01 How to pass in parameters to a Flex Air app at startup

  2. Multiple multi-word parameters:
    adl InvokeExample-app.xml ./ -- "green eggs" "and ham"
    adl InvokeExample-app.xml ./ -- "green eggs" "and ham"

    Screen shot 2011 07 03 at 13.57.05 How to pass in parameters to a Flex Air app at startup

  3. Speechmarks – simply escape them out:
    adl InvokeExample-app.xml ./ -- "\"green\" eggs" "and ham"
    adl InvokeExample-app.xml ./ -- "\"green\" eggs" "and ham"

    Screen shot 2011 07 03 at 17.28.24 How to pass in parameters to a Flex Air app at startup

Test it with custom file extension

You can register custom file extensions with your air app. When you open a file with a registered extension, the OS will open your air app and pass in the full path of the file as a parameter.

  1. Add your file extension in your application descriptor xml: 
    <fileTypes>
   <fileType>
     <name>InvokeExample</name>
     <extension>meow</extension>
     <contentType>text/xml</contentType>
   </fileType>
 </fileTypes>
    <fileTypes>
   <fileType>
     <name>InvokeExample</name>
     <extension>meow</extension>
     <contentType>text/xml</contentType>
   </fileType>
 </fileTypes>
  2. Publish & install your app.
  3. Create a test file and double click on it:
    Screen shot 2011 07 03 at 17.38.03 How to pass in parameters to a Flex Air app at startup
    Screen shot 2011 07 03 at 17.38.19 How to pass in parameters to a Flex Air app at startup
]]> http://zoltanb.co.uk/how-to-pass-in-parameters-to-a-flex-air-app-at-startup/feed/ 0 Flex Datagram Server http://zoltanb.co.uk/flex-datagram-server/?utm_source=rss&utm_medium=rss&utm_campaign=flex-datagram-server http://zoltanb.co.uk/flex-datagram-server/#comments Thu, 30 Jun 2011 09:32:39 +0000 zoltanb http://zoltanb.co.uk/?p=350 DatagramServer is small library for Flex+Parsley that allows you to set up and manage a UDP listener in your Air 2.5+ application.

UDP Packets in Flex Air apps

Datagram packets are ideal for gathering data from external devices without having to establish two-way persistent socket connections. Perfect for gathering logs, benchmark data, statistics, …etc.

[...]]]> DatagramServer is small library for Flex+Parsley that allows you to set up and manage a UDP listener in your Air 2.5+ application.

UDP Packets in Flex Air apps

Datagram packets are ideal for gathering data from external devices without having to establish two-way persistent socket connections. Perfect for gathering logs, benchmark data, statistics, …etc.

Note: You can send and receive UDP packets in Air 2.5+, but only on desktop Air apps. MobileDevice, extendedMobileDevice, tv, extendedTV profiles are unsupported.

You can download the DatagramServer swc from github:

https://github.com/mere/DatagramServer

Setup

  1. In your Parsley contextbuilder register DatagramServerContext:
    <parsley:FlexConfig type="{ DatagramServerContext }"/>
    <parsley:FlexConfig type="{ DatagramServerContext }"/>
  2. If you want to edit the datagram host and port from the UI, fastinject DatagramModel, then create a two way binding to .host and .port:
    <s:TextInput text="@{data.host}" width="120" />
<s:TextInput text="@{data.port}" width="40" />
    <s:TextInput text="@{data.host}" width="120" />
<s:TextInput text="@{data.port}" width="40" />
  3. Start/Stop the Datagram server from any parsley-managed class, eg.::
    dispatcher(new Event(DatagramServerEvent.START));
dispatcher(new Event(DatagramServerEvent.STOP));
    dispatcher(new Event(DatagramServerEvent.START));
dispatcher(new Event(DatagramServerEvent.STOP));
  4. To listen to incoming UDP packages, create a parsley messagehandler:
    [MessageHandler]
public function dataReceived(e:DataReceivedEvent):void
{
    logs.add(e.string);
    /**
    * you can also use:
    * e.ip     : returns the IP of the sender
    * e.data     : returns the packet as a bytearray
    * e.xml     : returns the packet as xml
    */
}
    [MessageHandler]
public function dataReceived(e:DataReceivedEvent):void
{
    logs.add(e.string);
    /**
    * you can also use:
    * e.ip     : returns the IP of the sender
    * e.data     : returns the packet as a bytearray
    * e.xml     : returns the packet as xml
    */
}

How to test your Datagram Listener

You can use Netcat to send udp packages. On a mac:

nc -u your.ip.address port
nc -u your.ip.address port

Example

Check out: https://github.com/mere/DatagramServerExample

Screen shot 2011 06 30 at 10.31.04 Flex Datagram Server

Screen shot 2011 06 30 at 10.31.36 Flex Datagram Server

]]> http://zoltanb.co.uk/flex-datagram-server/feed/ 0 Scala + apparat development in Flash Builder http://zoltanb.co.uk/scala-apparat-development-in-flash-builder/?utm_source=rss&utm_medium=rss&utm_campaign=scala-apparat-development-in-flash-builder http://zoltanb.co.uk/scala-apparat-development-in-flash-builder/#comments Tue, 28 Jun 2011 20:47:00 +0000 zoltanb http://zoltanb.co.uk/?p=334 If you want to create scala applications using Joa Ebert’s apparat framework, you can do this straight from Flash Builder with the Scala IDE plugin. The installation process is the same for FDT.

Unfortunately the Scala IDE for Helios is not available via the Eclipse Marketplace, so you have to install it using the [...]]]> If you want to create scala applications using Joa Ebert’s apparat framework, you can do this straight from Flash Builder with the Scala IDE plugin. The installation process is the same for FDT.

Unfortunately the Scala IDE for Helios is not available via the Eclipse Marketplace, so you have to install it using the Update Site.

How to install Scala IDE in Flash Builder

  1. Go to scala-ide update site:

    http://download.scala-ide.org/releases/2.0.0-beta

    Select JDT Weaving for Scala(required for Scala IDE) and Scala IDE for Eclipse
    Screen shot 2011 06 28 at 15.23.48 Scala + apparat development in Flash Builder

  2. Click next, accept t&c, finish, restart FB when prompted
  3. Depending on your existing plugins, you might get a diagnostics popup. Just click ok.
    Screen shot 2011 06 28 at 18.08.27 Scala + apparat development in Flash Builder
  4. For Scala development switch over Scala View:
    go to window>Open Perspective>Other…
    Select Scala:
    Screen shot 2011 06 28 at 20.50.35 Scala + apparat development in Flash Builder
  5. That’s it!
    You should get .scala syntax highlighting, code completion, compile and debug options in this view.
    Screen shot 2011 06 28 at 21.02.42 Scala + apparat development in Flash Builder

 

]]> http://zoltanb.co.uk/scala-apparat-development-in-flash-builder/feed/ 0 How to setup and configure Sonar for Groovy projects http://zoltanb.co.uk/how-to-setup-and-configure-sonar-for-groovy-projects/?utm_source=rss&utm_medium=rss&utm_campaign=how-to-setup-and-configure-sonar-for-groovy-projects http://zoltanb.co.uk/how-to-setup-and-configure-sonar-for-groovy-projects/#comments Tue, 28 Jun 2011 12:15:48 +0000 zoltanb http://zoltanb.co.uk/?p=312 Sonar is an open platform to manage code quality. Sonar can gather data from your Groovy projects and display them on a web interface or straight in SpringSource Toolkit via an eclipse plugin.

1. How to enable analysis of your Groovy projects If your project is not mavenised, you will need to create a [...]]]> Sonar is an open platform to manage code quality. Sonar can gather data from your Groovy projects and display them on a web interface or straight in SpringSource Toolkit via an eclipse plugin.

1. How to enable analysis of your Groovy projects

  1. If your project is not mavenised, you will need to create a pom.xml.
    cd into your project folder and run: 

    mvn org.grails:grails-maven-plugin:1.3.7:create-pom -DgroupId=YOURGROUPID
    mvn org.grails:grails-maven-plugin:1.3.7:create-pom -DgroupId=YOURGROUPID
  2. Edit your pom xml. Add:
     <sourceDirectory>src/main/groovy</sourceDirectory>
 <properties>
    <sonar.language>grvy</sonar.language>
    <sonar.dynamicAnalysis>false</sonar.dynamicAnalysis>
 </properties>
     <sourceDirectory>src/main/groovy</sourceDirectory>
 <properties>
    <sonar.language>grvy</sonar.language>
    <sonar.dynamicAnalysis>false</sonar.dynamicAnalysis>
 </properties>

2. How to add your project to the sonar console

  1. You need to install the Flex plugin to enable analysis of AS3 and flex projects:
    Go to System>Update Center:
    Screen shot 2011 06 24 at 14.36.38 How to setup and configure Sonar for Groovy projects
  2. Under Available plugins find Groovy and click install:
    Screen shot 2011 06 27 at 16.01.05 How to setup and configure Sonar for Groovy projects
  3. Restart sonar: 
    macosx-universal-64/sonar.sh stop
macosx-universal-64/sonar.sh console
..or the linux/windows equivalent...
    macosx-universal-64/sonar.sh stop
macosx-universal-64/sonar.sh console
..or the linux/windows equivalent...
  4. Go to the sonar profiles page.
    If you installed sonar locally, the default url is: 

    http://localhost:9000/profiles/projects/
    http://localhost:9000/profiles/projects/

    If the installation was successful, you should see a ‘Sonar Groovy Way ‘ section:
    Screen shot 2011 06 28 at 13.11.51 How to setup and configure Sonar for Groovy projects

3. How to gather data from your Groovy project and analyse it in Sonar

  1. cd into your project folder. Clean and Install your project into your local maven repo:
    mvn clean install
    mvn clean install
  2. run the sonar analysis:
    mvn sonar:sonar
    mvn sonar:sonar
  3. Go to your Sonar profile page. For local installs the default url is: http://localhost:9000/profiles
  4. Click on +Create or ‘Sonar Groovy Way‘ and  add your project to the associated projects:groovyprofile How to setup and configure Sonar for Groovy projects
  5. Go back to your sonar web interface (http://localhost:9000) –  the reports on all gathered data should be displayed.

4. How to install and configure the Sonar Eclipse Plugin in STS

  1. Go to Help>Install New software
    Enter the Sonar Update Site: 

    http://dist.sonar-ide.codehaus.org/eclipse/
    http://dist.sonar-ide.codehaus.org/eclipse/

    Screen shot 2011 06 27 at 17.39.37 How to setup and configure Sonar for Groovy projects

  2. Click Next, Accept T&C, Reboot STS when prompted
  3. go to preferences, type in sonar to the filter:
    Screen shot 2011 06 27 at 11.49.36 How to setup and configure Sonar for Groovy projectsIf you are running sonar on http://localhost:9000/ , then you don’t need to do anything.
    If your are running on a different host:port, click on add and and add a new Sonar Server URL.
  4. To verify the connection you can click on edit and click on Test Connection. In the console you should get: 
    [INFO] Connected to Sonar 2.8
    [INFO] Connected to Sonar 2.8
  5. Right click on your project in the Project explorer, go to Configure > Associate with Sonar:
    Screen shot 2011 06 27 at 17.54.42 How to setup and configure Sonar for Groovy projects
  6. 1. Select your Sonar server from the dropdown list
    2. Copy the GroupID and ArtifactID from your pom.xml
    3. Click on Find on ServerScreen shot 2011 06 27 at 18.01.32 How to setup and configure Sonar for Groovy projects
  7. Switch over to Sonar View:
    Screen shot 2011 06 28 at 13.22.43 How to setup and configure Sonar for Groovy projectsScreen shot 2011 06 28 at 13.24.04 How to setup and configure Sonar for Groovy projects
  8. If the sonar analysis was successful, your Measures, Web, Hotspots and Violations panel will be populated with the gathered data.

 

]]> http://zoltanb.co.uk/how-to-setup-and-configure-sonar-for-groovy-projects/feed/ 4 Flash/Flex Development on Scientific Linux http://zoltanb.co.uk/flash-flex-development-on-scientific-linux/?utm_source=rss&utm_medium=rss&utm_campaign=flash-flex-development-on-scientific-linux http://zoltanb.co.uk/flash-flex-development-on-scientific-linux/#comments Fri, 24 Jun 2011 20:40:30 +0000 zoltanb http://zoltanb.co.uk/?p=292 If you want to use a linux box for testing/developing AS3/Flex apps, you are likely to come across some obstacles:

Flash Builder is no longer supported on Linux. The last available version is FB3.
(ok, there’s the barely legal FB4Linux, too….) Air Development is no longer supported on Linux. Air 2.7 [...]]]> If you want to use a linux box for testing/developing AS3/Flex apps, you are likely to come across some obstacles:

That said, it is possible to set up a stable development environment on Linux.
FDT is still supported on Linux and the Flex 4.5 SDK + Air 2.6 SDK can be tweaked to work on linux.
Check out the following 2 articles about setting up the SDKs and the dev tools on Scientific Linux:

]]> http://zoltanb.co.uk/flash-flex-development-on-scientific-linux/feed/ 0