Sidebar + SideShow = Love

Fri, June 22, 2007, 01:35 AM under Windows | Vista | SideShow
In the past I have introduced Sidebar gadgets and have made a quite few blog posts on SideShow. What I've not done here is talk about the integration between these two. In this blog entry I'll assume you are familiar with both of them independently.

HOW:
The integration is about being able to send content from your Sidebar gadget to SideShow-enabled devices. Effectively, the SideShow gadget(s) running on Windows *is* the Sidebar process. So how do you SideShow-enable your Sidebar gadget? You add a bit to your manifest and the remainder modifications are all in javascript calling the SideShow methods of the Sidebar API:

1. Add an icon for SideShow to your Sidebar gadget manifest. In your gadget.xml file you already have an icon element under an icons element which is under the gadget element. You need to add another element named ico that points to your SideShow icon i.e.
   <icons>
<icon height="48" width="48" src="daniel.PNG" />
<ico src="SSnotification1.ico"/>
</icons>

2. Set a friendly name. Somewhere in your javascript make the following method call:
var friendName = "danielmoth.com"; //your data
System.Gadget.SideShow.setFriendlyName(friendName);
3. Add glance content. Whenever you want to update the glance data, make this call:
var glance = "Hello from Sidebar"; //your data
System.Gadget.SideShow.addText(0, glance);
At this point on your SideShow device you have something like this:

4. If you want to send SCF pages, use the same method as above, this time changing the id (first argument) as appropriate and making the 2nd argument hold the XML, e.g.
var scfXmlcontent = "<body><menu id='1' title='My menu'><item target='2'>I am a menu</item></menu></body>";
System.Gadget.SideShow.addText(1, scfXmlcontent);
So, on your previous screenshot if you now click on the SideShow's OK button you'll get the following:

Clearly, if you select the menu item then you'll get a "Page not found" message because we haven't send any other page with an id=2. I leave that as an exercise to you.

NOTES:
Of course, it would be great if whatever you render on your Sidebar gadget automatically got sent to the SideShow device but as you see above, that is not the case. However, the crucial part of building gadgets in general is getting the content that you want to show: you only need fetch that once and then you just need to package it twice (html for Sidebar and SCF for SideShow).

Note that if you want to send images that you reference by id in your SCF pages, then you must use the addImage API. When you visit the APIs, ignore their advice to check for the enabled method because it apparently always returns true. Also note that when you want to update the same content id, it is best that you call the remove method first and the send down the new content corresponding to the id. You should also not bother with notifications or events for combined gadgets, since the applicationEvent is non-functioning.

DOWNLOAD:
Should you wish to play with the simple sample I described here and you are too lazy to type it yourself, download this ZIP on your Vista machine and then execute the daniel.gadget inside it. To see a fully fledged proper gadget and not the Hello World demo I created, download the StocksPlus combined gadget (it is the Stocks gadget you have in your box, enhanced to support SideShow). Whichever gadget your download, first make sure the SideShow Simulator is running already! Enjoy :)