Google Web Toolkit (GWT): Practice

[Bhim Upadhyaya]

This thread aims to document GWT experience including maven based GWT projects:

[Bhim Upadhyaya]

Here is a Maven pom content :


<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">

<modelVersion>4.0.0</modelVersion>
<groupId>com.uhg</groupId>
<artifactId>TestProject</artifactId>
<packaging>war</packaging>
<version>1.0.0</version>

<properties>

<gwt.version>2.0.4</gwt.version>

<!-- tell the compiler we can use 1.5 -->
<maven.compiler.source>1.5</maven.compiler.source>
<maven.compiler.target>1.5</maven.compiler.target>

</properties>

<dependencies>
<dependency>
<groupId>com.mycompany.myproject</groupId>
<artifactId>company-parent-pom</artifactId>
<version>2.0.0</version>
<type>pom</type>
</dependency>

<!-- GWT dependencies (from central repo) -->
<dependency>
<groupId>com.google.gwt</groupId>
<artifactId>gwt-servlet</artifactId>
<version>${gwt.version}</version>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>com.google.gwt</groupId>
<artifactId>gwt-user</artifactId>
<version>${gwt.version}</version>
<scope>provided</scope>
</dependency>

<!-- test -->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.7</version>
<scope>test</scope>
</dependency>
</dependencies>

<build>
<outputDirectory>war/WEB-INF/classes</outputDirectory>
<plugins>
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>gwt-maven-plugin</artifactId>
<version>1.2</version>
<executions>
<execution>
<goals>
<goal>compile</goal>
<goal>generateAsync</goal>
<goal>test</goal>
</goals>
</execution>
</executions>
<configuration>
<runTarget>com.uhg.wi4f.Application/Appplication.html</runTarget>
</configuration>
</plugin>
<!--
If you want to use the target/web.xml file mergewebxml produces,
tell the war plugin to use it. Also, exclude what you want from the
final artifact here. <plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId> <configuration>
<webXml>target/web.xml</webXml>
<warSourceExcludes>.gwt-tmp/**</warSourceExcludes> </configuration>
</plugin>
-->

<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>2.0.2</version>
<configuration>
<source>${maven.compiler.source}</source>
<target>${maven.compiler.target}</target>
</configuration>
</plugin>
<!-- To copy jar files -->
<plugin>
<artifactId>maven-dependency-plugin</artifactId>
<version>2.1</version>
<executions>
<execution>
<id>copy-dependencies</id>
<phase>process-sources</phase>
<configuration>
<outputDirectory>src/main/webapp/WEB-INF/lib</outputDirectory>
<overWriteReleases>false</overWriteReleases>
<overWriteSnapshots>false</overWriteSnapshots>
<overWriteIfNewer>true</overWriteIfNewer>
</configuration>
<goals>
<goal>copy-dependencies</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
</build>

</project>

[Bhim Upadhyaya]

Creating a simple CXF SOAP client:


(Its a two step process: first GWT client side code makes an RPC call to GWT server side code and then GWT server side code makes a SOAP call to CXF services)



Step 1:


Generate client side stubs using Maven plug-in:


<plugin>

<groupId>org.apache.cxf</groupId>

<artifactId>cxf-codegen-plugin</artifactId>

<version>2.2.9</version>

<executions>

<execution>

<id>generate-sources</id>

<phase>generate-sources</phase>

<configuration>

<sourceRoot>target/generated/src/main/java</sourceRoot>

<wsdlOptions>

<wsdlOption>

<wsdl>src/main/webapp/WEB-INF/wsdl/MyWService.wsdl</wsdl>

</wsdlOption>

</wsdlOptions>

</configuration>

<goals>

<goal>wsdl2java</goal>

</goals>

</execution>

</executions>

</plugin>







Step 2:

If you want to assemble the code from target folder you can use:


<plugin>

<groupId>org.codehaus.mojo</groupId>

<artifactId>build-helper-maven-plugin</artifactId>

<executions>

<execution>

<id>add-source</id>

<phase>generate-sources</phase>

<goals>

<goal>add-source</goal>

</goals>

<configuration>

<sources>

<source>target/generated/src/main/java</source>

</sources>

</configuration>

</execution>

</executions>

</plugin>




Step 3: Create Service interface and ServiceAsync Interfaces:


public interface MyService extends RemoteService {
String callRemoteService(String name) throws IllegalArgumentException;

}




public interface MyServiceAsync {
void callRemoteService(String input, AsyncCallback<String> callback) throws IllegalArgumentException;

}



Step 4:

Create GWT client class that implements:

com.google.gwt.core.client.EntryPoint



This class also requires a field something like this:


private final MyServiceAsync myService = GWT.create(MyService.class);


In an appropriate location, we make a call to remote service:


myService.callRemoteService(textToServer,new AsyncCallback<String>()



Step 5:

Create server side class:

public class MyServiceImpl extends RemoteServiceServlet implements


MyService {...}


at some point in this class we make a SOAP call:


String callWS(String gwtString){
String response =null;
URL wsdlURL =null;
try{
wsdlURL = MyWImplService.WSDL_LOCATION;
}catch(Exception e){
System.err.println("Can not initialize the default wsdl ");
e.printStackTrace();
}

MyWImplService service =new MyWImplService(wsdlURL, SERVICE_NAME);
MyWService port = service.getMyWImplImplPort();
response = port.sayHi("SOAP test::"+gwtString);
return response;

}





(Please share your thoughts on this. It would be nice if we can have a single step process, that is, GWT client making direct SOAP call to CXF services)

[Bhim Upadhyaya]

MAKING A SUCCESSFUL REMOTE PROCEDURE CALL IN GWT
[DISCLAIMER: The content here does not reflect any orginational affiliation, these are hypothetical so far as legal issues are concernted. The code presented here is a part of executable GWT project]

STEP 1:
Create a Client side interface:

/**
 *
 */
package com.company.project.client;

import java.util.List;

import com.google.gwt.user.client.rpc.RemoteService;
import com.google.gwt.user.client.rpc.RemoteServiceRelativePath;
import com.company.project.client.domain.application.WebService;

/**
 * @author bupadhy
 * Nov 2, 2010
 */
@RemoteServiceRelativePath("testservice")
public interface TestService extends RemoteService {
	public List<WebService> callWSListService(String name);
	public Integer updateService(WebService ws); 
}

STEP 2:
Create Async interface on client side:

package com.company.project.client;

import java.util.List;
import com.google.gwt.user.client.rpc.RemoteServiceRelativePath;
import com.company.project.client.domain.application.WebService;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.rpc.ServiceDefTarget;

public interface TestServiceAsync {
	void callWSListService(String name, AsyncCallback<List<WebService>> callback);
	void updateService(WebService ws, AsyncCallback<Integer> callback);
}

Note: If you are using Maven, make sure that you exlude <goal>generateAsync </goal>, otherwise it will create a duplicate class and that becomes a road block for maven builder.

<plugin>
				<groupId>org.codehaus.mojo</groupId>
				<artifactId>gwt-maven-plugin</artifactId>
				<version>1.2</version>
				<executions>
					<execution>
						<goals>
							<goal>compile</goal>
							<!--  
							<goal>generateAsync</goal>
							-->
							<goal>test</goal>
						</goals>
					</execution>
				</executions>
				<configuration>
					<runTarget>com.company.project.TestAdmin/TestAdmin.html</runTarget>
				</configuration>
			</plugin>

STEP 3:
Create Server side implementation:

/**
 *
 */
package com.company.project.server;

import java.util.List;

import com.google.gwt.user.server.rpc.RemoteServiceServlet;
import com.company.project.client.TestService;
import com.company.project.client.domain.application.WebService;
import com.company.project.server.persistence.dao.WebServiceDAO;
import com.company.project.server.persistence.dao.impl.WebServiceDAOImpl;

/**
 * @author bupadhy
 * Nov 2, 2010
 */
public class TestServiceImpl extends RemoteServiceServlet implements TestService {
	WebServiceDAO wsDAO = new WebServiceDAOImpl();
	public List<WebService> callWSListService(String name){
		List<WebService> wsList = wsDAO.getWSList("test call");
		
		return wsList;
	}
	public Integer updateService(WebService ws){
		Integer status = wsDAO.updateSerive(ws);
		
		return status;
	}
}

STEP 4:
Declare server side class in TestAdmin.gwt.xml (module xml file):

   <servlet path="/testservice" class="com.company.project.server.TestServiceImpl"/> 

STEP 5:
Make a corresponding entry in web.xml:

	<servlet>
		<servlet-name>testServlet</servlet-name>
		<servlet-class>com.company.project.server.TestServiceImpl</servlet-class>
	</servlet>
	<servlet-mapping>
		<servlet-name>testServlet</servlet-name>
		<url-pattern>/com.company.project.TestAdmin/testservice</url-pattern>
	</servlet-mapping>

STEP 6:

Make a call from client side code:
Variable declaration portion:

private TestServiceAsync testService = GWT.create(TestService.class);

Calling portion:

				if (testService == null) {
					testService = GWT.create(TestService.class);
				    }
				AsyncCallback<List<WebService>> callback = new AsyncCallback<List<WebService>>() {
				      public void onFailure(Throwable caught) {
				    	  //TODO
				    	  Window.alert("RPC call failed!");
				    	  caught.printStackTrace();
				      }

				      public void onSuccess(List<WebService> result) {
				    	  //TODO
				    	  PopupView pv = new PopupView();
				    	  pv.getWebServiceDialogBox(result);
				      }
				};
				    testService.callWSListService("Client class", callback);

This was simplest possible GWT RPC example.

[Bhim Upadhyaya]

How to get event based index of an item in FlexTable:

   	ClickHandler clickHandlerON = new ClickHandler(){
    		public void onClick(ClickEvent event) {
    			final HTMLTable.Cell cell = testFlexTable.getCellForEvent(event);
    			int row = cell.getRowIndex();
                }