RSS

Monthly Archives: September 2008

Released GWT 1.5

Finally, GWT 1.5 is out! Read more about it here. Download it here. Some highlights:

  1. Java 5 language support (no need for typeargs anymore, and support for generics).
  2. new JavaScript overlay types to seamlessly and efficiently integrate with native JS code.
  3. New animations available on widgets, and theme support.
  4. New API for DOM access.

Good stuff!

Also, new Google APIs for GWT are almost finalized, here’s the link. These include: Gears, Gadgets, and Search API.

 
Leave a comment

Posted by on September 28, 2008 in GWT

 

Tags:

Google Web Toolkit and Client-Server Communications

This article is written by Miguel Mendez

Communication Infrastructure

Frame

  • Module com.google.gwt.user.User provides Frame class
  • Pass information to the server by manipulating the URL
  • Retrieve responses from the Frame’s content or the server can write script tags to be executed
  • History and browser compatibility issues to consider
  • Load events are not reliable across browsers; specifically in Safari 2

FormPanel

  • Module com.google.gwt.user.User provides FormPanel class
  • Provides interoperability with servers that accept traditional HTML form encoding
  • Data is sent asynchronously
  • Any Widget that implements HasName which is part of the FormPanel will have its data sent on submit
  • Enables file uploads

FileUpload Example

final FormPanel form = new FormPanel();

form.setAction("/myFormHandler");

// FileUpload requires the POST method, and multipart MIME

// encoding.

form.setEncoding(FormPanel.ENCODING_MULTIPART);

form.setMethod(FormPanel.METHOD_POST);

// Create a FileUpload widget.

FileUpload upload = new FileUpload();

upload.setName("uploadFormElement");

form.setWidget(upload);

// Get a root panel and add the form and a button

RootPanel rootPanel = RootPanel.get();

rootPanel.add(form);

rootPanel.add(new Button("Submit", new ClickListener() {

public void onClick(Widget sender) {

form.submit();

}

}));

RequestBuilder (XHR)

  • Module com.google.gwt.http.HTTP provides RequestBuilder
  • Builder for making HTTP GETs and POSTs requests
  • Asynchronous communications only
  • Restricted by the same origin policy
  • Browsers limit the possible number of simultaneous connections so don’t go crazy firing off requests

RequestBuilder Example

public void onModuleLoad() throws RequestException {

String url = GWT.getModuleBaseURL() + "get";

RequestBuilder builder =

new RequestBuilder(RequestBuilder.GET, url);

// Create a callback object to handle the result

RequestCallback requestCallback = new RequestCallback() {

public void onError(Request request, Throwable exception) {

//…

}

public void onResponseReceived(Request request,

Response response) {

//…

}

};
// Send the request

builder.sendRequest("payload", requestCallback);

}

XML Services

XML Encoding/Decoding

  • Module com.google.gwt.xml.XML declares XML related classes
  • XMLParser parses a string containing valid XML into a new Document instance
  • Document class can be used to explore and modify the structure of the document
  • Document class will also convert the structure back into a string
  • Manipulation of XML is somewhat laborious

XMLRPC Example

RequestBuilder rb = new RequestBuilder(RequestBuilder.GET, "...");

RequestCallback requestCallback = new RequestCallback() {

public void onResponseReceived(Request request,

Response response) {

// Parse xml response into a Document object

Document result = XMLParser.parse(response.getText());

// ...

}

// Error handling omitted

};

// Create Document

Document doc = XMLParser.createDocument();

// Add elements to the document as necessary…

// Send the XML request
rb.sendRequest(doc.toString(), requestCallback);

JSON Services

JSON Encoding/Decoding

  • Module com.google.gwt.json.JSON declares JSON related classes
  • JSONParser converts between strings and JSON objects
  • JSON is a fundamental data encoding that does not support cyclic structures
  • JSONP, JSONRPC are protocols built on top of the JSON encoding
  • Again, the conversion to/from JSON can be somewhat laborious

JSON Service Example

RequestBuilder rb = new RequestBuilder(RequestBuilder.GET, "...");

RequestCallback requestCallback = new RequestCallback() {

public void onResponseReceived(Request request,

Response response) {

// Parse json response into a JSONValue object

JSONValue result = JSONParser.parse(response.getText());

// ...

}

// Error handling omitted

};

rb.sendRequest("{...}", requestCallback);

Efficiency Tip: JavaScriptObject Overlays

Overlays result in no runtime overhead; very efficient

/**

* Java overlay of a JavaScriptObject, whose JSON

* representation is { count: 5 }.

*/

public class MyJSO extends JavaScriptObject {

// Convert a JSON encoded string into a MyJSO instance

public static native MyJSO fromJSONString(

String jsonString) /*-{

return eval('(' + jsonString + ')');

}-*/;

// Returns the count property of this MyJSO

public native int getCount() /*-{

return this.count;

}-*/;

}

GWT RPC

GWT RPC Overview

  • Designed to move Java instances between client code (in the browser) and a Java servlet
  • Uses Serializable and IsSerializable marker interfaces
  • Interfaces define the service, a generator creates the necessary marshaling code with built-inversioning and a serialization policy file
  • Supports Java 1.5 language constructs
  • Built on top of RequestBuilder (XHR)
  • Like the rest of GWT, recompile to pick up the latest performance improvements – faster serialization code, etc.

Declaring GWT RemoteServices

// Implemented by the servlet

@RemoteServiceRelativePath("tasks")

public interface TaskRemoteService extends RemoteService {

List<Task> getTasks(int startIndex, int maxCount)

throws TaskServiceException;

}

// Implemented by generated client proxy, needs to match sync

public interface TaskRemoteServiceAsync {

void getTasks(int startIndex, int maxCount,

AsyncCallback<List<Task>> callback);

}

// TaskRemoteService servlet

public class TaskRemoteServiceImpl extends RemoteServiceServlet
implements TaskRemoteService {

public List<Task> getTasks(int startIndex, int maxCount) 
throws TaskServiceException {
// Code omitted
}
}

Invoking GWT RemoteServices

// Get client proxy, annotation causes auto addressing

TaskRemoteServiceAsync service =

GWT.create(TaskRemoteService.class);

// Create a callback object to handle results
AsyncCallback<List<Task>> asyncCallback =
new AsyncCallback<List<Task>>() {
public void onFailure(Throwable caught) {
// Deal with TaskServiceException...
}

public void onSuccess(List<Task> result) {
for (Task task : result) {
// Process each task...
}
}
};

// Actually call the service
service.getTasks(0, 10, asyncCallback);

Accessing the Request Object

  • Async method signature changed to return a Request instance
  • Useful for canceling the HTTP request used by RPC
// Modified async interface
public interface TaskRemoteServiceAsync {
// Method returns the underlying HTTP Request instance
Request getTasks(int startIndex, int maxCount,
AsyncCallback<List<Task>> callback);
}

Accessing the RequestBuilder Object

  • Change the return type of the async method to RequestBuilder, proxy returns a fully configured RequestBuilder
  • Provides access to HTTP timeouts, and headers
  • Caller must call RequestBuilder.send()
  • Wrap modified async interface to provide your own special manipulation code
// Modified async interface
public interface TaskRemoteServiceAsync {
// Method returns the underlying HTTP RequestBuilder instance
RequestBuilder getTasks(int startIndex, int maxCount,
AsyncCallback<List<Task>> callback);
}

Raw RPC Serialization

  • For pre-serialization of responses or custom transports
    * Client accesses the generated SerializationStreamFactory
    * Server uses RPC.encodeResponseForSuccess method to encode
  • Streams are not symmetric
public Object clientDeserializer(String encodedPayload)
throws SerializationException {
// Create the serialization stream factory
SerializationStreamFactory serializationFactory =
GWT.create(TaskRemoteService.class);
// Create a stream reader
SerializationStreamReader streamReader =
serializationFactory.createStreamReader(encodedPayload);
// Deserialize the instance
return streamReader.readObject();
}

Best Practices

  • Use stateless servers – better handling, better scalability
  • Keep conversational state in the client
  • Consider possible failure modes, keep the user’s needs in mind
  • Judiciously control the amount of data sent to the client – consider pagination of data instead of one bulk transfer
 
Leave a comment

Posted by on September 28, 2008 in GWT

 

Tags: , , ,

GWT JSNI: Talking to GWT code from JavaScript

Bruce Johnson has written an expansive post on understanding the GWT JavaScript Native Interface (JSNI). It starts out with the piece that some people know about, namely inlining native JavaScript such as this:

PLAIN TEXT

JAVA:

  1. // Java method declaration…
  2. native String flipName(String name) /*-{
  3. // …implemented with JavaScript
  4. var re = /(\w+)\s(\w+)/;
  5. return name.replace(re, ‘$2, $1′);
  6. }-*/;

But what about calling back out to Java from within native land?

JAVA:

  1. package org.example.foo;
  2. public class Flipper {
  3. public native void flipName(String name) /*-{
  4. var re = /(\w+)\s(\w+)/;
  5. var s = name.replace(re, ‘$2, $1′);
  6. this.@org.example.foo.Flipper::onFlip(Ljava/lang/String;)(s);
  7. }-*/;
  8. private void onFlip(String flippedName) {
  9. // do something useful with the flipped name
  10. }
  11. }

You can also access any JavaScript, loaded from a script source or however via:

JAVA:

  1. // A Java method using JSNI
  2. native void sayHelloInJava(String name) /*-{
  3. $wnd.sayHello(name); // $wnd is a JSNI synonym for ‘window’
  4. }-*/;

But finally, what about if you wrote a bunch of Java code for GWT, and you want JavaScript to call that? Simply link the code back through the $wnd world:

JAVA:

  1. package org.example.yourcode.format.client;
  2. public class DateFormatterLib implements EntryPoint {
  3. // Expose the following method into JavaScript.
  4. private static String formatAsCurrency(double x) {
  5. return NumberFormat.getCurrencyFormat().format(x);
  6. }
  7. // Set up the JS-callable signature as a global JS function.
  8. private native void publish() /*-{
  9. $wnd.formatAsCurrency =
  10. @org.example.yourcode.format.client.
  11. DateFormatterLib::formatAsCurrency(D);
  12. }-*/;
  13. // Auto-publish the method into JS when the GWT module loads.
  14. public void onModuleLoad() {
  15. publish();
  16. }
  17. }
 
Leave a comment

Posted by on September 28, 2008 in GWT/ JSNI / COMPILER

 

Tags: ,

GWT: JSNI (Javascript Native Interface)

 
3 Comments

Posted by on September 28, 2008 in GWT/ JSNI / COMPILER

 

Tags: , , ,

Tutorial – Writing Instant Messenger Application – GWT

 
2 Comments

Posted by on September 28, 2008 in GWT/CHAT/COMET

 

Tags: , , ,

GWT Chat Application – (GWT with xmpp protocol)

emite (xmpp & gwt) – This library implements the xmpp communications protocol using the bosh technique with gwt. It also handles the xmpp Instant Messaging protocol but has a modular architecture to support any other kind of communications.

  • stable, pure java (no js), portable library
  • ready, full featured and easy to use instant messaging implementation
  • extensible architecture
  • Chat rooms support (Multi-User Chat).
  • Other XEP like: Chat State Notifications.
  • well tested (junit test, coverage support)

Features :

  • Common features support (chat, chat rooms, presence, roster)
  • Sound and visual advices when new messages arrive
  • Drag & Drop support to start a conversation and for chat room invitations
  • i18n support
  • Focused in be very usable
  • Based in extjs and gwt-ext

Screenshot

emite Chat Demo – click here

emite Chat application download

 
6 Comments

Posted by on September 27, 2008 in GWT/CHAT/COMET

 

Tags: , , , , ,

Chattr: GWT Sample Chat application

This project is an interesting example of instant messenger web application built using the Google Web Toolkit (GWT). This instant messenger application is mainly for those who are working or knowledge about the RPC (Remote Procedure Call).

The source for Instant Messenger Application is available in the Downloads section, and you can either get the ‘complete’ app version, or a version that is ‘working.’

 
Leave a comment

Posted by on September 26, 2008 in GWT/CHAT/COMET

 

Tags: , ,

 
Follow

Get every new post delivered to your Inbox.

%d bloggers like this: