You are previewing GWT in Action: Easy Ajax with the Google Web Toolkit.
O'Reilly logo
GWT in Action: Easy Ajax with the Google Web Toolkit

Book Description

The Google Web Toolkit is a new technology that automatically translates Java into JavaScript, making Ajax applications easier to code and deploy. GWT in Action is a comprehensive tutorial for Java developers interested in building the next generation of rich, web-based applications. This book was written by Robert Hanson, creator of the popular GWT Widget Library and Adam Tacy a major contributor to the GWT Widget Library. There is a new emphasis on building rich, web-based applications. These applications can be difficult to build because they rely on JavaScript, which lacks the sophisticated object-oriented structures and static typing of Java, they are tricky to debug, and they require you to manage numerous browser inconsistencies. In May of 2006 Google released the Google Web Toolkit (GWT). GWT enables developers to create Ajax applications in Java. With GWT, you can build your applications using a real object-oriented language and take advantage of Java tools like Eclipse that are already available. Instead of trying to bring tool support to Ajax, Google brought Ajax to a place where the tools already existed.
GWT in Action shows you how to take advantage of these exciting new tools. Readers will follow an example running throughout the book and quickly master the basics of GWT: widgets, panels, and event handling. The book covers the full development cycle, from setting up your development environment, to building the application, then deploying it to the web server. The entire core GWT library is discussed, with details and examples on how it can be extended. GWT helps you make the most of Ajax in your web applications and GWT in Action helps you get more out of GWT. Readers can download Early Access Chapters of GWT in Action now and participate in the Author Forum by visiting at the Manning site.

Table of Contents

  1. Copyright
    1. Dedication
  2. Preface
  3. Acknowledgments
  4. About this Book
    1. Who should read this book?
    2. Roadmap
    3. Code conventions and downloads
    4. Author Online
    5. About the authors
  5. About the Title
  6. About the Cover Illustration
  7. 1. Getting started
    1. 1. Introducing GWT
      1. 1.1. A walk through GWT
        1. 1.1.1. Explaining GWT’s Java-to-JavaScript compiler
        2. 1.1.2. Using JSNI to execute JavaScript from Java
        3. 1.1.3. Accessing the JRE emulation library
        4. 1.1.4. Understanding GWT’s widget and panel library
        5. 1.1.5. Examining GWT’s internationalization and configuration tools
        6. 1.1.6. Calling remote procedures with GWT
          1. Making RPC requests with RequestBuilder
          2. Communicating with GWT-RPC
        7. 1.1.7. Investigating GWT’s XML parser
        8. 1.1.8. Managing the browser history
        9. 1.1.9. Introducing GWT’s JUnit integration
      2. 1.2. GWT vs. other solutions
        1. 1.2.1. GWT vs. Swing
        2. 1.2.2. GWT vs. Echo2
        3. 1.2.3. GWT vs. JavaServer Faces
        4. 1.2.4. GWT vs. Ruby on Rails
      3. 1.3. Building your first GWT application
        1. 1.3.1. Building and running an example application
        2. 1.3.2. Building Tic-Tac-Toe with GWT
          1. Designing the Tic-Tac-Toe game
          2. Writing the Tic-Tac-Toe game
      4. 1.4. Summary
    2. 2. Creating the default application
      1. 2.1. The GWT application development lifecycle
      2. 2.2. Stage 1: Creating a GWT application
        1. 2.2.1. Creating the project
        2. 2.2.2. Creating an application
        3. 2.2.3. Setting up internationalization
        4. 2.2.4. Implementing internationalization
        5. 2.2.5. Creating unit test cases
        6. 2.2.6. Importing into your IDE
          1. Importing into Eclipse
          2. Using other IDEs
      3. 2.3. Summary
    3. 3. Advancing to your own application
      1. 3.1. Describing the application example
      2. 3.2. Stage 2: Developing your application
        1. 3.2.1. Implementing internationalization
        2. 3.2.2. Constructing the application
          1. Constructing the HTML file
          2. Altering the application files
          3. Examining the module XML file
        3. 3.2.3. Applying styling
      3. 3.3. Stage 3: Testing and debugging in hosted mode
        1. 3.3.1. Preparing for hosted mode
          1. -noserver
          2. -whitelist “list”
          3. -blacklist “list”
          4. -logLevel level
          5. -gen “location”
          6. -out “location”
          7. -style value
        2. 3.3.2. Running the Dashboard in hosted mode
        3. 3.3.3. Debugging the Dashboard in hosted mode through Eclipse
      4. 3.4. Stage 4: Compiling the code
        1. 3.4.1. Compiling the code/preparing for web mode
          1. -logLevel level
          2. -treeLogger
          3. -gen “location”
          4. -out “location”
          5. -style value
        2. 3.4.2. Viewing the compilation results
      5. 3.5. Stage 5: Deploying the code
        1. 3.5.1. Deploying to a web server
        2. 3.5.2. Deploying to a filesystem
      6. 3.6. Stage 6: Running in web mode
      7. 3.7. Implementing application logging
        1. 3.7.1. Logging information on the client-side
        2. 3.7.2. Logging information on the server-side
      8. 3.8. Summary
  8. 2. Building user interfaces
    1. 4. Working with widgets
      1. 4.1. What is a widget?
        1. 4.1.1. Using widgets as Java objects
        2. 4.1.2. Considering widgets as DOM elements
      2. 4.2. The standard GWT widgets
        1. 4.2.1. Interacting with the basic widgets
          1. Uploading files with the FileUpload widget
          2. Navigating your application with hyperlinks
          3. Navigating your application using menus
          4. Managing the view of data using trees
          5. Viewing images
        2. 4.2.2. Displaying text on the application
          1. Showing text as a label
          2. Making text active using the HTML widget
        3. 4.2.3. Grabbing the user’s interaction using focus widgets
          1. Framing an area of interest
          2. Listing options
          3. Clicking your way through an application
          4. Pushing the button
          5. Checking the box
          6. Making the choice
        4. 4.2.4. Getting user input through text input
          1. Securing password entry
          2. Entering multiple lines of text
          3. Entering a single line of text
      3. 4.3. Creating new widgets
        1. 4.3.1. Creating new widgets by manipulating the DOM
          1. Developing the FileUpload widget
        2. 4.3.2. Creating new widgets by extending existing widgets
          1. Developing the Dashboard’s PNGImage widget
      4. 4.4. Developing the Dashboard’s ToggleMenuItem widget
        1. 4.4.1. Building the TwoComponentMenuItem
        2. 4.4.2. Building the ToggleMenuItem
      5. 4.5. Summary
    2. 5. Working with panels
      1. 5.1. What is a panel?
        1. 5.1.1. Using panels as Java Objects
        2. 5.1.2. Considering panels as DOM elements
      2. 5.2. The standard GWT panels
        1. 5.2.1. Interacting with simple panels
          1. Popping up displays
          2. Communicating in a dialog
          3. Forming an opinion
          4. Focusing user actions
          5. Scrolling through information
        2. 5.2.2. Considering more complex panels
          1. Positioning components absolutely
          2. Interfacing with the browser through the RootPanel
          3. Adding new HTML areas
          4. Flowing components
          5. Decking out an application
          6. Stacking components together
          7. Docking components
          8. Laying out horizontally
          9. Laying out vertically
        3. 5.2.3. Considering HTML table-based panels
          1. Implementing an HTMLTable
          2. Flexing a table layout
          3. Gridding components together
        4. 5.2.4. Considering composite panels
          1. Creating a TabBar
          2. Creating a TabPanel
          3. Disclosing panels
        5. 5.2.5. Splitting panels
      3. 5.3. Creating new panels
        1. 5.3.1. Creating a new panel from scratch
        2. 5.3.2. Creating a new panel by extending an existing panel
          1. Re-creating the ButtonPanel
      4. 5.4. Creating the Dashboard panel
      5. 5.5. Summary
    3. 6. Handling events
      1. 6.1. Exploring events
        1. 6.1.1. Identifying event model browser differences
        2. 6.1.2. Understanding the GWT event model
          1. Creating a widget/panel
          2. Adding a widget to a page
          3. Capturing an event
          4. Finding a handler
          5. Handling an event
          6. Removing a widget from a page
      2. 6.2. Listening to events
        1. 6.2.1. Sinking events
        2. 6.2.2. Managing sunk events with the onBrowserEvent() method
        3. 6.2.3. Linking sunk events to the onBrowserEvent() method
        4. 6.2.4. Previewing events
        5. 6.2.5. Handling events by extending the listener classes
        6. 6.2.6. Moving events further into your GWT code
        7. 6.2.7. Preventing default browser event handling
      3. 6.3. Handling standard browser events
        1. 6.3.1. Reacting to change
        2. 6.3.2. Clicking around
        3. 6.3.3. Gaining/Losing focus
        4. 6.3.4. Capturing keyboard inputs
        5. 6.3.5. Loading images
        6. 6.3.6. Managing mouse inputs
        7. 6.3.7. Scrolling
        8. 6.3.8. Window resize events
        9. 6.3.9. Window close events
      4. 6.4. Handling other event types
        1. 6.4.1. Handling forms
        2. 6.4.2. Reacting to closing pop-ups
        3. 6.4.3. Tab events
        4. 6.4.4. Tabling events
        5. 6.4.5. Tree events
      5. 6.5. Implementing drag-and-drop
        1. 6.5.1. Implementing the drag part
          1. Starting to drag
          2. Dragging
          3. Stopping the drag
          4. DashboardPanel onMouseDown
          5. DashboardPanel onMouseMove
          6. DashboardPanel onMouseUp
        2. 6.5.2. Implementing the drop part
          1. Case 1: Widget 1 above widget 2
          2. Case 2: Widget 1 below widget 2
          3. Case 3: Widget 1 to the left of widget 2
          4. Case 4: Widget 1 to the right of widget 2
      6. 6.6. Summary
    4. 7. Creating composite widgets
      1. 7.1. What is a composite widget?
      2. 7.2. Composite widget development steps
      3. 7.3. Building the editable label
        1. 7.3.1. Step 1: Identifying the components
        2. 7.3.2. Step 2: Choosing the panel layout and structure
        3. 7.3.3. Step 3: Implementing the right GWT Java interfaces
        4. 7.3.4. Step 4: Building the composite widget
        5. 7.3.5. Step 5: Styling the composite widget
      4. 7.4. Creating a composite widget from other composite widgets
        1. 7.4.1. Creating a slider
        2. 7.4.2. Constructing the ColourPicker composite
      5. 7.5. Creating the Dashboard composite
      6. 7.6. Summary
    5. 8. Building JSNI components
      1. 8.1. Introducing JavaScript Native Interface (JSNI)
        1. 8.1.1. Understanding JSNI
          1. Crossing the boundary from Java to JavaScript
          2. Passing Java objects across the Java-to-JavaScript boundary
          3. Sending objects back across the JavaScript to Java boundary
          4. Crossing the boundary from JavaScript to Java
          5. Handling exceptions
      2. 8.2. Communicating using JSNI
        1. 8.2.1. Chatting to the browser via GWT Java
        2. 8.2.2. Chatting to the browser via JavaScript
        3. 8.2.3. Talking to a GWT application via a JavaScript API
        4. 8.2.4. Talking between GWT applications
      3. 8.3. Loading a JavaScript library
        1. 8.3.1. Using HTML to load a JavaScript library
        2. 8.3.2. Using the module XML to load a JavaScript library
      4. 8.4. Wrapping a simple JavaScript library
        1. 8.4.1. Accessing the loaded JavaScript library
          1. Developing the implementation class
          2. Adding the JavaScriptObject class
          3. Creating the widget
        2. 8.4.2. Using the widget in an application
      5. 8.5. Wrapping a complex JavaScript library
        1. 8.5.1. Generating the classes
        2. 8.5.2. Keeping JavaScript objects as Java objects
        3. 8.5.3. Calling user-defined code from a library
        4. 8.5.4. Using a complex wrapped widget in an application
      6. 8.6. Summary
    6. 9. Modularizing an application
      1. 9.1. Creating a modularization structure
        1. 9.1.1. Modularization in GWT
        2. 9.1.2. Including other modules in an application
        3. 9.1.3. Setting source and other resource paths
        4. 9.1.4. Defining an application’s server resources
        5. 9.1.5. Managing an application’s GWT properties
          1. Defining and extending properties
          2. Handling properties and managing differences
        6. 9.1.6. Replacing classes based on property values
        7. 9.1.7. Registering generators in the XML module file
        8. 9.1.8. Injecting resources into an application at runtime
          1. Injecting JavaScript resources into an application
          2. Injecting style sheets into an application
        9. 9.1.9. Setting an application’s entry point
        10. 9.1.10. The Dashboard’s module XML file
      2. 9.2. Including third-party modules
      3. 9.3. Packaging your own modules
      4. 9.4. Creating the Java package structure
      5. 9.5. Summary
  9. 3. Advanced techniques
    1. 10. Communicating with GWT-RPC
      1. 10.1. Underlying RPC concepts
        1. 10.1.1. Understanding asynchronous communication
        2. 10.1.2. Restrictions for communicating with remote servers
        3. 10.1.3. Creating the Server Status project
      2. 10.2. Implementing GWT-RPC
        1. 10.2.1. Understanding serializable data objects
          1. Implementing the IsSerializable Interface
          2. Using the typeArgs annotation
          3. Implementing the Server Status data object
        2. 10.2.2. Defining the GWT-RPC service
          1. Extending the RemoteService interface
          2. Using the typeArgs annotation
          3. Throwing exceptions
          4. Implementing the service
          5. Setting up your service for hosted-mode testing
        3. 10.2.3. Preparing the client side of a GWT-RPC call
        4. 10.2.4. Calling the remote server service
          1. Step 1: Creating the proxy object
          2. Step 2: Casting the proxy object to ServiceDefTarget
          3. Step 3: Create a callback object
          4. Step 4: Make the remote service call
      3. 10.3. Project summary
        1. 10.3.1. Project overview
        2. 10.3.2. Server-side service implementation
        3. 10.3.3. Calling the service from the client
      4. 10.4. Summary
    2. 11. Examining client-side RPC architecture
      1. 11.1. Structuring the client code
        1. 11.1.1. Encapsulating the Server Status component
          1. Writing the component shell
          2. Adding style and labels to the component
        2. 11.1.2. Encapsulating remote calls in a façade
        3. 11.1.3. Callback routine using the Command pattern
          1. Chaining callbacks for separation of activities
          2. Using an AsyncCallback superclass
      2. 11.2. Examining different polling techniques
        1. 11.2.1. Understanding polling issues
          1. Examining server-push
          2. Examining client-pull
        2. 11.2.2. Implementing a continuously updating component
          1. Using the GWT Timer class
          2. Creating a schedulable class
        3. 11.2.3. Emulating server-push by blocking server threads
          1. Implementing blocking on the client
          2. Implementing blocking on the server
      3. 11.3. Writing custom field serializers
        1. 11.3.1. Creating a custom field serializer class
        2. 11.3.2. Implementing custom field serialization
          1. Implementing the instantiate() method
          2. Implementing the serialize() method
          3. Implementing the deserialize() method
      4. 11.4. Summary
    3. 12. Classic Ajax and HTML forms
      1. 12.1. Classic Ajax with RequestBuilder
        1. 12.1.1. Examining HTTP methods
          1. Dissecting the HTTP GET method
          2. Comparing GET to the POST method
        2. 12.1.2. Simple RPC with RequestBuilder
        3. 12.1.3. Using RequestBuilder to load XML data
          1. Designing the Bookmarks menu
          2. Creating the Bookmark XML data file
          3. Implementing the submenu reader method
          4. Implementing the LinkCommand class
          5. Implementing the MenuLoaderHandler
          6. Implementing the loadSubMenu() method
      2. 12.2. Examining FormPanel basics
        1. 12.2.1. Introducing the FormPanel
        2. 12.2.2. Listening to FormPanel events
        3. 12.2.3. Altering the FormPanel target
        4. 12.2.4. Using the various form controls
          1. Using TextBox to capture text
          2. Using PasswordTextBox to hide text
          3. Using TextArea to capture long text
          4. Using CheckBox for boolean values
          5. Using RadioButton to offer options
          6. Using ListBox to display an option list
          7. Using Hidden to hide data
          8. Using FileUpload to upload files
      3. 12.3. Summary
    4. 13. Achieving interoperability with JSON
      1. 13.1. Introducing JavaScript Object Notation (JSON)
        1. 13.1.1. Understanding the JSON data format
        2. 13.1.2. Using JSONParser to parse JSON messages
      2. 13.2. Examining GWT’s JSON data objects
        1. 13.2.1. Introducing the JSONValue object
        2. 13.2.2. Examining basic JSON types
        3. 13.2.3. Storing JSONValue objects in a JSONArray
        4. 13.2.4. Collecting JSONValue objects in a JSONObject
      3. 13.3. Creating a search component using JSON
        1. 13.3.1. Examining the Yahoo Search API
        2. 13.3.2. Implementing the Yahoo search component
        3. 13.3.3. Sending JSON data to the server
        4. 13.3.4. Parsing and validating a JSON server response
      4. 13.4. Implementing a Yahoo Search proxy service
        1. 13.4.1. Using JSON with Java on the server
        2. 13.4.2. Using JSON with Perl on the server
        3. 13.4.3. Using JSON with Ruby on the server
      5. 13.5. Summary
    5. 14. Automatically generating new code
      1. 14.1. Generating new types
      2. 14.2. Investigating GWT generators
        1. 14.2.1. Basic generator code
      3. 14.3. Creating a generator for the Dashboard
        1. 14.3.1. Accessing the input class
        2. 14.3.2. Accessing properties of the context
        3. 14.3.3. Adding logging to a generator
        4. 14.3.4. Generating the new type structure
        5. 14.3.5. Creating the new class
          1. Overriding an existing method
          2. Creating a method that uses introspection
          3. Getting information from tags in comments
        6. 14.3.6. Using the classes that have been generated
      4. 14.4. Summary
    6. 15. Changing applications based on GWT properties
      1. 15.1. Quick summary of properties
      2. 15.2. Managing browser differences
        1. 15.2.1. How GWT manages browser differences
        2. 15.2.2. Building the Flash widget
          1. Creating the Flash widget
          2. Implementing the standard Flash widget
          3. Implementing the Internet Explorer–specific Flash widget
        3. 15.2.3. Setting up the property replacement
      3. 15.3. Supporting internationalization in full
        1. 15.3.1. Using static-string internationalization
          1. Defining static string internationalization constants
          2. Defining static string internationlization constants with lookup
          3. Defining static-string internationalization messages
          4. Establishing the messages file and directory structure
          5. Creating messages for the default locale
          6. Adding messages for other locales
          7. Localization of dates, times, and currencies
        2. 15.3.2. Using dynamic string internationalization
      4. 15.4. Altering the application for the locale
        1. 15.4.1. Implementing the default component
        2. 15.4.2. Locale-specific classes
      5. 15.5. Implementing user-defined properties
        1. 15.5.1. Defining user-specified properties
        2. 15.5.2. Defining a user-specified property provider
        3. 15.5.3. Checking the provided property value
        4. 15.5.4. Building the code
      6. 15.6. Summary
  10. 4. Completing the understanding
    1. 16. Testing and deploying GWT applications
      1. 16.1. Testing GWT code using JUnit
        1. 16.1.1. Overview of JUnit for GWT developers
          1. Writing a simple test case
          2. Running tests
          3. Writing a test to properly handle errors
          4. Setting up and cleaning up the test
        2. 16.1.2. Creating a new test case
          1. Running junitCreator
          2. Examining the generated test case
        3. 16.1.3. Testing asynchronous code
      2. 16.2. Deploying GWT applications
        1. 16.2.1. Organizing your project
          1. Removing unneeded rebind decision files
          2. Cleaning up the TreeItem images
          3. Removing an unneeded history file
          4. Relocating the JavaScript code in GWT 1.3
          5. Relocating the JavaScript code in GWT 1.4
        2. 16.2.2. Installing RPC servlets
          1. How servlet containers work
          2. Understanding servlet configuration in the development environment
          3. Configuring the production environment
          4. Writing the application deployment descriptor
      3. 16.3. Summary
    2. 17. Peeking into how GWT works
      1. 17.1. Examining the compilation process and output
        1. 17.1.1. Investigating compilation
        2. 17.1.2. Examining the output
          1. The gwt.js file
          2. The module.nocache.js and module.nocache-xs.js files
          3. The cache.xml files
          4. Specific HTML and JavaScript files
          5. The History.html file
      2. 17.2. The GWT application-loading mechanism
        1. 17.2.1. Legacy applications
        2. 17.2.2. Standard applications
        3. 17.2.3. Bootstrapping the standard application
          1. Establishing property-providers
          2. Processing the metatags
          3. Managing property metatags
          4. Registering a property error function
          5. Registering a loading error function
          6. Determining the MD5 name of the file to load
          7. Executing the application
        4. 17.2.4. Cross-script applications
      3. 17.3. Compiling Java to JavaScript
        1. 17.3.1. Exploring the produced JavaScript
        2. 17.3.2. Reviewing standard Java objects: the vector object
        3. 17.3.3. Exploring program code as JavaScript
        4. 17.3.4. Understanding the initialization code segment
      4. 17.4. Summary