Thursday, November 18, 2010

Spring Roo, Starting with GWT 2.1 Project

Spring Roo generates GWT 2.1 project with all the new GWT design features such as Activities, RequestFactory, UIBinder, PlaceController ( If you want to know more about these, watch Google I/O 2010 Ray Ryan's session in here http://www.google.com/events/io/2010/sessions/architecting-production-gwt.html . It also generates the Server side persistence logic using AspectJ.

In this article we will take a deep look into what are the files Roo generates as there is not enough documentation for a beginner.

First download SpringSource Tool Suite from http://www.springsource.org/roo/start. ( You can also try with Spring Roo Command line and Normal Eclipse Installation ). But lets stick to STS as it provides integration with all spring libraries and Maven build tool.

Once you download the installer/Archive for the STS, install it. ( I downloaded the installer exe as it was lot smaller than the archive file ). Installing the STS using the exe file should be straight forward. Just make sure you install all the default packages.

Lets start the STS.exe from the installed location. ( Just incase if you have to search for it, It should be inside sts-2.x.x-RELEASE folder inside the installed folder ). Launching the STS.exe would take a while to load ( It's a huge application with lot of eclipe plugins to be loaded). Once it launches, you will see the welcome page like below.


To install the GWT tools (including the SDK), you simply navigate to the Install Extensions Page. GWT plugin is in Language and Framework tooling sections in the Extensions Tab on the dashboard. The Extensions tab also has few interesting extensions like EclEmma, a code coverage tool, Tasktop Pro, a time tracking tool and so on. But they are optional to follow this article. You will asked to restart the STS after installing the plugins.

Now we have SpringSource Tool Suite with Google Web Toolkit with the SDK installed. You will see the google web toolkit actions on the toolbar now as shown in the diagram below.




Lets start with GWT Project creation using Roo shell from Window->Show View -> Roo Shell. ( Since we have installed GWT Plugin, you can also generate the GWT Project using Web Application Project wizard. But that doesnot use Roo's magic of generating all the boiler plate code ).

On the Roo Shell View click on "Create New Roo Project" action on the toolbar. Fill in the required information on the roo project creation like Project Name, Top level package name for the GWT Project and click on Finish on the wizard's Next Page. STS creates the Roo project with AspectJ Support, it requires AspectJ weaving support to be enabled. Enable AspectJ weaving and restart the workbench. The Roo_GWT project will be like as shown below.

Click on Open Roo Shell on the Roo Shell view and choose Roo_GWT project. The Roo shell loads the Roo_GWT project and starts the roo.

Now to create the GWT project layout on the Roo_GWT project,from the roo prompt type in gwt setup


Created SRC_MAIN_WEBAPP\WEB-INF\spring
Created SRC_MAIN_WEBAPP\WEB-INF\spring\webmvc-config.xml
Created SRC_MAIN_WEBAPP\WEB-INF\web.xml
Managed SRC_MAIN_WEBAPP\WEB-INF\web.xml
gwt setup
Managed ROOT\pom.xml [Added dependency org.springframework:spring-web:${spring.version}]
Managed ROOT\pom.xml [Added dependency org.springframework:spring-webmvc:${spring.version}]
Managed ROOT\pom.xml [Added dependency org.springframework.webflow:spring-js-resources:2.2.0.RELEASE]
Managed ROOT\pom.xml [Added dependency commons-digester:commons-digester:2.0]
Managed ROOT\pom.xml [Added dependency commons-fileupload:commons-fileupload:1.2.1]
Managed ROOT\pom.xml [Added dependency javax.servlet:jstl:1.2]
Managed ROOT\pom.xml [Added dependency javax.el:el-api:1.0]
Managed ROOT\pom.xml [Added dependency joda-time:joda-time:1.6]
Managed ROOT\pom.xml [Added dependency javax.servlet.jsp:jsp-api:2.1]
Managed ROOT\pom.xml
Managed ROOT\pom.xml [Added dependency com.google.gwt:gwt-servlet:2.1.0]
Managed ROOT\pom.xml [Added dependency com.google.gwt:gwt-user:2.1.0]
Managed ROOT\pom.xml [Added dependency org.json:json:20090211]
Managed ROOT\pom.xml [Added dependency com.googlecode.gwt.inject:gin:1.0]
Managed ROOT\pom.xml [Added dependency javax.validation:validation-api:1.0.0.GA]
Managed ROOT\pom.xml [Added dependency xalan:xalan:2.7.1]
Managed ROOT\pom.xml
Managed SRC_MAIN_WEBAPP\WEB-INF\web.xml
Managed SRC_MAIN_WEBAPP\WEB-INF\spring\webmvc-config.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client
Created SRC_MAIN_JAVA\com\roo\gwt\ApplicationScaffold.gwt.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\request
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldDesktopShell.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldMobileShell.java.orig
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldMobileShell.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldDesktopShell.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldDesktopApp.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldMobileApp.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldMobileShell.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldApp.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ScaffoldMobileApp.java.orig
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\Scaffold.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\MobileProxyListView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ByteParser.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ByteRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\CharRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\FloatRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ShortRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\MobileProxyListView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\CharBox.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\FloatParser.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\BigDecimalRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ShortBox.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ByteBox.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\ShortParser.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\BigDecimalBox.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\CharParser.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\CollectionRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\FloatBox.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ui\BigDecimalParser.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui
Created SRC_MAIN_JAVA\com\roo\gwt\server
Created SRC_MAIN_JAVA\com\roo\gwt\client\style
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\MobileListResources.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\mobile.css
Created SRC_MAIN_JAVA\com\roo\gwt\shared
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\ScaffoldInjector.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\InjectorWrapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\ScaffoldModule.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\MobileInjector.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\DesktopInjectorWrapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\MobileInjectorWrapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\ioc\DesktopInjector.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyListView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyEditView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\AbstractProxyListActivity.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\AbstractProxyListView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyPlace.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\FindAndEditProxy.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyDetailsView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\CreateAndEditProxy.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ScaffoldPlaceHistoryMapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\AbstractProxyEditActivity.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyListPlacePicker.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyPlaceToListPlace.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\CollectionRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\PlaceHistoryFactory.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\place\ProxyListPlace.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\createButton.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\groupIcon.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\openGradient.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\selectionGradient.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\titleGradient.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\gwtLogo.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\userIcon.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\backButton.png
Created SRC_MAIN_JAVA\com\roo\gwt\client\style\images\rooLogo.png
Created SRC_MAIN_WEBAPP\ApplicationScaffold.html
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\activity
Created SRC_MAIN_JAVA\com\roo\gwt\client\scaffold\activity\IsScaffoldMobileActivity.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ApplicationEntityTypesProcessor.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ApplicationRequestFactory.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ApplicationListPlaceRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ApplicationMasterActivities.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ApplicationDetailsActivities.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ScaffoldMobileActivities.java


Well, that generated a LOT of classes, files, images in the Roo_GWT project. Lets look at the different types of files it generated.




Managed ROOT\pom.xml [Added dependency org.springframework:spring-web:${spring.version}]
Managed ROOT\pom.xml [Added dependency org.springframework:spring-webmvc:${spring.version}]
Managed ROOT\pom.xml [Added dependency org.springframework.webflow:spring-js-resources:2.2.0.RELEASE]
Managed ROOT\pom.xml [Added dependency commons-digester:commons-digester:2.0]
Managed ROOT\pom.xml [Added dependency commons-fileupload:commons-fileupload:1.2.1]
Managed ROOT\pom.xml [Added dependency javax.servlet:jstl:1.2]
Managed ROOT\pom.xml [Added dependency javax.el:el-api:1.0]
Managed ROOT\pom.xml [Added dependency joda-time:joda-time:1.6]
Managed ROOT\pom.xml [Added dependency javax.servlet.jsp:jsp-api:2.1]
Managed ROOT\pom.xml
Managed ROOT\pom.xml [Added dependency com.google.gwt:gwt-servlet:2.1.0]
Managed ROOT\pom.xml [Added dependency com.google.gwt:gwt-user:2.1.0]
Managed ROOT\pom.xml [Added dependency org.json:json:20090211]
Managed ROOT\pom.xml [Added dependency com.googlecode.gwt.inject:gin:1.0]
Managed ROOT\pom.xml [Added dependency javax.validation:validation-api:1.0.0.GA]
Managed ROOT\pom.xml [Added dependency xalan:xalan:2.7.1]
Managed ROOT\pom.xml




Roo managed the maven pom files with the gwt dependency files. We dont have to update the dependency section manually.



Created SRC_MAIN_WEBAPP\WEB-INF\spring
Created SRC_MAIN_WEBAPP\WEB-INF\spring\webmvc-config.xml
Created SRC_MAIN_WEBAPP\WEB-INF\web.xml
Managed SRC_MAIN_WEBAPP\WEB-INF\web.xml



Generated web.xml and webmvn-config.xml for the Server side configuration. The web.xml contains all the servlet mapping and Spring application context loading defined. The applicationContext.xml file gets created when you create the roo project using the New Roo Project wizard, but the file will not have any details about the persistence mechanism.

In addition to the Maven POM Management, Spring Web MVC. Roo generates a basic GWT classes required for a Master/Detail layout web application.

  • ApplicationScaffold.gwt.xml - GWT xml file with Entry point class defined.
  • Client Scaffold Package - Roo by default generates classes for viewing the application on a Desktop browser and Mobile Browser. There will be classes with Desktop and Mobile in the class name for the UI.
  • Client Scaffold UI Package - Contains basic ui boxes.
  • Client Scaffold IOC Classes to Inject dependencies using Guice/Gin. - Contains Injector classes for Desktop and Mobile to return the respective Application as the entry point.
  • Client Managed Activities - Contains ApplicationMasterActivities and ApplicationDetailActivities

Adding persistence Support

Now that we have the basic project structure created we can add persistence support. Roo supports adding different types of Persistence mechanism and database. For example if you want to use Hibernate with in memory database.


persistence setup --provider HIBERNATE --database HYPERSONIC_IN_MEMORY
Managed SRC_MAIN_RESOURCES\META-INF\spring\applicationContext.xml
Created SRC_MAIN_RESOURCES\META-INF\persistence.xml
Created SRC_MAIN_RESOURCES\META-INF\spring\database.properties
Managed ROOT\pom.xml [Added dependency org.hsqldb:hsqldb:1.8.0.10]
Managed ROOT\pom.xml [Added dependency org.hibernate:hibernate-core:3.5.5-Final]
Managed ROOT\pom.xml [Added dependency org.hibernate:hibernate-entitymanager:3.5.5-Final]
Managed ROOT\pom.xml [Added dependency org.hibernate.javax.persistence:hibernate-jpa-2.0-api:1.0.0.Final]
Managed ROOT\pom.xml [Added dependency org.hibernate:hibernate-validator:4.1.0.Final]
Managed ROOT\pom.xml [Added dependency cglib:cglib-nodep:2.2]
Managed ROOT\pom.xml [Added dependency javax.transaction:jta:1.1]
Managed ROOT\pom.xml [Added dependency org.springframework:spring-jdbc:${spring.version}]
Managed ROOT\pom.xml [Added dependency org.springframework:spring-orm:${spring.version}]
Managed ROOT\pom.xml [Added dependency commons-pool:commons-pool:1.5.4]
Managed ROOT\pom.xml [Added dependency commons-dbcp:commons-dbcp:1.3]
Managed ROOT\pom.xml



We can see that roo modified the applicationContext.xml with dataSource information, added a persistence.xml file with the hibernate properties, database.properties file with database details and updated the pom file with all the dependencies.

Adding Domain Objects

From the roo prompt do the following,


entity --class ~.domain.Contact
Created SRC_MAIN_JAVA\com\roo\gwt\domain
Created SRC_MAIN_JAVA\com\roo\gwt\domain\Contact.java
Created SRC_MAIN_JAVA\com\roo\gwt\domain\Contact_Roo_Configurable.aj
Created SRC_MAIN_JAVA\com\roo\gwt\domain\Contact_Roo_Entity.aj
Created SRC_MAIN_JAVA\com\roo\gwt\domain\Contact_Roo_ToString.aj
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ContactActivitiesMapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ContactEditActivityWrapper.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ContactDetailsActivity.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ContactListActivity.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactMobileListView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactListView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactListView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactDetailsView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactDetailsView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactMobileDetailsView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactMobileDetailsView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactEditView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactEditView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactMobileEditView.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactMobileEditView.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactProxyRenderer.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactSetEditor.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactSetEditor.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactListEditor.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ContactListEditor.ui.xml
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ContactProxy.java
Created SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ContactRequest.java
Managed SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ApplicationEntityTypesProcessor.java
Managed SRC_MAIN_JAVA\com\roo\gwt\client\managed\request\ApplicationRequestFactory.java
Managed SRC_MAIN_JAVA\com\roo\gwt\client\managed\ui\ApplicationListPlaceRenderer.java
Managed SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ApplicationMasterActivities.java
Managed SRC_MAIN_JAVA\com\roo\gwt\client\managed\activity\ApplicationDetailsActivities.java
~.domain.Contact


This generates lot of classes which belong to different layers of a GWT Application,

Activities

ContactActivitiesMapper
ContactEditActivityWrapper
ContactDetailsActivity
ContactListActivity

UI Binder

ContactMobileListView
ContactListView.ui.xml
ContactDetailsView
ContactDetailsView.ui.xml
ContactMobileDetailsView
ContactMobileDetailsView.ui.xml
ContactEditView
ContactEditView.ui.xml
ContactMobileEditView
ContactMobileEditView.ui.xml
ContactSetEditor
ContactSetEditor.ui.xml
ContactListEditor
ContactListEditor.ui.xml

Request Factory
ContactProxy
ContactRequest

To understand more about these different terminologies and how they fit into the GWT Architecture, please read this link http://code.google.com/webtoolkit/doc/latest/DevGuideRequestFactory.html


Now lets add some fields to the Contact pojo object


field string --fieldName name --notNull


This will again update all the ui classes, request factory classes and aspectj classes to incorporate the new field.

Lets compile the project using GWT Compile from the toolbar. GWT toolkit should compile all combinations of the application without any errors.


Compiling module com.roo.gwt.ApplicationScaffold
Compiling 12 permutations
Compiling permutation 0...
Compiling permutation 1...
Compiling permutation 2...
Compiling permutation 3...
Compiling permutation 4...
Compiling permutation 5...
Compiling permutation 6...
Compiling permutation 7...
Compiling permutation 8...
Compiling permutation 9...
Compiling permutation 10...
Compiling permutation 11...
Compile of permutations succeeded
Linking into C:\STS_BLOG\workspace\Roo_GWT\target\Roo_GWT-0.1.0.BUILD-SNAPSHOT\applicationScaffold
Link succeeded
Compilation succeeded -- 90.265s



Now run the application as a Web Application ( Right Click-> Run As -> Web Application). From the development mode view double click the url which will launch the application in your default browser. You can see the application as shown below.


You can click on Create Contact and Add new contact like below

We have written no queries, no business logic for the Contact object. But we got the Create contact , contact list, edit contact. This is where Roo comes in really handy. It generates a default set of queries, ui when we gave the commands "field string --fieldName name --notNull" Roo updates the ContactProxy object with the new field.

Where are the queries

If you look at the domain package for the Contact object ( disable all the filters on the package explorer as by default only java classes are shown for a package ) you will find .aj files with *Roo_Configurable.aj, *_Roo_Entity.aj, *_Roo_JavaBean.aj, *_Roo_ToString.aj files.

Specifically Contact_Roo_Entity.aj file will have all the query for interacting with the database.


public static final EntityManager Contact.entityManager() {
EntityManager em = new Contact().entityManager;
if (em == null) throw new IllegalStateException("Entity manager has not been injected (is the Spring Aspects JAR configured as an AJC/AJDT aspects library?)");
return em;
}

public static long Contact.countContacts() {
return entityManager().createQuery("select count(o) from Contact o", Long.class).getSingleResult();
}

public static List Contact.findAllContacts() {
return entityManager().createQuery("select o from Contact o", Contact.class).getResultList();
}

public static Contact Contact.findContact(Long id) {
if (id == null) return null;
return entityManager().find(Contact.class, id);
}

public static List Contact.findContactEntries(int firstResult, int maxResults) {
return entityManager().createQuery("select o from Contact o", Contact.class).setFirstResult(firstResult).setMaxResults(maxResults).getResultList();
}


These methods return the required data to the UI via the RequestFactory as ContactProxy Objects. ( You will understand this if you have read the GWT RequestFactory Article ). The methods in the aj files can be overwritten in the Contact entity class in which case Roo will remove the method from the .aj file. (Read more on this here http://static.springsource.org/spring-roo/reference/html-single/index.html )

Overall, Roo is pretty good at generating and maintaining all the boiler plate code which is a painful job to write. But it can only generate based on a simple application structure. Not all applications are just Master/Detail layout.

How do i use Service Layer with the Request Factory

According to GWT 2.1 you cant do this as RequestFactory is tightly bound with the Domain Driven Development approach. According to google service layer approach is going to be supported in GWT 2.1.1.

Wednesday, July 15, 2009

Eclipse RCP : Single instance of RCP Application

There are methods of maintaining a single instance of an application. Most often the application creates a lock file and holds on to it during the lifecycle of the application.

A new instance of the application will try to find this file and if it exists, the application will try to show the existing instance to the user, preventing from creating whole new instance of the application. One drawback of this approach will be if the application crashes leaving the lock file. The user has to manually delete the file (or application can try deleting this file )
The same can be achieved via opening a server socket when the application is opened. Now how do we do it for a simple RCP Application.



/*
* (non-Javadoc)
* @see org.eclipse.equinox.app.IApplication#start(org.eclipse.equinox.app.IApplicationContext)
*/
public Object start(final IApplicationContext context)
{
if (!checkServerPort())
{
try
{
final ServerSocket server = new ServerSocket(5000);

serverThread = new Thread(new Runnable()
{
@Override
public void run()
{
boolean socketClosed = false;
while (!socketClosed)
{
if (server.isClosed())
{
socketClosed = true;
}
else
{
try
{
Socket client = server.accept();
BufferedReader in = new BufferedReader(new InputStreamReader(client
.getInputStream()));
new UIJob("Reopening the app...")
{
@Override
public IStatus runInUIThread(IProgressMonitor monitor)
{
advisor.getWindowAdvisor().handleEvent(null);
return null;
}
}.schedule();

/**
* if (SINGLE_INSTANCE_SHARED_KEY.trim().equals(message.trim())) {
* System.out.println("Receiving message"); }
*/
in.close();
client.close();
}
catch (IOException ex)
{
socketClosed = false;
}
}
}
}
});
serverThread.start();
}
catch (IOException ex)
{
ex.printStackTrace();
}
}
else
{
try
{
Socket clientSocket = new Socket(InetAddress.getLocalHost(), 5000);
OutputStream out = clientSocket.getOutputStream();
out.write(SINGLE_INSTANCE_SHARED_KEY.getBytes());
out.close();
clientSocket.close();
}
catch (UnknownHostException ex)
{
ex.printStackTrace();
}
catch (IOException ex)
{
ex.printStackTrace();
}
return IApplication.EXIT_OK;
}
final Display display = PlatformUI.createDisplay();
try
{

final int returnCode = PlatformUI.createAndRunWorkbench(display, advisor);
if (returnCode == PlatformUI.RETURN_RESTART)
{
return IApplication.EXIT_RESTART;
}
return IApplication.EXIT_OK;
}
finally
{
display.dispose();
}
}

private boolean checkServerPort()
{
try
{
new Socket("localhost", 5000);
}
catch (IOException ex)
{
return false;
}
return true;
}

/*
* (non-Javadoc)
* @see org.eclipse.equinox.app.IApplication#stop()
*/
public void stop()
{
final IWorkbench workbench = PlatformUI.getWorkbench();
if (workbench == null)
{
return;
}
final Display display = workbench.getDisplay();
display.syncExec(new Runnable()
{
public void run()
{
if (!display.isDisposed())
{
workbench.close();
}
}
});
}



Now when the application is launched for the first time, it will open a server socket 5000 and will start listening on it. The next instance of the application will check the server port and if it is used already, it will create a client for that server socket and send a message to the server.

When the server receives any message from the client, it will reopen the instance which created the server socket.

The handleEvent method on the WorkbenchWindowAdvisor will have to have the following code..


/*
* (non-Javadoc)
* @see org.eclipse.swt.widgets.Listener#handleEvent(org.eclipse.swt.widgets.Event)
*/
@Override
public void handleEvent(Event event)
{
Shell workbenchWindowShell = getWindowConfigurer().getWindow().getShell();
workbenchWindowShell.setVisible(true);
workbenchWindowShell.setActive();
workbenchWindowShell.setFocus();
workbenchWindowShell.setMinimized(false);
}


Now enjoy the single instance of the RCP application. This approach can be used for any java application.

Friday, July 10, 2009

Eclipse RCP : Redirecting eclipse errors to log4j

Its sometimes tedious to find the real exception occured when using an eclipse based application. Since it goes under the workspace/.metadata/.log file. It takes a while to figure this out. But most of the desktop application do write to a log file of its own. So when using eclipse using two log files to know about the application is kind of not nice.

But still eclipse provides a way to listen to the log messages of its own. So if the application uses its own logging , it can listen to the eclipse log and add it to its own logger. Here we will look at connecting eclipse log messages to the log4j logger.

Eclipse Platform provides a method to add listeners Platform.addLogListener(ILogListener);

So how do we add the listener to the Platform. In the Activator of the application plugin's start method, add the following.


public class Activator extends AbstractUIPlugin {

private ILogListener listener;


@Override
public void start(final BundleContext context) throws Exception {
super.start(context);
plugin = this;
listener = new Listener();
Platform.addLogListener(listener);
}

@Override
public void stop(final BundleContext context) throws Exception {
Platform.removeLogListener(listener);
listener = null;
plugin = null;
super.stop(context);
}

}


Now every error/warning eclipse logs to its .log file under .metadata directory will be sent to the log listener. How does the log listener handle the events from the eclipse?


package com.logging;
public class Listener implements ILogListener {
private static final Logger LOGGER = Logger.getLogger(Listener.class.getName());

@Override
public void logging(final IStatus status, final String plugin) {
if (status.getSeverity() == IStatus.WARNING) {
if (status.getException() == null) {
LOGGER.warn(status.getMessage());
} else {
LOGGER.warn(status.getMessage() + status.getException());
}
} else if (status.getSeverity() == IStatus.ERROR) {
if (status.getException() == null) {
LOGGER.error(status.getMessage());
} else {
LOGGER.error(status.getMessage()+status.getException());
}
}
}
}


Now all the eclipse errors and warnings will go to the logger which is configured for Listener.class.getName().

To get all the log messages from the eclipse. the log4j.properties

log4j.category.com.logging.Listener=all

This will log all the errors and warnings from the eclipse application to the log4j's log file or console as configured.

Monday, July 6, 2009

Eclipse RAP : Custom Widget development

It took a while to understand and create a custom widget but finally i could do it. I wanted to create a custom widget to draw sequence of svg graphics. I followed the Custom widget development at the RAP help site. It helped me to get a good start but since i was trying to do SVG it didnt really work at my first attempt..(i know... nothing works at the first attempt).

The SVG support i wanted to create was something like below.

video

Here is what i did to create a custom widget.

1. Create a new plugin project and name it like com.xyz.project.mywidget
This is not mandatory but its good to call the plugin as the widget name.

2. Create a package com.xyz.project.mywidget
This package will contain the server side, client side and API resource classes. Just follow as explained in the RAP help.

3. Create the server side Widget class , i wanted a widget to send events to the server and also behave as a selection provider when a image is clicked. So i extended SWT Composite and implemented ISelectionProvider.


public class MyWidget extends Composite implements ISelectionProvider {

/**
* for showing multiple images on the widget
*/
private String[] images;

/**
* To get the selection back from the client.
*/
int selectionIndex;

/**
* Listeners
*/
private ListenerList listeners = new ListenerList();

/**
* Selection.
*/
private ISelection selection;

private String selectedImage;

public MyWidget(Composite parent) {
super(parent, SWT.NONE);
}

public String[] getImages() {
return images;
}

public void setImages(String[] parts) {
this.images = parts;
}

@Override
public void setLayout(Layout layout) {
super.setLayout(new FillLayout());
}

public String getSelectedImage() {
return selectedImage;
}

public void setSelectedImage(String selectedPart) {
this.selectedImage = selectedPart;
if (selectedPart != null) {
selectionIndex = Integer.parseInt(selectedPart);
setSelection(new StructuredSelection(images[selectionIndex / 2]));
}
}

public void addSelectionChangedListener(ISelectionChangedListener listener) {
listeners.add(listener);
}

public ISelection getSelection() {
return selection;
}

public void removeSelectionChangedListener(
ISelectionChangedListener listener) {
listeners.remove(listener);
}

public void setSelection(ISelection selection) {
this.selection = selection;
Object[] list = listeners.getListeners();
for (int i = 0; i < list.length; i++) {
((ISelectionChangedListener) list[i])
.selectionChanged(new SelectionChangedEvent(this, selection));
}
}
}



Follow this post for how to implement ISelectionProvider - http://random-eclipse-tips.blogspot.com/2009/02/eclipse-how-to-implement.html

Now that the server side, widget is ready, we need the client side widget code, the qooxdoo javascript code. Read the qooxdoo explanation in RAP custom widget tutorial and follow it, it gives you a basic idea of what to do.


    qx.Class.define( "com.xyz.project.MyWidget", {
extend: qx.ui.layout.CanvasLayout,

construct: function( id ) {
this.base( arguments );
this.setHtmlAttribute("id",id);
this._id = id;
},

properties : {
images : {
init : "",
apply : "load"
},

members : {
load : function() {
var current = this.getParts()[0];
if( current != null && current != "" ) {
qx.ui.core.Widget.flushGlobalQueues();
var id = document.getElementById( this._id );
var wm = org.eclipse.swt.WidgetManager.getInstance();
var designWidgetId = wm.findIdByWidget( this);
var newParts = this.getParts();
var current = null;
var image = 1;
if(this.__paper == null ) {
this.__paper = Raphael(id, newParts.length*100, 480);
startx = 10;
starty = 10;
width = 100;
height=25;
curve=10;
var part=0, colorhue = .6 || Math.random(),
color = "hsb(" + [colorhue, 1, .75] + ")";
var selectionColor = "#d54";
var currentSelection = null;
var detail = this.__paper.rect(startx, starty+height+5, 200, 100, 5).attr({fill: "#d54" , stroke: "#474", "stroke-width": 2}).hide();
label0 = this.__paper.text(startx+20,starty+height+10,"ID : ").hide();
label1 = this.__paper.text(startx+20,starty+height+25,"Other : ").hide();
for (part=0;part<newParts.length;part++)
{
(function(paper,part,type){
var c = "#ccc";
if(image==0) {
if(type == "image1") {
paper.image("./Part_icon_image1.png", startx, starty, width, height);
}else if(type == "image2") {
image("./Part_icon_image2.png", startx, starty, width, height);
}
}
var label = paper.text(startx+25,starty+10,part).hide();
paper.rect(startx,starty,width,height,curve).attr({stroke: c, fill: c, "fill-opacity": .4}).
mouseover(
function(){
this.animate({"fill-opacity": .75}, 500);
detail.show().animate({x: 10+(width*part), y: starty+height+5}, 200 );
label0.attr({text: "ID : "+newParts[part]}).show().animate({x: 40+(width*part), y: starty+height+10}, 200);
label1.attr({text: "Other : "}).show().animate({x: 40+(width*part), y: starty+height+25}, 200);
paper.safari();
}).
mouseout(
function(){
this.animate({"fill-opacity": .25}, 500);
detail.hide();
label0.hide();
label1.hide();
paper.safari();
}).
click(
function(){
if(currentSelection != null ) {
currentSelection.attr({fill:c});
}
currentSelection = this;
currentSelection.attr({fill:selectionColor});
var req = org.eclipse.swt.Request.getInstance();
req.addParameter( designWidgetId +".selectedImage", part );
req.send();
});
})(this.__paper,part,newParts[part]);
startx+=width;
}
}}

},
}
});


Now that, whenever the setImages method is called on the server side widget, the client has to update the browser. But how does it interact, the server side widget and the client side widget get connected through two main classes, the API resource class and the LCA class. There are different ways of defining the LCA class but here i would just follow the simple approach as explained in the RAP help.

First to create the API resource, we need to create a IResource implementation , In our case, MyWidgetResource as follows,


public class DesignWidgetResource implements IResource {
public String getCharset() {
return HTML.CHARSET_NAME_ISO_8859_1;
}

public ClassLoader getLoader() {
return this.getClass().getClassLoader();
}

public RegisterOptions getOptions() {
return RegisterOptions.VERSION_AND_COMPRESS;
}

public String getLocation() {
return "com/xyz/project/mywidget/MyWidget.js";
}

public boolean isJSLibrary() {
return true;
}

public boolean isExternal() {
return false;
}
}

you can just copy and paste the above code and replace the getLocation method to your .js file. Now the LCA, this can either be written in a pre defined package or can be done using getAdapter method in the widget class. I will follow the pre defined package which com.xyz.project.mywidget.internal.mywidgetkit and create MyWidgetLCA.java




public class MyWidgetLCA extends AbstractWidgetLCA {

private static final String PARAM_SELECTED = "selectedImage";

private static final String PROP_IMAGES = "images";

private static final String JS_PROP_IMAGE = "images";

public void preserveValues(final Widget widget) {
ControlLCAUtil.preserveValues((Control) widget);
IWidgetAdapter adapter = WidgetUtil.getAdapter(widget);
adapter.preserve(PROP_IMAGES, ((MyWidget) widget).getImages());
// adapter.preserve(PROP_MOVE_RIGHT, ((DesignWidget) widget)
// .getMoveRight());
// only needed for custom variants (theming)
WidgetLCAUtil.preserveCustomVariant(widget);
}

/*
* Read the parameters transfered from the client
*/
public void readData(final Widget widget) {
MyWidget myWidget = (MyWidget) widget;
String location = WidgetLCAUtil.readPropertyValue(myWidget,
PARAM_SELECTED);
myWidget.setSelectedImage(location);
}

/*
* Initial creation procedure of the widget
*/
public void renderInitialization(final Widget widget) throws IOException {
JSWriter writer = JSWriter.getWriterFor(widget);
String id = WidgetUtil.getId(widget);
writer.newWidget("com.xyz.project.mywidget.MyWidget",
new Object[] { id });
writer.set("appearance", "composite");
writer.set("overflow", "hidden");
ControlLCAUtil.writeStyleFlags((MyWidget) widget);
}

public void renderChanges(final Widget widget) throws IOException {
MyWidget gmap = (MyWidget) widget;
ControlLCAUtil.writeChanges(gmap);
JSWriter writer = JSWriter.getWriterFor(widget);
writer.set(PROP_IMAGES, JS_PROP_IMAGE, gmap.getImages());
// only needed for custom variants (theming)
WidgetLCAUtil.writeCustomVariant(widget);
}

public void renderDispose(final Widget widget) throws IOException {
JSWriter writer = JSWriter.getWriterFor(widget);
writer.dispose();
}

public void createResetHandlerCalls(String typePoolId) throws IOException {
}

public String getTypePoolId(Widget widget) {
return null;
}

}


Here, the LCA class is the important class which communicates between the server code and client script. The selection on the client sends an event to the server through the LCA in the readData method. The client code will use org.eclipse.swt.Request.getInstance() to send the request to the server when an image is clicked on the Widget.

Now we got the both the resource and LCA ready. we need to create an resources extension point and add the MyWidgetResource classes.
   <extension
point="org.eclipse.rap.ui.resources">
<resource
class="com.xyz.project.mywidget.MyWidgetResource">
</resource>
</extension>


ok..we have a basic setup ready, what is the Raphael stuff on the Qooxdoo javascript. Raphael is a Javascript based SVG library which helps creating different SVG based graphics. For more details on that visit http://raphaeljs.com/. The demos explain a lot about the library. How do we add an external javascript resource into the myWidget implementation.

1. Create a RaphaelAPIResource similar to the one we created for MyWidget as MyWidgetResource.

public class RaphaelAPIResource implements IResource {

private String location;

public String getCharset() {
return HTML.CHARSET_NAME_ISO_8859_1;
}

public ClassLoader getLoader() {
return this.getClass().getClassLoader();
}

public String getLocation() {
location = "http://raphaeljs.com/raphael.js";
return location;
}

public RegisterOptions getOptions() {
return RegisterOptions.VERSION;
}

public boolean isExternal() {
return true;
}

public boolean isJSLibrary() {
return true;
}

}


and add the resources extension to the existing extension point we used as following.
   <extension
point="org.eclipse.rap.ui.resources">
<resource
class="com.biologistics.gd.design.RaphaelAPIResource">
</resource>
<resource
class="com.biologistics.gd.design.DesignWidgetResource">
</resource>
</extension>


Since we are displaying images on the client side , we need the images also as resources sent to the client. we have to create http.registryresources to use aliases for the images. In this case, we are referring to Part_icon_image1.png and Part_icon_image2.png as alias in the javascript.

 <extension
point="org.eclipse.equinox.http.registry.resources">
<resource
alias="/Part_icon_image1.png"
base-name="branding/Part_icon_image1.png">
</resource>
<resource
alias="/Part_icon_image2.png"
base-name="original/Part_icon_image2.png">
</resource>
</extension>


Now we can create a view with MyWidget as a child and setImages on that.

 public void createPartControl(final Composite parent) {
widget = new MyWidget(parent);
widget.setParts(new String[]{"image1","image2"});
getSite().setSelectionProvider(widget);
}


Will be glad to help !

Thursday, March 5, 2009

Quick Tips: Storing preferences and settings per user in a RCP application

Eclipse RCP applications store the prefrences and settings in the workspace. When a RCP application is exported, the workspace is opened within the application folder unless the workspace location is overridden. This will make every user who uses the application to use the same preferences. To enable the preferences and workbench state to be user specific, the default location of the workspace can be configured in the config.ini file as follows.


osgi.instance.area.default=@user.home/eclipseworkspace


Now the preferences and other dialog settings will be written in the user's own workspaces.

Quick Tip: Save and Restore the perspective layout

To restore the perspctive to the last modified state, eclipse stores the workbench state to a file called workbench.xml. To enable the save and restore layout, the IWorkbenchConfigurer must be set in the ApplicationWorkbenchAdvisor.


public void initialize(IWindowConfigurer configurer)
{
configurer.setSaveAndRestore(true);
}

Monday, March 2, 2009

Eclipse : Writing to the console in a RCP Application

When you want to add console message to the eclipse console view, there is no easiest way to do this. The sysout/syserr messages will go on the console where you have the application if you run it with -consoleLog option.

How do we show the messages on the console view eclipse provides. First of all we have to add the console view to the perspective. The console view is part of the org.eclipse.ui.console plugin, so add it to the dependencies if you dont have it already.

Now add the ConsoleView to the perspective in the createInitialLayout method ( the following snippet is written with the RCP Mail example )


public void createInitialLayout(IPageLayout layout) {
String editorArea = layout.getEditorArea();
layout.setEditorAreaVisible(false);

layout.addStandaloneView(NavigationView.ID, false, IPageLayout.LEFT,
0.25f, editorArea);
IFolderLayout folder = layout.createFolder("messages", IPageLayout.TOP,
0.5f, editorArea);
folder.addPlaceholder(View.ID + ":*");
folder.addView(View.ID);

IFolderLayout consoleFolder = layout.createFolder("console",
IPageLayout.BOTTOM, 0.65f, "messages");
consoleFolder.addView(IConsoleConstants.ID_CONSOLE_VIEW);
layout.getViewLayout(NavigationView.ID).setCloseable(false);
}


Now if you run the application you can see the console view at the bottom of the Messages view of the RCP Mail application. But now there are no open consoles on the console view. Now let us take an example, whenever a Messages view is opened we want to write something to the console.


public class OpenViewAction extends Action {

private final IWorkbenchWindow window;
private int instanceNum = 0;
private final String viewId;
MessageConsole messageConsole;

public OpenViewAction(IWorkbenchWindow window, String label, String viewId) {
this.window = window;
this.viewId = viewId;
setText(label);
// The id is used to refer to the action in a menu or toolbar
setId(ICommandIds.CMD_OPEN);
// Associate the action with a pre-defined command, to allow key
// bindings.
setActionDefinitionId(ICommandIds.CMD_OPEN);
setImageDescriptor(com.blog.sample.Activator
.getImageDescriptor("/icons/sample2.gif"));

}

public void run() {
if (window != null) {
try {
int instance = instanceNum++;
window.getActivePage().showView(viewId,
Integer.toString(instance),
IWorkbenchPage.VIEW_ACTIVATE);

messageConsole = getMessageConsole();
MessageConsoleStream msgConsoleStream = messageConsole
.newMessageStream();

ConsolePlugin.getDefault().getConsoleManager().addConsoles(
new IConsole[] { messageConsole });

msgConsoleStream.println(viewId + Integer.toString(instance));

} catch (PartInitException e) {
MessageDialog.openError(window.getShell(), "Error",
"Error opening view:" + e.getMessage());
}
}
}

private MessageConsole getMessageConsole() {
if (messageConsole == null) {
messageConsole = new MessageConsole("RCPMail", null);
ConsolePlugin.getDefault().getConsoleManager().addConsoles(
new IConsole[] { messageConsole });
}

return messageConsole;
}

}


Now every new view opened will write the ViewID to the RCPMail console we created.

Have fun!