This chapter provides a description of the architecture of IT Mill Toolkit.
In Chapter 1, Introduction, we gave a short introduction to the
general architecture of IT Mill Toolkit. Let us now look deeper into it. Figure 2.1, “IT Mill Toolkit Architecture” below illustrates the architecture.
IT Mill Toolkit consists of a web application
API, a horde of user interface
components, themes for controlling
the appearance, and a data model that allows
binding the user interface components directly to data. Behind the
curtains it also employs a terminal adapter to
receive requests from web browsers and make responses by rendering the
pages.
An application using IT Mill Toolkit runs as a servlet in a Java web server,
serving HTTP requests. The terminal adapter receives client requests through
the web server's Java Servlet API, and inteprets them to user events for a
particular session. An event is associated with a UI component and delivered
to the application. As the application logic makes changes to the UI
components, the terminal adapter renders them in the web browser by generating
a response. In AJAX rendering mode, a client-side JavaScript component
receives the responses and uses them to make any necessary changes to the page
in the browser.
The top level of a user application consists of an application class that
inherits com.itmill.toolkit.Application. It creates the
UI components (see below) it needs, receives events regarding them,
and makes necessary changes to the components. For detailed information about
inheriting the Application, see Chapter 3, Writing a Web Application.
The major parts of the architecture and their function are as follows:
- User Interface Components
-
The user interface consists of UI components that are created and
laid out by the application. The components render
themselves using a terminal adapter, which in return
creates user events (see below) for the components. The
components relay these events to the application logic. Most
components are bound to some data using the Data Model
(see below). For a complete description of UI component
architecture, see Chapter 4, User Interface Components.
- Client-Side Engine
-
The Client-Side Engine of IT Mill Toolkit manages the rendering in
the web browser using Google Web Toolkit (GWT). It communicates
user interaction and UI changes with the server-side Terminal
Adapter using the User Interface Definition Language (UIDL), a
JSON-based language. The communications are done using
asynchronous HTTP or HTTPS requests. See the section called “Client-Side Engine”.
- Terminal Adapter
-
The UI components do not render themselves directly as a web page,
but use a Terminal Adapter. This abstraction layer
allows users to use IT Mill Toolkit applications with practically
any web browser. Releases 3 and 4 of IT Mill Toolkit supported
HTML and simple AJAX based rendering, while Release 5 supports
advanced AJAX-based rendering using Google Web Toolkit (GWT). You
could imagine some other browser technology, not even based on
HTML, and you - or we for that matter - could make it work just by
writing a new adapter. Your application would still just see the
Toolkit API. To allow for this sort of abstraction, UI components
communicate their changes to the Terminal Adapter, which renders
them for the user's browser. When the user does something in the web
page, the events are communicated to the terminal adapter (through
the web server) as asynchronous AJAX requests. The terminal
adapter delivers the user events to the UI components, which
deliver them to the application's UI logic.
- Themes
-
The user interface separates between presentation and logic. While
the UI logic is handled as Java code, the presentation is defined
in themes as CSS. IT Mill Toolkit provides a
default themes. User themes can, in addition to style sheets,
include HTML templates that define custom layouts and other
resources, such as images. Themes are discussed in detail in Chapter 6, Themes.
- UIDL
-
The Terminal Adapter draws the user interface to the web page and
any changes to it using a special User Interface Definition
Language (UIDL). The UIDL communications are done using JSON
(JavaScript Object Notation), which is a lightweight data
interchange format that is especially efficient for interfacing
with JavaScript-based AJAX code in the browser. See the section called “JSON” and Chapter 10, User Interface Definition Language (UIDL) for details.
- Events
-
User interaction with UI components creates events, which are first
processed on the client side with JavaScript and then passed all the way
through the HTTP server, terminal adapter, and user component layers to the
application. See the section called “Events and Listeners”.
- Data Model
-
In addition to the user interface model, IT Mill Toolkit provides a
data model for interfacing data presented in UI
components. Using the data model, the user interface components can
update the application data directly, without the need for any control
code. All the UI components use this data model internally, but they can
be bound to a separate data source as well. For example, you can bind a
table component to an SQL query response. For a complete overview of the
IT Mill Toolkit Data Model, please refer to Chapter 7, Data Model.
| |
