More than MVC framework for Flex : Mate

Recently at work place I was working on complex GUI screen which was to be designed in Flex. Flex has quite nice capabilities : Making beautiful GUI containing charts, widgets with minimal efforts and getting data from java-based-server-side with RemoteObject. But I guess as application will get complex(Do check grooveshark.com to see how rich and complex but beautiful GUI can be created with Flex) I needed some way of structuring and designing application so anybody can understand and extend application without reading thousands of lines of action script code. Being java programmer (framework based eco-system) naturally I thought on the lines of Struts, MVC framework. But then I felt need of spring like container too where I can write/design each component separately, test them and inject and wire them in main application. There are lots of framework in flex : Cairngorm, pureMVC and Mate. Naturally first pick was Cairngorm since its official adobe framework. While browsing through HelloWorld program, I thought why I am needed to to make so many framework specific classes. Last update date on download site was very old : 30th May 2007. Then I learned about Mate : a wonderful framework which allows structuring of application in very unobtrusive way with very small learning curve. It was quite easy for me to help other team members understand new design with this framework.

Mate uses flex eventing. So with Model-View-Controller, View generates events like Submit-Form which then you can "map" to one or more Controllers. The best feature of this framework is "Injection". It injects model into controller and view so once you change model in Controller methods View updates it self. With Flex data binding and Mate injection this becomes quite powerful and very simple design for complex GUI. Mate EventMap tag allows declarative coding thus allows rapid testing and prototyping. When you look at Mate EventMap you will come to know what Application is doing, its high-level components. - your design - exactly what framework should do. Mate allowed me structure my application and set discipline.

Say for example on clicking on "submit" button, you want to show make remote call, get data, update couple of labels on screen and put data into Grid also calculate Total Amount from all records and based on some "Value" you want to show some Signal like Yellow, Amber or Green indicating current status. Such screen can be described by simple EventMap declaration as follows. View can be implemented with its own Panels : SearchPanel and DisplayPanel. SearchController will host all activity specific code like calculating Totals or Summary etc.

EventMap

---

1.  <EventHandlers type="{SearchEvent.SEARCH}">


2.     <!-- call the remoting service -->


3.     <RemoteObjectInvoker instance="{services.productService}" method="search" arguments="{event.searchCriteria1,event.searchCriteria1}">


4.         <!-- result sequence gets executed when service returns with a result -->


5.         <resultHandlers>


6.         <MethodInvoker generator="{SearchController}" method="setGridData" arguments="{resultObject}"/>                


7.         <MethodInvoker generator="{SummaryCalculator}" method="calculateSummary" arguments="{resultObject}"/>                


8.         <MethodInvoker generator="{SignalIndicator}" method="calculateAndIndicateState" arguments="{resultObject}"/>                


9.         </resultHandlers>


10.         <faultHandlers>


11.         <CallBack method="handleFault" arguments="{fault.faultDetail}"/>


12.         </faultHandlers>


13.     </RemoteObjectInvoker>


14. </EventHandlers>


15.  

View code can be refactored into two panels : SearchPanel and DisplayPanel SearchPanel looks like as follows :

SearchPanel

---

1. <mx:Script>


2.        <![CDATA[


3.            import mate.events.*;


4.            import mx.controls.Alert;


5.            import mx.collections.*;


6.            


7.            private function fireSearch():void


8.            {


9.                var event:MessageEvent = new SearchEvent(SearchEvent.SEARCH, true);


10.                event.searchCriteria1 = textInput1.text;


11.         event.searchCriteria2 = textInput2.text;


12.                dispatchEvent(event);


13.            }


14.            


15.                ]]>


16.    </mx:Script>


17.  


18.  <mx:Button id="searchBtn" label="Search" width="100" click="fireSearch()"/>

Where as DisplayPanel looks like as follows :

DisplayPanel

---

1. <mx:Panel>


2.     <mx:Script>


3.     <![CDATA[


4.         import mate.events.*;


5.         import mx.controls.Alert;


6.         import mx.collections.*;


7.         import mate.model.*;


8.  


9.         [Bindable]


10.         public var searchResult:SearchResultVO;


11.       ]]>


12.     </mx:Script>


13.  


14.  


15.     <mx:VBox label="Search Result">


16.         <mx:DataGrid id="dataGrid" width="350" height="200" dataProvider="{searchResult.Data}"/>


17.     </mx:VBox>


18. </mx:Panel>

and code below injects model into controller and DisplayPanel. The way it works like Spring context's singlton bean so same instance is shared and below tag says : DisplayPanel.searchResult = SearchController.currentResultSet

EventMap - Injector

---

1. <Injectors target="{DisplayPanel}" >


2.         <PropertyInjector targetKey="searchResult" source="{SearchController}" sourceKey="currentResultSet" />


3.  </Injectors>

Below is code for Controller which requires its own Binding when currentResultSet changes :

SearchController

---

1. package mate.controller


2. {    


3.     import flash.events.Event;


4.     import flash.events.EventDispatcher;


5.     import mx.controls.Alert;


6.     import mx.collections.ArrayCollection;


7.     import mate.model.*;


8.    


9.     public class SearchController extends EventDispatcher


10.     {    


11.         private var _currentResultSet:SearchResultVO;


12.        


13.         [Bindable (event="currentSetChange")]


14.         public function get currentResultSet():SearchResultVO


15.         {


16.             return _currentResultSet;


17.         }


18.        


19.         public function setGridData(result:SearchResultVO):void


20.         {


21.            // Do other processing if required....


22.             _currentSet = result;


23.             dispatchEvent( new Event('currentSetChange'))


24.         }


25.     }


26. }  

One more good feature if Mate is that it has MockService interface where you can write dummy remote service as part of Flex application itself. This allows developers to work independently when server-side services are not ready or avaialable.

1.  <MockRemoteObject id="helloService" showBusyCursor="true" delay="1" mockGenerator="{MockHelloService}"/>


2.  

Welcome to awesomeness of Mate.
Tushar

Uploading and Sharing Photos

We all want to share pictures all our Kodak moments with our friends. This is one kind of existence in Web 2.0 virtual world. This normally involves following pattern :

1. Take a lot of pictures by using point-and-shoot digital cameras.
2. Download them from Camera/Memory card to computer
3. Edit them in Picture editor
4. Upload them to web-album sites like flickr or picasa
5. Share photos from Picasa or Filkr
6. Upload and share on social networking sites like Orkut or Facebook.

Step 4,5 and 6 are normally mutually exclusive but then if you have friends which are on one social network and few others are on other or worse, some friends don't live in Web 2.0 so you have to send them email invitation. Now uploading photos at all these places is really pain esp. if you have hundreds of photos of your latest trip to some exotic location. I don't understand why cant somebody come-up with simple application where it allows me to do basic things like chatting, adding photos, sharing and viewing updates from all social networking sites from one single window. If you find one working application with such functionality let me know.

Picasa makes sharing photos really easy. I use Picasa Desktop Application for all my photos. Picasa has concept of gadgets where you can add button, clicking on which it will post your album to sites like Orkut or Facebook. So here is my way.

1. Download photos from Camera or Phone using Picasa.
2. Edit them using picasa
3. Use picasa tool bar buttons to upload them to Picasa Web album, orkut and facebook.

You can add Facebook button from this url : Facebook Picasa uploader plugin. Details you can find here

And orkut has inbuilt support for Picasa Web Albums See screen shot below





Hope this simple tip makes your life with Photos and Social Networks easier.

Tushar.

Google Buzz

My first impression - I like the idea of adding connected sites : twitter, picasa, blogger, reader and all status messages. I am still searching for good social network desktop client which will connect to all my accounts : gmail, orkut, facebook, yahoo, linked-in, twitter but there is not such application existing yet. The once which was closer is Digsby, but digsby's UI is really clumsy to use.



Buzz is single window solution. You want to share picasa album or your recent tweet it works. Lets hope that it does not fail as Google Wave failed due to absence of freinds. I hope google this time sends invitations to clusters of users such that when I use buzz I will find at least some friends to share buzz. Buzz is suppose to compete with Facebook and Twitter, it surely has plus points against both

• it works right inside the most popular Google application - gmail
• no 140 character limit
• auto publish feature : when I tweet, same twit will be "buzzed" too

I hope Buzz comes with lot of "twitter" applications by default or provides options to add applications written with help of Buzz API like Gmail Labs application. One thing I would have liked to see is that Buzz should have implemented hashtags that are popular in twitter. Hashtags are like "user metadata" which helps to follow/search tweets that you are interested thus allowing to connect/discover like minded people.

On other side, I don't know what google is thinking of having two different products : Wave and Buzz. I think since Wave has failed Google was in serious need to restrict facebook's advance so google added social networking aspects to its most loyal user base - Gmail. I am not sure about Buzz success, its surely going to tank as like google's other recent products. Facebooks strong point is that all sharing links, photos, activities, thoughts is at the central of page but in gmail is just another view so am not sure it should be part of gmail. Gmail view is OK but there should be separate page also where I can just spend time on Buzz. Hope google adds new features slowly.

Google Nexus One

Two days back I bought my android phone in US. Cant wait to get hands on it. Here are few pics of it.





The most astonishing thing is that it got 1 GHz CPU while most of the smart phones in current generation are around 528 MHz thats big advantage and its got bigger screen. For screen bigger the better. It also has Flash Player, significant factor over IPHONE 3GS.

Tech Specifications. For details spec see : Google Site

• Processor Qualcomm QSD 8250 1 GHz
• Android Mobile Technology Platform 2.1 (Eclair)
• 512MB Flash 512MB RAM 4GB Micro SD Card (Expandable to 32 GB)
• Display 3.7-inch (diagonal) widescreen WVGA AMOLED touchscreen 800 x 480 pixels
• Camera 5 megapixels Autofocus LED flash with Video captured at 720x480 pixels at 20 fps
• 3G : UMTS Band 1/4/8 (2100/AWS/900)
• Wi-Fi (802.11b/g)
• Bluetooth 2.1 + EDR

There have been lot of speculation about google's entry in Mobile Phone market. Everybody is speculating "how still google not able to deliver a Iphone-killer" since Nexus One still will be be at par with iphone when it comes to user experience especially applications but for Giant google the achievement is launch of url : google.com/phone. Here is detailed blog about it : Google's URL

Querying Java Objects stored in Terracotta's NAM Part 3

First and Second part of this series I talked about Querying data structures available in Java. First part specifically talked about existing ones like JoSQL, JxPath and Quaere and discussed indexing problem. Second part specifically talked about lucene and jofti as indexing frameworks and wrote small framework to test and get some performance numbers. This test showed that B-tree index (memory and possibly disk based) is suitable and not lucene index. Third part of this series now I am discussing my own small framework- tcquerymap which is rewrite of Jofti. Jofti is old and not maintained and uses jdk14 libraries. Now even documentation link does not work : http://prism-index.com/guide.html.

querymap documentation link : Getting Started With Querymap
querymap source download : Complete Source Code with Eclipse Project
querymap TIM : Copy this TIM to terracotta modules directory to use it
querymap terracotta sample app : Download sample eclipse App. You can use Terracotta eclipse plugin to launch it within eclipse

So the basic idea is maintaining in-memory indexes which index String Ids with "Comparable" as Keys. All primitive wrappers in Java implement this interface so no special conversion is needed.


How it works
It scans java objects and makes comparable objects for each of the property mentioned to be indexed. It inserts these comparable objects in its own tree against String Ids assigned to the java object. So in-effect its nothing more than maintaining many in-memory Maps. In fact the implementation that I wrote uses JDK TreeMap and not b-tree map. But in-future it will be replaced by more performant B-tree.

Querying
One needs to understand that with in-memory object indexes its only possible to implement subset of SQL query and no join queries. To start with, small framework only implements following operations : arithmetic operands : <,>,<=,>=,==. Logical operands : AND , OR. Range : BETWEEN, Set : IN

To implement querying SQL parser needs to be implemented. I choose to avoid writing parser and implemented direct API kind of querying similar to Quaere. I find Domain specific languages more intuitive since when developer writes code for it he know what querying he writes. So interface looks like below. It is not as good as quaere. Quaere is DSL, below API is just few interfaces implemented. Here execute returns List of IDs put into index against the properties.


import static com.google.code.querymap.ObjectQuery.*;

Collection col = from(Domain.class).where(
gt("inner.property2", 60),
lt("inner.property2",89)
eq("inner.property3",random.nextInt(NUM_OBJECTs))
).execute();



So basically it is equivalent of follwing SQL

select from Domain
where inner.property2 > 60
and inner.property2 < property3=rand(NUM_OBJECTS)


How it performs
Naturally is not as performant as Jofti since it used JDK tree map which uses red-black tree. In future when I complete writing my own b-tree implementation I expect to perform as good as Jofti. Jofti further implemented node level locking so multiple concurrent insert opertations can work parellel. This can also be implemented too. But query performance is not bad and I expect it to improve with b-tree implementation.


Integration with Terracotta
Since it uses TreeMap it is cluster-able easily. Attached tc-config.xml has all correct declarations for it. One more advantage is with Terracotta is that object identifier are readily generated by Terracotta. See implementation TerracottaQueryMap. Please dont compare performance of TerracottaQueryMap against HashMap, CHM or Terracotta Distributed Map(Concurrent String Map old name) since all these are just single index maps so easy to stripe or employ mulitple locks.

For using it as TIM you need to add following lines to tc-config.xml


<modules>
<module id="com.google.code" name="querymap-1.0" version="1.0.0">
</module>


In code you can use it as queryable map as follows. Here propList is list of properties to be indexed.


TerracottaQueryMap map = new TerracottaQueryMap(Domain.class,proplist));

map.put(key,domain1);
map.put(key,domain2);
map.put(key,domain3);


To Query.


Collection col =map.entrySet(
from(Domain.class).
where(
eq("inner.property2",random.nextInt(NUM_OBJECTs))
)
);


Future directions planned
Java has hugh limitation for memory intensive application. So achieve scale two approaches : partition index and merge results or use disk to overflow index pages. Other thing I see can be implemented is that when query selects random elements these random elements need to be faulted from Terracotta server thus degrading performance, same elements can be read from local store too like EHCACHE. Later on this topic separately.

If you think this framework is useful please let me know. You can download its source as Eclipse project(sole dependency on tc.jar) and as Terracotta Integration Module here.

Tushar

Erlang and Concurrency

Here I write a lot about my experiments with Terracotta which is shared durable memory for Java applications which are multi-threaded. But some days before I came across erlang, language which is created at Erricsson for running fault-tolerant telecom applications. Whats so special about it?. If you google or rather "Bing" it you will find plenty of things about it. How cool and scalable it is?. If you read this you will even come to know How Goldman Sachs was using it to gain significant advantage in program trading over other competitors and how others are trying to steal leaked source code.

So erlang is not procedural programming language its functional programming language. Frankly I also need to understand whats so different about it. But I saw this presentation of infoQ site about erlang concurrency and was amazed. Right from starting I always thought about following graph - throughput increases as a function of in-coming request rate till some point but after it stabilizes and then it drops. It drops because of system overload. In a perfectly cpu-intensive lock-contention free application this will happen because of cpu context switching.


But in erlang it stays constant instead your latency (response time) increases. This is according to Little's Law. Little law says relation between throughput and latency is number of users in system. N = RX.




Above is famous graph of benchmark of YAWS (Http server written in erlang) against Apache and you can see how early apache gets saturated and dies. You can read details here but explanation is given here is :

"The problem with Apache is not related to the Apache code per se but is due to the manner in which the underlying operating system (Linux) implements concurrency. We believe that any system implemented using operating system threads and processes would exhibit similar performance. Erlang does not make use of the underlying OS's threads and processes for managing its own process pool and thus does not suffer from these limitations."


So basically all magic is erlang's concurrency model : No Shared State, Only message passing between light-weight processes. Erlang processes are way lighter than Java Threads since they are logical entities and not tied to user-level or kernel-threads. Thus erlang shows "No Shared State" concurrency model scales well. Since now JVM is touted as platform, I am looking forward to see erlang implementation on JVM and see how it does against other concurrent interpreted languages - scala. This is great post why JVM is unfit for such porting. May be Java 8 ( I think closures are not part of Java 7). This is also interesting read about Erlang on Java : Erlang Concurrency model on JVM . Some of work on writing OTP(erlang's sdk for writing applications) for scala http://github.com/jboner/scala-otp/tree/master/.

I have already got Programming Erlang book now looking forward to write first program in OTP.

Tushar

Links : Java Sample Apps

Many times you hear or read something cool about some framework or tool and you are interested in Sample application written for it just to play with it, browse and go through source-code to find out how to code it.

Here is list of great sample Apps that I just stumbled upon while reading this great blog about Tomcat Clustering.

Link : http://www.mediafire.com/jbs-blog-examples

List is
* IBM-DB2-JDBC-XML.zip
* IBM-DB2-JDBC-Relational.zip
* Google-App-Engine.zip
* WebServices-JAX-WS-Java-SE.zip
* RESTful-WebServices-Apache-CXF.zip
* WebServices-Apache-CXF-Spring-2.5.zip
* WebServices-Apache-CXF.zip
* WebServices-WSIT-Reliable-Messaging.zip
* WebServices-JAX-WS-Web-App-Client-Basic-Security.zip
* WebServices-JAX-WS-Web-App-Client.zip
* WebServices-JAX-WS-Web-App.zip
* PMD-Clover2-Cobertura-Maven2-Test.zip
* WebServices-JAX-WS.zip
* WebServices-Axis2-with-Eclipse-client.zip
* Spring-Maven2-annotations-example.zip
* Spring-Maven2-basic-example.zip

I will add following to above lists which I know about

Terracotta Samples Application written by Team

• Terracotta Reference Application : Examinator
  


• 
  Terracotta with Spring and EHCACHE
  


• 
  Terracotta, Hibernate, Spring
  


• 
  Terracotta, Spring, Hibernate
  


• Sample Web App with Maven, Terracotta