Studying Parsley Framework

I've been building this pretty big application at work, its the main application we use to manage all of our internal accounts. The application has been in construction for 2 years now, its all done in Flex and Java and on the Flex side of things, I've been using Cairngorm as my application framework. However as we've being adding different parts (some are not often used) the application has gotten bigger and I've been looking to break things up into modules to help manage everything. Both from a run-time perspective (memory consumption) and from a development perspective (maintenance).

Of course using modules got me to thinking about how everything would work with Cairngorm, so I started doing some research and came across the Parsley application framework. Parsley is an Inversion-of-control (IOC) framework much like Spring is in the Java programming world. Meaning you have a config file that describes all the objects you want framework to manage for you and then it injects the appropriate object(s) into other object(s) for you, so no one object knows about the other. This makes your code loosely coupled, easier to update and maintain and finally, easy to unit test.

The framework appears to be well designed and like I just mentioned, reminds me of Spring, so the concepts are easy to understand. Also, it seems that parts of the latest Cairngorm (version 3.0) can be used along with it, so this will help as well. And the biggest point is that it has build in support for working with Flex modules, so I am eager to use it.

I'll be writting some blog posts of my experiences with Parsley, so look for them soon!


Installing Flash Builder Burrito as a plug-in

If you are like me and develop in Java and Flex all day long and Eclipse is your IDE, then most likely you will want to install Flash Builder as a plug-in within Eclipse. Well I just installed the beta version of Flash Builder codenamed "Burrito" and noticed it was installed as a standalone application. After a quick Google search I found the following article, which allowed me to install Burrito as a plug-in within Eclipse in a matter of seconds.

So here is what I did exactly (cause I upgraded my Eclipse version as well):
  1. Uninstall previous version of Flash Builder 4
  2. Deleted my eclipse installation (d:\opt\eclipse)
  3. Downloaded and installed latest version of Eclipse
  4. Installed Flash Player "Burrito" and then followed the instructions here


Flash Player 10.2 beta is out

The beta version of the next iteration of the Flash Player, version 10.2 is now available for download on Adobe Labs. The biggest new feature is related to using hardware acceleration to improve performance. So if you do lots of video/animation using the Flash Player, what are you waiting for? go over to the labs website and get it!

Here is a another website with some pretty good info on this release.

Flash one of big selling points for Android

Just saw a commercial for a Videotron Nexus One (Videotron is a cell phone provider here in Montreal) and of the main points was the fact that it ran Flash. Love it. Well how else will I see ads, watch YouTube videos, view sport highlights on ESPN.com and TSN.ca and see news articles on CNN.com? Flash is a big part of the web experience.


Flex, HTML/JS Pros and Cons from a developers point-of-view

Having worked these last couple of months on a pure HTML/JS project at work, I'd thought I'd share a few pros and cons and random notes of working in both Flex and HTML/JS programming languages.

I'm not here to bash one or the other, enough people do that, just some thoughts for you guys to draw your own conclusions. Also this is from a developer stand-point, building web applications, not a web site with simple text and images...but an app, where you load, create and update data.

Note: Was using jQuery 1.4.2 for the javascript portion.

  • AS3 is very similar to the Java programming language
  • Development, build and unit testing is almost exactly like in Java
  • Great IDE (Flash Builder) provides an easy and fast way to code in MXML/AS3
  • Online documentation is excellent and thus helps newbies learn the language
  • SDK is open source, so a developer can learn and extend the base classes himself if need be
  • In Flex, you manipulate the data directly and send it back to the server for processing, no need to worry about re-drawning the UI
  • No cross-browser, cross-OS issues
  • Object layout is flexible and easy to do
  • With its a default theme, the app can look good and professional
  • Can create re-usable controls/classes
  • Takes time for new developers to realize that the app is one entity that just sends data to/from the server and not a collection of pages
  • Compile times can be long
  • Developer can get into the bad habit of loading lots of static data (countries, provinces, etc..) up-front, that will never be used, thus causing an unnecessary long load time for the app
  • You application SWF can be de-compiled
  • If end user can to copy data from multiple controls (or from DataGrid) to paste into another app (say an email), you pretty much have to code this, where its a default functionality with an HTML page since 1975
  • Dealing with timezones can be a chore (Flex loves to deal with it on its own)

  • Faster load times
  • The development cycle is quicker: update the page and reload in the browser
  • In some cases you can have a single page and use Ajax calls to get the data you need, no need for a page refresh
  • End users have been working with browsers for a long time now so the default copy'n'paste functionality is very useful to them and almost second nature
  • Cross-browser issues still exist!
  • IDE support not great for JS third-party frameworks like jQuery
  • In my case, no documentation existing for how to built a jQuery widget, had to find an online tutorial after searching. So no real API doc.
  • Object layout is a pain - tables still the way to go - and inconsistent across browsers sometimes
  • As a developer you need some design skills to make the app look good.
  • Handling the proper z-order of objects can be a chore
  • Reading someone's jQuery plugin/widget can be interesting (enough braces and commas for you?)
  • The browser BACK button can take your app out of proper state
A final thought...I like working in both technologies, I love to learn new things and working with jQuery has made working with data in JavaScript a heck of allot easier that it used to be 10 years ago. But I still look at it this way, if you want to build something people are going to read, you use HTML/CSS/JS. If you want to build an application, you use Flex.


New Firefox 4 beta 7 is really fast

I just downloaded and installed the latest Firefox 4 beta 7 and man it is fast! The browser loads in an instant, not like beta 6 that took a minute to initialize and the pages come up in a flash! - couldn't avoid the pun :) There are also minor UI tweaks that are easy to notice.

You download it here.


Great prez about the future of Flex (from MAX 2010)

Just saw Deepa Subramaniam's MAX 2010 presentation on the future of Flex and it is cool! If you are doing Flex development or are planning on doing so for the first time anytime soon, then I recommend you view her prez. She begins by talking about Hero, the latest Flex version currently being worked and then to talk about the future of Flex and the Flash platform and my favorite part was "Falcon"; the complete re-write of the Flex compiler. With "Falcon", we will be able to keep the "auto-compile" feature in Eclipse ON for good and not worry about slow downs while working on projects. But don't take my word for it...watch the prez for yourself!

So I guess Flash is popular afterall

With all the negative comments Flash has been getting in the last year, especially since the Steve Jobs essay back in April, it is nice to see that Skyfire, an iOS application built to convert Flash content to HTML5 has sold out 1 day after its initial release. Basically the Skyfire servers have been overloaded because too many users were viewing Flash content! Well time to get more servers eh?! :)

Skyfire sells for $2.99 on the app store.


Built my first AIR app for iPhone

Well this past week I got my first ever smartphone, namely an Apple iPhone 4. It wasn't my first choice, I would have preferred a phone running Android, but my carrier had no such phones available...until this week of course (got to love how that works eh?).

Needless to say, after getting familiar with this iPhone, I wanted to see if I could build an app for it and after some research I found out there are several ways to do this:
  1. use XCode
  2. use HTML/JS/CSS
  3. use AS3/Flash
The first method described above is what is used in 98% of cases. You need a Mac and must have downloaded the XCode development environment and you can build an iPhone app (actually any iOS app...so it can run on iPhone/iPad/iPod) in the Objective C language.

Using the second method, you build a web application using traditional HTML/JS/CSS technologies and then compile them into a native iPhone app. There is a tool called Titanium Developer that I found that allows you to do this.

The third and final way to build an iPhone app is to use the Adobe Packager for iPhone. This little piece of technology if you remember caused a big stir back in April 2010 - cause Apple end-up changing its developer agreement and basically did not allow any third party tools, such as this one to compile any code for the iOS. Well I guess people complained and on Sept 9th, 2010, Apple changed their agreement once again, this time allowing such tools to be used. So basically I download it and build a very simple temperature conversion app (Fahrenheit to Celsius).

The Adobe Packager for iPhone allows you to take a SWF file an converted it to a native iPhone application. You can create your SWF file either by using the Flash CS5 authoring tool or by creating an AS3 project using the AIR 2.0.1 SDK in Flash Builder. In my case I built an AS3 project using Flash Builder and once the SWF was generated, I then used the iPhone packager to generate an IPA file. Then this IPA file is imported into iTunes so you can install (sync) the app onto the iPhone itself.

So its pretty cool to create your first iPhone app using AS3 and see it running. But there is a caveat. As I mentioned before, within Flash Builder you have to create an AS3 project to build the app. You can't create a regular Flex project that uses mx:Application or mx:WindowedApplication as its root class. You have to create a simple HelloWorld.as class that extends Sprite. So you can't use any of the regular controls such as mx:Label or mx:Button. Within an AS3 project you can only use the flash.text.TextField class and use that as a label, textbox and as a button where needed. So building an app in this way can be very time consuming to say the least.

Assuming that Apple doesn't change its stance once again, I'm pretty sure Adobe will be improve how we can build AIR apps for the iPhone in the very near future.

Important Note: In order to develop an app for the iPhone you first much purchase an iPhone Developer Certificate and this costs $99/year. Or you can jailbreak your iPhone :)


Setting focus on a Flex app after its loaded

Every notice that after a Flex application is loaded by the browser that it doesn't have focus? So if your Flex application has a login screen, you actually have to grab the mouse and click somewhere on the Flex app for it to gain focus and for you to start typing. Well here is a quick and simple example of how to solve this problem on Firefox and IE. Doesn't work on Chrome and Safari...ah those bloody browsers again!

AIR using "Hero" beta running on Android video

Need I say more...great video that demos a simple AIR app running on Android 2.2. This is a beta version of AIR, which was built using a beta version of the next Flex SDK, codenamed "Hero". The presenter also goes thru most of the code, so this is a great peak into the future of Flex/AIR development for Android phones.


Ottawa Mobile Dev day recap

On Saturday I went to the Mobile Dev Day in Ottawa and here is a brief recap of what I saw.

Windows Phone 7
It was the last prez of the day and for me it was by far the most interesting, so you could say they saved the best for last. The presenter actually demoed a beta version of the phone (due out in Nov of this year) with all of its features and then proceeded to use Visual Studio to create a couple of simple apps and run them in the simulator to demonstrate a simple development cycle. A couple of the sample apps he built used the Azure services (provinded by MS for a monthly fee of $12 - dont quote me on that) to push information to the phone. The development was done in C# so easy for existing Windows developers to pick up on (or even Java developers like me!).

Adobe AIR on Android
Unfortunately there was no demo, just a look at sample code and what extra APIs are provided to AIR for the Android OS. Again this is just a beta, so you can try it out yourself by downloading the add-on here. Although you can access things like the Geolocation API and the Accelerometer, you cannot unfortunately access the phone's contacts or any over local data. Maybe in the next version.

Two words: Objective C. We had two presenters for the iPhone and although the apps looked great (like they always do), I can't say that programming in Objective C turns me on. It looks so archaic. Dealing with pointers? Remembering to free up memory? That's so 15 years ago! There is a glimmer of hope however, you can use PhoneGap to create HTML/JS/CSS apps and deploy them to the iPhone. But you have to have a Mac in either case to do iPhone development. Bah!


HTML/CSS not as intuitive

So you have the root container of your application and want to center it on the screen (regardless of screen resolution). How do you do that in HTML? I use Dreamweaver CS5, so I thought the CSS code hinting would make this easy for me to figure out. "position" property? Nope. There is a "vertical-align" property, but not "horizontal-align" property. "float" property maybe? Nope. How about "display"? Nadda, again.

Finally after some google I found this and it worked:

.rootContainer {
width: 1000px;
position: absolute;
left: 50%;
margin-left: -500px;

So in essence a hack as I see it. The above CSS basically says take your container, makes it 1000 pixels wide, position it as 50% from the left border and then goes back 500 pixels (always half of the container's width) in the left direction. Basically it is doing a mathematical calculation for you. In 2010, shouldn't things be easier for you than this?

The equivalent in Flex you ask? If your container is nested within a Canvas, just set the horizontalCenter like so:


Simplicity. I love it. And in the case that the parent was a non-Canvas type container, then you could use:


Again, simplicity. You know just but looking at either one of those lines what the positioning of child elements is going to be.

The conclusion here is not to say that I don't want to learn, or that I am being lazy. Neither that a simple math calculation is beyond my abilities. It's to say that it is not intuitive! We use the word intuitive when talking about a user using a UI for the first time, how easy it is to figure out how to perform some task; well same goes for developers. In Flex it is easy to figure out how to position elements within a container, in HTML it is not so easily apparent.

Another one is the CSS "float" property. Allows you to push elements to the right or left. But top and/or bottom? No idea, haven't discovered that one yet :)

P.S.: Don't ever use the HTML <center> tag to center elements...it doesn't just center its immediate children, but children of children as well. Don't ask me what algorithm it uses!


Very nice UI design for Windows 7 tablet

Here is an article I came across today about a possible UI for the upcoming Windows 7 tablet. Very nice indeed!


Adobe Ottawa Mobile Developer day

Adobe is holding a developer day on Saturday August 28th, 2010. They will showcase development for mobile devices using Adobe tools for various platforms, including iPhone and Windows Phone. The mini-conference is free, so better sign up as soon as possible here.


Specify formatter on AdvancedDataGridColumn

The AdvancedDataGrid in Flex certain contains way more functionality than the regular DataGrid in Flex. It contains features like multi-column sorting, multi-cell selection, grouped columns and much more.

Once feature I recently discovered is that you can specifier the formatter to be used on a particular AdvancedDataGridColumn. This allows you to quickly format, say monetary values, without the need for creating a label function or using a renderer.

Example is as follows:

[mx:NumberFormatter id="nf" precision="2" rounding="none"/]
[mx:AdvancedDataGrid id="dg2"]
[mx:AdvancedDataGridColumn headerText="Name" dataField="name"/]
[mx:AdvancedDataGridColumn headerText="Balance" dataField="balance" formatter="{nf}"/]

Flash Player 10.1 release notes

Just in case anyone is interested, the Flash Player 10.1 release notes can be found here. Very useful cause it contains a list of all new features and known issues, which might explain some odd behavior for some :)


Firefox 4 is the new Opera

Downloaded Opera 10.54 just now and playing around with it and couldn't notice that the upcoming Firefox 4 is going to look very much like it.

And the reason why I am toying with Opera? Well we are going to be doing some heavy re-work of of one website at work and it will be all done in HTML (using JQuery for coolness). So yes that means I need to test the site as I go along in the most popular browsers: IE, Firefox and Chrome. So then I thought why not Opera as well. Heck I should also try Safari I guess. The worse is IE, cause so many still use version 6.0 (27% of internet users as of 2009). What a pain!

Oh wait, with Flex you just have test once :)


Adobe Flash Player 10.1 and AIR 2.0 released!

Today Adobe released the final versions of Flash Player 10.1 and AIR 2.0.2 for public consumption.

Both are long awaited releases, especially for the Flash Player since it can now be installed on mobile devices and contains several important features (most notably speed improvements) for running on this platform type.

For you developers out there, don’t forget to download the debug version of the latest Flash Player 10.1 from here



Fixing File upload session issue with non IE browsers

I did a lot of learning this passed week about security and how to protect web applications written in HTML and Flex against various attacks. I would like to prepare an entire lecture on the subject but I thought I'd share one particular topic on my blog for now.

The topic I want to talk about is securing file uploads to a server via Flex. If you have added file upload functionality to a Flex application you have probably run into the issue of session information being lost during the upload. And this makes server-side security validation a big issue.

Note: This problem description and solution is using Java application server running BlazeDS or LCDS.

The problem

The problem occurs whenever you perform a file upload using Flex. I'm not going to write all the lines of code here, but basically the following lines of code will do the trick:

var req:URLRequest = new URLRequest();
req.method = URLRequestMethod.POST;
req.data = someData;

var fileReference:FileReference = new FileReference();
fileReference.upload( req, "/phoenix/FileServlet" );

Those lines of code will upload whatever file the user selected to the FileServlet servlet under the phoenix context. Under non-IE browsers this operation will occur in a different browser thread thus causing a different session to be created on the server-side. Thus the application session and upload session are different and are not sharing information. This is basically the root cause of the problem. This means that if you wanted to retrieve the login name of the user currently authenticated, you will get no value. So the following line of code will return NULL:


Also if you try to validate that the user has the appropriate role using the standard request.isUserInRole( "UPLOAD_ROLE" ); method call, it will always return FALSE. Needless to say this is a critical issue from a security perspective as you need to know who is doing the file upload and if he is allowed to perform the operation. Without this information basically anybody can perform a file upload request and in some cases with malicious intent.

The solution

Since a new session is being created for the file upload operation, we need to tell the server to associate this session with our existing authentication session. We accomplish this in two parts, first by giving Flex our server session ID and then sending it back during the file upload. Here are the details of these two operations.

Sending back the server-session ID

Right after the Flex application initializes, call the remote server method to retrieve the server-session ID. In Java the remote method will look like this:

public String getSessionInfo()
return FlexContext.getFlexSession().getId();

Sending the session ID during the upload operation

Now that you have the session ID, you need to send it back with the call to the FileServlet along with the session cookie name. So from our sample above, the following line:

fileReference.upload( req, "/phoenix/FileServlet" );

Should be changed to:

fileReference.upload( req, "/phoenix/FileServlet;cookieName=" + sessionID );

Note: The variable cookieName needs to be the actual session cookie name you have configured for your Java web application (ex.: myappcookie).

So now, when the file upload operation occurs it will send back the session ID along with the file and so the server will associated that with your existing authenticated session. Now you can retrieve the login name of the currently authenticated user and validate that the user has the appropriate roles (see sample code above).


Flexcommon 1.2 released

I have just uploaded the latest version (1.2) of my FlexCommon library to its home on GoogleCode. This latest release contains the following changes:
  • Compiled with Flex 3.2
I dont see this as a problem and should allow a wider audience to use the library.
  • DataComboBox
This is an extension of the ComboxBox control. Lots of times we set the dataProvider and then want to set the selectedIndex based on some value withing the dataProvider. For this purpose I have created the DataComboBox control, which has two new properties: dataField and dataValue. The dataField property tells the control which property within each item of the dataProvider to examine and the dataValue property is the value to compare against. Once a match is found. the selectedIndex is set. See the documentation for an example.
  • New StringUtils.isNumeric() method
New convenience method to determine if a string contains only numeric digits.
  • Comes with en_US and fr_CA language bundles
All the error messages returned by validators are now contained with resource bundles: en_US (English) - the default - and fr_CA (French). You can of course create your own and if you wish to submit it to me I will include it!


Fixing the "unable to export SWC oem" error in Flash Builder

If you created a project using Flex Builder 3 and wish to upgrade it to Flash Builder 4, you might see the following error in the Eclipse "Problems" view when you attempt to compile for the first time:

unable to export SWC oem.

I read on several sites how to fix the problem but here is my little piece of details with step-by-step instructions:

  1. Shutdown eclipse
  2. Using your favorite text editor, open the .flexLibProperties file in the root of your project
  3. Erase all lines between the <includeResources> tags and just replace with an empty version of that tag (e.x.: <includeResources/>)
  4. Save updated .flexLibProperties file
  5. Start eclipse
  6. Use the clean and build options under the "Project" menu
And voila, your project now compiles under Flash Builder 4



Open Source Week in Montreal (MonDev)

For those interested, "Open Source Week' is happening this month in Montreal from May 24th to the 28th, also known as MonDev. Go to the site to see what topics and being presented and to register as a speaker if that interests you.


Copy operation between List / DataGrid

One of the great things about Flex is how much is available out-of-box. One feature that is provided out-of-box is the ability to easily drag'n'drag data from one control to another. One great example of this is to drag'n'drop data from a source List control to a destination List control and vice-versa. A example use case is where you are allowing the user to assign "users" to a "group" from an available list of "users".

This is code to implement this functionality is as follows:

[List id="availUsers" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dataProvider="{availbleUsers}"]

[List id="assignUsers" dragEnabled="true" dragMoveEnabled="true" dropEnabled="true" dataProvider="{assignedUsers}"]

Pretty simple eh? Basically what this code is saying is that both List controls are drag sources (dragEnabled="true"), that both are drop destinations (dropEnabled="true") and that when data is dragged from the control, that the data should be removed (dragMoveEnabled="true") - since it will be moved to the destination.

In some cases, as it happened to me just yesterday, you don't want the data to go back and forth between the two controls. In my case, I need the available list of users to remain as-is and that you could assign a user multiple times to the destination list.

To accomplish this, you just need to make the following changes:

[List id="availUsers" dragEnabled="true" dragMoveEnabled="false" dropEnabled="false" dataProvider="{availbleUsers}"]

[List id="assignUsers" dragEnabled="false" dragMoveEnabled="true" dropEnabled="true" dataProvider="{assignedUsers}"]

With the changes, this will allow data to be copied from the available users list (dragMoveEnabled="false") to the assigned users and you can't go back (dragEnabled="false").


Flash Player 10.1 pre-release

Adobe has setup a page that allows you to download a pre-release version of the next version of the Flash Player. That's version 10.1, which is heavily geared for running on mobile devices; but the desktop version gets all the advantages as well.

You can view some demos on the page showing the Flash Player 10.1 running on various devices and at the bottom of the page there are some quick interviews with Adobe employees; each one talking about one of the new changes that are present in the upcoming release.


Handling change - the YouTube way

Just noticed today that YouTube changed their site a little bit - more like tweaked. No big deal really, they have added some video controls and changed others. What I do like is that at the top-right corner of the page, their is a little blue information box that allows you to "take a tour of the changes". And like it says, it uses a little JavaScript overlay to take you on a tour of the page you are looking and explains the various parts of the page that have changed and how it now works. Simple and ingenious.

Some people hate changes, even of the smallest kind (Napoleon would be outraged! - internal friendly joke). This is a good way I think of showing users that the changes are no big deal really and you can continue on using YouTube to enjoy your favorite videos as you always have and with a smile :)

Careful building hybrid Flex/HTML applications

Building a Flex application from the ground up is fun experience. But since Flex has only been around for 6 years and if your company has been around for longer than that, this means that your Flex application might have to co-exist with an existing HTML application (most likely server driven such as a PHP, JSP or ASP web site). In essence, you have a hybrid Flex/HTML application and there is pros and cons to this.

If your company will continue to use Flex going forward, for all the good reasons, then basically you are getting ahead of the game. The parts are being built as you want them and you can eventually convert the old parts later on. Eventually you will end up with a 100% Flex built web application.

You hybrid design will cause confusion with end-users. If your web application (as an example) deals with managing user records, maybe the general page (the main page) and address page is in HTML and the contact page is done in Flex. Meaning, end-users will, in the course of administrating a user then be jumping from HTML to Flex and vice-versa. Here is a list of negative effects that this might cause:

  1. Users might use the browser's back-button and not get the intended result (in my example this might not seem like the case, but in a complex Flex app, you can imagine such a scenario)
  2. Every time the Flex UI loads, it might need to retrieve the same data over and over again (country list in this case)...so there will be a little wait time, although in seconds, some might perceive this as annoying.
The way I see it, if your "root" page is HTML based and the sub pages are in Flex, then confusion might be minimized. If the reverse is true however, meaning the "root" page is in Flex and the sub-pages are in HTML, then when the user hits the back-button, he might go back to a Flex UI and find it not in the state he left it in (However I believe there is a way to save application state in Flex - I just thought of this actually, but hey, I've got a million things on my mind, can't think of everything at once). At my company we ended-up doing the later and in hind sight it might not have been the best decision. We basically wanted people to use the new version of the web application as soon as possible and now because it is not yet complete, then are jumping from Flex to HTML and back in some cases, and this causes confusion and frustration.

Obviously if we had to do it all over again, we would have left the "root" page in HTML and built all the sub pages as Flex and then finally migrated the "root" page once all the sub pages were converted.

Also another way would have been to leave the old web application in HTML as is, build the new application using Flex, not given anyone access to it and then when it was 100% in Flex, release it to everyone. Not sure this would have worked well either because of the following reasons:

  • You would have to maintain the HTML and Flex applications at the same time
  • You would be getting no feedback at all on the new Flex app
  • You would sell-shock users when the new Flex app would be released

So has anyone else ever have to deal with this type of issue? What did you do? How did you handle it?


Flash Player crashes?

Been reading alot of Flash Player bashing lately and one of the main cons against the "little" player is the fact that it crashes so often. It does? Like when? It has happened once to me while visiting a web site and it was so long ago I don't remember. And like most people, I visit websites where I have to watch Flash content; like tsn.ca, espn.com, youtube.com, etc... It's not like I don't touch websites with Flash content with a 10-foot pole. Heck I develop in this stuff.

And then you have to wonder...if the Flash Player crashed so often, wouldn't nobody develop for this platform at all? Why would it still exist 15 years after it original release?

So wake-up people, Flash Player is here to stay for a little while longer, we can do more with it today than we ever could, and the web is more dynamic because of it. Will it cease exist some day? Perhaps, but not for another 10 years I hope :)

HTML has spoiled end-users

"People are quick to learn (in most cases), but slow to change."

Change happens all the time. We change our shoes, our clothes, the car we drive, what we eat for breakfast, where we live and where we work. But change certain things on people and wow, you are in a world of hurt.

I've recently been re-writing/migrating/enhancing an application at work, which used to be in JSP pages to Flex 3 and things have been progressing well. Until of course people started using the application. Main complaint? "Why can't I highlight this page and copy it into an email?" Well what the end-user was referring to as a page is actually a TitleWindow that has some information on it and a DataGrid with the financial information in it. What he basically wants to do would be possible if it was an HTML page, cause you can highlight anything in an HTML page. But the real reason for having to do this? The person needing this information did not want to take the time to access the application to see this information for himself. (so is the main issue here lazyness?)

So the simplest thing has caused negative feedback for the new version application and not just from one person. And it is the most basic thing really, copy'n'paste functionality that is normally part of the OS/browser. Something people have been able to do since forever is now no longer possible. They could use screen capture applications, but they don't support the Flash Player and its DataGrid control. People don't see that the information is more presentable and easier to navigate, they are only taking about the simplest basic feature that is no longer working.

So what to do? I will have to do some research to see if anyone else has had this problem and basically make Flex more HTMLism I guess. But mostly, in the end, I will have to change.

Chrome 5 comes with Flash Player

Been reading alot lately of how HTML5 will spell the end of the Flash Player and then today, bam! Google release an alpha version of Chrome 5 that comes with the Flash Player! Wonder what that's all about really.


Loading CSS at runtime

Just spent like 7 hours trying to debug a problem and finally found the solution by reading someone's blog. Basically was trying to load the CSS settings at runtime in my Flex 3 application. It didn't work at all, kept getting the following error:

Error #1034: Type Coercion failed: cannot convert bla to IFlexModule

Finally the problem was... the CSS filename (bla.css), was the same as the application MXML file (bla.mxml)! Changing the name of the CSS file to something different (app.css) basically solved the problem. Guess when you compile a CSS file to SWF, internally the generated ActionScript class is named the same as your CSS file and thus conflicts with the main application classname.

To learn how to load at runtime, read the "Loading style sheets at run time" in the Flex Livedocs.


Data Visualization Components now part of SDK

Just saw this post by one of the Flex engineers, Deepa, that the upcoming Flex 4 SDK will now contain the Data Visualization Components. These components include the AdvancedDataGrid, OLAPDataGrid and all the Charting components. This means you no longer need a serial number to use these components within any Flex projects build with version 4 of the Flex SDK. This is a great way for Adobe to continue promoting Flex and allowing developers to create even better applications without having to spend a penny. You can download the latest beta version of the Flex 4 SDK here (the nightly builds contain the Data Visualization Components).


Things that inspire

Everyone once in a while I visit a website where I read an article that inspires me to do better. Today I happened to see the new Home Tab Design for next version of Firefox (4.0). It was a contest actually and the winner is a gentleman by the name of Yatrik Solanki. Check out the video on this page where he basically explains his design for the page. Now I've got ideas for the main internal application used at my work place. Seems like I'll have some extra work to do :)


Change mouse cursor on a Label control

Since I was using a Label control to display some HTML text (monetary amount with its appropriate currency symbol), I also wanted to use it to display a detail pop-up window. Easy enough just need to code a handler for the click event.

However there is no visual cue that tells you that the Label is click-able, like the mouse cursor changing to a hand. But there is a way, you can make it do this automatically when someone hovers over the Label control. Its not obvious, so here are the 3 properties you have to set:

<mx:Label buttonMode="true" useHandCursor="true" mouseChildren="false"/>


Ottawa Flash User Group meeting

The Ottawa Flash User Group is holding their next meeting in a couple weeks; specifically on Wednesday March 3rd @ 7:00 PM EST. So if you are from Ottawa or the neighboring region (like Montreal for me), you should consider attending the event. I have in the past and you can see and learn some interesting things.

Full details and registration here.


French accent characters in Flex

Just this past week we added support for the French language (fr_CA) to a Flex application we are building at work. Nothing complicated really, just had to make use of resource bundles as described in the Flex livedocs.

However we did notice that when running the Flex application, certain French characters that contain accents (ex.: é - ALT-130) were displaying as little empty boxes in the UI. Found the answer to this problem on this website. Basically the encoding for our french properties file was incorrect. It was using ISO-8859-1 instead of UTF-8.

To resolve this problem, in Eclipse, perform these steps:
  1. Right-click on your french properties file and select "Properties"
  2. Select "Resource" from the left side panel
  3. Change the "Text file encoding" from the default to "Other" and select "UTF-8"


Flash Player truly brings web sites to life

I find as I browse the web everyday, it is sometimes easy to forget that the Flash Player is what breathes life into web sites all over the world.

On one website, I see an silent teaser playing for a upcoming movie. Turn on the sound for the teaser and you are transported to a fictional world, but only for a few seconds. Goto Youtube.com and the whole experience revolves around the Flash Player, enabling the user to view a music video he hasn't seen in years, watch a clip from a favorite movie or watch a short funny movie created by a friend.

For myself, I am big NFL fan and I love going to either nfl.com or espn.com and watching a pre-game show debate about my favorite team's upcoming game (Cowboys in case anyone in wondering) or watching a post-game review for that matter. Furthermore, because not all the Cowboy games are presented on a national cable channel, I have a way to watch those games on my computer via the web because of the Flash Player.

So next time you are browsing some website, look around the page, you won't see just static data like it used to be just 15 years ago, but a portion of it will be dynamic and that is thanks to the little plug-in that could.