FlexFusion

A coworker of mine has created a drag ‘n’ drop component that allows dragging between 2 items (base component is a ListBase, so it allows for greater flexibility of the list dataProviders). Today I needed to enable or disable the list components, but all it could do was disable the entire component. If the component was completely disabled, the user would not be able to scroll the list and see all of the items in it. We had decided that rather than just disabling everything, that we would just disable drag ‘n’ drop between the lists and remove the directional arrows that are also part of the component (left arrow pushes items from right to left, and vice versa for the right arrow).

I decided to override the enabled property of the component that this component was extending. Within this enabled, I was checking for initialization, then disabling drag for both lists and making the arrows invisible; however, once I compiled and ran the code I received a

RangeError: Error #2006: The supplied index is out of bounds.
at flash.display::DisplayObjectContainer/getChildAt()

I decided to try running debugger to see if it would give me the line of code that was throwing the error, but to no avail. I had tried gradually removing all of the items that I had added, but nothing worked. I even cleaned out my project and recompiled everything, but still no luck. It wasn’t until I undid everything I had added that it worked (as it should), but when I was testing, I had removed (almost) everything that I had added. The only thing I had not done was delete some image variables that I had moved from a private function to private variables at the top of the page, so I could access them within my “enabled” function. I put all of my code back in again and did not instantiate the image variables when I declared them, but rather in the creationComplete function, and no error.

After finally narrowing it down to the image instantiation, I tried instantiating the images on declaration and in the creationComplete function and, again, no error was thrown, so apparently it has something to do with trying to reference an image variable that is instantiated before creationComplete. I guess this goes hand-in-hand with “only instantiate your variables when you are going to use them”. Now that’s figured out…back to work

Whenever I’m coding I like things just so I’m pretty sure it’s a very mild case of OCD as it really does bug me when things are different. Not so much that I get any kind of other disorders from this, but enough that I want to go in and make my changes/fixes to put in the way I like it. In order to help me through this, I have started writing many regular expressions that will fix the code, and hopefully be quicker than manually editing the pages.

My company has come up with a set of standards that we’re trying to follow when writing our code, so, if anyone else joins the company and edits/creates new code they can just follow the guidelines we already have set up. In order to keep track of all of the regular expressions I’m writing (and so others can use them if they wish), I’ve created a Regular Expressions page that I’ll periodically be updating with new regular expressions each time I use them. I know they’re useful to me, so I’m sure that at least one other person will have a use for them too :).

Enjoy!

Up until a couple of months ago, I had not really used the regular expression Find/Replace in Eclipse. I’d read several blog posts about it, but hadn’t really played around with it much. This all changed after I was, once again, manually replacing some items in Eclipse (setting multiple properties of an object to those of an item that had been passed in to the function). About halfway through, I figured I would try using regular expressions to automate the task a bit. From this point on, just about every find/replace I did was using a regular expression.

All of these examples are for ActionScript, by the way, but could easily be converted to be useful in any other programming language:

For example: (Make sure to remove the double quotes from these examples also.)

I prefer curly braces in my functions to be on the same line as the actual function definition rather than on the next line so I wrote this

Find: "\s+\{"
Replace: " {"

This will take something like:

function testing():void
{

and change it to

function testing():void {

Not a huge deal to most, but my code OCD and our in-house coding standards like it on the same line. If I don’t have to manually do this, it certainly makes things easier.

Now this isn’t that complex and in most other IDE’s could be handled pretty easily. However, try doing something like this next example without using some kind of regular expression

(This example is pretty long, so make sure to remove the carriage return before the “return this” statement when pasting into your Replace field)

Find: "public var (\w+):( )?(\w+)( ?= ?[^;]+)?;(([^\t])+(\t)(\t+)?(\s+)?)”
Replace: “private var _$1:$3$4;$5$5public function get $1():$3 {$5$7
return this._$1;$5}$5$5 public function set $1( value:$3 ):void {$5$7this._$1 = value;$5}$5$5″

This example will take something like:

public var companyId:uint;
public var companyName:String = "";
public var isLegit:Boolean = false;

Will be converted to multiple accessors (i.e.setters and getters). I won’t show all 3, but this is what the first one would be converted to:

private var _companyId:uint;

public function get companyId():uint {
    return this._companyId;
}

public function set companyId( value:uint ):void {
    this._companyId = value;
}

That has saved me so much coding time.

Anyway, I wish I had started using these earlier as I’m now setting up a nice little library of scripts that I can run whenever I need to modify my code. I’m sure someone has set up a site with a library of these things, but these are just a few that I’ve set up.

And one very important thing to remember with these:

Make sure to check the Regular Expressions checkbox in Find/Replace or it will probably never find anything

Back in January I saw Brian Kotek’s post about returning typed structs to Flex. When I first read this article, I wasn’t sure how useful it was (I guess I was getting a little confused with the addition of Transfer and AOP in the article, and figured it was just something for that framework). A few weeks later I came across another article about the same idea, and something clicked and I realized just how brilliant this was.

Previously in order to return a typed object to Flex from Coldfusion, you would usually set up aliasing within both your ActionScript object and your CFC

AS:
[RemoteClass(alias="com.mySite.UserVO")]
public class UserVO {

CFC:
<cfcomponent alias=”com.mySite.UserVO”>

Then, when you transfer objects back and forth between ActionScript and ColdFusion, they are automagically converted to that specific type (along with all of the methods that go along with them). The only bad thing with this method, is that in order to transfer the CFC VO back from ColdFusion to ActionScript, you have to create that object in ColdFusion. Now this doesn’t create much overhead for one object, but if you query the database and return those query rows as separate objects, you have to createObject on each query row, which is an insane hog of memory and server resources. Plus, ActionScript cannot use any of the extra methods that CF is returning, so really anything other than the CFC object’s properties are just extraneous information.

Using the newly discovered technique, you can return the CFC object’s properties as structs rather than having to use createobject each time. You create the properties of the CFC as keys in the struct, such as

myStruct['firstName'] = “John”;
mystruct['lastName'] = “Doe”;

All that’s needed is to set one extra key in the struct e.g. myStruct['__type__'] = “com.mySite.UserVO” When the items are returned to ActionScript any struct that has __type__ as a key is automagically converted to an object of that type. What’s even more brilliant is if any items within the struct also have an __type__ (e.g. if the user has a company, and that company is returned as a company struct using the same __type__ methodology) then they also get converted to that typed object, so some sort of recursion is happening also.

Now for the sad news (on my part at least). After spending 3 days trying to get this to work on CFMX7 (I had read in a couple of different places that this supposedly would work in CFMX7), I finally found that it apparently only works via LiveCycle or CF8 (which has Flex Data Services Express, I think). After trying everything imaginable, I ended up just having to write a function to convert the returned data to objects. Now I’m hoping that my company will upgrade to CF8, but I don’t think that will be happening. It looks more likely to be Java + WebORB. I’m not sure if this same capability is possible with WebORB, but I’m hoping it does. Certainly is a nice feature to have. Anyway, hopefully this post will be informative for those with CF8 (or LiveCycle) and save those others with CFMX7 from going down the same path as me for 3 days

The original post with a little more details is on the CFTalk Mailing List

Lately there has been some strangeness with the Adobe livedocs for Flex. Every now and then the page will just constantly reload in a never ending cycle. This seems to only be happening on on the Flex 3 livedocs.

Update:
Looks like the Flex Doc Team will be fixing the problem soon and will get it working as it once was. They even posted a link to a downloadable version of them (It’s 67MB so be prepared for a small wait). I prefer to use this method for access any documentation rather than going online to access them mainly due to the fact if I’m out and about and don’t have an internet connection (I know, not very common any longer, but still…), then I still have access to the documentation. Plus, the livedocs weren’t exactly speedy to begin with, as they had to load the javascript and frames and all of the other fun they’ve put in there. The local version is nice and quick to open. Hopefully I’ll get a chance soon to write an AIR version using the Flex documentation (something like CFDocs which is very quick and has a nice interface)

Well, sort of…

ColdFusion has a very nice “isDate()” function that allows you to pass in a variety of formats, and check whether the passed in value is a date. I had been searching for something similar in Flex, but had very little success until I started playing around with different functions myself.

I had been writing a custom controller for a datagrid which allowed passing in data from an object or table and displaying it in an editable datagrid. The problem I ran into was that depending on the data returned, trying to set those values back to the object that I was using, caused me some issues (such as trying to set a date stored in a text field, back to the object as a “new Date” value). After trying many different kinds of things, I found that the parse function of date works very nicely.

You can do something like

    if ( Date.parse( myDateField.text ) ) {
        myObj.recordingDate = Date.parse( myDateField.text );
    }

If you pass it a value that is not a valid date, the statement returns false.

Anyway, I had been searching around for a while trying to find something that would allow me to check for isDate and this fit the bill nicely. It also allows you to pass in quite a varied type of date formatting and it still recognizes it. Very powerful feature, it seems.

I have started to copy over some of my blog posts from ColdFusion Community in order to keep everything that I’m typing localized in one spot.  Hopefully this will save me from having to search 2 places when I’m trying to figure out an answer to something I’ve already solved previously.  So, if you have a feeling of Déjà vu, it may be you were enjoying my nonsense before.

Yay me! The guys over at pxl designs ran a contest today that gave away 3 copies of their excellent Flex 2 certification practice exam, Attest, for free to anyone who answered 3 flex questions correctly. Apparently they were only medium difficulty as I was able to answer them all correctly I had previously only downloaded the trial version and found the questions to be well written, difficult enough to make you think (and question whether you are selecting the correct answer because of the excellent potential alternate answers), with excellent, concise answers explaining why a certain answer was correct over another.

A co-worker has been nudging me to take the Flex certification exam, for nothing other than proof that I know what I’m talking about, or that I can flash my Certification when I’m giving a demonstration to my team He already passed his exam with no exam studying, just one year of intense self-study-by-doing. I had been putting off taking the exam month after month, saying to myself “once I download the practice exam and go through it a few times, I’ll take the test”. Well, now I’ve got the practice exam and have no excuses for not taking the certification.

I’ll have to take the practice tests a few times, just to make sure I’ve got everything, and read up on some of the documentation over at livedocs, but after that, I’m certification bound

This should finish up my technical background and can get on with the good stuff.

After proving that I could actually program given something interesting to do, the web development company promptly offered me a position. It consisted of one man who had been working for himself for several years. I worked on all kinds of projects there, large and small, and was allowed to develop my skills in other ventures, not just ColdFusion. However after several years, I felt myself stagnating and not being challenged enough, so, once again, after getting bored, I decided I should look for something new. I had been looking into going towards something of a more OOP design, and needed somewhere that would allow someone with a self-taught CF background, to begin somewhat a-new but bringing all of the coding background along for the ride.

Enter my current company and Adobe Flex. I had no idea (before beginning the position) how much programming and OOP was involved in Flex and ActionScript. I thought that it was all just Flash (which I never thought of as anything more than a design program). After playing with Flex and ActionScript for a couple of weeks, I’ve got a whole new appreciation for it.  It has challenged me more than anything I’ve done so far, and forces me to rethink my previous procedural style of thinking every day. There always seems to be something that can be re-written better or more logically, or encapsulated to save time later. And on that point, I think this article just about sums up me, my programming, and a good portion of why I do what I do The Nerd Handbook (better than I could explain myself )

Anyway, if anyone actually made it this far, thanks for reading and hopefully I’ll have the time and patience (and the code) to post something helpful.

Yeah, that didn’t take long, did it.  I was browsing around trying to figure out how a spam bot managed to find my site (I only managed to get it up and running myself recently), and checked out Google, when lo-and-behold, I come across FlexAbility; however, not my FlexAbility, someone else’s.  It was such a good name that someone else thought of it first.  So, rather than confuse everyone when my site becomes big and famous, I thought that I would change the name.  As I’m the only one reading this (oh yes, and the spammers), I don’t think I have to worry about someone confusing my site.  This seems like a good compromise for a name though, so I think I’ll stick with it this time (and no other sites came up with my initial search so phpt!)

Welcome to FlexFusion!