Kusunam's Blog

I am sure you will run in to something like this if you are going to work on Flex for your next 4-5 projects. Luckily \ Un-luckily I ran in to this on my first project itself. This was definitely very complex to me when I started but it does make sense after I finish it. Given the complexity of this I will update it iteratively.

Requirement

• You have a Database table(s) whose data translate to something like Tree with top level is identified using separate column something like ‘isTopLevel’

Assumptions

• You will have 2 Database tables. One is “FolderVO” and other is “FileVO“. These two tables are linked using 3^rd table called “Folder_File_Link”
• FolderVO will have a column to specify ‘isTopLevel’ which will be populated for only top Folder in the tree
• “Folder_File_Link” will have its structure something like following to identify each folder’s children

  linked        folderId        folder_file_Id    
  

• A Folder can have either Folder or File list as its Children based on its property “folderLink” which take “Folder” or “File“
  
• This structure can be in some other formats too and purpose of this post is just to show how to develop Flex screens to handle something like this
  

Explanation

On the server side retrieve Folder with ‘isTopLevel‘ is set to ‘T‘ and go to link table and get all the Folders and Files attached to it. This is a recursive method at the end t will generate “FolderVO” object which will have following properties:

public var folderId:int;

public var folderName:String;

public var folderCode:String;

public var folderDescription:String;

public var folderLink:String;    //—- This will identify whether this folder can have Folder or Files as Children

public var topFolder:String;

public var children:ArrayCollection; //—- This contains FolderVO or FileVO objects    recursively    

Here children is a Collection which contains Folders or Clients based on its property ‘folderLink‘

This Tree will support following features:

1. Create a Folder (either top level or any children)
2. Remove Folder
3. Attach any existing Files
4. Remove any File from the Folder

**** Given the complexity of this form I will try to add details n next few days or weeks (depending on my schedule). But if you ran in to something like this and need any help drop me a message I will definitely help on this as I went through this pain already J

I was wondering why people do not use these Utility projects from Apache. Probably I have seen 1-2 projects which utilize org.apache.commons.beanutils. Even I was not using these until 2006-2007. In any application which is in Test or Prod I see ‘NullPointerExceptions’ at least once. So what is the problem we write all these boiler code to check for NULL then call some function on it like trim(), length, size() or any public methods. Sometimes we miss first NULL check and I have seen myself missing these repeatedly before I started using Apache Common Utility methods. Now I make use of these utility classes very often which are ‘Null safe’ and protects my code from any ‘Null Pointers’. Here are some of the Utility projects I use on daily basis and recommend any one to use these if you are not using these already.

Apache Commons Bean Utils

    BeanUtils    MethodUtils

Apache Commons Lang

    ArrayUtils    DataUtils    DataFormatUtils    ObjectUtils    StringUtils

Apache Commons Collections

    This has many classes useful on operating on Collections.

I am sure many people who often involve with open source projects use these on regular basis.

I started this journey a month back or so and here is how it was and how it is now.

 Back Ground
 I am working on developing web Enterprise applications using Java J2EE technologies for last 10 years. All the time my biggest complaint was why do I need to write everything by myself i.e. HTML (first design the page) then use some framework like Struts Spring as MVC and other stuff. Before I came in to Java I was a Visual Basic developer and it was cool in developing desktop applications by just dragging and dropping and defining the events. My biggest belief is as an Application Developer I should be worrying about my business logic and rest should be taken care by framework or technology. This is exactly what J2EE addressed on Server side when it was released i.e. it takes care of Deployment, Resource Management, Connection pooling, Transaction Management etc and I just need to work on my business logic.

FLEX

Flex seems to be addressed some of these very well on the client side i.e. provide a working area where we can just drop existing components and start defining what they do and how they do. We can also reuse some of the custom components. I feel learning Flex is little bit steep in the beginning especially for someone like me, who has not worked on even driven applications for a long time. I started my first Flex screen by just looking at some of the examples from Adobe @ http://livedocs.adobe.com/flex/3/html/index.html and luckily this screen was simple one with no Commits to database i.e. just read from Database and display on the screen. I have used XML communication between Flex and Java deployed as a WAR project on JBoss application server. This worked perfectly fine for my screen requirement. During this screen development I was spending most of time on Google and Adobe in searching how to construct XML on the server and also how to read it in Flex and also how to display collections in a drop down, Grid. First screen gave me some opportunity to learn how Flex works and also experiment different layouts, containers, components and also some Action Script.

After I finished this screen I have to work on my 2^nd screen which is more complex to me with 2 dropdowns, Tree component, editing tree nodes, screen modes (view, edit) and many more. I thought I can never finish this screen looking at my limited flex knowledge and also screen complexity. But as an applications Architect I had to approach it organized and iteratively and this worked (working) perfectly to me. I am still working on this screen and so far I do not have any road blocks.

Flex Learning Resources:
A simple Getting Started    http://learn.adobe.com/wiki/display/Flex/E4X

Adobe Resource Center    http://livedocs.adobe.com/flex/3/html/index.html

 Flex in a week from Adobe    http://www.adobe.com/devnet/flex/videotraining/

Flex Learning Path – Programmer    http://www.adobe.com/devnet/flex/learn/programmer/

A must to have AIR for every Flex newbie “Tour de Flex Component Explorer”    

http://www.adobe.com/devnet/flex/tourdeflex/

XML over HTTP (or) Remoting using AMF

XML seems to be tempting and easier approach when you are beginning with Flex but as the application gets complex XML seems to be painful. First thing is we need to do 2 time XML parsing i.e. one on server and one on client and 2nd thing how do we manage XML when we need to do some heavy CUD operations? I ran in to this issue when I started my 2^nd screen which has lot of CRUD operations and immediately I started looking out for some alternatives to this XML. First thing I ran in to is ‘BlazeDS’ from Adobe which seems to be addressing ‘Remoting’ perfectly for my needs. Also Adobe claims (I have also seen someone posted these performance numbers on web) that it is faster using AMF (Action Message Format) comparing to XML communication. Learning BlazeDS is easy and straight forward for any Java Developer (May be I will write another post on BlazeDS). There are other alternative to BlazeDS like GraniteDS and other claiming that they are better than BlazeDS but I will experiment with them once I get comfortable with all these new technologies (to me).

Flex MVC Framework (Cairngorm)

Currently 80% of my UI and Action Script code are on same MXML file and this is growing day by day and I started hating my code. Next question is how I refactor this code to put it in a nice MVC style framework. Cairngorm seems to be a nice one for a starter like me. I experimented with it yesterday only and also I have applied it to my 2^nd screen and most of it is simple and easy but I hit a road-block in it i.e. how do I enable disable UI components based on events and their response (result fault). I will look in to it more in next couple of days (May be another post on Cairngorm). There are other frameworks like PureMVC, Swiz and Mate. I hear lot of good about Mate and this will be the next in my list to experiment.

Maven2

I hate Ant and a big fan of Maven even though it has some drawbacks. But I can be up and running with Maven in 5-10 minutes for any project. Flex do not have good support for Maven and this was the task I have spent overall a week or so (bad part is I have started on it before I started on developing Flex so I did not had any idea about what is SWC, SWF, RSL etc). There is an open source project called “flex-mojos’ lead by Marvin Froeder (Velo) and it is the best plug-in available for Flex-Maven. Please look at Google groups http://groups.google.com/group/flex-mojos for further details also here is the latest wiki for it @ https://docs.sonatype.org/

As always drop me a message for any questions or suggestions….