var op1:Boolean = true;
var op2:int = 2;
var op3:Object = null;

var result_1or2:Object = op1 || op2;
trace(result12); // output: true
var result_1and2:Object = op1 && op2;
trace(result); // output: 2
var result_3or2:Object = op3 || op2;
trace(result); // output: 2
var result_3and2:Object = op3 && op2;
trace(result); // output: null

So, if you decide to execute write something really terse, like

var result:Boolean = validateSomething() && validateSomethingElse();

and expect both functions to run, then you might be in for a surprise. If the first operand evaluates to false (false, null, 0 or "") then the second part is not executed.

The same caveat applies to the shorthand operator a &&= b(), which basically expands to a = a && b(). So if a is “falsy”, b() is not executed. So be careful with logical operators and don’t abuse them or they’ll bite back!

You have been warned.

Because I am constantly installing/uninstalling/reinstalling prerelease versions of Flash Professional CS5, I frequently run into this problem. So I have to install the “real deal” debug version of Flash Player after each Flash Pro reinstall, which I know is not the recommended approach but it’s the fastest one. Today I wanted to try Flash Player 10.1 beta 3 and I got an error that said:

The version of Adobe Flash Player ActiveX that you are trying to install is not the most current version.

LOL, WUT?

After countless tries and retries and googling and hair pulling I found the solution and it lies within TechNotes kb402435 and tn_14157. What you have to do is download the Adobe Flash Player uninstaller and run

uninstall_flash_player.exe /clean

from the command line.

Then all you have to do is install the desired version of Flash Player and you’re good to go!

Internet

Name: Orange Internet
APN: internet
APN type: default

MMS

Name: Orange MMS
APN: mms
MMSC: http://wap.mms.orange.ro:8002
MMS proxy: 62.217.247.252
MMS port: 8799
APN type: mms

Assume you want to add localization to a MenuBar component and the data provider is an Object. Let’s assume, for the sake of this example, that the Object that will act as dataProvider for the MenuBar component looks like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

private var menu:Array = [
    { label: "FILE", children: [
        { label: "NEW" },
        { label: "OPEN" },
        { label: "IMPORT", children: [
            { label: "PROJECT" },
            { label: "OTHER" } ] },
        { type: "separator" },
        { label: "EXIT" } ] },
    { label: "EDIT", children: [
        { label: "UNDO" },
        { label: "REDO" },
        { type: "separator" },
        { label: "CUT" },
        { label: "COPY" },
        { label: "PASTE" } ] },
    { label: "PROJECT", children: [
        { label: "BUILD" },
        { label: "CLEAN" },
        { type: "separator" },
        { label: "EXPORT" } ] },
    { label: "LANGUAGE", children: [
        { label: "ENGLISH", children: [
            { label: "AMERICAN" },
            { label: "BRITISH" } ] },
        { label: "ROMANIAN" } ] }
];

For this object, the labels are actually resource names in the resource bundle. When the application is initialized, the init() function kicks in (defined below) and the MenuBar‘s dataProvider is set to the return value of the translateItems() function:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

private function init():void {
    mainMenu.dataProvider = translateItems(menu);
}
 
private function translateItems(menuItems:Array):Array {
    for (var p:String in menuItems) {
        var menuItem:ObjectProxy = menuItems[p] = new ObjectProxy(menuItems[p]);
        menuItem.labelLocale = menuItem.label;
        (function(item:ObjectProxy):void {
            BindingUtils.bindSetter(function(value:Object):void {
                item.label = value as String;
            }, ResourceManager.getInstance(), {
                name: "getString",
                getter: function(resMan:IResourceManager):String {
                    return resMan.getString(BUNDLE_NAME, item.labelLocale);
                }
            });
        })(menuItem);
        if (menuItem.children) {
            menuItem.children = translateItems(menuItem.children);
        }
    }
    return menuItems;
}

Now let’s see what the magic behind the translateItems() function is.

7

        var menuItem:ObjectProxy = menuItems[p] = new ObjectProxy(menuItems[p]);

First of all, each Object in the menu Array must be converted to an ObjectProxy. This is necessary because for the localization to work (that is, for the menu labels to change), we need to be able to track changes made to each Object in the data provider. When a change is made to an object managed by a proxy, the dataProvider is notified and the label is updated.

8

        menuItem.labelLocale = menuItem.label;

After we set the ObjectProxy, we save the current label property for later use in the labelLocale property. We’ll need the labelLocale property to fetch the resource name when the locale changes.

9
10
11
12
13
14
15
16
17
18

        (function(item:ObjectProxy):void {
            BindingUtils.bindSetter(function(value:Object):void {
                item.label = value as String;
            }, ResourceManager.getInstance(), {
                name: "getString",
                getter: function(resMan:IResourceManager):String {
                    return resMan.getString(BUNDLE_NAME, item.labelLocale);
                }
            });
        })(menuItem);

The next part is a little tricky. This section of code is wrapped inside an anonymous function that is executed immediately, with the current menuItem passed as its parameter. This is important because we need to keep a local reference to this menuItem for use in the binding functions.
Next up, is the BindingUtils utility class which provides two static methods for performing data binding from ActionScript. Here, I used the bindSetter method, which has these parameters:

• setter:Function — Setter method to invoke with an argument of the current value of chain when that value changes.
• host:Object — The host of the property. See the bindProperty() method for more information.
• chain:Object — The name of the property, or property chain. See the bindProperty() method for more information.
• commitOnly:Boolean (default = false) — Set to true if the handler should be called only on committing change events. See the bindProperty() method for more information.

I won’t go into much detail about each of these parameters, as I think the docs do a pretty good job explaining what each of them does. You can find more information here. What is important in this brief example is the chain parameter, to which I have passed an Object in the form: { name: property name, getter: function(host) { return something; } }. This Object must contain the name of, and a getter function for, a public bindable property of the host object. In our case, the host is the ResourceManager instance and the bindable property is the getString() function.

19
20
21

        if (menuItem.children) {
            menuItem.children = translateItems(menuItem.children);
        }

The last bit is self explanatory – if the current menu item has any child submenus, we apply the translateItems() function recursively.

Enough talk! Now let’s see this code in action!
[kml_flashembed movie="http://blogu.lu/mrm/files/2009/01/bindingdemo.swf" width="400" height="180" /]
And the Flex Builder Project source code

• event The control specified by the source property must dispatch progress and completed events. The ProgressBar control uses these events to update its status. The ProgressBar control only updates if the value of the source property extends the EventDispatcher class
• polled The source property must specify an object that exposes bytesLoaded and bytesTotal properties. The ProgressBar control calls these methods to update its status.
• manual You manually update the ProgressBar status. In this mode you specify the maximum and minimum properties and use the setProgress() property method to specify the status. This mode is often used when the indeterminate property is true

In ActionScript, you can use use the following constants to set this property: ProgressBarMode.EVENT, ProgressBarMode.POLLED, and ProgressBarMode.MANUAL.

At first I used the manual mode, but I soon abandoned it because It didn’t feel right. I quickly dismissed the polled method because basically I had to do the same thing as manual mode, only I had to update an object with bytesLoaded and bytesTotal properties and I also felt that it wasn’t responsive enough.

But it did give me an idea: Hey, why don’t I build my own data provider type for the ProgressBar component! And this is what I came up with – The Progress class:

package mrm
{
    import flash.events.EventDispatcher;
    import flash.events.ProgressEvent;
 
    public class Progress extends EventDispatcher
    {
        private var _bytesLoaded:Number
        private var _bytesTotal:Number;
 
        public function Progress(bytesLoaded:Number=0, bytesTotal:Number=0)
        {
            setValues(bytesLoaded, bytesTotal);
        }
 
        public function set bytesLoaded(value:Number):void {
            _bytesLoaded = value;
            dispatch();
        }
 
        public function get bytesLoaded():Number {
            return _bytesLoaded;
        }
 
        public function set bytesTotal(value:Number):void {
            _bytesTotal = value;
            dispatch();
        }
 
        public function get bytesTotal():Number {
            return _bytesTotal;
        }
 
        public function setValues(bytesLoaded:Number, bytesTotal:Number):void {
            _bytesLoaded = bytesLoaded;
            _bytesTotal = bytesTotal;
            dispatch();
        }
 
        private function dispatch():void {
            dispatchEvent(new ProgressEvent(ProgressEvent.PROGRESS, false, false, _bytesLoaded, _bytesTotal));
        }
 
        public function clear():void {
            setValues(0, 0);
        }
    }
}

I’d say the class methods are pretty easy to comprehend, so I won’t go into much detail about them. Because the class extends EventDispatcher, it can dispatch events so it can be used as source for a ProgressBar component using the default event mode. Basically, whenever you change one of its properties (bytesLoaded or bytesTotal), it fires a ProgressEvent.

This way, you can have one Progress object used as source for multiple ProgressBars and not even care about them! You just set the source property and update the progress on the object and Flex does the rest for you. Neat, huh?

Here’s a demo:

[kml_flashembed movie="http://blogu.lu/mrm/files/2009/01/progressdemo.swf" width="230" height="70" /]

And the Flex Builder Project source code

Now here’s the same project, but this time using Flex 4 SDK (codename “Gumbo”):

[kml_flashembed movie="http://blogu.lu/mrm/files/2009/01/progressdemogumbo.swf" width="230" height="70" /]

And the Flex Builder Project source code

It works with Gumbo too!

So I had a few days off and I decided to build myself a little Adobe AIR app to help me out with my little problem. So without further ado, here’s the awesomeness of an application which I’ve dubbed “mrm’s TV Guide”:

mrm's TV Guide in Action

Pretty Cool™, ain’t it? Yeah, I know. Now awarded with Softpedia’s “100% Clean” award!

So here’s how it works.

The application gets its data from TV Calendar, a really neat site that’s been around for a few years now. If I’d only find out about it sooner! TV Calendar also gets its data from epguides.com and TVRage.Com, so it’s not 100% accurate or up-to-date.

But my application doesn’t actually download anything from TV Calendar. Using the power of YQL (Yahoo Query Language) and XPath, web scraping has never beed easier. My application gets its data from Yahoo’s cache with an easy to use SQL-like SELECT syntax and a bit of XPath to filter just the relevant HTML tags. The result is return in JSON format, which is decoded to ActionScript objects using Mike Chambers’ as3corelib.

Image 1 - Update button

When you press the “Update” button, it’ll fetch all the shows airing this month, the shows that have aired in the past 4 months and the shows that will be airing in the upcoming 2 months (currently these numbers are hardcoded, but you will be able to change them in a future version). Then, for each day in those 7 months, it will load the corresponding TV Calendar page and extract the episode title, episode description etc for each episode it has found. The progress is reported using a simple progress bar as you can see in the image below.

As the information is loaded, the calendar is updated with the episodes from the shows chosen based on my filters. We’ll get to filters in a bit. When you first run the application there won’t be any filters, so all the episode dates will be highlighted in the calendar. The episodes for the current selected date will be displayed in on the right. If you hover your mouse over an episode, the summary will be displayed in a tooltip. Handy!

Image 2 - Progress bar and information panel

After all the data has been retrieved, the information is saved locally in an SQLite database so you can check your favourite shows offline.

Now, I was saying something about those filters… At this point, if you have no filters set up (that is, no show is checked in the “Filters” window), the “Filters” window will pop up where you can select the shows you would like to be displayed in the calendar. The “Select All” and “Deselect All” buttons are conveniently located at the top of the window for easy access. This window also accepts keyboard input, so for example if you press “H” the list will scroll to the first show matching the first letter. In this case, “Heroes”.

Image 3 - Filters window

After you select your preferred shows, the calendar will be updated to reflect your choices. Here’s what I’ll be watching on the 20th of January 2009.

Image 4 - Finally

… And that’s a wrap.

PS: Don’t click the “Clear” button, unless of course you want to remove all shows and episodes data from the database .

UPDATE: You can now grab it from the Adobe Marketplace. SWEET!!

UPDATE 2: “100% CLEAN” award granted by Softpedia. SWEET!!

Well, because I always said blogs are a waste of time. But not all of them, just those “online diary” type of blogs. You know what I’m talking about, those “here’s what I did this morning”, “this is a picture of the sandwich I just ate; it was delicious”, “I’m so sad, please comfort me” etc etc.

This is not going to be one of those blogs. This is going to be one of them tecknical blogs. I’ll mostly be writing about Flex, ActionScript, JavaScript, web technologies and the sorts. It’s all so exciting and I’m really looking forward to it!