Gadget Corner : gadgets

Tips for writing Sidebar gadgets with SideShow functionality

sbblog@microsoft.com — Fri, 02 Mar 2007 23:29:00 GMT

Here's a few tips for developers writing Sidebar gadgets that interact with Sideshow (the Windows Vista support for auxiliary displays):

Early versions of the Sidebar/Sideshow documentation incorrectly refers to the enabled method as a property. The following code snippet demonstrates how to determine in your gadget whether Sideshow is available using the enabled method:

var sideshowEnabled = System.Gadget.SideShow.enabled(); … if (sideshowEnabled) { …. }

Also note that the enabled method reports whether Sideshow is supported on that operating system, not whether a Sideshow device is currently available. Thus, it always reports “true” on Windows Vista.

The applicationEvent feature is not fully supported on the currently shipping version of Sidebar and should generally not be used.

You can update content using repeated calls to addText/addImage with the same id value. We recommend that you call remove before updating the content for a given id, otherwise the script may suffer from a memory leak.

Instead of this:

… System.Gadget.SideShow.addText(100, originalContent); …. System.Gadget.SideShow.addText(100, newContent);

Do this:

…. System.Gadget.SideShow.addText(100, originalContent); …. System.Gadget.SideShow.remove(100); System.Gadget.SideShow.addText(100, newContent); …

Thanks,
Paula Tomlinson

Embedded ActiveX objects and x64

sbblog@microsoft.com — Fri, 26 Jan 2007 22:00:00 GMT

Really, this post is about Flash. But it will probably apply to quite a few other ActiveX objects out there, too, so use it liberally!

Unfortunately, Adobe Flash does not support the x64 processor architecture. The basic upshot of this is that you can't view Flash content in a Sidebar Gadget if your machine has an x64 processor. Sorry about that.

If you're developing a gadget, you can attempt to provide an user error experience for this by using our own System APIs. The System.Machine.processorArchiture returns "x86" and "x64" for those types, so if you're using a control you suspect isn't supported, then you can write out a helpful user message instead of the HTML for the object!

Thanks,
Brian

“WPF/E” and Sidebar gadgets

sbblog@microsoft.com — Wed, 06 Dec 2006 04:04:00 GMT

One of my favorite new web technologies is now available for preview. I’d urge to you go check out the developer center and team blog.

Of course, since “WPF/E” is a technology designed to work in web pages, many of you are going to try it out inside gadgets. Very cool. Unfortunately, you’ll probably hit some roadblocks when attempting to render “WPF/E” content inside a Sidebar gadget.

External Files

Samples that access external files will not be able to access those files. This includes images referenced in the XAML and XAML files, even inside the gadget package.

This is not a security issue, but rather a problem with the way the “WPF/E” control resolves file paths and URLs. Unfortunately, there is no known workaround, such as placing the files on a remote server. Only XAML content embedded in the HTML files will load.

Making samples into gadgets

It is minor in comparison to the above issue, but most examples won’t have height and width set on the body. This is required for Sidebar gadgets, so be sure to add it.

Brian

Using the slideshow gadget with Search folders

sbblog@microsoft.com — Tue, 28 Nov 2006 01:29:00 GMT

Ben Betz has a pretty cool post about building some advanced queries in the UI (http://shellrevealed.com/blogs/shellblog/archive/2006/10/31/Query-Composition_3A00_-Building-a-search-upon-another-search.aspx).

Did you know that you can direct the slideshow Sidebar gadget to cycle through images in those same dynamic search folders?

David Washington submitted this tip.

The Short Story:

You can point the Slideshow gadget at a Search Folder. You can do this by simply putting a search folder inside of an actual folder and pointing the gadget at the actual folder.

Here are the steps:

1) Create an actual folder

2) Perform a search of pictures

3) Save search to created folder

4) Point the Slideshow gadget at the created folder

5) Make sure “Include subfolders” is checked

The Long Story:

I have a ton of photos that I have tagged and rated, so I was a little disappointed when I saw that the Slideshow sidebar gadget doesn’t support search folders. I have search folders for “Top Rated Pictures” and “Pictures of Family” and I wished that I could just point the gadget at these instead of an actual folder.

Due to the awesome-ness of search folders, they behave just like a regular ShellFolder so the sidebar gadget should support it but the version of SHBrowseForFolder that is being called is only showing File System folders. Determined to hack my around this limitation, I was up to my elbows in javascript when I found that a neat feature in the gadget code that will allow this functionality. If “Include Sub-Folders” is checked the code that adds pictures to the slideshow checks each enumerated file if it is a folder and recursively adds its contents as well. Due to the aforementioned awesome-ness this includes Search Folders! To have a little more control over what pictures are displayed, I created a couple (file system) folders that contain search folders. I just point the Slideshow gadget at one of these and I have exactly what I wanted. I have multiple instances of the Slideshow Gadget running pointing to different saved searches.

Building the Feed headlines gadget using the Windows Feeds Platform

sbblog@microsoft.com — Thu, 16 Nov 2006 21:22:00 GMT

The final RSS gadget, “Feed Headlines” is done and available with Windows Vista! This gadget is featured on the Vista Sidebar by default and allows users to see new headlines peripherally. We built the gadget using the Windows Feeds Platform, which greatly reduced the complexity of getting and storing of feed data so that we could focus more on the user experience.

Initially, the gadget was prototyped using an http request to handle the xml files from each feed, similar to other AJAX development. Designing and developing the prototype quickly revealed that managing feeds was going to be very consuming to develop due to how much code would need to be written for feed download, storage, and user management not to mention the bugs introduced due to the extra code.

We started prototyping a gadget to be a full-fledged feed aggregator for all types of syndicated formats. As part of this development process we took a look at the Internet Explorer 7 feed reading experience and realized that our experience with a Sidebar gadget had to interact with Vista’s new feed platform. We ended up building a gadget that essentially became a face to the feed platform. Because we chose to build the gadget on top of the feed platform the job became a lot less complex, and a more usable gadget emerged. It was more usable in that the user doesn’t need to maintain another RSS list specific to the “feed headlines” gadget and read/unread data is synchronized.

In hindsight, it becomes quite clear that managing feeds in one location accessible to all applications is “how feed management on the OS should work”. Sure you can be savy and have your opml list and import it to all your RSS apps, but I personally am just not that organized, and isn’t that a lot of the reason we use computers - to do our mundane tasks for us?

By choosing to build our gadget on top of the feed platform, we introduced a dependency on the feed platform. If it breaks we break. This is not a bad thing, because if it does break we know where things went wrong and can be fixed from one point instead of several.

In conclusion, I don’t believe this would be a viable gadget without the feed platform. As an independent feed aggregator, there is just too much set-up to ask of the user. Gadgets are quick glance mini-applications. I don’t believe users will want to spend a great deal of time interacting with them, and API’s like the feed platform will make gadgets extremely robust.

Notes on the gadget’s usage of the Feed Platform APIs:

The RSS gadget uses a number of the APIs from the feed platform in ways that may not be obvious on the surface. Helpfully, the feed platform exposes its APIs through a scriptable ActiveX object, so it was simple to access these APIs in a Sidebar gadget using JavaScript.

By default, the RSS gadget displays all feeds in the feed platform, including subfolders. Because the feeds can be organized into folders, it’s possible through the settings dialog to select an individual feed or a folder of feeds.

The gadget also displays only the unread items from the selected feeds, making it more relevant to the user as a gadget. Further, if the user opens a feed item from the gadget’s flyout that particular item will be marked as read.

-John Moscarillo, Sidebar Gadget Developer

Roaming gadgets on a USB key

sbblog@microsoft.com — Fri, 10 Nov 2006 02:57:00 GMT

DISCLAIMER: This post is relevant for the Vista v1 version of Sidebar, but isn’t guaranteed to work on future versions. Hopefully we’ll be able to devise a more streamlined method of roaming gadgets and settings in the future.

Sidebar by default will use settings and gadgets that have been installed to your user profile. Many folks use multiple computers and don’t have easy methods of duplicating their user profiles between computers. Even on domain joined computers and accounts with roaming profiles, gadgets don’t roam. Additionally, some folks use shared computers with profiles that get wiped out every night. For most of these scenarios, Sidebar users typically only have access to the standard Vista gadgets and any shared gadgets the system administrator has installed. Fear not, roaming users, Sidebar does have support for carrying your gadgets and settings with you!

USB storage keys are pretty cheap these days, and they have plenty of room for storing gadgets. We can copy our gadgets and settings to this USB key, edit the settings file to make it drive-letter independent, and use a simple batch file to execute Sidebar in such a way that our gadgets and settings are loaded from the USB key instead of from the user profile.

Step 1: Copy the installed gadgets to the usb key

On Vista your settings and user-installed gadgets are found in “%userprofile%\appdata\local\microsoft\windows sidebar”. Gadgets which were installed by your system administrator are installed in “%programfiles%\windows sidebar\shared gadgets”.

a. On your USB volume (let’s assume it is on E: for these instructions), create a folder called sblocal

b. Copy the entire folder tree from “%userprofile%\appdata\local\microsoft\windows sidebar” to e:\sblocal.

c. You should now have settings.ini file under e:\sblocal, and all your user gadgets are under e:\sblocal\gadgets.

d. If you want to roam your admin-installed shared gadgets too, copy the entire folder tree from “%programfiles%\windows sidebar\shared gadgets” to e:\sblocal\gadgets

Step 2: Edit settings.ini to make it drive-letter independent

Sidebar supports environment variable expansion when figuring out where gadget files live. We can replace the drive-letter-based paths in our local settings.ini file to redirect Sidebar to look where we want for a given gadget.

a. Open settings.ini in your favorite text editor. <shameless plug>Note that the Find/Replace All functionality in Notepad on Vista is hundreds of times faster than it was in XP so Notepad is a good choice for this. </shameless plug>

b. Each section in the settings.ini file will have an entry called “PrivateSetting_GadgetName” whose value is set to the folder where the gadget files are found. EG, my calculator.gadget entry looks like this:

PrivateSetting_GadgetName="C:%5CUsers%5Cdavidshi%5CAppData%5CLocal%5CMicrosoft%5CWindows%20Sidebar%5CGadgets%5Ccalculator%5B1%5D.gadget"

c. I need to change every occurrence of my user profile-based path to use an environment variable called GADGETS_USER. GADGETS_USER is the variable that sidebar uses as the default location for finding user-installed gadgets to show in the gallery, so it’s a good variable to use here for consistency.

d. To do this, I will replace every occurrence of “C:%5CUsers%5Cdavidshi%5CAppData%5CLocal%5CMicrosoft%5CWindows%20Sidebar%5CGadgets%5C” with “%GADGET_USER%”, so my new entry for calculator will look like this:

PrivateSetting_GadgetName="%GADGETS_USER%\calculator%5B1%5D.gadget"

e. Similarly, for any system-provided gadget I want to use, I need to replace the string “C:%5CProgram%20Files” with “%PROGRAMFILES%”

f. Finally, for any of the Shared Gadgets I want to use, I need to replace the string “C:%5CProgram%20Files%5CWindows%20Sidebar%5CShared%20Gadgets” with “%GADGETS_USER%” so they will be mapped to the copies on my usb key

Step 3: Create a batch file for running sidebar with the right settings and gadgets

Now we can take advantage of Sidebar’s use of some environment variables to redirect it to use our local copies. GADGETS_SETTINGS tells sidebar where to find settings.ini, and GADGETS_USER tells sidebar where to look for gadgets to display in the gallery.

a. Under e:\sblocal, create a new text file called sb.cmd

b. Add these lines to the file and save it:

pushd %~dp0

set GADGETS_SETTINGS=%~dp0

set GADGETS_USER=%~dp0\gadgets

start sidebar

popd

Now you can plug your USB key into any Vista computer, exit the default Sidebar process that runs on logon, and run the sblocal\sb.cmd script to launch sidebar with your custom gadgets and settings. Note that if you add any new gadget instances to sidebar while roaming, you may have to repeat step 2.

Enjoy!