Aditya Yadav & Associates

Architecting World Class Engineering Companies

Home
Mobile
Books
Amazon Cloud Computing Wi
Amazon Cloud Computing Wi
Understanding Programming
Deploying HTML5
Cross Platform POX Json J
CloudEase - Enterprise
Pocket Guides
Research Reports
Products
Consulting
CloudEase - Enterprise
User eXperience
Presentations
EAI / SOA / ROA / MOA
CEP
GPU/FPGA
QA
Web2.0 & Enterprise2.0
Internet Scale Websites
Cloud Computing
Peer To Peer
Technology Strategy
Agile
Lean
Labs
Articles & Whitepapers
Blogs
Podcasts
Videocasts
Training
Tools We Recommend
Press Release(s) And News
The Way We Work
Contact Us
 
Deploying HTML 5  

Product Description
 

Provides a comprehensive look at the HTML 5 standard as implemented by the top 5 browsers i.e. Opera, Chrome, Firefox, IE and Safari. It covers HTML 5 Structure, Semantics, SVG/MathML, WebForms, Canvas, Native Drag & Drop, Browser History Management, Inline Document Editing, Cross Document/Domain Messaging, Offline Applications Caching & WebDatabases, Audio & Video & Related Tools, GeoLocation, Local & Session Storage, Server Side Events, Workers, Web Sockets. Besides providing practical real world examples for each of the features each chapter contains explanation of the HTML 5 specification for each feature so that you understand what can be expected when they are implemented fully by the browser vendors. Also includes explanation of plugins and third party libraries used in HTML 5 development. We shall be using the JQuery Javascript library extensively. Also web socket chapter contains examples using Netty and Jetty to create WebSocket Servers.

 

It is intended for developers, QA, analysts and architects who are building next generation web applications using HTML 5 and are tasked with analysis, development and QA of such systems. It is also intended for students and freshers who are planning to take up web application development or leaders who want to understand how HTML 5 can be capitalized upon. This can be used as one single reference and guide for any future web application development as far as HTML is concerned. When this book will be published it will be the first book available worldwide on HTML 5.

 
Download source code accompanying the book here
 

 

 

HTML 5 WebSocket Server Example using Java/JDK1.6, Netty & Chrome

 

HTML 5 WebSockets is a mechanism to establish a two way channel of communication with a backend server over ws:// and wss:// protocols. Read the specification here. WebSockets are not hacked implementations like Pushlets, Reverse Ajax or Comet which are constrained by 2 connection browser limits. But on the other hand with multiple connections the WebSocket server could get overwhelmed. They are secured for use over internet protected by the same-origin policy.

 

In the example below we have assembled a WebSocket Server using Netty & Java. It is a very simple server which upgrades from HTTP to the WebSocket protocol and with every message it recieves over WebSocket which is a number it returns the square of the number. We have tested it with JDK 1.6 and the latest Chrome browser on 31st Mar 2010. The download bundle is a console java project which can be opened in eclipse. Run the WebSocketServerHandler.class it will print the following on the console

 

 

and expose a WebSocket Server on http://localhost:9000/websocket url. It doesn't have any same domain constraints so isn't suitable for internet use rightaway. Which also means we can open the 'index.html' file in the 'web' folder in the project in Chrome by double clicking on it. Enter an integer e.g. 12 in the textbox and hit 'Square It...' button it will send '12' to the WebSocket Server which will return '144' which the event handler will display on the page. As shown below.

 

 

This is a good starting point for creating real-life applications. There are other WebSocket Servers available which are listed on wikipedia which you can use.

 

You can download the WebSocket Server Example Source Code below.

 

 

 

HTML 5 WebSocket Server Example using Jetty 7.0.1, Chrome and JDK 1.6

 

In the example below we have assembled a chat application using HTML 5 and Jetty 7.0.1 we have tested it on the latest version of Chrome and JDK1.6 on 2nd April 2010. In the download is a zip of the Jetty 7.0.1 with the example pre installed in the webapps directory. The webapp contains a WebSocketServlet named 'WebSocketChatServlet.java' it keeps a list of all WebSockets and whenever any message is recieved from any user it broadcasts it to everyone in effect creating a chat like application.

 

The download bundle contains the source code to the web application (the WebSocket Server part) and the index.html page (the Chat Client part). download and unzip the bundle and assuming you have JDK1.6 installed, Java Home set and on java.exe on the path. Double click the start.jar file or run it with 'java -jar start.jar' from the command line. The chat application can be accessed on http://localhost:9000/ChatWebSocketServer/ we have changed the jetty configuration to start on port 9000. Open the chat client in two browser tabs and start chatting. See below.

 

 

You can download the WebSocket Chat Example Source+Bin + Jetty 7.0.1 bundle below.