Archive

Archive for May, 2009

Get recent images uploaded in flickr using flex

May 29, 2009 2 comments

Hi everybody, we have used third party widgets in our blog which shows the recent images of the subscribed URL from flickr, but do you know how it is working ?. If you dont know please trust me, i will tell you how it can be done.

As i said in my previous post, you must know few things about the api which you are going to access

  1. Which api method you are going to access ?
  2. What is the URL of the api method you need to access ?
  3. What are the parameters the api method expects ?
  4. What kind of data the api method returns ?
  5. What can you do with the returned data ?

Here i am going to access the getRecent method of flickr api which will get api key as required parameter and it will return set of XML node. Each XML node represents the details of an image and using those details we can construct the URL of the image where it has been located in flickr. Once we have known the location we could display the image in our widget.

I can sense what is going through your mind right now, i.e. “what is api key ?”, if i am not wrong. ok let me tell you about api key. Anyone who wants to access api method they must have unique identification so that the server can know who wants to access api methods. thats why we need api key and it comes up in two versions. Non commercial key & Commercial key. Non commercial key will be allowed to use by programmers who are not using for commercial product and if you want to get commercial key, you must give some information about the product which want to access api and with prior permission from flickr you can use it.

Finally what we ever need to know is URL of the api method which we are going to access. It can be constructed if you know the api key and method name you are going to access.

http://www.flickr.com/services/rest/?method={method_name_here}&api_key={your_api_key}

Now create HttpService instance, specify URL, result format, event handler function for result and fault property, then invoke the HttpService instance.


<mx:HTTPService url="http://www.flickr.com/services/rest/?method=flickr.photos.getRecent&api_key={your_api_key}"
 result="resultHandler(event)" resultFormat="e4x" id="service" fault="faultHandler(event)" method="POST"
 showBusyCursor="true" />

Once the getRecent method has been invoked successfully it will return set of XML node named photo as I have mentioned below.

<photos page="2" pages="89" perpage="10" total="881">
<photo id="2636" owner="47058503995@N01"
		secret="a123456" server="2" title="test_04"
		ispublic="1" isfriend="0" isfamily="0" />
<photo id="2635" owner="47058503995@N01"
		secret="b123456" server="2" title="test_03"
		ispublic="0" isfriend="1" isfamily="1" />
<photo id="2633" owner="47058503995@N01"
		secret="c123456" server="2" title="test_01"
		ispublic="1" isfriend="0" isfamily="0" />
<photo id="2610" owner="12037949754@N01"
		secret="d123456" server="2" title="00_tall"
		ispublic="1" isfriend="0" isfamily="0" />
</photos>

As i have told earlier each photo node represents the details of an image in flickr and we can construct URL of the image using ID, server ID, farm ID and secret property of each photo XML node.

http://farm{farm-id}.static.flickr.com/{server-id}/{id}_{secret}.jpg

Now you know how to construct an URL of image, assign this to the source property of Image tag and it will display it. thats it!!!. How long you will use widgets that others have been developed, just develop your widgets in the way you want. Who knows someone even buy yours.

My simple image gallery

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="service.send()">

 <mx:Script>
 <!&#91;CDATA&#91;
 import mx.collections.ArrayCollection;
 import mx.rpc.xml.SimpleXMLDecoder;
 import mx.rpc.AsyncToken;

 import mx.controls.*;
 import mx.rpc.events.*;
 import mx.effects.easing.*;

 &#91;Bindable&#93;public var p : String;

 &#91;Bindable&#93; public var index : Number = 0;

 &#91;Bindable&#93;public var xmlRes : XML;

 &#91;Bindable&#93; public var ac : ArrayCollection = new ArrayCollection();

 &#91;Bindable&#93; public var imgSource : ArrayCollection = new ArrayCollection();

 &#91;Bindable&#93; public var timer : Timer;

 public function resultHandler(event : ResultEvent):void
 {
 xmlRes = new XML(event.result.photos);

 for each(var x:XML in xmlRes.photo)
 {
 ac.addItem(x);

 var url : String = "http://farm"+ x.@farm +".static.flickr.com/" + x.@server + "/"+ x.@id + "_" + x.@secret+".jpg"

 var obj : Object = {isource : url};

 imgSource.addItem(obj);

 } 

 var farmid : String = ac.getItemAt(index).@farm;
 var serverid : String = ac.getItemAt(index).@server;
 var id : String = ac.getItemAt(index).@id;
 var secret : String = ac.getItemAt(index).@secret;

 var source : String = "http://farm"+farmid+".static.flickr.com/" + serverid + "/"+ id + "_" + secret+".jpg";

 img.source = source;
 panel.title = ac.getItemAt(index).@title;

 img.visible = true;
 img.includeInLayout = true;

 timer = new Timer(10000);
 timer.addEventListener(TimerEvent.TIMER,nextHandler);
 timer.start();

 }

 public function nextHandler(event : Event):void
 {
 index = index + 1;

 if(index < ac.length)
 {
 var farmid : String = ac.getItemAt(index).@farm;
 var serverid : String = ac.getItemAt(index).@server;
 var id : String = ac.getItemAt(index).@id;
 var secret : String = ac.getItemAt(index).@secret;

 var source : String = "http://farm"+farmid+".static.flickr.com/" + serverid + "/"+ id + "_" + secret+".jpg";

 img.source = source;
 panel.title = ac.getItemAt(index).@title;

 img.visible = true;
 img.includeInLayout = true;

 }

 }

 public function faultHandler(event : FaultEvent):void
 {
 Alert.show(event.fault.message);

 }

 public function callService():void
 {
 var asyn : AsyncToken = service.send();
 }

 public function nextClick(event : Event):void
 {
 back.enabled = true;

 if((hList.horizontalScrollPosition + 6) < hList.maxHorizontalScrollPosition)
 {
 next.play(&#91;hList&#93;);
 }

 if((hList.horizontalScrollPosition + 12) > hList.maxHorizontalScrollPosition)
 {
 forw.enabled = false;
 }
 } 

 public function prevClick(event : Event):void
 {
 forw.enabled = true;

 if((hList.horizontalScrollPosition - 6) > 0)
 {
 prev.play(&#91;hList&#93;);
 }
 if((hList.horizontalScrollPosition - 12) < 0)
 {
 back.enabled = false;
 }
 }

 &#93;&#93;>
 </mx:Script>

 <mx:HTTPService url="http://www.flickr.com/services/rest/?method=flickr.photos.getRecent&api_key=your_api_key_here"
 result="resultHandler(event)" resultFormat="e4x" id="service" fault="faultHandler(event)" method="POST"
 showBusyCursor="true" >

 </mx:HTTPService>

 <mx:WipeUp id="fade" duration="2000" />

 <mx:Panel id="panel" width="600" height="300">
 <mx:Image showEffect="fade" hideEffect="fade" id="img" width="100%" height="100%" maintainAspectRatio="false" />
 </mx:Panel>

 <mx:HorizontalList id="hList" dataProvider="{imgSource}" columnWidth="100" horizontalScrollPolicy="off" rowHeight="150" width="600" height="150" >
 <mx:itemRenderer>
 <mx:Component>
 <mx:HBox dropShadowEnabled="true" horizontalGap="300" verticalGap="200" >
 <mx:Image  showEffect="" source="{data.isource}" maintainAspectRatio="false" width="100%" height="80%"   />
 </mx:HBox>
 </mx:Component>
 </mx:itemRenderer>
 </mx:HorizontalList>

 <mx:HBox>
 <mx:Button id="back" label="prev" enabled="false" click="prevClick(event)" />
 <mx:Button id="forw" label="next" click="nextClick(event)" />
 </mx:HBox>

 <mx:Sequence id="prev">
 <mx:AnimateProperty property="horizontalScrollPosition"
 fromValue="{hList.horizontalScrollPosition}" toValue="{hList.horizontalScrollPosition - 6}" duration="7000" easingFunction="{Elastic.easeOut}" />
 </mx:Sequence>

 <mx:Sequence id="next">
 <mx:AnimateProperty property="horizontalScrollPosition" easingFunction="{Elastic.easeOut}"
 fromValue="{hList.horizontalScrollPosition}" toValue="{hList.horizontalScrollPosition + 6}" duration="7000"/>
 </mx:Sequence>

</mx:Application>

Advertisements

MXML : Why i am always getting late, is it from from my heredity ?

May 26, 2009 Leave a comment

Hi very good morning, today i am going to explain about how mxml and actionscript differs from each other and which one is better suits for building flex application. Before we gonna look at which one is best, let me tell one thing that the flex framework is written using actionscript alone, now you would have realized how great actionscript is. but it would not be a surprise to the people who knows that actionscript is object oriented programming language which is used to write a client side business logic and whatever mxml tag we have, we do also have corresponding actionscript class.

you may have doubt that why certain properties which is available either in actionscript or mxml which could not access by other. In order to resolve this conflict i must explain the three tiers of actionscript api. They are follows.

  • Flex framework api
  • Flash player api
  • custom api

Flex framework api

All the controls, containers, managers, effects which resides in the mx package are part of flex framework api and it was written using actionscript.

Flash player api

All the classes which resides in the flash package are part of flash player api. All the core classes and network specific classes of flash player api are part of flash player.

Custom api

All the custom classes which are written using flex framework api as well as flash player are custom api.

Now you would have known why certain properties available in one could not access by other because they are not belong to the same package and they are not belong to same api so some properties available in one may not be available in other.

Come back to our discussion that which one is better suited for web application ?. Both has certain advantages and disadvantages. Using mxml, we can easily layout the controls and design a page but the run time environment of flex application is flash player which doesnt know mxml. so when we compile the mxml component or application, it will be converted to actionscript class and then it will converted in to swf object along with the libraries you have used in mx package when you developed the mxml component or application. therefore the swf object size will be increased and it also have greater impact when loading application.

But this is not the same case for actionscript because it will only reference the classes in flash player so it doesnt need to add any libraries from flex framework api therefore the swf object will be lesser relatively compared to swf object created from mxml. Although creating user interface in actionscript is not preferable way to do, we can easily create user inteface with mxml tag than actionscript. Actionscript is meant for developing client side businees logic and used to define dynamic behavior of components.

In certain cases like custom preloader where we must develop a custom preloader component using actionscript since its loading time will be lesser compared to mxml. So choose wisely which one to use for your component and dont blame mxml it is not its fault but its ancestors.

And finally thank you for reading my post!!!.

Origins of flex application

May 25, 2009 Leave a comment

Hi folks!!!, we do always compare between flex and flash as they are two other technologies and we always thinking that what we cant do in flash that can do by flex. Here the conclusion for the people who have still doubts about the differences between flash and flex.

There is nothing flash cant do, that flex can do. Both flex and flash application will be compiled in to .swf object and the flash player (run time environment of .swf) will execute swf file with th help of AVM2 (ActionScript virtual machine). So the only difference is the way you are creating application and not how it behaves.

In fact, root application of any flex application is System manager which is responsible for managing and handling flex application. It itself subclass of flash.display.movieclip which is a one of the class in flash which will have timeline and the timeline in turn will have many frames which will contain the content to display when the user runs.

But in flex, the system manager will have only two frames and they are preloader & flex application. When application starts executing, the system manager will create an instance of preloader and the preloader will start loading flex application & run time shared libraries. Once it has been loaded, the preloader will notify the system manager & the system manager will create an instance to main flex application. The application will initialize and layout the child components and once it has been done its task, the application will notify the preloader which will notify the system manager. At last the system manager will remove the preloader from its display list and will add flex application in display list.

You are developing flex application whether using flex or flash, after compilation it will be in form of .swf (to be precise it will be in the form of byte code) which will be executed by flash player which doesn’t know neither flash nor flex, but it knows how to interpret byte code and it executes flex and flash based applications.

URL loader frowns “when HttpService does, why cant I ?”

May 19, 2009 4 comments

URL loader allows the users to handle requests and response to and from HttpServices same as what flex HttpService allows the users to do. So whatever the task can be done by HttpService, can also do by URL loader but the way they do will be different. We do have MXML HttpService tag which will invoke HttpServices like servlet in a much easier way than URL loader. Because we dont have MXML URL loader tag since its part of Flash player API so we can create an URL loader instance and call servlet using ActionScript alone.

To invoke a servlet using load method of URLLoader instance, the load method will expect a single parameter which is none other than URLRequest instance. It defines the URL in which it will request the servlet when URLLoader instance invokes the load method. As well as the event handler function for URLLoader complete event should be registered before you invoke the servlet because as you know well this event handler function will be executed once the request has been fulfilled.


var loader : URLLoader = new URLLoader();
var request : URLRequest = new URLRequest("http://localhost:8080/CallServlet/callService");
loader.addEventListener(Event.COMPLETE,resultHandler);
loader.load(request);

When we make a request to the servlet, we should also send request parameters which will be expected by the servlet when it receives the request. In URL loader we do have class named URLVariables through which we will create the request parameters as name/ value pair and finally we will set the data property of the URLRequest instance to URLVariables instance.


var param :URLVariables = new URLVariables();
param.email = email.text;
param.pass = pass.text;
request.data = param;

Thats it. Now replace the URLLoader instance code, instead of HttpService instance code in our previous example & run the application.


<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" creationComplete="createLoader()">

 <mx:Script>
 <!&#91;CDATA&#91;
 import mx.rpc.events.FaultEvent;
 import mx.rpc.events.ResultEvent;
 import mx.controls.*;

 var loader : URLLoader;
 var request : URLRequest;

 public function createLoader():void
 {
 loader = new URLLoader();
 request = new URLRequest("http://localhost:8080/CallServlet/callService");
 loader.addEventListener(Event.COMPLETE,resultHandler);
 }
 public function callLoader():void
 {    
 var param :URLVariables = new URLVariables();
 param.email = email.text;
 param.pass = pass.text;
 request.data = param;
 loader.load(request);
 }
 public function resultHandler(event : Event):void
 {
 Alert.show(loader.data);
 }
 public function faultHandler(event : Event):void
 {
 Alert.show("error");
 }
 &#93;&#93;>
 </mx:Script>

 <!--<mx:HTTPService id="service" url="http://localhost:8080/CallServlet/callService" result="resultHandler(event)" fault="faultHandler(event)" method="GET" showBusyCursor="true" resultFormat="text">
 <mx:request xmlns="">
 <email>{email.text}</email>
<pass>{pass.text}</pass>
 </mx:request>
 </mx:HTTPService> -->

 <mx:Panel paddingLeft="20" paddingRight="20" paddingTop="20" paddingBottom="20">
 <mx:FormItem label="E-mail">
 <mx:TextInput id="email" />
 </mx:FormItem>
 <mx:FormItem label="Password">
 <mx:TextInput id="pass" displayAsPassword="true" />
 </mx:FormItem>
 <mx:Button label="Submit" click="callLoader()" />
 </mx:Panel>

</mx:Application>

Download previous example here

Note :

This post is continuity of my previous post if you could not follow this instructions. Please refer my previous post click here. Still you could not follow, drop your feedback i will try to refine the content as much as possible.

HttpService says “I can invoke the servlet”

May 18, 2009 9 comments

Hi everybody, its my pleasure to come up with another interesting blog that is how to invoke a servlet from flex application using HttpService. Let me start with HttpService which is responsible for handling request and response to and from http services like servlet. Now we are bound to know how servlet works, dont get panic !!! its easy let me explain.

Servlet – a glance

Whenever the client requests resource from web server (Apache), the web server will fetch the resource and send it as a response to the client. But the web server will love to serve as long as the requested resource is static content. If the client request any dynamic content which will not be available until the request is made, the web server cant do it alone so that it need help from some helper application like servlet which is capable of generating just in time resource i.e. dynamic content.

Who is the manager of servlet ?

Now you must know the person who is managing servlet who is none other container. the role of container has to create an instance of servlet before any one requests the servlet and whenever the client requests the servlet the container will intercept and create new thread of the requested servlet and also it will handover the request parameters to the servlet class

Note :

One could not explain the concept of servlet and container in single post because its too vast, i hereby just given idea about servlet and how it works. If you want to know more there are plenty of forums available where you can know everything about these stuffs.

Now come back to our concept. To invoke a servlet from flex you have to create HttpService component, Servlet class and at last you have to map the URL to Servlet in deployment descriptor.

Before you do all these stuffs, set up your web application in Tomcat , create flex project and configure server location of your flex application. Please refer to my previous post if you dont know how to do it, click here

Create HttpService component

  • Create HttpService instance in your MXML application file, name the instance and define the event handler function name for result and fault property.
  • specify the url which will invoke the servlet class when user invokes the service.
  • Define the http method of your request e.g. GET, POST etc.
  • Specify the request parameters of your HttpService which will passed to the servlet and servlet will do some process with the data. It can be specified using request property of HttpService.
  • Define the event handler function for result and fault inside <mx:script> tag.
  • The response of the servlet will be handled by either result event handler function or fault event handler function depends on the result of servlet invocation.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

 <mx:Script>
 <!&#91;CDATA&#91;
 import mx.rpc.events.FaultEvent;
 import mx.rpc.events.ResultEvent;

 import mx.controls.*;

 public function resultHandler(event : ResultEvent):void
 {
 Alert.show(event.result.toString());
 }

 public function faultHandler(event : FaultEvent):void
 {
 Alert.show("error");
 }

 &#93;&#93;>
 </mx:Script>

 <mx:HTTPService id="service" url="http://localhost:8080/CallServlet/callService" result="resultHandler(event)" fault="faultHandler(event)" method="GET" showBusyCursor="true" resultFormat="text">
 <mx:request xmlns="">
 <email>{email.text}</email>
<pass>{pass.text}</pass>
 </mx:request>
 </mx:HTTPService> 

 <mx:Panel paddingLeft="20" paddingRight="20" paddingTop="20" paddingBottom="20">
 <mx:FormItem label="E-mail">
 <mx:TextInput id="email" />
 </mx:FormItem>
 <mx:FormItem label="Password">
 <mx:TextInput id="pass" displayAsPassword="true" />
 </mx:FormItem>

 <mx:Button label="Submit" click="service.send()" />
 </mx:Panel>

</mx:Application>
 

In the code you are seeing above, i just created HttpService instance and the request parameter are the users input of email address and password which will be passed to servlet once the user invokes servlet by clicking “Submit” button.

Create, compile & deploy servlet

  • Create a java class which should extend HttpServlet Class
  • Define doGet method if you have declared GET in the method property of HttpService instance else doPost.
  • Get the request parameters sent by the HttpService instance
  • Do some process with request parameters
  • Compile the servlet class
  • Finally copy your_servlet.class and paste this file in to {Tomcat_home_directory}\webapps\{Web_application_name}\WEB-INF\classes folder of your web application.
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
public class MyServlet extends HttpServlet
{
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws IOException, ServletException
{
String email = request.getParameter("email");
String password = request.getParameter("pass");
String result = "Hi iam servlet, I am here to conform your username & password, they are " + email + " & " + password + ". is it correct ?";
PrintWriter out = response.getWriter(); out.println(result);
}
}

In the servlet class above, i have implemented doGet() method since i have declared GET in the method property of HttpService instance. I am also getting the request parameters , construct a string which asks user whether the email address and password they have entered are same as it displays and finally it returns that string as response to the HttpService request.

Map URL to servlet

Actually the servlet will have three names. They are public URL, internal name and actual servlet path . The public URL and internal name wont be necessary to same as actual servlet path. Internal name will be chosen by the developer who deploys servlet and it will be internally used in the deployment descriptor. The public URL is the one which users knows and when they request the container will find the internal name of the requested servlet and using internal name the container will find the actual path of the servlet. here the example goes. Please add the following code in the web.xml before </webpp> which is present under

{Tomcat_home_directory}\webapps\{Web_application_name}\WEB-INF folder of your web application.


<servlet>
 <servlet-name>servlet</servlet-name>
 <servlet-class>MyServlet</servlet-class>
 </servlet>

 <servlet-mapping>
 <servlet-name>servlet</servlet-name>
 <url-pattern>/callService</url-pattern>
 </servlet-mapping>

Tags & Definitions

<url-pattern> – defines the relative public URL

<servlet-name> – defines the internal name

<servlet-classs> – defines the fully qualified class name.

Yes we did it all, now restart your tomcat server, run your flex application, input email address, password, click Submit button and see the response of your servlet.

Download this application

Note : Download the application, deploy it in the webapps of your tomcat home directory. Copy the url below and paste in the address bar of your web application and run the application. http://localhost:8080/CallServlet/HttpRequest-debug/HttpRequest.html

Integrate flex application with Java

May 18, 2009 1 comment

Why do we need to integrate ?

Flex application is meant for presentation tier where the user will input the data but it could not directly access and store the data in database. As well as it does not have much functionality as we have server side technologies like j2ee, .net etc. I can tell you the example, we don’t have file handling mechanism in flex which is a big blow if you want to develop web application with flex alone. Mainly if you want to develop web application we should use both client and server side technology, here flex plays client role and it needs help from the server side technology to develop complete web application.

How is it possible ?

In flex, we do have service named remoting service which allows flex application to communicate with server side Java classes using BlazeDS server and we can implement remoting service in flex with the help of RemoteObject component which is one of the three components in Remote Procedure Call (RPC) components and other two are HttpService & WebService components.

now its time to get in to the action !!!. To access the methods of server side Java classes from flex application we have to do the following task.

  • Create RemoteObject component
  • Create, compile & deploy Java class
  • Configure server side settings.

Remote Object component

  • Set up your web application in Tomcat and integrate your flex application with your web application in Tomcat. If you dont know how to do this please go through to my previous post click here.
  • Create remote object instance in your MXML application file, name the instance and define the event handler function name for result and fault property.
  • The most important thing is dont forget to define the destination for your RemoteObject instance because using destination alone we map the flex application request to the corresponding Java class.

<mx:RemoteObject id="{your_instance_ name}" destination = "{your_destination_name}" result="{your_result_eventHandler_name}" fault="your_result_eventHandler_name}"/
>
  • We have to define the event handler function name for result and fault because if our remote object component successfully accessed the method then the event handler function for result will be executed and where we execute some business logic with the result. Similarly if it is not executed successfully,event handler function for fault will be executed.
  • Define event handler function function for result and fault inside <mx:script> tag
  • Create simple user interface to call and show the return string of method in server side java classes.

Server side Java class

  • Create a java class and define a method which should return string when it is called.
  • Compile the java class and copy the .class file of your java class.
  • Paste that file in to {Tomcat_home_directory}\webapps\{Web_application_name}\WEB-INF\classes folder of your web application.

Configure server side settings

  • Go in to {Tomcat_home_directory}\webapps\{Web_application_name}\WEB-INF\flex folder of your web application.
  • Open the Remoting-config.xml file in notepad.
  • Before service tag, map your remote object destination to corresponding java class.

<destination id="{your_remote_object_destination}">
<properties>
<source>{fully_qualified_class_name}</source>
</properties>
</destination>

Finally invoke your server side java method with remote object instance i.e. remoteObject_instanceName.javaClass_Method(), it will request the BlazeDS server, BlazeDS will interpret and forward the request to corresponding java class. Once the method has been executed successfully, BlazeDS will forward the response to the requested remote object instance and the event handler function defined for result will be executed.

Brief introduction about cairngorm

May 16, 2009 1 comment

Hi to all, I have been developing widgets using flex for the past two months and i have not developed using any MVC framework. When people told me that flex application should be developed using cairngorm i have not taken seriously because they have not given reason for why it should be developed with cairngorm. But today i have learnt from my mistakes and known why it should develop with cairngorm and also wish to spread an awareness about importance of cairngorm. here it goes.

Cairngorm is mostly used & well known micro architecture for building and integrating flex application with services. It has been in constant use since flex 1.5 , all because of once you have developed flex application then developer who have not been part of development of flex application can take over and continue the project without any hassles. To describe cairngorm in laymen perspective, it is nothing but divide the code in to logical functions. They are follows.

  • View
  • Model locator
  • Front controller
  • Command
  • Business delegate
  • Service locator

View

It describes user interface (UI) of flex application as well as it bounds the data in the model locator so that whenever the data in the model locator changes, the data bounded to the view will also be updated. so the user dont need to refresh the application when data changes, it will be updated automatically if it has bounded the data in the model locator.

Model locator

It is a centralized location for storing & retrieving data in flex application. It is a singleton class so that the user could not create more than one instance throughout the flex application. The user can retrieve and store the data in model locator using getInstance() static method which will return model locator instance and using that we can push & pop the data from model locator.

Front controller

The role of front controller is map the event name to the corresponding command class. When user triggers an event, the event class will inspect & redirect to corresponding command class which has been defined controller class.

Command

Command class is the one which creates an instance of delegate class and also invokes method of the delegate class which in turn invokes services defined in the service locator. When the services has been invoked, the delegate will return control to command class and the result or the fault method will be executed depend on the result of service invocation.

Delegate

The method defined in the delegate class will invoke the service using static method of service locator i.e. ServiceLocator.getInstance() which will return service locator instance and with the help of that we can invoke the service and also register the class which will handle the result of the service  invocation (generally it will be handled by command class)

Service Locator

This is where we will define all the services which we will invoke from  delegate class of our flex application.

Conclusion

Here i have tried to give an introduction about each  logical functions of cairngorm micro architecture. I have been trying to get good docs about cairngorm micro architecture for the past two months. once i have got, i will post more details about cairngorm in detailed manner. Thank you for reading this post.