book

GWT in Action

by Adam Tacy, Robert Hanson

May 2007

Intermediate to advanced

632 pages

15h 7m

English

Manning Publications

Read now

Unlock full access

Dedication
Who should read this book?RoadmapCode conventions and downloadsAuthor OnlineAbout the authors
1.1. A walk through GWT1.1.1. Explaining GWT’s Java-to-JavaScript compiler1.1.2. Using JSNI to execute JavaScript from Java1.1.3. Accessing the JRE emulation library1.1.4. Understanding GWT’s widget and panel library1.1.5. Examining GWT’s internationalization and configuration tools1.1.6. Calling remote procedures with GWTMaking RPC requests with RequestBuilderCommunicating with GWT-RPC1.1.7. Investigating GWT’s XML parser1.1.8. Managing the browser history1.1.9. Introducing GWT’s JUnit integration1.2. GWT vs. other solutions1.2.1. GWT vs. Swing1.2.2. GWT vs. Echo21.2.3. GWT vs. JavaServer Faces1.2.4. GWT vs. Ruby on Rails1.3. Building your first GWT application1.3.1. Building and running an example application1.3.2. Building Tic-Tac-Toe with GWTDesigning the Tic-Tac-Toe gameWriting the Tic-Tac-Toe game1.4. Summary
2.1. The GWT application development lifecycle2.2. Stage 1: Creating a GWT application2.2.1. Creating the project2.2.2. Creating an application2.2.3. Setting up internationalization2.2.4. Implementing internationalization2.2.5. Creating unit test cases2.2.6. Importing into your IDEImporting into EclipseUsing other IDEs2.3. Summary
3.1. Describing the application example3.2. Stage 2: Developing your application3.2.1. Implementing internationalization3.2.2. Constructing the applicationConstructing the HTML fileAltering the application filesExamining the module XML file3.2.3. Applying styling3.3. Stage 3: Testing and debugging in hosted mode3.3.1. Preparing for hosted mode-noserver-whitelist “list”-blacklist “list”-logLevel level-gen “location”-out “location”-style value3.3.2. Running the Dashboard in hosted mode3.3.3. Debugging the Dashboard in hosted mode through Eclipse3.4. Stage 4: Compiling the code3.4.1. Compiling the code/preparing for web mode-logLevel level-treeLogger-gen “location”-out “location”-style value3.4.2. Viewing the compilation results3.5. Stage 5: Deploying the code3.5.1. Deploying to a web server3.5.2. Deploying to a filesystem3.6. Stage 6: Running in web mode3.7. Implementing application logging3.7.1. Logging information on the client-side3.7.2. Logging information on the server-side3.8. Summary

4.1. What is a widget?4.1.1. Using widgets as Java objects4.1.2. Considering widgets as DOM elements4.2. The standard GWT widgets4.2.1. Interacting with the basic widgetsUploading files with the FileUpload widgetNavigating your application with hyperlinksNavigating your application using menusManaging the view of data using treesViewing images4.2.2. Displaying text on the applicationShowing text as a labelMaking text active using the HTML widget4.2.3. Grabbing the user’s interaction using focus widgetsFraming an area of interestListing optionsClicking your way through an applicationPushing the buttonChecking the boxMaking the choice4.2.4. Getting user input through text inputSecuring password entryEntering multiple lines of textEntering a single line of text4.3. Creating new widgets4.3.1. Creating new widgets by manipulating the DOMDeveloping the FileUpload widget4.3.2. Creating new widgets by extending existing widgetsDeveloping the Dashboard’s PNGImage widget4.4. Developing the Dashboard’s ToggleMenuItem widget4.4.1. Building the TwoComponentMenuItem4.4.2. Building the ToggleMenuItem4.5. Summary
5.1. What is a panel?5.1.1. Using panels as Java Objects5.1.2. Considering panels as DOM elements5.2. The standard GWT panels5.2.1. Interacting with simple panelsPopping up displaysCommunicating in a dialogForming an opinionFocusing user actionsScrolling through information5.2.2. Considering more complex panelsPositioning components absolutelyInterfacing with the browser through the RootPanelAdding new HTML areasFlowing componentsDecking out an applicationStacking components togetherDocking componentsLaying out horizontallyLaying out vertically5.2.3. Considering HTML table-based panelsImplementing an HTMLTableFlexing a table layoutGridding components together5.2.4. Considering composite panelsCreating a TabBarCreating a TabPanelDisclosing panels5.2.5. Splitting panels5.3. Creating new panels5.3.1. Creating a new panel from scratch5.3.2. Creating a new panel by extending an existing panelRe-creating the ButtonPanel5.4. Creating the Dashboard panel5.5. Summary
6.1. Exploring events6.1.1. Identifying event model browser differences6.1.2. Understanding the GWT event modelCreating a widget/panelAdding a widget to a pageCapturing an eventFinding a handlerHandling an eventRemoving a widget from a page6.2. Listening to events6.2.1. Sinking events6.2.2. Managing sunk events with the onBrowserEvent() method6.2.3. Linking sunk events to the onBrowserEvent() method6.2.4. Previewing events6.2.5. Handling events by extending the listener classes6.2.6. Moving events further into your GWT code6.2.7. Preventing default browser event handling6.3. Handling standard browser events6.3.1. Reacting to change6.3.2. Clicking around6.3.3. Gaining/Losing focus6.3.4. Capturing keyboard inputs6.3.5. Loading images6.3.6. Managing mouse inputs6.3.7. Scrolling6.3.8. Window resize events6.3.9. Window close events6.4. Handling other event types6.4.1. Handling forms6.4.2. Reacting to closing pop-ups6.4.3. Tab events6.4.4. Tabling events6.4.5. Tree events6.5. Implementing drag-and-drop6.5.1. Implementing the drag partStarting to dragDraggingStopping the dragDashboardPanel onMouseDownDashboardPanel onMouseMoveDashboardPanel onMouseUp6.5.2. Implementing the drop partCase 1: Widget 1 above widget 2Case 2: Widget 1 below widget 2Case 3: Widget 1 to the left of widget 2Case 4: Widget 1 to the right of widget 26.6. Summary
7.1. What is a composite widget?7.2. Composite widget development steps7.3. Building the editable label7.3.1. Step 1: Identifying the components7.3.2. Step 2: Choosing the panel layout and structure7.3.3. Step 3: Implementing the right GWT Java interfaces7.3.4. Step 4: Building the composite widget7.3.5. Step 5: Styling the composite widget7.4. Creating a composite widget from other composite widgets7.4.1. Creating a slider7.4.2. Constructing the ColourPicker composite7.5. Creating the Dashboard composite7.6. Summary
8.1. Introducing JavaScript Native Interface (JSNI)8.1.1. Understanding JSNICrossing the boundary from Java to JavaScriptPassing Java objects across the Java-to-JavaScript boundarySending objects back across the JavaScript to Java boundaryCrossing the boundary from JavaScript to JavaHandling exceptions8.2. Communicating using JSNI8.2.1. Chatting to the browser via GWT Java8.2.2. Chatting to the browser via JavaScript8.2.3. Talking to a GWT application via a JavaScript API8.2.4. Talking between GWT applications8.3. Loading a JavaScript library8.3.1. Using HTML to load a JavaScript library8.3.2. Using the module XML to load a JavaScript library8.4. Wrapping a simple JavaScript library8.4.1. Accessing the loaded JavaScript libraryDeveloping the implementation classAdding the JavaScriptObject classCreating the widget8.4.2. Using the widget in an application8.5. Wrapping a complex JavaScript library8.5.1. Generating the classes8.5.2. Keeping JavaScript objects as Java objects8.5.3. Calling user-defined code from a library8.5.4. Using a complex wrapped widget in an application8.6. Summary
9.1. Creating a modularization structure9.1.1. Modularization in GWT9.1.2. Including other modules in an application9.1.3. Setting source and other resource paths9.1.4. Defining an application’s server resources9.1.5. Managing an application’s GWT propertiesDefining and extending propertiesHandling properties and managing differences9.1.6. Replacing classes based on property values9.1.7. Registering generators in the XML module file9.1.8. Injecting resources into an application at runtimeInjecting JavaScript resources into an applicationInjecting style sheets into an application9.1.9. Setting an application’s entry point9.1.10. The Dashboard’s module XML file9.2. Including third-party modules9.3. Packaging your own modules9.4. Creating the Java package structure9.5. Summary
10.1. Underlying RPC concepts10.1.1. Understanding asynchronous communication10.1.2. Restrictions for communicating with remote servers10.1.3. Creating the Server Status project10.2. Implementing GWT-RPC10.2.1. Understanding serializable data objectsImplementing the IsSerializable InterfaceUsing the typeArgs annotationImplementing the Server Status data object10.2.2. Defining the GWT-RPC serviceExtending the RemoteService interfaceUsing the typeArgs annotationThrowing exceptionsImplementing the serviceSetting up your service for hosted-mode testing10.2.3. Preparing the client side of a GWT-RPC call10.2.4. Calling the remote server serviceStep 1: Creating the proxy objectStep 2: Casting the proxy object to ServiceDefTargetStep 3: Create a callback objectStep 4: Make the remote service call10.3. Project summary10.3.1. Project overview10.3.2. Server-side service implementation10.3.3. Calling the service from the client10.4. Summary
11.1. Structuring the client code11.1.1. Encapsulating the Server Status componentWriting the component shellAdding style and labels to the component11.1.2. Encapsulating remote calls in a façade11.1.3. Callback routine using the Command patternChaining callbacks for separation of activitiesUsing an AsyncCallback superclass11.2. Examining different polling techniques11.2.1. Understanding polling issuesExamining server-pushExamining client-pull11.2.2. Implementing a continuously updating componentUsing the GWT Timer classCreating a schedulable class11.2.3. Emulating server-push by blocking server threadsImplementing blocking on the clientImplementing blocking on the server11.3. Writing custom field serializers11.3.1. Creating a custom field serializer class11.3.2. Implementing custom field serializationImplementing the instantiate() methodImplementing the serialize() methodImplementing the deserialize() method11.4. Summary
12.1. Classic Ajax with RequestBuilder12.1.1. Examining HTTP methodsDissecting the HTTP GET methodComparing GET to the POST method12.1.2. Simple RPC with RequestBuilder12.1.3. Using RequestBuilder to load XML dataDesigning the Bookmarks menuCreating the Bookmark XML data fileImplementing the submenu reader methodImplementing the LinkCommand classImplementing the MenuLoaderHandlerImplementing the loadSubMenu() method12.2. Examining FormPanel basics12.2.1. Introducing the FormPanel12.2.2. Listening to FormPanel events12.2.3. Altering the FormPanel target12.2.4. Using the various form controlsUsing TextBox to capture textUsing PasswordTextBox to hide textUsing TextArea to capture long textUsing CheckBox for boolean valuesUsing RadioButton to offer optionsUsing ListBox to display an option listUsing Hidden to hide dataUsing FileUpload to upload files12.3. Summary
13.1. Introducing JavaScript Object Notation (JSON)13.1.1. Understanding the JSON data format13.1.2. Using JSONParser to parse JSON messages13.2. Examining GWT’s JSON data objects13.2.1. Introducing the JSONValue object13.2.2. Examining basic JSON types13.2.3. Storing JSONValue objects in a JSONArray13.2.4. Collecting JSONValue objects in a JSONObject13.3. Creating a search component using JSON13.3.1. Examining the Yahoo Search API13.3.2. Implementing the Yahoo search component13.3.3. Sending JSON data to the server13.3.4. Parsing and validating a JSON server response13.4. Implementing a Yahoo Search proxy service13.4.1. Using JSON with Java on the server13.4.2. Using JSON with Perl on the server13.4.3. Using JSON with Ruby on the server13.5. Summary
14.1. Generating new types14.2. Investigating GWT generators14.2.1. Basic generator code14.3. Creating a generator for the Dashboard14.3.1. Accessing the input class14.3.2. Accessing properties of the context14.3.3. Adding logging to a generator14.3.4. Generating the new type structure14.3.5. Creating the new classOverriding an existing methodCreating a method that uses introspectionGetting information from tags in comments14.3.6. Using the classes that have been generated14.4. Summary
15.1. Quick summary of properties15.2. Managing browser differences15.2.1. How GWT manages browser differences15.2.2. Building the Flash widgetCreating the Flash widgetImplementing the standard Flash widgetImplementing the Internet Explorer–specific Flash widget15.2.3. Setting up the property replacement15.3. Supporting internationalization in full15.3.1. Using static-string internationalizationDefining static string internationalization constantsDefining static string internationlization constants with lookupDefining static-string internationalization messagesEstablishing the messages file and directory structureCreating messages for the default localeAdding messages for other localesLocalization of dates, times, and currencies15.3.2. Using dynamic string internationalization15.4. Altering the application for the locale15.4.1. Implementing the default component15.4.2. Locale-specific classes15.5. Implementing user-defined properties15.5.1. Defining user-specified properties15.5.2. Defining a user-specified property provider15.5.3. Checking the provided property value15.5.4. Building the code15.6. Summary
16.1. Testing GWT code using JUnit16.1.1. Overview of JUnit for GWT developersWriting a simple test caseRunning testsWriting a test to properly handle errorsSetting up and cleaning up the test16.1.2. Creating a new test caseRunning junitCreatorExamining the generated test case16.1.3. Testing asynchronous code16.2. Deploying GWT applications16.2.1. Organizing your projectRemoving unneeded rebind decision filesCleaning up the TreeItem imagesRemoving an unneeded history fileRelocating the JavaScript code in GWT 1.3Relocating the JavaScript code in GWT 1.416.2.2. Installing RPC servletsHow servlet containers workUnderstanding servlet configuration in the development environmentConfiguring the production environmentWriting the application deployment descriptor16.3. Summary
17.1. Examining the compilation process and output17.1.1. Investigating compilation17.1.2. Examining the outputThe gwt.js fileThe module.nocache.js and module.nocache-xs.js filesThe cache.xml filesSpecific HTML and JavaScript filesThe History.html file17.2. The GWT application-loading mechanism17.2.1. Legacy applications17.2.2. Standard applications17.2.3. Bootstrapping the standard applicationEstablishing property-providersProcessing the metatagsManaging property metatagsRegistering a property error functionRegistering a loading error functionDetermining the MD5 name of the file to loadExecuting the application17.2.4. Cross-script applications17.3. Compiling Java to JavaScript17.3.1. Exploring the produced JavaScript17.3.2. Reviewing standard Java objects: the vector object17.3.3. Exploring program code as JavaScript17.3.4. Understanding the initialization code segment17.4. Summary

Content preview from GWT in Action

Chapter 1. Introducing GWT

This chapter covers

High-level overview of GWT’s toolset
Comparison of GWT to similar technologies
An example of a GWT application

In May 2006, Google released the Google Web Toolkit (GWT), a set of development tools, programming utilities, and widgets that let you create rich Internet applications differently than you may have done before. The difference between GWT and all those other frameworks is that with GWT you write your browser-side code in Java instead of JavaScript. For those of us who rely on Java as a trusted tool, this is a monumental difference over traditional JavaScript coding. It means that besides gaining all the advantages of Java as a programming language, you also get immediate access to a gazillion ...