Thursday, August 16, 2007

Turning the Velodoc Flash applet into a Google Desktop Gadget

Documentation

The Goggle Desktop SDK can be found at http://desktop.google.com/dev/index.html. The documentation is rudimentary, but there are several samples worth exploring. Besides gadgets are packaged in .gg files which can be renamed into .zip files, so that the content can be explored.

A lot of information can also be found in the forums at http://groups.google.com/group/Google-Desktop-Developer?lnk=lr&hl=en-GB.

Implementation

My initial track was to run the Flash applet in the Sidebar as explained in http://groups.google.com/group/Google-Desktop-Developer/browse_thread/thread/2ee23c46237e5408?hl=en-GB. My gadget was very simple: a manifest, a localized string.xml file, the main.xml file represented below and a couple of images.

<view height="240" width="240">
<div id="flashcontainer" style="text-align: center;"></div>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="240" height="240">
<param name="movie" value="http://www.velodoc.net/Gadgets/Velodoc.Gadget.swf" />
<param name="wmode" value="transparent" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
</object>
</view>

In particular, there was no Javascript file in this implementation.

This track is a dead end because there is too much interactivity in the Flash applet and Google Desktop seems to get the events before the applet code gets an opportunity to handle them, which results in an unresponsive applet. Accordingly, the only way is to run the applet in a details view.

The best example to start from is HtmlDetailsView which is part of the SDK. Do not forget to change the guid in the manifest, otherwise you won't be able to submit your project to Google at the end. The code is pretty straightforward, so please download the gadget at http://www.velodoc.net/gadgets/GDesktop/Velodoc.GDesktop.gg, rename it into a .zip file and explore.

The only issue I have faced is the use of the system.network.online property to detect the online/offline status. After simply disconnecting my network cable, the value returned was still true. So I have created the isOnline() function which uses a synchronous XMLHttpRequest of type HEAD to confirm access to the Flash applet. I did not feel that an asynchronous request was justified in this case. For more information see http://www.jibbering.com/2002/4/httprequest.html and http://ajaxpatterns.org/XMLHttpRequest_Call.

Test and debugging

Testing is easy and does not require packaging the gadget. Double-click the gadget.manifest file and the gadget is installed in the sidebar.

Packaging and Distribution

To package your applet, simply archive all the files in a zip file. Keep the directory structure where the manifest is at the root of the archive. Then rename the .zip extension into .gg and test. You can install your packaged gadget by double-clicking the gg file.

If you upload your gadget to an IIS 6 server, you will get an error 404 when downloading it. By default IIS blocks files which have no known mime type. See: http://www.microsoft.com/technet/prodtechnol/WindowsServer2003/Library/IIS/0f4ac79a-dc2b-4a5f-89c1-d57266aa6ffe.mspx?mfr=true. To be able to download your gadget from an IIS server, you need to create a MIME type for the .gg extension. You can map the .gg extension to "application/octet-stream".

Then the last step is to submit your gadget at http://desktop.google.com/pluginsubmit?hl=en-GB to get some visibility.

Finally, please note that I have also opened a discussion thread regarding this gadget at http://groups.google.com/group/Google-Desktop-Developer/browse_thread/thread/6776e746840080ee?hl=en-GB

No comments: