The latest development of “XML Servlet/Engine/Components” allows Isolution Workflow (IW from now on) to use AJAX (Asynchronous Javascript and XML) client for presentation layer. Thanks to modularity achieved by using Maven and IW’s own MC (Model/Controller) abstraction, it is possible to “swap” presentation layer in IW without any change to MC code. Actually without any change to Java code, just swap three dependencies in Maven POM.

One example of this is such swap for totolotek project, already containing business specific MCs. This example doesn’t look so pretty and it’s not optimalized, because I have done only as much as to be able to test the “XML Servlet/Engine/Components”.

My choice of AJAX client is one written with GWT. The benefits of such choice are already mentioned in Michal’s article “GWT, czyli ajax bez wysiłku”. If you are not familiar with GWT, I would recommend reading his article.

On the server side:

Both presentation layers(PL from now on) have the same input and output and similar execution flow. Servlet part is the main input point and is PL specific.

Servlet calls Engine part directly, which is PL specific, but I guess it could be generalized. It figures out which action should be taken and how should Metamodel be created. Metamodel is object representation of the user interface to be rendered.

The action is a call to specific Controller. As mentioned before, Metamodels and Controllers are generalized and should not contain any PL specific code in order for PL to be interchangeable. Controller then creates Metamodel accordingly.

After the flow returns from Controller to Engine, the Components part is called. Components part is PL specific. It transforms Metamodel into User Interface (UI from now on) in form of HTML or XML. The flow then returns to Servlet, in which the UI is packed into response and is the main output point.

On the client side:

After writing client GWT code, it is compiled with GWT compiler. Result of compilation is HTML and Javascript. So when browser first hits the server, this result of compilation is sent from server to client. In my example the UI contains various GWT Widgets. The most important in AJAX role are GWT Buttons, which have Events linked to them by GWT Listeners. These Events when invoked, create common AJAX request and send it to server.

AJAX request is Javascript client code, which sends request in form of XML, asynchronously through HTTP/HTTPS protocol, to server. XML resides in the body of HTTP/HTTPS request. GWT is no exception in this regard.

Server (apache → tomcat → servlet container) accepts the request, crunches it and spits out response.

Ideally, the received XML response is parsed. Web page DOM (Document Object Model) is changed accordingly to data received.

The GWT code:

The GWT code (the way I wrote it) is organized into multiple packages, as any other Java code. There is the MainEntry, which is as the name suggests, the starter of the GWT Application.

Renderers create the “big picture” Widgets, like tree, form, table, depending on what they find in XML response. Form Renderer uses Initializers to create smaller Widgets, like text boxes, combos, checkboxes and so on, depending on data gathered for current field being parsed.

Renderers also create GWT Buttons and apply certain Listeners to them, depending on action name parsed from XML response. Each Listener then relies on Request Builder to create XML request providing its own specific parameters.

After obtaining XML request, Listeners use Request Controller to send this request. This Controller should not be confused with Controllers on server side. The Request Controller simply creates HTTP Request, fills the body with XML request and sends it asynchronously (does not wait for response).

Response Controller receives the XML response and starts parsing it. Depending on the top level tags it founds, it calls either Menu Renderer or Table Renderer or Form Renderer to handle the rest. And there we have a complete circle.

Summary

This article is just a brief overview of the modules that compose AJAXian server and client. While it should give an idea of how it works, i guess some diagrams could describe the process in more detail. For now this has to do