On May 09, at the Google I/O, Lars Rasmussen presented Google Wave and now (during a long trip in europe) he is presenting “the next generation Google communication product” also at the Prague Google Developer Day. What is Wave? Realized in Sidney Australia, Google Wave is a communication and collaboration tool. The creators of Wave are two brothers (Lars & Jens) and you may remember those two names because they realized the google maps.

The basic concepts around Wave can be resumed with 3P:

- a Product (Wave.google.com)
- a Platform (code.google.com/apis/ Wave)
- a Protocol (Waveprotocol.org)

and an extremely ambitious target: producing something that may eventually replace email.

gw1

Today email is the most common way to communicate and to share information (invented more that 30 years ago, before internet, before the web … and was done without the experience of sms, blog, instant message, discussion group, social network, …). Essentially in an email based communication the data have to be exchanged between all the people we want to talk with, a lot of data to be moved, stored, administered.

gw2

Google Wave is a shared object ospitated on a server somewhere, where all the user can connect, open, write and change the same shared object.
The idea seems simple and the result is not so difficult to understand and actually there a site http://easiertounderstandthan Wave.com to appreciate the simplicity of Google Wave and a nice example “how to use Google Wave” is a video shared on YouTube: Pulp Fiction via Google Wave. Google Wave is a rich content communication protocol, where people may exchange messages, images and videos with friends they invite to the Wave; furthermore they may customize the Wave with special gadgets and bots (or robots). Let me point on gadgets in this post.

What is a Wave gadget?

A Wave gadget is an extended content of a Wave and is the way that Google give in order to let third party developers to extend the user experience on the Wave. Of course, there are some basic and default gadgets that can be embedded on a Wave: Wave Map; Who is coming; Play Chess; Magnetic Poetry Gadget; Open Social Templates; Sudoku; …; but my target here is to show how we can build a (simple) gadget and use it in a Wave. Any Google gadget written for a non- Wave container can run in the Wave, but it does not give us the possibility to use the main features of Waves, i.e. the interactivity, live and multi-user environment, in two words “shared state”.
The first, minimalistic, “Hello World!” gadget may looks as follows:

< ? xml version="1.0" encoding="UTF-8" ?>
< Module>
< ModulePrefs title="Hello  Wave">

< / ModulePrefs>
< Content type="html">
< ![CDATA[ Hello,  Wave!]] >
< /Content>
< / Module>

and you can test the sample placing the code in some place accessible via http and adding it on a Wave (open a Wave, click on ‘…’ in the menu bar, click on the jigsaw piece, and then paste the url in the pop up dialog); we saved this in the following public URL http://www.keychain.it/HelloWorld.xml if you want to test it yourself. After a test, I suppose you can’t resist of saying “Wow, I got Hello, Wave!”

Ok, the sample is not so amusing, in fact it leaks at least there aspects: interactivity, style, shared-multiuser-state. The first two have noting particularly special in Wave: just put between the [ ] in the CDATA block the content you would put in the body of an html page, as well as a <script> tag to contain JavaScript and a <style> tag for the stylesheet, and you will get the content embedded in the Wave. On the other hand handling shared-state requires a bit of work.

Status of a Gadget

One of the main characteristic of a Wave gadget is the possibility for the Wave partecipants to manage and modify a shared object: the state. From the programmer point of view the shared object is a hashmap accessible through the getState function and updatable through the submission of a delta (i.e. differences) through submitDelta function. A gadget has to register a handler (via setStateCallback(..)) to be called by the Wave when the state changes, and is usually the first action a gadget does when inserted in a Wave.

So a more complete example of a gadget (the full code of a simple Tic Tac Toe gadget I wrote for this post is located at http://www.keychain.it/TicTacToe.xml, you may use this url to download the full source or to insert the gadget in the Wave) may looks as follows:

< ? xml version="1.0" encoding="UTF-8" ?>
< Module>
< ModulePrefs title="Tic Tac Toe" height="250">
< Require feature=" Wave" />
< Require feature="dynamic-height" />
< / ModulePrefs>

<!--[CDATA[
<div class="container">...
< th id="c00" onclick="selected(this.id);">00</th>
...
</div>
<script type="text/javascript">

//Function called when the status changes
function stateUpdated() {
 ...
}

//onclick handle of the elements in the game board
function selected(s) {
 ...
  Wave.getState().submitDelta(...);
}

//register callbacks
function init() {
  if ( Wave &amp;&amp;  Wave.isIn WaveContainer()) {
     Wave.setStateCallback(stateUpdated);
  }  
}

//let the container call init function
gadgets.util.registerOnLoadHandler(init);
</script>
<style>...</style>

]]-->
< / Content>
< / Module>

Take a look at the live demo here. The important parts of this code are:

- the registration of the function init as loadHandler callback;
- the registration, done in init, of the function stateUpdated to be called called after each status modification/update;
- the function selected, called each time that a player clicks on a cell of the game board and that will eventually submit a delta;
- the function stateUpdated called by the cotainer each time that the status of the widget is updated. This is the pivotal function that display the changes of the status into the visual gadget.

Of course, the code of the gadget is supposed to be more easy to understand than elegant, efficient, stilish so please, be clement with the design and if you have any kind of suggestion we will be very happy to improve the TigTacToe gadget with your suggestions.

tictac

A couple of notes on state, deltas and synchronization.

As you can note there are mayor inefficiencies on the gadget code: first of all at each update the gadget reread and rebuild most of the user interface; this is due the fact that Wave communicate to the gadget that a change of the state has been submitted but do not give access to the effective delta; in a real application this may become a major problem and, as I know, this has to be solved in a per-application basis i.e. developing a sort of communication contract implemented by the gadget itself, for example an improved TTT may use a special token, say {delta: XXX} to be put in the state noticing what is the real change happened (but note, things become a bit more complex when you consider that during a run the gadget may be unloaded by an user, e.g. closing the browser, and reloaded after a while).

The second note I can not omit is that with gadgets we are actually doing some sort of (simplified, mediated, put-here-your-preferred-modifier) concurrent programming but without any sort of synchronization primitives. Thus avoiding, for example, two players switching X two cells at the same time is not straightforward (note, this is just a sample of a general problem, I am not looking for a different algorithm for the TicTacToe). My feeling is that a sort of “booking of resources” can be implemented, using the stateUpdated callback functionality as a system for enforcing order on requests, quite easily (with the overhead of at lest a communication round) but the complexity required is certainly too much for the proposed sample.