IT Mill Toolkit

Reference Manual

2008-03-20

Abstract

IT Mill Toolkit enables developers to build high quality browser user interfaces with Java on server. It provides a library of ready to use high-quality user interface components and defines clean framework for creating your own components. The focus is in ease of use, re-usability, extensibility and meeting requirements of large enterprise application. The toolkit has been used in production since year 2001 and it is shown to be suitable for building demanding business applications.


Table of Contents

Preface
About This Book
Prerequisites
Organization of This Book
Supplementary Material
Online Resources
Support
I. Developer's Guide
1. Introduction
Overview
Goals and Philosophy
Background
Changes in IT Mill Toolkit Release 5
Example Application Walkthrough
Hello World!
Calculator
What's Inside the IT Mill Toolkit Package?
Installing
Package Contents
Starting the Content Browser
Running the Demo Applications
Getting Development Environment Up and Running
Installing Java SDK
Installing Eclipse IDE
Installing Apache Tomcat
Firefox and Firebug
QuickStart with Eclipse
Importing IT Mill Toolkit as a Project
How to Run the Demo Applications in Eclipse?
How to Debug the Demo Applications in Eclipse?
Using QuickStart as a Project Skeleton
Your First Project with IT Mill Toolkit
Creating the Project
Including IT Mill Toolkit Libraries
Writing the Code
Defining Deployment Descriptor
Ready to Go!
Starting the Web Server
Running and Debugging
2. Architecture
Overview
Technological Background
AJAX
Google Web Toolkit
JSON
Client-Side Engine
Events and Listeners
3. Writing a Web Application
Overview
Managing the Main Window
Child Windows
Opening and Closing a Child Window
Window Positioning
Modal Windows
Application-Level Windows
Creating New Application-Level Windows
Creating Windows Dynamically
Caveats in Using Multiple Windows
Referencing Resources
Resource Interfaces and Classes
File Resources
Class Loader Resources
Theme Resources
Stream Resources
Error Handling
Error Indicator
Application Environment
Creating Deployable WAR in Eclipse
Web Application Contents
Deployment Descriptor web.xml
Embedding Applications in Web Pages
Embedding Inside a <div> Element
Embedding Inside an <iframe> Element
4. User Interface Components
Overview
Label
Link
TextField
DateField
Calendar
Button
Check Box
Selecting Items
Basic Select Component
Native Selection Component NativeSelect
Radio Button and Check Box Groups with OptionGroup
Twin Column Selection with TwinColSelect
Allowing Adding New Items
Multiple Selection Mode
Table
Scrollable Tables
Paging Tables
List Tables
Tree
Embedded
Upload
Progress Indicator
Doing Heavy Computation
Custom Composite Components
CustomComponent
Common Component Features
Sizing Components Through Sizeable
5. Managing Layout
Background for Layout
Layout Components
Ordered Layout
Grid layout
Panel
Tab Sheet
Expanding Layout
Controlling Layout Formatting
Layout Cell Alignment
Layout Cell Spacing
Layout Margins
Custom Layouts
6. Themes
Overview
Introduction to Cascading Style Sheets
Basic CSS Rules
Matching by Element Class
Matching by Descendant Relationship
Notes on Compatibility
Creating and Using Themes
Styling Standard Components
Using Themes
Theme Inheritance
7. Data Model
Overview
Properties
Holding properties in Items
Collecting items in Containers
8. Developing Custom Components
Overview
Google Web Toolkit Widgets
Extending an IT Mill Toolkit Widget
Example: A Color Picker GWT Widget
Styling GWT Widgets
Integrating a GWT Widget
Deserialization of Component State from Server
Serialization of Component State to Server
Example: Integrating the Color Picker Widget
Defining a Widget Set
GWT Module Descriptor
Server-Side Components
Server-Client Serialization
Client-Server Deserialization
Extending Standard Components
Example: Color Picker Server-Side Component
Using a Custom Component
Example: Color Picker Application
Web Application Deployment
GWT Widget Development
Creating a Widget Project in Eclipse
Importing GWT Installation Package
Creating a GWT Module
Compiling GWT Widget Sets
Ready to Run
Hosted Mode Browser
9. Advanced Web Application Topics
Special Characteristics of AJAX Applications
Resources
URI Handlers
Parameter Handlers
Java Servlet Parameters
Shortcut Keys
10. User Interface Definition Language (UIDL)
API for Painting Components
JSON Rendering
UIDL Syntax
Bibliography

List of Figures

1.1. IT Mill Toolkit General Architecture
1.2. IT Mill Toolkit Package Contents
1.3. Development Toolchain and Process
1.4. Firebug Debugger for Firefox
1.5. IT Mill Toolkit Imported as a Project in Eclipse
1.6. IT Mill Toolkit Content Browser Started Under Eclipse
1.7. Terminating a Launch
1.8. Removing Terminated Launches
1.9. Execution Stopped at Breakpoint in Debug Perspective in Eclipse
1.10. A New Dynamic Web Service Project
1.11. A Ready Project
1.12. Running an IT Mill Toolkit Application
1.13. Debugging an IT Mill Toolkit Application
2.1. IT Mill Toolkit Architecture
2.2. Architecture of IT Mill Toolkit Client-Side Engine
2.3. Class Diagram of a Button Click Listener
3.1. Opening a Child Window
3.2. Screenshot of the Modal Window Demo Application
3.3. Communication Between Two Application-Level Windows
3.4. Resource Interface and Class Diagram
3.5. Screenshot of the stream resource example with an embedded image
3.6. Embedded Application
3.7. IT Mill Toolkit Applications Embedded Inside IFrames
4.1. UI Component Inheritance Diagram
4.2. The Label Component
4.3. Label Modes Rendered on Screen
4.4. Referencing An Image Resource in Label
4.5. Single- and Multi-Line Text Field Example
4.6. Example of the Date Field with Default Style
4.7. Example of the Date Field with Calendar Style
4.8. An Example of a Button
4.9. An Example of a Check Box
4.10. Retrieval of the Currently Selected Item
4.11. The Select Component
4.12. Filtered Selection
4.13. Radio Button Group
4.14. Twin Column Selection
4.15. Select Component with Adding New Items Allowed
4.16. Basic Table Example
4.17. Table Selection Example
4.18. Example with Checkbox Components in a Table
4.19. Table with Paging Style
4.20. Table with List Style
4.21. A Partially Expanded Tree
4.22. The Progress Indicator Component
4.23. Starting Heavy Work
5.1. The Grid Layout Component
5.2. A Simple TabSheet Layout
5.3. A TabSheet with a Hidden and Disabled Tabs
5.4. The ExpandLayout Component
5.5. Cell Alignment Modes
5.6. Layout Spacings
5.7. Layout Margins
5.8. Example of a Custom Layout Component
6.1. Theme Contents
6.2. Simple Styling by Element Type
6.3. Matching HTML Element Type and Class
6.4. Matching Only HTML Element Class
6.5. Themeing Login Box Example with Default Theme
6.6. Themeing Login Box Example with Custom Theme
7.1. IT Mill Toolkit Data Model
8.1. Color Picker Module
8.2. GWT Widget Base Class Hierarchy
8.3. Color Picker Widget Without Styling
8.4. Color Picker Widget With Styling
8.5. Annotated Project Contents
8.6. Hosted Mode Browser
8.7. Creating New Launch Configuration
8.8. Naming Launch Configuration
8.9. GWTShell Arguments
8.10. Setting a Breakpoint
8.11. Debugging with Hosted Mode Browser