« Personal Blog Site | Main | Mathematical Black... »
http://blogs.sun.com/insidemyhead/date/20070322 Thursday March 22, 2007

Flex Up Your Portlets!

As promised I started to do my Flex development, and boy I found it really amazing. Flex based UI is nothing but a SWF file that is run by the Flash VM running as a plugin in your browser, much like the Java Plugin. Personally I prefer Flex over Ajax, having tried both.

If you want to build a rich user interface web application that requires several state changes, spans multiple business processes and requires complex data handling at the back-end and still want to give the users a really rich and consistent experience (no refreshes!) then I think Flex definitely is the better choice.

By the way, Flex provides a platform/browser independent virtual machine in which your web application user interface runs (as long as there is a Flash VM for that browser/platform, and for most OS'es it is there). On the other hand Ajax does depend on the browser, in the sense it relies on the browser to provide the platform to build the applications. And hence it is sensitive to the browsers interpretation of JavaScript code. That makes Ajax based code sensitive to the way the JavaScript code is written and interpreted by the browser.

Another point I noticed in Flex, is that the scripting language used is ActionScript, which happens to be a much more strongly typed language as compared to JavaScript, so I believe this is in favor of Flex as well.

It has the pretty good concept of,

Application = Code + Markup.

Where Markup is provided by the declarative MXML syntax, code is provided by ActionScript. ActionScript is Object Oriented as well, that is, if you are familiar with Java, learning ActionScript is pretty much a breeze.

Flex provides inbuilt support for making calls to the backends using HTTP (GET/POST) as well as native support to make webservices Calls via the <mx:HTTPService> and the <mx:WebService> tags respectively. Using the <mx:WebService> tag to make web services calls was so easy, that it felt like reading WebServices for Dummies!!

I believe it is possible to make calls into EJB's also, but I haven't yet explored that possibility. Still in my learning phase!.

The first application I did was an application that shows the user a drawing board in which the user can draw pictures. To do this it was a breeze in Flex Builder. Opened up the 'Design' view, dropped in a panel, a canvas object and then trapped the mouse clicks in ActionScript, and made sure that lines were drawn between the mousedown's and the mouseup's. Real Simple!

Anyway, being in the portal world, I wanted to make use of the Flex Application Platform in my portal. In other words, I wanted to 'Flex Up my portlet'. This would not only involve building the user interface in Flex, but would also get me to test the webservices support in Flex. Nice!

So now I needed a nice enough usecase. After thinking for a while, I thought that maybe a E-Signature portlet would really be nice. The portlet will present a user with a document (a NDA, EULA etc) that traditionally the end users would have signed/accepted. The portlet would provide a canvas wherein a user can actually sign the document. And then this signature is posted back to the server as a bitmap and saved. Basically, this portlet could leverage my initial work on the simple standalone 'canvas board' flex application. With this idea in mind, was all charged up to flex up my portlet.

 Tools Used


So my E-Signature portlet is done. I put up a small screencast of it for download. If you are interested then you can view it here.

In my next blog, I will post instructions on how to actually integrate Flex applications into your portlets. So keep posted!

 

UPDATE: I didn't get time to post the entry on how to create a portlet out of the Flex application, but I helped my colleague Murali on getting his Flex app as a portlet and he has been prompt enough to post the instructions on his blog here. Thanks Murali.



Posted by insidemyhead [Sun] ( March 22, 2007 11:13 PM ) Permalink | Comments[11]
Comments:

Great Sandeep, I hope we will have some thing still left to do!!!!

Posted by Uday on March 23, 2007 at 10:03 AM IST #

This is great help. Reminds me of the old days when you helped me learn Foxpro and ASP. Great headstart of my research about FLEX's possibilities. Thanks Avnish

Posted by Avnish on May 15, 2007 at 10:48 PM IST #

Hi Sandeep - I am Raghu, a part of the Flex Team here in Bangalore. Lets get together sometime and do some coding on Flex & the portal stack that you mentioned. I'll just leave this idea on murali's blog too...

Posted by Raghu on April 17, 2008 at 01:05 PM IST #

Need 3 Flex engineers in New York City:
1. You have to be living in New York City for now.
2. Work part time or full time with us.
3. Good at Adobe Flex technology.
4. Please contact us for other requirement and details.

Busycode Inc. is a top Adobe Flex shop who develops Flex/AIR applications for clients.
For more info, please visit http://www.busycode.com

Posted by Andychou on April 18, 2008 at 01:23 PM IST #

Hi,

Nice post. You can invoke Java objects , Spring beans, and EJB methods from Flex application using the RemoteObject component. Please visit this URL for details on how to invoke methods in EJB from Flex applications.

http://www.ryannorris.com/2007/05/18/using-flex-data-services-with-ejb3/

Posted by Sujit Reddy G on May 05, 2008 at 07:08 PM IST #

Can you post the code ?
thank you

Posted by Rene on August 13, 2008 at 04:45 AM IST #

Can you please help with the following:
I want to be able to run a Flex UI inside eclipse and have that Flex UI interact with other eclipse UIs that are inside eclipse (e.g. data exchange, and most importantly drag&drop from the flex UI to the eclipse UIs and vise versa, etc.). How can I go about doing this?

Thank you so much,

AJ

Posted by AJ on September 13, 2008 at 10:38 AM IST #

Can you please help with the following:
I want to be able to run a Flex UI inside eclipse and have that Flex UI interact with other eclipse UIs that are inside eclipse (e.g. data exchange, and most importantly drag&drop from the flex UI to the eclipse UIs and vise versa, etc.). How can I go about doing this?

Thank you so much,

AJ

Posted by AJ on September 13, 2008 at 10:39 AM IST #

wsasa

Posted by 203.91.207.30 on November 07, 2008 at 09:09 AM IST #

I also have written an article about RIA with Flex on a portlet. This one will create a full blown Adobe AMF with LCDS to cummunicate with the portlet.
You can view the article here
https://my.lyfam.com/drupal/node/19
Cheers

Posted by Doug on April 09, 2009 at 09:56 AM IST #

hi guys,

i am doing integration of flex + blazeDS + WebSphere Portal server. i can able to view flex application on portal server, but to invoke javaobject from flex using RMI i.e. through blazDS (MessageBorkerServlet), made corresponding enteries in web.xml, services-config.xml & remoting-config.xml, while deploying it gives error
"
[4/28/09 14:59:34:040 IST] 0000006c SystemErr R com.ibm.etools.j2ee.commonarchivecore.exception.DeploymentDescriptorLoadException: IWAE0022E Exception occurred loading deployment descriptor for module "MyFirstPortlet.war" in EAR file "C:\Program Files\IBM\PE\PortalServer\deployed\MyFirstPortlet.ear"
!Stack_trace_of_nested_exce!
com.ibm.etools.j2ee.commonarchivecore.exception.DeploymentDescriptorLoadException: WEB-INF/web.xml
!Stack_trace_of_nested_exce!
java.lang.IllegalStateException: !EMF2DOMAdapterImpl_ERROR_0!
at com.ibm.wtp.internal.emf.xml.EMF2DOMAdapterImpl.handleInvalidMultiNodes(EMF2DOMAdapterImpl.java:1127)
at com.ibm.wtp.internal.emf.xml.EMF2DOMAdapterImpl.findDOMNode(EMF2DOMAdapterImpl.java(Compiled Code))
at com.ibm.wtp.internal.emf.xml.EMF2DOMAdapterImpl.primUpdateMOFFeature(EMF2DOMAdapterImpl.java(Compiled

Caused by: com.ibm.wps.pe.mgr.exceptions.AppServerWarInstallException: EJPPH0056E: The installation of portlet application C:\Program Files\IBM\PE\PortalServer\deployed\MyFirstPortlet.war did not complete successfully. Please check the WAS log files for a possible explanation.
at com.ibm.wps.pe.mgr.appserveradmin.WAS5Admin.installImpl(WAS5Admin.java:1244)
... 72 more
Caused by: com.ibm.wps.pe.mgr.exceptions.AppServerWarInstallException: EJPPH0000E: ADMA5016I: Installation of MyFirstPortlet_PA_1huh74xp started.
ADMA5057E: Application validation failed with unexpected exception while checking module to server relationship: com.ibm.etools.j2ee.commonarchivecore.exception.DeploymentDescriptorLoadException: IWAE0022E Exception occurred loading deployment descriptor for module "MyFirstPortlet.war" in EAR file "C:\Program Files\IBM\PE\PortalServer\deployed\MyFirstPortlet.ear"
ADMA5011I: The cleanup of the temp directory for application MyFirstPortlet_PA_1huh74xp is complete.
ADMA5014E: The installation of application MyFirstPortlet_PA_1huh74xp failed.

at com.ibm.wps.pe.mgr.appserveradmin.WAS5Admin.installImpl(WAS5Admin.java:1243)
... 72 more"

please look into it.

Thanks in advance.

Posted by Vasu Reddy on May 04, 2009 at 10:24 AM IST #

Post a Comment:
  • HTML Syntax: NOT allowed