Windows 7/Vista Sidebar Gadgets

Web Reference in Creating Vista Gadget Book

2009-03-16T16:26:00.000-07:00

Here is the list of Web references used in the "Creating Vista Gadget book"

------------------------------------------
Chapter 1
------------------------------------------
Create Channel Definition Format (CDF)
http://msdn2.microsoft.com/en-us/library/aa768024.aspx

Weather Gadget source of information
http://weather.msn.com

Windows Live Gadgets
http://microsoftgadgets.com/livesdk/index

Yahoo Widgets(Konfabulator)
http://widgets.yahoo.com

Apple Dashboard Widget
http://www.apple.com/downloads/dashboard

Google Desktop Gadget
http://desktop.google.com

DesktopX Widget
http://www.stardock.com/products/desktopx

Samurize Widgets
http://www.samurize.com

KlipFolio Widgets
http://www.klipfolio.com

Apollo Widgets
http://labs.adobe.com/technologies/air

AveDesk Widgets
http://www.avedesk.org

Opera Widgets
http://widgets.opera.com

------------------------------------------
CHAPTER 2
------------------------------------------
Tutorial on CSS and HTML
http://www.w3.org/Style/Examples/011/firstcss

DOM Level 1 specification
http://www.w3.org/TR/REC-DOM-Level-1

Article on reusing MSHTML component
http://msdn2.microsoft.com/en-us/library/bb508516.aspx

Information on HTML Application
http://msdn2.microsoft.com/en-us/library/ms536496.aspx

Windows Sidebar Object Reference
http://msdn2.microsoft.com/en-us/library/aa965853(VS.85).aspx

addshadow and other gadget protocol methods
http://msdn2.microsoft.com/en-us/library/aa359356(VS.85).aspx

Widgets 1.0 W3C working draft
http://www.w3.org/TR/widgets

------------------------------------------
CHAPTER 3
------------------------------------------
Soapbox Video Gadget
http://www.codeproject.com/KB/gadgets/SoapBoxGadget.aspx

Use of Microsoft Copyright content
https://www.microsoft.com/about/legal/permissions/default.mspx

Colors and contrast effects
http://www.colorsontheweb.com

Microsoft design and dimension guidelines
http://msdn2.microsoft.com/en-us/library/aa511443.aspx

HTML and CSS Design Example
http://www.w3.org/Style/Examples/011/firstcss

------------------------------------------
Chapter 5
------------------------------------------
RSS information at the Harvard website
http://cyber.law.harvard.edu/rss/rss.html

About Atom syndication format
http://tools.ietf.org/html/rfc4287

Visual Studio Express editions Free downloads
http://www.microsoft.com/express/download

JavaScript Object Notation(JSON)
http://www.json.org

------------------------------------------
Chapter 8
------------------------------------------
Windows Vista User Experience Guidelines
http://msdn2.microsoft.com/en-us/library/aa511258.aspx

Windows Script Host
http://msdn2.microsoft.com/en-us/library/at5ydy31.aspx

Script Debugger for Windows NT 4.0 and Later
http://www.microsoft.com/downloads

Firefox plug-in for debugging
http://www.codejacked.com/debugging-javascript-with-firefox

Microsoft Cabinet Software Development Kit (Tool for creating a vcab file)
http://support.microsoft.com/kb/310618

VeriSign public timestamp dll
http://timestamp.verisign.com/scripts/timstamp.dll

------------------------------------------
Chapter 9
------------------------------------------
Sitemeter
http://sitemeter.com

Internet Explorer Developer Toolbar
http://www.microsoft.com/Downloads

Child node attributes in HTML document
http://msdn2.microsoft.com/en-us/library/ms537445.aspx

W3C DOM Level 1 specification
http://www.w3.org/TR/2000/WD-DOM-Level-1-20000929/

------------------------------------------
Chapter 10
------------------------------------------
WMI Tasks for Scripts and Applications
http://msdn2.microsoft.com/en-us/library/aa394585.aspx

WMI Code Creator
http://www.microsoft.com/downloads/details.aspx?FamilyID=2cc30a64-ea15-4661-8da4-55bbc145c30e

Identifier for Visual Studio project
http://msdn2.microsoft.com/en-us/library/hb23x61k(VS.80).aspx

------------------------------------------
Chapter 11
------------------------------------------

SHOUTcast Internet radio
http://www.shoutcast.com/

Real Player download
http://www.real.com/player

Object Model reference for Scripting
http://msdn.microsoft.com/en-us/library/dd563945(VS.85).aspx

YouTube RSS Feeds
http://www.youtube.com/rssls

------------------------------------------
Chapter 12
------------------------------------------
Download Silverlight Plug-in
http://www.microsoft.com/silverlight/downloads.aspx

XAMLPad download link
http://msdn2.microsoft.com/en-us/library/ms742398.aspx

-----------------------------------------
Chapter 13
------------------------------------------
Feeds distribution website
http://feeds.feedburner.com

Information on XMLHTTPRequest object
http://msdn2.microsoft.com/en-us/library/ms535874(VS.85).aspx

Beginner guide on XML DOM
http://msdn2.microsoft.com/en-us/library/aa468547.aspx

Details on Feed objects visit
http://msdn2.microsoft.com/en-us/library/ms684749(VS.85).aspx

Gadget graphic protocols
http://msdn2.microsoft.com/en-us/library/bb508512(VS.85).aspx

Free Photo editing software Paint.Net
http://www.getpaint.net

Microsoft Accessibility Developer Center
http://msdn2.microsoft.com/en-us/accessibility/default.aspx

list of DHTML events available to an element
http://msdn2.microsoft.com/en-us/library/ms533051(VS.85).aspx

W3C initiative Web Content Accessibility Guidelines 2.0
http://www.w3c.org/TR/WCAG20/

Lighthouse for the Blind, an expert in vision disabilities
http://www.lighthouse.org/accessibility/effective-color-contrast/

Vista Security
http://msdn2.microsoft.com/en-us/library/aa965881.aspx

User Account Control and WMI
http://msdn2.microsoft.com/en-gb/library/aa826699.aspx

Inspect Your Gadget (Security related article)
http://msdn2.microsoft.com/en-us/library/bb498012.aspx

Simple Gadget Samples for Windows Sidebar
http://msdn2.microsoft.com/en-us/library/bb735517(VS.85).aspx

JsMin (Online Javascript compressor)
http://fmarcia.info/jsmin/test.html

Gadget using Microsoft Dynamics
http://www.codeproject.com/KB/gadgets/DynamicsCRMGadget.aspx

Trickofmind Gadget
http://www.trickofmind.com

Auto Update for Vista Gadget

2009-02-19T14:31:00.000-08:00

I got this question from a Gadget developer!

"We have an auto-upgrade mechanism in place which gets notified if a new version is available thanks to a Web service.

Clearly this will alert users to the presence of a new version, and allow them to download it. However, once downloaded we’d like the old version to be replaced by the new one. Right now we are finding that the new one appears side-by-side with the old one, and the user has to remove it manually.

Do you have any ideas about how to prevent this?"

If you have a similar concern, here is a detail on what needs to be in the new version and what happens when the user download a new version of your existing Gadget.

To replace the existing gadget with a new version the following needs to be there:

Name of the Gadget should be same.
Gadget configuration file need to be same except for the version number which needs to be greater.
The current gadget must be closed from the sidebar.

What happens is, when user downloads a gadget in the temp folder, the gadget is renamed to gadget(1).gadget (if old gadget is also there), so technically this becomes a different gadget(rule 1 above). And If the current gadget is in the sidebar the new gadget install itself again(rule 3). Although there is no direct way to close the gadget from the side bar, what you can do is this.

When an upgrade is available. Give an Alert message that:

Instead of giving your user a URL of the gadget, redirect them to the upgrade page where you can put step-by-step instructions.
The best way of course is to Avoid an Upgrade all together, in my experience very few people go for an upgrade if existing gadget is working.

Auto-update is also discussed in the "Appendix A: Tips and Tricks" section of the book.

ComicStrip Vista Sidebar Gadget

2009-02-02T14:54:00.000-08:00

One of the most popular demo Gadget in the book is ComicStrip Gadget. I keep getting emails from users all over the world about how to customize it. Note that this gadget is meant for education purpose only. Here is one of the conversation.

If you are also interested to customize the Gadget Read On.

The Problem from Gadget developer

First of all let me thank you the very useful ComicStrip gadget. I really enjoy using it, However I have slight problems with it.These are:

When I restart the PC, the gadget reverts all settings to default, in my case, I only need Dilbert, Garfield and Calvin & Hobbes strips but when my PC restarts the gadget always displays all the default strips like Maxine, Chicken and so on. I cannot figure out what is the problem, I am admin on my PC and I also have full control rights for the Sidebar directory. I also checked the settings.ini for gadgets, it has the right settings for ComicStrip. This also happens sometimes when I just hibernate the PC.
The other thing: on the settings page Calvin and Chicken are mixed up, so when I select Calvin, I get Chicken strips and vice versa.

Could you please at least give me hints how to resolve this problem or could you please fix it? I really enjoy using your superb gadget and I definitely do not want to switch to an other feed reader sw because the Sidebar is the most comfortable solution AND simply there is no alternative for your gadget, it is one of a kind...

The Solution

The session in sidebar vista gadget is not saved when the computer restarts, so the only way to make the settings persist is set the defaults in the code. ComicStrip gadget is based on MyBlog Gadget which is the core focus of Chapter 4 to Chapter 8 of Creating Vista Gadgets .If you have the book, check the portion where we initialize and set the defaults for the Gadget.

Here are the steps to change the defaults:

1. Open the following location in Windows Explorer %userprofile%\AppData\Local\Microsoft\Windows Sidebar\Gadgets\ComicStrip.gadget\code

2. Open the Gadget.js file in notepad.

3. Look for the function SetDefaults()

you will see the following code

function SetDefaults()
{
System.Gadget.Settings.write("Dilbert",true );
URLFeedsActive[0] = 1;

System.Gadget.Settings.write("Garfield",true );
URLFeedsActive[1] = 1;

System.Gadget.Settings.write("Chicken",true );
URLFeedsActive[2] = 1;

URLFeedsActive[3] = 0;
URLFeedsActive[4] = 0;
URLFeedsActive[5] = 0;

System.Gadget.Settings.write("Calvin",true );
URLFeedsActive[6] = 1;

System.Gadget.Settings.write("Maxine",true );
URLFeedsActive[7] = 1;

URLFeedsActive[8] = 0;
URLFeedsActive[9] = 0;

System.Gadget.Settings.write("Peanuts",true );
URLFeedsActive[10] = 1;

System.Gadget.Settings.write("BobBetty",true );
URLFeedsActive[11] = 1;

}

SO FOR 11 COMIC STRIPS YOU HAVE 11 SETTINGS

if you want only dilbert , garfield and calvin your function code should look like the following

function SetDefaults()
{
System.Gadget.Settings.write("Dilbert",true );
URLFeedsActive[0] = 1;

System.Gadget.Settings.write("Garfield",true );
URLFeedsActive[1] = 1;

URLFeedsActive[2] = 0;
URLFeedsActive[3] = 0;
URLFeedsActive[4] = 0;
URLFeedsActive[5] = 0;

System.Gadget.Settings.write("Calvin",true );
URLFeedsActive[6] = 1;

URLFeedsActive[7] = 0;
URLFeedsActive[8] = 0;
URLFeedsActive[9] = 0;
URLFeedsActive[10] = 0;
URLFeedsActive[11] = 0;
}

4. Make the change in SetDefault function and save Gadget.js file.

5. Close the gadget from sidebar.

6. Go to gadget picker window and add the gadget again.

Hope this helps.

Visual Studio Template for Sidebar Gadget

2009-01-29T15:37:00.000-08:00

The Gadget books comes with a Visual Studio Temopate with all the reusable functionalities. To create a Gadget all you need to do is Install the tempalte and Create New Project as you do in Visual Studio and Select Innovate.Gadget from your templates

Here is one of the user email I recieved with a query about installing the template. So if you are having similar issues read on.

The Problem (user email)

I would like some clarification on the Gadget Template code so I can make good use of the template if you please.

The information on installing this has been a bit confusing. Should I unzip the files and put them in the C:\Users\User_Pin\Documents\Visual Studio 2005\Templates\Project Templates folder, or should I place them under the same directory path’s Visual Web Developer folder?

I have not had any luck with VS 2005 recognizing this template. Thanks so much for any info…

The Solution

For the installing the Visual Studio template, all you need to do is put the gadgetTemplate.zip in the following folder 'My Documents\Visual Studio 2005\Templates\ProjectTemplates' and it should work. Here is the Screen-shot

Once you put the zip file there , Open Visual Studio 2005 and click on File -> New Website and you will see the template in My Templates section. See the screen shot below

The User Reply

I didn’t notice that the language, by default on the “New Web Site” came up “Visual Basic”. Once I set it to “Visual C#”, the template appears. That’s funny since. I don’t even have Visual Basic installed, but all is well now. Thanks for the help

So if you are also trying to use the template you know (now) what kind of issues are there. Take care.

SOAP based Web Service in Vista Sidebar Gadget

2009-01-02T23:31:00.000-08:00

I got the following email the other day from a fellow gadget developer, regarding a problem with a Gadget which access a SOAP based Web Service.

"I bought your book 'Creating Vista Gadgets' and congratulations... It’s a very good book since it gives both technical details and a broader view of the subjects on other areas which engineers usually forget about.
My aim is very simple… I wanted to migrate a small windows application to the vista gadget platform. It’s an astrological quality time meter using the Webservice http://webservices.plaintime.com/Service.asmx?wsdl. Since my knowledge of XML and Javascript is more google based I’m having problems understanding how to code it. Any help is welcome.

Although I could not help him directly, except for telling him that,

A SOAP based Web Service can be called inside a gadget similar to an rss feed. which is thoroughly covered in Chapter 5 - Chapter 8. Blog Gadget covers this topic in details. A webservice also return an XML file which then will be required to parse.
Sending notes to refer Chapter 9, Information Gadget which uses a Text based Web Service for a Sidebar Gadget, to get some insight and
A link to an article which elaborates a usage of webservice http://www.codeproject.com/KB/gadgets/DynamicsCRMGadget.aspx.

You wll be glad to know that he was finally able to use the Gadget Template in the book for the webservice and with his permission I am sharing his gadget with all of you. The gadget download page: http://www.maladilusoes.com/DLTL. Here is screenshot of the Gadget: Ontime – Astrology Time Management.

So, what kind of Vista Gadget are you creating ?

The Big Question: Vista Gadgets in Windows 7

2008-12-11T16:36:00.000-08:00

If you are one of those users, who are thinking whether vista gadget will make it to windows 7. Well ! Its official now.

Vista Gadgets are not only available in Windows 7 but are also integrated in the context menu. Though you won't see the sidebar anymore so you can just drag the widget in your desktop where ever you want. Here is a screenshot submitted by a user with Silverlight Widget (Chapter 12) on Windows 7

So your investment on Vista Gadgets are there to stay. Start creating now.

Uninstall and reinstall a Vista Sidebar Gadget

2008-12-07T01:04:00.000-08:00

A common concern among vista gadget user is, how to reinstall a gadget or uninstall a gadget. A Vista Gadget is not an application so it does not show up in the Add/Remove programs.

Here are four simple steps to uninstall and reinstall.

Uninstall Step 1 -> Close the existing gadget from the sidebar
Uninstall Step 2 -> Go to the Gadget picker box, Right click the gadget icon and then click uninstall

To Reinstall a Gadget. First uninstall a gadget and then install the latest version

Reinstall Step 1 -> Download and save the latest version to the desktop
Reinstall Step 2 -> Double click the gadget in the desktop to re-install.

SiteMeter Vista Gadget

2008-08-28T10:44:00.000-07:00

I was getting a lot of emails regarding the Sitemeter Windows Vista Gadget, demonstrated in the book (Chapter 9). I wanted to clarify that there are two versions of the Gadget.

SiterMeter Live Version for public use with multiple websites. This is also announced at SiteMeter website. The latest gadget can be downloaded here
Fixed version available in the book. Can be found at the download section of www.innovatewithgadgets.com

If you have a PUBLIC account at Sitemeter.com you can download and use the Live version of the Gadget as shown below

Here are the Steps to add a new website in the Gadget

Get the Sitemeter Code

Open Settings Page.

Add a Title for your website for example For http://www.widgets-gadgets.com you can have Web Widgets. This is a friendly title to distinguish between multiple websites.

Add the 6 digit code , This is NOT the password for the SiteMeter For example for www.widgets-gadgets.com It is s41widgets

Once added, go back to the gadget and when you put your mouse on Title of the Gadget, you will be able to see the Chevrons (forward/backward arrows) Click on the arrow to go to statistics for previous/next website.

Done. let me know if you have any questions

Beijing Olympics - Vista Sidebar Gadget

2008-08-14T17:31:00.000-07:00

Hungry for Olympics ?

The Widget-Box Gadget just got widget-ized with Beijing 2008 Olympics.

Get latest updates, news, videos, slideshows from USATODAY, NBC, COMCAST, and more.

Check out the Gadget at http://widget-box.blogspot.com/

Download the Gadget here

Amazing Reviews for Creating Vista Gadgets

2008-08-02T21:46:00.000-07:00

The book Creating Vista Gadgets got some great reviews at Amazon.com, but Amazon's inhouse maintenance (!) has caused disapearance of all of them. I have recieved an email from Amazon.com that they are working on the issue, hopefully they will apear soon.

If you are looking for what customers are saying about the book here is the list of reviews along with their Amazon link.

3 of 3 people found the following review helpful:

Excellent rundown of gadget development, June 2, 2008

By B. Teutsch (Microsoft)

This book is a wonderful introduction to the entire process of creating a gadget for the Windows Vista Sidebar. I was a program manager for the Sidebar project, and the information Rajesh sets out is excellent. I would caution readers that this book introduces gadget development from the perspective of someone who is at least somewhat familiar with HTML development practices. As long as you're starting from that baseline, you'll find gadget development using this book to be both simple and comprehensive!
http://www.amazon.com/review/RKU12HI5BIO7F

1 of 1 people found the following review helpful:

Great book!!! Even for starters with no background. 2 Thumbs up, June 13, 2008

By Anand Chauhan "Andy Chauhan"

I am a professor teaching Computer Science courses at a University and have reviewed many books. This falls into top 1% of the books that I have reviewed over many years of my teaching. The book presents a great content and a easy to understand style even for starters in this area. I am generally into hard core Linux technologies and have basic understand of Windows systems. However, this book provides sufficient conceptual background to start programming rapidly. The code examples are great to understand the basics of Gadgets. With the book in hand the user can safely assume an easy learning curve. Its a power packed, programing and easy approach to learning Windows Gadgets, and to my understand is the best book it its class. Highly recommended.
http://www.amazon.com/review/RE304VUE23R99

4 of 4 people found the following review helpful:

Comprehensive book on Vista Sidebar Gadgets, May 30, 2008

By Rama K. Vavilala

If you are intending to develop a Vista Sidebar gadget, this is the only book you will ever need. The author goes beyond the JavaScript coding of a sidebar gadget and covers good design practices, architecture and deployment of gadgets. There is even a chapter on business model for sidebar gadgets. The writing style is simple and easy to follow.

Another nice thing about the book are the examples. Not only do the examples illustrate different types of gadgets, but they also illustrate how different technologies such as ActiveX and SilverLight can be employed for gadget development.
http://www.amazon.com/review/R8CGLW2L948SO

4 of 4 people found the following review helpful:

Everything you need, May 27, 2008

By M. Schmidt

If you're new to Vista gadget development or even experienced and need a little creativity boost, this is the book to get. Not only does it cover basic gadget development, it'll show you how to mix and match different technologies when creating your gadget. ActiveX, silverlight, .NET, Ajax. It has it all. Some of the gadgets included in the book are worth the price alone.
http://www.amazon.com/review/R1PTX95J2NZM7M

5 of 5 people found the following review helpful:

Awesome book about gadgets creation!, May 21, 2008

By Sofia Ipatieva "Web designer, BS."

I've found this book occasionally, but after I've finished it I fall in love with gadgets and widgets. I've read it like a thriller. Thanks to author who guided me in exciting and interesting journey through the magic world of the gadgets. Great book, easy to read and understand, quite useful and it's gave me a lot of new ideas and professional tools. I would recommend this book to all my friends-web designers. Sofia I.
http://www.amazon.com/review/R3C0V3ADXKOA9N

1 of 1 people found the following review helpful:

Great Book, In-depth Analysis and reading material., June 29, 2008

By Ajay Prasad

This is awesome book with in-depth analysis and great reading material. User friendly explanation that is even good for the starters. The book contains many topics that give detail orientation of learning and implementation. This book has very comprehensive details that explain everything and require no further explanation. 200% worth reading!!!
http://www.amazon.com/review/R2565F3000FLDY

1 of 1 people found the following review helpful:

Your guide to creating Gadgets, June 23, 2008

This book is an awesome guide to creating Vista Gadgets even for novice developers. It provides all the required knowledge to play with and create your own for a multitude of utilities.
http://www.amazon.com/review/R16X3CT9KRS7PF

1 of 1 people found the following review helpful:

Not just another boring Technical book...... This one is FUN!, June 23, 2008

By Richard T. Kingslan "Consultant for a Major Software Company"

Typically, technical books have a problem of being dry. They lack style, any sense of enjoyment (seriously - you don't read one to stay awake at night...) and are typically read because you either have a problem with the subject at hand, or you've been tossed under the bus by your boss - who promised you could be an expert in three days. And, he told you Monday was the deadline - and it's Friday afternoon.

Now and then, you come across a book that IS fun, and gives you the opportunity to learn something that can be expanded greatly. Such a book is Rajesh's book on Vista Gadgets. With the technology based in the use of JavaScript, HTML, CSS and Ajax, the skills that you can glean from this book can take you in many directions. The key, however, is learning. And learning something is much more enjoyable and fun when you can see the outcome - and it does something that is, well - cool.

Gadgets are designed to be little tools to do something useful. They are a way to automate a daily task. To keep an eye on specific processes. A way to while the time away playing Suduko when, of course, you really should be working. Plus, they can be very attractive and add another element to the theme of a given desktop, much as the wallpaper and the colors of the windows create the theme.

Plus, as mentioned - gadgets can be considered a beginners introduction to Web Parts - those pieces of code that do tasks on web servers and on client browsers - the up and coming Web 2.0. The technology is the same, the scope and the interfaces into the larger project are different.

It would have been a much more average book if Rajesh had taken a number of projects and walked you through the code on how to develop these - all with code samples, snips of pictures, graphic elements, etc. However, he goes the extra mile by not stopping at the 'Let's build an RSS feed gadget...' (Make no mistake - you only need one of those, and all in all - they're pretty simple...) Rajesh takes it the extra mile by spending time on Patterns, project thoughts, bringing together all of the disparate elements. Call it, if you will, Designing Gadgets. Creating a gadget is not overly hard. Designing one is a bit more of a challenge. Rajesh takes you on the thoughts that need to be sorted out as you go through that process. The upside? You don't stop when you get done with the book. You really DO have all the tools necessary to design and develop your own tools, widgets, automatons and sidebar 'bots'.

Remember, though - these are supposed to be fun! If you find yourself having too much fun, that C++ book is just to your left. Read it for a while. Come back to this book and you'll see that Rajesh's book is MUCH MORE exciting!
http://www.amazon.com/review/R1JUFCTRG81OA9

Excellent source for Gadget development, June 20, 2008

By Abhijit Jadhav

This book is an excellent source for creating gadgets for windows vista.I am familiar with HTML development projects and this book provided me with comprehensive details with easy to understand language. I also liked the way Rajesh has illustrated different gadgets in his examples.
http://www.amazon.com/review/R2NPUD7C0POT0L

1 of 1 people found the following review helpful:

Amazing Book and the stuff that we need to build gadgets is in here, June 11, 2008

By M. Kulkarni "DarthRader"

Book is an excellent guide and must to have if you are looking to create gadgets. Best thing about this book is its straight forward approach for serious application developer.The advanced samples are very handy when it comes to build gadgets real-time. i have already started using tips to build my own gadgets. MUST READ FOR chapter 3, 8,9,10,11,12 to get into gadgets before its too late. Do not miss tips section very handy and useful. MAY THE FORCE BE WITH YOU
http://www.amazon.com/review/R1FE2TOS2D1YEP

2 of 2 people found the following review helpful:

Anupama Kunchakara, Software Application Engineer, June 7, 2008

By Anupama Kunchakara

An Excellent book for Gadgets development. There are lot of examples which really are useful to understand the concepts.
http://www.amazon.com/review/R2ZCD2PVJERHFD

3 of 3 people found the following review helpful:

Get deep into Vista Gadgets technology, May 31, 2008

By Luigi Bertoneri

I'm a developer with more than 10 years of experience. I like the new technology, especially of Windows Vista, Windows Mobile and Windows Embedded. I have created a few gadgets without this book, since the Vista Gadget SDK was a beta. I found myself running into more bugs and problems. I think this book is a great learning tool and an excellent guide, it reports more material gleaned from a few of the tips.

The thing that many books have in common is that they are boring. Well, this book is different!

The author, Rajesh Lal, has presented his book, explaining complex matters in a new interesting way, which makes reading his book enjoyable as well as useful. It keeps the theory down to what you need to know to get the job done, without a load of waffle. The author's approach to teaching, is like a friend telling a story. Creating Vista Gadgets will throw a few challenging scenarios at you, you'll go from knowing nothing about gadget to having a strong grasp on the concept.

Programming delves into more depth in many areas; in HTML, CSS, JavaScript, RSS, Ajax and object-oriented programming.
The book is very well structured in a logical development with 4 sections and all concepts are described with illustrations.

In the first section Rajesh Lal talks about the history of gadgets and covers all the basics. Afterwards, he goes well in depth with more Vista Gadget samples.

You can find here all the basic steps required to begin to think your gadget. He provides an overview about using the manifest, the event, how to use resources and the APIs available. The 3rd chapter of the first section, is the chapter I like most, all you need for a killer gadget, the user interface. Around internet you can find a lot of gadgets but only a handful are very useful and cool. Here you can find a good guideline on how to think like a user, the choice to expose, how to do a quick access, the gadget's limits, the refresh, the style and so on. The last chapter of the first section talks about the way to use it in your business, needed for readers more than a noob - a real pearl.

It's indeed useful to understand how to use you gadget or what to deploy with a deep view around you, it helps you with a lot of case studies with benefits.

The other three sections are for real developers, explaining the tool you need such as Visual Studio and a step by step procedure to set up the project with some tips. Furthermore, you can find a deeper analysis of topics mentioned in the previous section. Here you can learn using a manifest, settings, the presentation and the DOM and so on. After the first samples and the first smell of the power you have, the author introduces the event and more useful info with some cool samples.

The 7th chapter is the best of the second section, great must read. I will not explain any further, enjoy reading it.

The book explains then how to debug a gadget, the debugging tools and how to use them and deploy with CAB or MSI. Section 9 is the last of this chapter, introducing AJAX and providing a lot of information on how to use it for deploying a gadget retrieving information from part of a site and manipulate it to a different view. It covers a lot of the design concept and usability.

In the last Chapter of the section 3 the author met his goals. He explains how to develop gadgets in different ways, thus adding renewed power to gadget: Silverlight. I have found it very complete, it's effective and useful. This chapter also have a lot of references and the author suggest areas for further research.

The 4th section, closes the book with a great shot. In "Tips and tricks" You can find some useful hints like avoiding vista security or how to protect your code. In "Extra" the author gives the readers a gadget template for Visual Studio, yes you have read well, a template with three cool gadgets.

My final assessment: This is one of my absolute favorite books on programming, it's just a lot of fun. This is the first book that would really set you apart. It's very useful, with lots samples with code, it really helps you to improve your skills, thinking like an analyst-programmer. Moreover, it helps developers using some language and writing better code. After reading it, you'll have an arsenal of tools to throw at any programming problems. Getting to work under Vista Gadget with no easy task. The target audience is too widely spread, developers (green and old), architects, business analysts, so this book is great to have in the office or in your bookshelf at home. This book is highly recommended.

This book also serves as an excellent reference. If you have a question about something you can contact the author for reference agreement here: http://www.amazon.com/gp/pdp/profile/A2OJOGNTJEY2O9.

I hope this is a comprehensive overview about this book, Creating Vista Gadgets by Rajesh Lal. If you understand a bit of what this book is... order now or buy it immediately, It will repay its cost within hours through saving your wasted time.
http://www.amazon.com/review/R3UBNFOBLSTXLA

1 of 1 people found the following review helpful:

Gadgets development is interesting now!!, June 23, 2008
By manish saraf

I am beginner to Vista gadgets and I found the book to be explanatory with lots of examples. The book explains design, architecture, deployment etc very efficiently. Gadgets development is very interesting for me now. I would definately recommend this book to my web designer friends. http://www.amazon.com/review/R31QR3B2U52TX6

Creating Vista Gadget using HTML, CSS, & JavaScript

2008-05-11T22:08:00.000-07:00

If you ever wanted a book on Creating Vista Gadgets, with lots of useful samples. Here is a book on the topic. Click here to buy the book.

Creating Vista Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, Ajax, ActiveX (COM) and Silverlight (Buy from Amazon)

releasing on "May 19, 2008"

Table of Content

Advanced Gadgets included in the book

This book has advanced samples using ActiveX (COM), Ajax, & Microsoft Silverlight. This guide will walk you through the process of designing and developing of each of them.

(a) Build a Blog Gadget using RSS /Atom Feed

MyBlog Gadget will walk you through a complete gadget development lifecycle using an online RSS/Atom Feed. We see the design patterns and standard practices, common assumptions and then add advanced features to the gadget with multiple feeds and advance page and record management.

(b) Create an Information Gadget with Ajax

Site Statistics Gadget uses Ajax and a Web API provided by Sitemeter.com to create a unique Information Gadget which mimics the online free service provided by Sitemeter.com. It shows how to do screen scraping and load part of a web page in the Flyout window.

(c) Develop a Utility Gadget using ActiveX COM technology

Most Recent Used (MRU).Net Projects is a innovative gadget which lists Most Recent Used projects in .Net. It shows projects for Visual Studio 2003, Visual Studio 2005 and Visual Studio 2008. The gadget also shows how to read and enumerate registry data. The gadget also explains how to use advanced features of Windows Power Shell and Windows Management Instrumentation (WMI) in a sidebar Gadget.

(d) Incorporate Internet Radio and YouTube Video in Fun Gadgets

Learn to create a Radio Gadget based on an online streaming server and Video Gadget using a YouTube Video feed. The gadgets also show how to incorporate windows Media Player as well as Flash Media Player inside a Sidebar gadget. See how to use XMLDOM to read online feed instead of Ajax approach.

(e) Create Cutting edge Sidebar gadget using Microsoft Silverlight

Silverlight World Clock Gadget shows time for multiple cities of the world. It also gives you an insider view of XAML and Microsoft Silverlight. Know the programming model of Silverlight in gadget development.

(f) Developing a Sidebar Gadget using Microsoft Popfly.NET

Website Comparison Gadget uses Microsoft Popfly.net to create an innovative gadget which compares the popularity of different websites with the help of services provided by Live Search and Microsoft Bar graph. It shows how to create the mashups in minutes and port it to Sidebar platform.

I would like to hear any questions/ comments/ suggestions, you may have !

Introduction: Creating Vista Gadgets

2008-04-29T21:48:00.000-07:00

Introduction Creating Vista Gadgets download or read online

Introduction - Creating Vista Gadgets - Upload a doc

Creating Vista® Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, AJAX, ActiveX (COM) and Silverlight™ Copyright © 2008 by Sams Publishing All rights reserved. No part of this book shall be reproduced, stored in a retrieval system, or transmitted by any means, electronic, mechanical, photocopying, recording, or otherwise, without written permission from the publisher. No patent liability is assumed with respect to the use of the information contained herein. Although every precaution has been taken in the preparation of this book, the publisher and author assume no responsibility for errors or omissions. Nor is any liability assumed for damages resulting from the use of the information contained herein. This material may be distributed only subject to the terms and conditions set forth in the Open Publication License, v1.0 or later (the latest version is presently available at http://www.opencontent.org/openpub/). ISBN-13: 978-0-672-32968-5 ISBN-10: 0-672-32968-9 Library of Congress Cataloging-in-Publication Data Lal, Rajesh. Creating Vista gadgets : using html, css and javascript with examples in rss, ajax, activex (com) and silverlight / Rajesh Lal. p. cm. ISBN 978-0-672-32968-5 (pbk.) 1. Microsoft Windows (Computer file) 2. Operating systems (Computers) 3. User interfaces (Computer systems) I. Title. QA76.76.O63L3546 2008 005.4'46--dc22 2008016280 Printed in the United States of America First Printing April 2008 Associate Publisher Greg Wiegand Acquisitions Editor Loretta Yates Development Editor Todd Brakke Managing Editor Patrick Kanouse Project Editor Jennifer Gallant Copy Editor Margo Catts Indexer Ken Johnson Proofreader Mike Henry Technical Editor Marc Clifton Publishing Coordinator Cindy Teeters Book Designer Anne Jones Trademarks All terms mentioned in this book that are known to be trademarks or service marks have been appropriately capitalized. Sams Publishing cannot attest to the accuracy of this information. Use of a term in this book should not be regarded as affecting the validity of any trademark or service mark. Warning and Disclaimer Every effort has been made to make this book as complete and as accurate as possible, but no warranty or fitness is implied. The information provided is on an “as is” basis. The author and the publisher shall have neither liability nor responsibility to any person or entity with respect to any loss or damages arising from the information contained in this book. Bulk Sales Sams Publishing offers excellent discounts on this book when ordered in quantity for bulk purchases or special sales. For more information, please contact U.S. Corporate and Government Sales 1-800-382-3419 corpsales@pearsontechgroup.com For sales outside of the U.S., please contact International Sales international@pearson.com This Book Is Safari Enabled The Safari® Enabled icon on the cover of your favorite technology book means the book is available through Safari Bookshelf. When you buy this book, you get free access to the online edition for 45 days. Safari Bookshelf is an electronic reference library that lets you easily search thousands of technical books, find code samples, download chapters, and access technical information whenever and wherever you need it. To gain 45-day Safari Enabled access to this book: • Go to http://www.informit.com/onlineedition • Complete the brief registration form • Enter the coupon code UWC5-ZPGE-RMIN-P5EG-MSHE If you have difficulty registering on Safari Bookshelf or accessing the online edition, please email customer-service@safaribooksonline.com. the broadest ever worldwide release of a PC operating system, in 2007 Windows Vista opened the door to an era of gadget development. Gadgets, which reside on the Windows Vista Sidebar, are small, lightweight, and can be very useful applications. The Sidebar is a brand new platform for innovation and it gives users a unique way to interact with information. This book is for people who want to create feature-rich and professional-looking Vista Sidebar gadgets. It’s a guide for designers, developers, and anyone else who has a basic knowledge of HTML, CSS, and JavaScript and wants to leverage this new and innovative platform. It’s for anyone who wants to create a gadget for his company, or for a programmer with a great idea to implement on a Sidebar gadget platform, or even for a hobbyist programmer, who wants to try his hand on a gadget platform. This book is intended to give you ideas for what you can do with this new platform and how you can do it. With Introduction What’s in the Book This book starts with a brief background on gadgets, and then gives a broad and clear view of the architecture of gadget development. Gadget design considerations are an important part of this book and they go side by side with almost all the chapters that deal with gadget development. Once you’ve read up on the concept and scope of gadget development, the book helps you create a gadget called MyBlog. During this process the text elaborates on the architecture, design constraints, and implementation details for the gadget and then details some standard practices applicable to all gadget development. The last section deals with more advanced gadget examples that utilize .NET, XML, XHTML, CSS, Ajax, and Microsoft Silverlight. This book is divided into three broad sections. Section 1: The Foundation The four chapters in this first section give a thorough background of Sidebar gadgets. The section explains the types of gadgets, the architecture, and the technology behind the 2 Create Killer Vista Sidebar Gadgets Using HTML, CSS, and Ajax gadget development. The “Approach to Design” chapter helps you know the difference between a merely good-looking gadget and a one that is professional, rich, and worth the space it takes up on the user’s desktop. The last chapter discusses the revenue model of the gadget: what you need to know to sell your gadgets. Section 2: Developing a Gadget This section walks you through the standard development process of a gadget. It details the creation of the basic MyBlog Gadget, which makes use of an RSS/Atom feed. It also goes through best practices with the user interface, design guidelines, and common assumptions. The later chapters improve on the basic gadget based on standard practices and also deal with deploying and distributing a gadget. Section 3: Advanced Samples The section deals with advanced samples. You will be able to create advanced gadgets such as a Site Statistics Gadget, a Radio Gadget, and a YouTube Video Gadget. All the samples follow standard patterns, making it easier to switch between the features and functionality you want, when you want. You will also learn how to use ActiveX COM for creating a utility gadget with a sample .Net Most Recent Used (MRU) Gadget. The final chapter shows you how to create a gadget with Microsoft Silverlight. You will also see how, in just a few minutes, to create a Sidebar gadget with Microsoft Popfly. If you are a relatively new gadget developer, I would suggest you to start with the first section. If you have basic background knowledge of gadgets and you just want to start with the step-by-step practical approach to gadget development, you can directly start with the second section, “Developing a Gadget.” The third section, “Advanced Samples,” is for people who have developed a gadget and want to go beyond the basics of gadget development. Each chapter in the third section is actually an advanced sample dealing with a particular type of gadget in a scenario of its own. Special Features and Notations This book is meant to be a definite, precise, and concrete guide for gadget development. By pruning redundant information and filtering and highlighting the information that is more crucial, we have tried to make it as comprehensive as possible. This book includes various features and conventions that help you get the most out of the book. HTML, CSS, and JavaScript code blocks will be shown as follow Code in HTML, CSS, and JavaScript Sample single code lines will look like this: Statement one; Statement two; Introduction 3 Other comments will also show up in the code with two backslashes // Comment one // Comment two The book also uses the following boxes for important information: NOTE A Note includes extra information to broaden your understanding of a topic. TIP A Tip provides alternative, shortcuts, or insider information of the topic being discussed. CAUTION A Caution warns you of potential traps and pitfalls. Supporting Website The book has a supporting website where you can download all the codes and gadgets. The website also has blogs I have written on Sidebar gadgets and some of my personal views on gadget development. You are invited to check that site and contact me personally. You will also find errata and most updated information there. Visit www.innovatewithgadgets.com Index A About screen (Settings page, Recent Project Gadgets), 222 accessibility techniques enter key as mouse clicks, 135-137 Flyouts, 137-138 HTML, 73 keyboard access, 72-73 putting focus on gadgets after loading, 135 Settings pages, 137-138 tab controls, adding, 135 theme colors, 73 accessing information (gadget design), 51 Active Desktop feature (Windows XP), 9 ActiveX COM, 38, 214 initializing inside gadgets, 215 Windows Registry, reading settings via, 229-234 ad gadgets benefits of, 82 case study, 81 Added Features check box (Settings page), Site Statistics gadgets, 199 AddFeed function, feed gadgets, 147-148 AddItem function, feed gadgets, 146 addShadow() method, 46, 304-306 Adobe AIR widgets, 25 aesthetics, user interface design, 53 322 Ajax Ajax buildMyContent function, Site Statistics gadgets, 205-210 getData function, 200 getHTMLAjax function, 200-201 getTextAjax function, 190, 200-203 parseData function, 190, 203-204 parseHTML function, 200 parseHTMLAjax function, 201-202 ShowFlyout function, 204-205 Site Statistics gadget API, 188-190 displaying portions of web pages in, 190-194 XMLHTTPRequest object, 188, 192 alpha transparencies, gadget design, 71 Always On Top property, 17 animation, Silverlight World Clock Gadget, 273-274 API (Application Programming Interfaces) Site Statistics gadgets, 187 data retrieval, 200-204 graphs, 204-210 parsing data, 190 pie charts, 204-210 pulling text data, 188-189 Windows Registry, MRU Project Gadgets, 230-231 Apollo widgets. See Adobe AIR widgets Apple, Dashboard widgets, 23 application gadgets, 13, 58 Assert function, debugging gadgets, 164 assumptions feed gadgets caching data, 133 updates, 132 functionality, JavaScript errors, 130-131 Internet connections, 131 memory, 133-134 session management, 133-134 Atom feed gadgets, 91 data storage, 92 feed example, 103 audio (streaming), playing on Radio Gadget, 240 automatic updates, 289 checking for, 290 user notifications, 292-293 version checks via inserted code, 291-292 version information, posting online, 290-291 AveDesk widgets, 25 B background images as wallpaper, 34 gadget design, 68-69 background.png files, 35 behaviors (gadget design) configuring gadgets, 60-61 displaying gadget statuses, 61-62 error messages, 61-62 refreshing gadgets, 61 Service Not Available information, 62-63 warnings, 61-62 blogs. See MyBlog gadget body on load functions, feed gadgets, 104 BuildContent function, 124-125 BuildMyBlog function, feed gadgets, 111 buildMyContent function, Site Statistics gadgets, 205-210 BuildVideoObject function, YouTube Video Gadgets, 251 configuration functions 323 buttons gadget design, 69 icons associated with button types, 163 type values list, 163 buttons parameter (MsgBox function), 165 themes, 268-269 usability, 270 developing animation, 273-274 existing framework integration, 271-272 handleLoad function, 277 logic, 275-280 mouse click events, 279-280 multiple locales, 278-279 SetClock function, 277-278 setting time, 276-277 SilverlightClock.XAML files, 272-273 features of, 264-265 JavaScript, 265-266 XAML, 267-268, 272-276 code security, JavaScript, 313 collection objects, MRU Project Gadgets, 231 color (themes), accessibility techniques, 73 Comic-Strip gadget, 319 common assumptions feed gadgets caching data, 133 updates, 132 functionality, JavaScript errors, 130-131 Internet connections, 131 memory, 133-134 session management, 133-134 common images, display/presentation (design patterns), 128 communities (online), gadgets, 21 comparing gadgets, 26 Comparison Gadgets (Websites), 280 configuration functions, 122 C CAB files creating, 175 deploying gadgets via, 174 buying certificates, 176 signing via certificates, 178 Windows Installer, 180 caching feed gadget data, 133 case studies ad gadgets, 81 free information gadgets, 86 gadget design information, 51-53 gadgets as side products, 83 pull models (gadget revenue models), 77 push models (gadget revenue models), 79 utility gadgets, 85 CDF (Channel Definition Format), 10 ChangeFeed() function, feed gadgets, 144-146 checkForUpdate() function, 291 click events (mouse), Silverlight World Clock Gadget, 279-280 Clock Gadget for Time, 14 Clock Gadgets, 261 designing images, 268-269 layouts, 269-270 How can we make this index more useful? Email us at indexes@samspublishing.com 324 configuring configuring gadget behaviors, 60-61 gadget window, feed gadgets, 156-157 Settings page, feed gadgets, 155 controls, gadget design, 69 converting gadgets, 20 Counter Widget feature (Sitemeter.com website), Site Statistic gadget development, 184 country codes (localization), 302 CPU Meter Gadget, 14 CSS (Cascading Style Sheets), 32 display presentation (design patterns), 129-130 feed gadgets, data presentation in, 108 flyout.css files, 33 gadget.css files, 33 settings.css files, 33 undocked.css files, 33 Currency gadget, 64, 68 customizable design patterns, 116 customizing gadgets, 18 Windows Sidebar, 8 DOM, 166-167 JavaScript, 161, 166-167 Systems Debugger Select window, 169 VBScript, 164-166, 169 WScript, 161-163 deploying gadgets CAB files, 174 buying certificates, 176 signing via certificates, 178 Windows Installer, 180 comparison chart, 180 installation process, 172 installation target folders, 171 packaging, 172-173 design accessibility adding tab controls, 135 enter key as mouse clicks, 135-137 Flyouts, 137-138 HTML, 73 keyboard access, 72-73 putting focus on gadgets after loading, 135 Settings pages, 137-138 theme colors, 73 behaviors D Dashboard widgets (Apple), 23 data applications, gadget development, 9 data storage, feed gadgets, 92 debugger statements, 169 debugging gadgets, 160 debugger statements, 169 Disable Script Debugging option (Internet Explorer), 168 configuring gadgets, 60-61 displaying gadget statuses, 61-62 error messages, 61-62 refreshing gadgets, 61 Service Not Available information, 62-63 warnings, 61-62 customizable patterns, 116 directory structures, 118-119 Disable Script Debugging option 325 display/presentation, 127 common images, 128 standard images, 128 Stylesheets, 129-130 extensible patterns, 117 file structures, 119 image grouping, 118 information, 50 case study, 51-53 easy access of, 51() live data, 51 relevant to individual users, 51 showing enough for further action, 51 showing only revelant information, 54 localization, 118 maintainable patterns, 116 modular file structures, 118 PNG files, 71-72 quality, ensuring, 50 reusable functionality, 120 flyout window, 124-125 gadget window, 122-124 Settings page functions, 125-126 screen space, justifying, 49 standard file/folder layouts, 118-120 styles, 70 text, 70 transparent images, 71 usage patterns application gadgets, 58 fun gadgets, 59 information gadgets, 57 utility gadgets, 58-59 what gadgets aren’t meant for, 60 user interfaces aesthetics, 53 docked page dimensions, 64 flyout page dimensions, 65 guidelines for, 66 relevant information, 54 settings page dimensions, 65 simplicity, 53 standard page dimensions, 64 undocked page dimensions, 65 unobtrusiveness of, 56 visuals, 55 visual themes background images, 68-69 buttons, 69 controls, 69 drag images, 68 icons, 67 titles, 67 Desktop (Google), 23 desktop gadgets Adobe AIR widgets, 25 AveDesk widgets, 25 Dashboard widgets (Apple), 23 Desktop (Google), 23 DesktopX widgets, 24 KlipFolio widgets, 25 Konfabulator (Yahoo widgets), 22 Opera widgets, 26 Samurize widgets, 24 DesktopX widgets, 24 directories feed gadget structures, 95 structures of, 118-119 Disable Script Debugging option (Internet Explorer), 168 How can we make this index more useful? Email us at indexes@samspublishing.com 326 display/presentation display/presentation (design patterns), 127 images, 128 Stylesheets, 129-130 displaying HMTL in flyouts, 193-194 web pages, Site Statistics gadgets, 190-194 docked gadgets feed gadgets, 154-155 page dimensions, 64 YouTube Video Gadget, 258-259 Docked Views, 16 DOM (Document Object Model) debugging gadgets, 166-167 feed gadgets, data presentation in, 109-111 Site Statistic gadgets displaying portions of web pages in, 190-194 parsing data, 190 DOM Level 1 (Document Object Model Level 1), 36 drag images, gadget design, 68 dragicon.png files, 30, 34-35 event.closeAction property, 123 extensible design patterns, 117 features, adding to gadgets, 140 feed gadgets, 91-92, 139 adding features to, 140 advanced framework of, 141 caching data, 133 commonly used fields list, 99-100 core functionality, 104-107 data presentation, 107 CSS, 108 DOM, 109-111 data section, 103 data storage, 92 deploying, 114 framework of, 98 directory structure, 95 image files, 96 required files, 94-96 Gadget.xml manifest files, 98-99 JavaScript functions in, 112-113 Main Gadget window, 104-107 Mini Me option, 154 gadget window configuration, 156-157 Settings page configuration, 155 mouse hover functionality, 152-154 multiple feeds, 142-148 multiple pages, managing, 150-152 removing feeds from, 148-149 Settings page, 100-101 unobtrusive traversing, 152-154 updates to, 132 updating feeds, 148-150 zip files, 113-114 E-F easy access of information (gadget design), 51 effects, 302. See also graphic design enter key as mouse clicks (accessibility techniques), 135-137 enterprise-level applications, gadgets in, 313 Enumerate Registry, MRU Project Gadgets, 231-232 error messages, gadget behaviors, 61-62 event.Action.commit property, 123 Gadget Setup function 327 feed tracking, 294 FeedBurner feed tracking tool, 294 feedchanged function, feed gadgets, 102 feedchanged variable, 123 FeedURL, feed gadgets, 101 File System API System.Environment, 43 System.Network, 43 System.Shell, 42-43 files standard gadget layouts, 118-120 structures of, 119 Flash Media Player, embedding in YouTube Video Gadgets, 250-251 floating state, feed gadgets, 154-155 Floating Views, 16 flyout page dimensions (user interface design), 65 flyout windows, 18, 124-125, 130 flyout-related functions, 124 Flyout.css, 129 flyout.css files, 33 flyout.html files, 30, 32 flyouts accessibility techniques, 137-138 displaying HTML in, 193-194 folders, standard gadget layouts, 118-120 free information gadgets, 85 benefits of, 87 case study, 86 fun gadgets, 14-15, 59 functionality JavaScript errors, 130-131 resuable functionality, 120 flyout window, 124-125 gadget window, 122-124 Settings page functions, 125-126 G Gadget Object Model, 35, 38-39 gadget development, 9 Sidebar Events API, 41 System.Contact API, 45 System.debug API, 45 System.Diagnostic.EventLog API, 45 System.Environment API, 43-44 System.Gadget API, 40 System.Gadget.Settings API, 40-42 System.Machine API, 44 System.MessageStore API, 45 System.Network API, 43 System.Shell API, 42-43 Gadget Picker window, 30 gadget revenue models, 75 ad gadgets benefits of, 82 case study, 81 free information gadgets, 85 benefits of, 87 case study, 86 gadgets as side products, 82 benefits of, 84 case study, 83 pull models, 76 ad gadgets, 81 benefits of, 85 case study, 77 utility gadgets, 84-85 push models, 78 case study, 79 gadgets as side products, 82-84 utility gadgets, 84-85 Gadget Setup function, 122 How can we make this index more useful? Email us at indexes@samspublishing.com 328 gadget window gadget window, 129 configuration functions, 122 feed gadgets, configuring for Mini Me gadgets, 156-157 flyout-related functions, 124 gadget specific functions, 124 settings-related functions, 123 standard functions in, 122 YouTube Video Gadget, 259-260 Gadget.css, 129 gadget.css files, 33 gadget.xml files, 30-32 Gadget.xml manifest files, MyBlog gadget, 98-99 gadgets application gadgets, 13 classifying, 12 comparison chart, 26 competing versions of, 22 converting, 20 core functionality of, 34 customizing, 18 defining, 7 development of, 8-9 development platforms, 21 fun gadgets, 14-15 history of, 9-10 information gadgets, 12 limitations of, 15-16 malware, 37 meeting points between different gadgets, 20 multiple versions of, 8, 22 purposes of, 7 spyware, 37 support for, 87-88 utility gadgets, 14 web resources, online community website, 21 GadgetUndocked.css, 129 gBackground method, 45 getData function, 200 getElementById function, feed gadgets, 109 GetFeed() function, 105, 124, 132 getHTMLAjax function, 200-201 getTextAjax function, 190, 200-203 GIF (Graphics Interchange Format) files, 71-72 gImage method, 45 gimage protocol, 304 globalization internationalization, 299 localization, 299 country codes, 302 gadget example, 300-302 globalUpdateGadgetXML variable, 291 globalUpdateURL variable, 291 Google Desktop, 23 graphic design, 302 gimage protocol, 304 GraphicDemo.gadget, 304-306 g:background protocol, 303-306 g:image protocol, 303 g:text protocol, 303 shadow effects, 309-311 transparent PNG files, 307 GraphicDemo.gadget, 304-306 graphs, Site Statistics gadgets, 204-210 g:background protocol, 303 GraphicDemo.gadget, 304-306 removeElements method, 306 removeObjects method, 306 images 329 g:image protocol, 303 g:text protocol, 303 Sidebar gadgets, 37 web pages applications versus, 37 displaying in Site Statistics gadgets, 192 H handleLoad function, Silverlight World Clock Gadget, 277 Hello World XAML files, Silvelight World Clock Gadget, 268 HideArrows function, feed gadgets, 153 HideFlyout function, 124 hosting web gadgets, 19 hover functionality (mouse), feed gadgets, 152-154 href properties, changing onclick events to, 136 HTML (Hypertext Markup Language) accessibility techniques, 73 applications versus web pages, 37 extracting for display in flyouts, 193-194 feed gadget files, 94-95 flyout.html files, 30-32 getHTMLAjax function, 200-201 main.html files, 30, 32 MSHTML (Microsoft HTML) component, 36-37 parseHTML function, 200 parseHTMLAjax function, Site Statistics gadgets, 201-202 reading, XHR (XMLHttpRequest) object, 295, 297 retrieving via XMLHTTPRequest objects, 192 Settings page, feed gadgets, 100-101 settings.html files, 30-32 I icon.png files, 30, 34-35 icons gadget design, 67 user interface design, 55 images. See also graphic design addShadow method, 46 background images as wallpaper, 34 gadget design, 68-69 background.png files, 35 display/presentation (design patterns), 128 drag images, gadget design, 68 dragicon.png files, 30, 34-35 feed gadgets, 96 gBackground method, 45 GIF files, gadget design, 71-72 gImage method, 45 grouping, gadget design patterns, 118 icon.png files, 30, 34-35 info.gif files, 35 loading.gif files, 35 logo.png files, 30, 34-35 MRU Project Gadgets, 220 PNG files, gadget design, 71 Silverlight World Clock Gadget, 268-269 Site Statistic gadgets, 195-196 transparent images, gadget design, 71 How can we make this index more useful? Email us at indexes@samspublishing.com 330 images user interface design, 55 wallpaper, 34 info.gif files, 35 information gadgets, 57 Site Statistics gadget Added Features check box, 199 API, 187-190, 204-210 Counter Widget feature (Sitemeter.com website), 184 data retrieval, 200-204 design considerations, 195-197 developing, 198-204 displaying portions of web pages in, 190-194 goals of, 183 images, 195-196 integration into existing frameworks, 199 layouts, 196-197 Mini Me version, 199 site summary pages (Sitemeter.com website), 185 themes, 195-196 usability, 197 Weather Gadget, 12 Initialize function, 124 Innovate.Gadget project template (reusable frameworks), 315 Installer (Windows), deploying gadgets via CAB files, 180 installing gadgets for deployment, 172 internationlization, 299 Internet connections, common assumptions of, 131 radio stations, 238-239 Internet Explorer, Disable Script Debugging option, 168 J-K-L JavaScript, 34 ActiveX COM objects, initializing inside gadgets, 215 debugging gadgets, 161, 166-167 errors, gadgets design, 62 functionality, 130-131 feed gadgets, functions in, 112-113 JSON, 105 main.Js files, 30 Settings page, feed gadgets, 101 Silverlight World Clock Gadget creation, 265-266 Site Statistic gadgets, parsing data, 190 Sitemeter.com website, Count Widget feature, 184 JavaScript Compression, 313 JavaScript Obfuscator, 313 JSON (JavaScript Object Notation), 105, 295-297 keyboards, accessibility techniques, 72-73 KlipFolio widgets, 25 Konfabulator (Yahoo widgets), 22 Layer style (Photoshop), 309 layouts files/folders, 118-120 Radio Gadgets, 241 Silverlight World Clock Gadget, 269-270 Site Statistic gadgets, 196-197 YouTube Video Gadget, 252-253 live data, gadget design, 51 Microsoft Silverlight World Clock Gadget 331 Live Gadgets, 19 LoadFeed function, feed gadgets, 146 loading gadgets, putting focus on (accessibility techniques), 135 loading.gif files, 35 LoadSettings function, 101, 125 LoadXML function, 133 localization, 299 country codes, 302 gadget design patterns, 118 gadget example, 300-302 logic, Silverlight World Clock Gadget, 275-280 logo.png files, 30, 34-35 embedding Flash Media Player in, 250-251 video feeds, 249-250 media player functionality, Radio Gadgets, 243-244 PlayRadio function, 247 state changes in, 245-247 memory, common assumptions, 133-134 Message function, debugging gadgets, 164 MessageDialog function, debugging gadgets, 164 MessageJS function, debugging gadgets, 162 Microsoft Feed Manager, reading online data via, 298-299 Microsoft Outlook Gadget, 13 Microsoft Popfly, creating via Sidebar gadgets mashup gadgets, 281-283 Website Comparison Gadgets, 280 Microsoft Silverlight applications features of, 262 origin of, 263 running, 262 Sidebar implementation, 264 Microsoft Silverlight World Clock Gadget, 261, 266 designing images, 268-269 layouts, 269-270 themes, 268-269 usability, 270 developing, 271 animation, 273-274 existing framework integration, 271-272 handleLoad function, 277 logic, 275-280 mouse click events, 279-280 M Main Gadget window, feed gadgets, 104-107 main.html files, 30-32 main.Js files, 30 maintainable design patterns, 116 malware, gadgets as, 37 mashup gadgets, creating, 281-283 media gadgets Radio Gadget designing, 240-242 developing, 243-248 features of, 239-240 Internet radio stations, 238-239 requirements for, 239 Windows Media Player, 244-245 YouTube Video Gadget BuildVideoObject function, 251 designing, 251-253 developing, 255-260 How can we make this index more useful? Email us at indexes@samspublishing.com 332 Microsoft Silverlight World Clock Gadget multiple locales, 278-279 SetClock function, 277-278 setting time, 276-277 SilverlightClock.XAML files, 272-273 features of, 264-265 JavaScript, 265-266 XAML, 267-268, 272-276 Minesweeper Gadget, 59 Mini Me option, feed gadgets, 154 gadget window configuration, 156-157 Settings page configuration, 155 Mini Me versions, Site Statistics gadgets, 199 mini web applications, gadget development, 9 modular file structures, 118 mouse click events enter key as (accessibility techniques), 135-137 Silverlight World Clock Gadget, 279-280 hover functionality, feed gadgets, 152-154 MRU (Most Recent Used) lists, 13 MRU (Most Recent Used) Project Gadgets, 211 ActiveX COM, 214-215 initializing inside gadgets, 215 reading Windows Registry settings, 229-234 developing collection objects, 231 Enumerate Registry, 231-232 framework integration, 222-225 listing Windows Registry items, 225-229 reading Windows Registry, 229-235 RegRead function, 232-233 Windows Registry API, 230-231 goals of, 212 images of, 220 layout of, 220 themes of, 219 usability of, 221 Windows Power Shell, 216 WMI, 216-218, 226-229 MsgBox function buttons parameter, 165 debugging gadgets, 166 prompt parameter, 165 return values of, 166 title parameter, 166 MSHTML (Microsoft HTML) component, 36-37 Multiple Views, 16 MyBlog Gadget, 92, 139 adding features to, 140 advanced framework of, 141 commonly used fields list, 99-100 core functionality, 104-107 data presentation, 107 CSS, 108 DOM, 109-111 data section, 103 deploying, 114 framework of, 98 directory structure, 95 image files, 96 required files, 94-96 Gadget.xml manifest files, 98-99 JavaScript functions in, 112-113 Main Gadget window, 104-107 Mini Me option, 154 gadget window configuration, 156-157 Settings page configuration, 155 parseRSS function 333 mouse hover functionality, 152-154 multiple feeds, 142-148 multiple pages, managing, 150-152 removing feeds from, 148-149 Settings page, 100-101 unobtrusive traversing, 152-154 updating feeds, 148-150 zip files, 113-114 O On Load function, 122 onclick events, changing to href properties, 136 OnDock function, 122 onfocus events, 137 onfocusout events, 137 onkeydown events, 136 onkeypress events, 136 onkeyup events, 136 N NET MRU Project Gadgets, 211 ActiveX COM, 214-215 initializing inside gadgets, 215 reading Windows Registry settings, 229-234 developing collection objects, 231 Enumerate Registry, 231-232 framework integration, 222-225 listing Windows Registry items, 225-229 reading Windows Registry, 234-235 reading Windows Registry settings, 229-234 RegRead function, 232-233 Windows Registry API, 230-231 goals of, 212 images of, 220 layout of, 220 themes of, 219 usability of, 221 Windows Power Shell, 216 WMI, 216-218, 226-229 notifications, gadget updates, 292-293 online data, reading Microsoft Feed Manager, 298-299 Windows RSS platform, 298-299 XHR (XMLHttpRequest) object, 295-297 XML DOM, 297-298 online gadget communities, 21 OnMouseHover function, feed gadgets, 152 OnUndock function, 122 Opacity property, 17 Opera widgets, 26 Outlook Gadget (Microsoft), 13 P packaging gadgets for deployment, 172 parseData function, 190, 203-204 ParseFeed function, 124 debugging gadgets, 162 feed gadgets, 150-151 parseHTML function, 200 parseHTMLAjax function, Site Statistics gadgets, 201-202 parseRSS function, feed gadgets, 109 How can we make this index more useful? Email us at indexes@samspublishing.com 334 Photoshop Photoshop Layer style, 309 shadow effects, 309-311 transparent PNG files, 307 Picture Slideshow Gadget, 56 pie charts, Site Statistics gadgets, 204-210 PlayRadio function, Radio Gadgets, 247 PNG (Portable Network Graphic) files gadget design, 71 transparent files, 307 Popfly, Sidebar gadget creation via mashup gadgets, 281-283 Website Comparison Gadgets, 280 popup function debugging gadgets, 161 syntax of, 162-163 porting mashup gadgets, 283 power supply information, detecting, 44 PowerStatus method (System.Machine API), 44 presentation/display (design patterns), 127 images, 128 Stylesheets, 129-130 prompt parameter (MsgBox function), 165 pull models (gadget revenue models), 76 ad gadgets, 81 case study, 77 utility gadgets, 84-85 push models (gadget revenue models), 78 case study, 79 gadgets as side products, 82 benefits of, 84 case study, 83 Q-R Question function, debugging gadgets, 164 Radio Gadget designing layouts, 241 themes, 240 usability, 242 developing existing framework integration, 243 media player functionality, 243-247 volume functions, 247-248 features of, 239-240 Internet radio stations, 238-239 requirements for, 239 Windows Media Player, advanced optional parameters list, 244-245 reading online data Microsoft Feed Manager, 298-299 Windows RSS platform, 298-299 XHR (XMLHttpRequest) object, 295-297 XML DOM, 297-298 RealPlayer, Internet radio stations, 239 Recent Documents Gadget, 13 Recent Project Gadgets, 222 Recent ProjectX Gadgets, 221 Refresh function, feed gadgets, 146 refreshing gadget behaviors, 61 RegRead function, MRU Project Gadgets, 232-233 relevant information, gadget design, 51, 54 removeElements method, g:background protocol, 306 RemoveFeed function, feed gadgets, 148-149 Settings page 335 removeObjects method, g:background protocol, 306 removing feeds from feed gadgets, 148-149 Reset() function, feed gadgets, 144 Resize() function, 123 reusable functionality, 120 flyout window, 124-125 gadget window configuration functions, 122 flyout-related functions, 124 gadget specific functions, 124 settings-related functions, 123 standard functions in, 122 Settings page, functions of, 125-126 reusble frameworks, 315 revenue models, 75 ad gadgets benefits of, 82 case study, 81 free information gadgets, 85 benefits of, 87 case study, 86 gadgets as side products, 82 benefits of, 84 case study, 83 pull models, 76 ad gadgets, 81 benefits of, 85 case study, 77 utility gadgets, 84-85 push models, 78 case study, 79 gadgets as side products, 82-84 utility gadgets, 84-85 RSS (Really Simple Syndication) feed gadgets, 61, 91 data storage, 92 feed example, 103 RSS Reader gadget, 55, 57 RSS/Atom, reading, 295, 296-299 S Samurize widgets, 24 SaveSettings function, 125-126 SaveXML function, 133-134 scripting, disabling via Disable Script Debugging option (Internet Explorer), 168 security, 312 code, 313 malware, gadgets as, 37 spyware, gadgets as, 37 User Account Control, 312 Windows Live Gallery, 312 SendPlayStateChangeEvents event, Radio Gadget media player functionality, 245 Service Not Available information (gadget behaviors), 62-63 session management, common assumptions, 133-134 SetClock function, Silverlight World Clock Gadget, 277-278 SetGlobalText function, 301 SetInterval function, feed gadgets, 132 Settings Closed function, 123 Settings page accessibility techniques, 137-138 dimensions (user interface design), 65 How can we make this index more useful? Email us at indexes@samspublishing.com 336 Settings page feed gadgets, 100-101 adding multiple feeds, 142, 146-148 configuring for Mini Me gadgets, 155 removing feeds from, 148-149 updating feeds, 148-150 functions of, 125-126 Recent Project Gadgets, 222 Site Statistics gadgets, 199 settings window, 129 settings-related functions, 123 settings.css files, 33, 129 settings.html files, 30-32 SettingsClosing function, 126 Setup function, 104, 123 Setup Size function, 122 shadow effects, creating in Photoshop, 309-311 shadows in images, addShadow method, 46 sharing gadgets, 320 ShellOpen function, reading Windows Registry, 234-235 shortcut keys, sidebar gadget access, 72 ShowArrows function, feed gadgets, 153 ShowFlyout function, 124 feed gadgets, 110 Site Statistics gadgets, 204-205 side products, gadgets as, 82 benefits of, 84 case study, 83 Sidebar (Windows) customizing, 8 gadgets, functions of, 10-11 Silverlight application implementation, 264 Sidebar Events API (Gadget Object Model), 41 Sidebar gadgets, 19-20 accessibility techniques HTML access, 73 keyboard access, 72-73 theme colors, 73 addShadow method, 46 as HTML application, 37 future of, 46 gBackground method, 45 gImage method, 45 Popfly, creating via mashup gadgets, 281-283 Website Comparison Gadgets, 280 widget boxes, 20 Silverlight applications features of, 262 origin of, 263 running, 262 Sidebar implementation, 264 Silverlight World Clock Gadget, 261 designing images, 268-269 layouts, 269-270 themes, 268-269 usability, 270 developing, 271 animation, 273-274 existing framework integration, 271-272 handleLoad function, 277 logic, 275-280 mouse click events, 279-280 multiple locales, 278-279 SetClock function, 277-278 setting time, 276-277 SilverlightClock.XAML files, 272-273 SystemSetup() function 337 features of, 264-265 JavaScript, 265-266 XAML, 267-268, 272-276 simplicity, user interface design, 53 Site Statistics gadget, 183 API, 187 graphs based on, 204- 210 parsing data, 190 pie charts based on, 204-210 pulling text data, 188-189 designing images, 195-196 layouts, 196-197 themes, 195-196 usability, 197 developing, 198 data retrieval, 200-204 integration into existing frameworks, 199 goals of, 183 Mini Me version, 199 Sitemeter.com website Counter Widget feature, 184 site summary pages, 185 web pages, displaying portions of, 190-194 site summary pages (Sitemeter.com website), Site Statistic gadget development, 185 Sitemeter.com website, Site Statistics gadget development API, 187-190 Counter Widget feature, 184 site summary pages, 185 SLQ Server, accessing, 313 Soapbox Video Gadget, gadget design case study, 51-53 sound information, detecting, 44 spyware, gadgets as, 37 standard file/folder layouts, 118-120 standard images, display/presentation (design patterns), 128 standardizing widgets, 47 startUpPage function, feed gadgets, 111 statistics feed tracking, 294 user tracking, 294 statuses, displaying (gadget behaviors), 61-62 Stop function, debugging gadgets, 169 storing data, feed gadgets, 92 streaming audio, playing on Radio Gadget, 240 styles, gadget design, 70 Stylesheets, display/presentation (design patterns), 129-130 support for gadgets, 87-88 System Debugger Select window, debugging gadgets, 169 System.Contact API, 45 System.debug API, 45 System.Diagnostic.EventLog API, 45 System.Environment API, 43-44 System.Gadget API (Gadget Object Model), 40 System.Gadget.onSettingsClosed property, 123 System.Gadget.Settings API (Gadget Object Model), 40-42 System.Machine API, 44 System.MessageStore API, 45 System.Network API, 43 System.Shell API, 42-43 SystemSetup() function, 123 How can we make this index more useful? Email us at indexes@samspublishing.com 338 tab controls T tab controls, accessibility techniques, 135 text. See also graphic design gadget design, 70 reading, XHR (XMLHttpRequest) object, 295-297 TextBoxFeedURL, feed gadgets, 102 themes color, 73 Radio Gadgets, 240 Silverlight World Clock Gadget, 268-269 Site Statistic gadgets, 195-196 time information, detecting, 44 Silverlight World Clock Gadget, setting in, 276-277 title parameter (MsgBox function), 166 titles, gadget design, 67 tracking users, 294 transparent images, gadget design, 71 transparent PNG files, 307 traversing feed gadgets, 152-154 Trick-of-Mind gadget, 319 UpdateFeed function, feed gadgets, 148-150 updates automatic updates, 289 checking for, 290 posting version information online, 290-291 user notifications, 292-293 version checks via inserted code, 291-292 feed gadgets, 132 feeds in feed gadgets, 148-150 URLFeedsCurrentID variable, feed gadgets, 145 usability, designing for Site Statistic gadgets, 197 usage patterns (gadget design) application gadgets, 58 fun gadgets, 59 information gadgets, 57 utility gadgets, 58-59 User Account Control, security, 312 user interfaces, designing aesthetics, 53 docked page dimensions, 64 flyout page dimensions, 65 guidelines for, 66 relevant information, 54 U undocked gadgets feed gadgets, 154-155 page dimensions, 65 YouTube Video Gadget, 258-259 undocked.css files, 33 unobtrusive traversing, feed gadgets, 152-154 updateAvailable variable, 291 settings page dimensions, 65 simplicity, 53 standard page dimensions, 64 undocked page dimensions, 65 unobtrusiveness of, 56 visuals, 55 user notifications, gadget updates, 292-293 user tracking, 294 visual themes 339 utility gadgets, 58-59, 84 benefits of, 85 case study, 85 Clock Gadget for Time, 14 CPU Meter Gadget, 14 MRU Project Gadgets, 211 ActiveX COM, 214-215 reading Windows Registry settings, 229-234 collection objects, 231 Enumerate Registry, 231-232 framework integration, 222-225 goals of, 212 images of, 220 layout of, 220 listing Windows Registry items, 225-229 reading Windows Registry, 234-235 reading Windows Registry settings, 229-234 RegRead function, 232-233 themes of, 219 usability of, 221 Windows Power Shell, 216 Windows Registry API, 230-231 WMI, 216-218 listing Windows Registry MRU items, 226-229 version information, posting online, 290-291 Video Gadgets, 15, 249 BuildVideoObject function, 251 designing layouts, 252-253 themes, 251 usability, 253 developing docked/undocked functionality, 258-259 existing framework integration, 255-256 gadget windows, 259-260 Flash Media Player, embedding in, 250-251 video feeds, 249-250 Visual Studio, MRU Project Gadgets, 211-213 framework integration, 222-225 goals of, 212 images of, 220 layout of, 220 themes of, 219 usability of, 221 Windows Registry listing items, 225-229 reading, 234-235 reading settings, 229-234 visual themes (gadget design) background images, 68-69 buttons, 69 V VBScript, debugging gadgets, 164-166, 169 verisign certificates, buying, 176 version checks via inserted code, 291-292 controls, 69 drag images, 68 icons, 67 titles, 67 How can we make this index more useful? Email us at indexes@samspublishing.com 340 visuals visuals (gadget design) GIF files, 71-72 PNG files, 71 transparent images, 71 user interface design, 55 volume functions, Radio Gadgets, 247-248 Windows Media Player, advanced optional parameters list, 244-245 Windows Power Shell, 216 Windows Registry accessing ActiveX COM, 214-215 Windows Power Shell, 216 WMI, 216-218 listing MRU items from, 225-229 reading settings via ActiveX COM, 229-234 ShellOpen function, 234-235 Visual Studio MRU, viewing, 213 Windows Registry API, MRU Project Gadgets, 230-231 Windows RSS platform, reading online data via, 298-299 Windows Sidebar customizing, 8 gadgets, functions of, 10-11 Windows XP, Active Desktop feature, 9 WMI (Windows Management Instrumentation), 216-218, 226-229 World Clock Gadgets, 261 designing images, 268-269 layouts, 269-270 themes, 268-269 usability, 270 developing, 271 animation, 273-274 existing framework integration, 271-272 handleLoad function, 277 logic, 275-280 mouse click events, 279-280 multiple locales, 278-279 SetClock function, 277-278 W W3C (World Wide Web Consortium), widget standardization, 47 wallpaper, 34 warnings, gadget behaviors, 61-62 Weather Gadget, 12, 19, 61 web gadgets, 19, 22 web pages displaying, Site Statistics gadgets, 190-194 HTML pages, applications versus, 37 Site Statistics gadgets, data retrieval, 200-204 web resources, sharing gadgets, 320 Website Comparison Gadgets, 280 widget boxes, 20 Widget-Box gadget, 317 widgets, standardizing, 47 Windows Cabinet (CAB) files creating, 175 deploying gadgets, 174 buying certificates, 176 signing via certificates, 178 Windows Installer, 180 Windows Installer, deploying gadgets via CAB files, 180 Windows Live Gallery, security, 312 zip files 341 setting time, 276-277 SilverlightClock.XAML files, 272-273 features of, 264-265 JavaScript, 265-266 XAML, 267-268, 272-276 WPF/E (Windows Presentation Foundation/Everywhere). See Silverlight applications, 263 WScript, debugging gadgets, 161-163 Y-Z Yahoo widgets, Konfabulator, 22 YouTube Video Gadget, 249 BuildVideoObject function, 251 designing layouts, 252-253 themes, 251 usability, 253 developing docked/undocked functionality, 258-259 X XAML (eXtensible Application Markup Language) Hello World files, 268 Silverlight World Clock Gadget, 267-268, 272-276 XHR (XMLHttpRequest) object, reading online data via, 295-297 XHTML (Extensible Hypertext Markup Language), reading, 295 XML (Exentensible Markup Language) feed gadget files, 94-95 gadget.xml files, 30-32 Gadget.xml manifest files, MyBlog gadget, 98-99 reading XHR (XMLHttpRequest) object, 295-297 XML DOM, 297-298 XML DOM (Document Object Model), reading online data via, 297-298 XMLHTTPRequest object, 105-107, 298 XMLHTTPRequest objects methods of, 188 properties of, 188 pulling text data, 188 retreiving HTML, 192 existing framework integration, 255-256 gadget windows, 259-260 Flash Media Player, embedding in, 250-251 video feeds, 249-250 zip files deploying gadgets, 173 feed gadgets, 113-114 How can we make this index more useful? Email us at indexes@samspublishing.com

Table of Contents : Creating Vista Gadgets

2008-04-26T21:42:00.000-07:00

Table of Contents for Creating Vista Gadgets download

Table of Contents - Creating Vista Gadgets - Upload a doc

Creating Vista" Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, AJAX, ActiveX (COM) and Silverlight Rajesh Lal Contents at a Glance Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 Part I 1 2 3 4 Part II 5 6 7 8 Part III 9 10 11 12 Part IV A B The Foundation Innovate with Windows Vista Sidebar Gadgets The Architecture ........................................7 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29 An Approach to Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 Selling Your Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75 Developing a Gadget Creating a Simple Gadget with RSS/Atom Feed . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91 Design Patterns and Standard Practices The MyBlog Gadget Revisited Debugging and Deploying a Gadget Advanced Samples Site Statistics Gadget with AJAX—An Information Gadget Most Recent Used .NET Projects—An Application Gadget Radio Gadget and YouTube Video Gadget—Fun Gadgets A Silverlight World Clock—Utility Gadget Appendices Tips and Tricks . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 289 Extras . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315 Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 321 . . . . . . . . . . . . . . . . . . . . . . 183 . . . . . . . . . . . . . . . . . . . . . . 211 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 159 . . . . . . . . . . . . . . . . . . . . . . . 237 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261 Table of Contents Introduction 1 What’s in the Book. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 Section 1: The Foundation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 Section 2: Developing a Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2 Section 3: Advanced Samples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2 Special Features and Notations Supporting Website .............................................................2 ............................................................................3 Part I 1 The Foundation Innovate with Windows Vista Sidebar Gadgets Windows Sidebar 7 Introducing Gadgets and the Vista Sidebar. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 .......................................................................8 ..........................................................8 Technology Behind Gadgets Brief History of Gadgets ...............................................................9 Innovate with Gadgets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10 Types of Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Information Gadgets Utility Gadgets Fun Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 12 Application Gadgets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14 Gadgets in Depth. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 What Gadgets Are Not. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15 Different Views—The Three Hats of the Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16 Opacity Level and Always on Top Property. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17 Using Flyout for More Information . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18 Customization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18 Multiple Platforms for Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19 Meeting Points for Different Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20 The Development Platform. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Gadget Ecosystem . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21 Other Desktop Gadget/Widget Platforms . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 22 Gadget Comparison Chart . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26 Contents v 2 The Architecture Gadgets Overview 29 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29 The Manifest File gadget.xml . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31 User Interface and Presentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32 Cascading Style Sheets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32 Core Functionality of the Gadget: JavaScript Resources, PNG, and Other Files . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34 Technology Behind Gadget Development . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35 MSHTML Component, the Core of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 Standard Web Technologies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36 Sidebar Gadget as an HTML Application . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37 Gadget Object Model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38 ActiveX Technology. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38 Gadget Object Model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39 User Interaction and Sidebar Events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40 APIs to Access the File System . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42 Core Features to Interact with the System . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Communication and Other APIs. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44 Sidebar Gadgets: The Road Ahead . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46 3 An Approach to Design Design Considerations 49 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49 Putting Information First . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50 Constructing the Right User Interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 53 Usage Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 60 Gadget Behavior Challenges for the User Interface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 63 Standard Dimensions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64 Gadget Page When Docked . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64 Undocked Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65 Settings Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65 Flyout Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65 Other Interface Guidelines . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 66 Visual Themes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67 Title . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67 Icon . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67 Drag Image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68 Background Image . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 68 Controls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69 Text and Style . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70 vi Creating Vista Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, AJAX, ActiveX (COM) and SilverLight Transparent Images in the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71 Alpha Transparency . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71 Portable Network Graphics File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71 GIF File Limitations. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71 About Accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72 Keyboard Access . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72 General HTML accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73 Theme Colors and Contrast . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73 4 Selling Your Gadget Pull Model 75 Gadget Revenue Model . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 75 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 76 Push Model. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 78 How Gadgets Give You Business . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80 The Ad Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 81 Gadget as a Side Product. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82 Utility Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84 Free Information Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 85 Supporting Your Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 87 Part II 5 Developing a Gadget Creating a Simple Gadget with RSS/Atom Feed Brief Background on Feeds 91 Feed Gadgets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 91 About the MyBlog Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92 Basic Framework of the MyBlog Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94 Required Files. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 94 Directory Structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 95 How the MyBlog Gadget Works. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 97 The Manifest File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98 Gadget Settings . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 100 Parts of the MyBlog Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 102 The Data . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 103 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 104 Core Functionality of the Gadget Presenting with CSS and DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 107 Putting It All Together. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 112 Contents vii 6 Design Patterns and Standard Practices 115 Design Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 115 Maintainable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116 Customizable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 116 Extensible . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 117 Elements of Design Patterns. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 117 Standard Layout for Files and Folders . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 118 Reusable Functionality . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 120 Display and Presentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127 Common Assumptions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130 The Gadget Will Always Work Regular Feed Updates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 130 Internet Connection. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 131 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 132 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133 Caching of the Feed Data Memory and Session Management . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 133 Adding Accessibility . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 134 Putting the Focus on the Gadget when It Is Loaded . . . . . . . . . . . . . . . . . . . . . . . . . . 135 Adding Tab Controls . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 The Enter Key Acting Like a Mouse Click . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 Using the onfocus and onfocusout Events for Mouse Hover Effect . . . . . . . . . . 137 Making the Gadget’s Flyout and Settings Page Keyboard Accessible . . . . . . . 137 7 The MyBlog Gadget Revisited Recapping the MyBlog Gadget 139 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 139 Taking the MyBlog Gadget to the Next Level. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 141 Adding Multiple Feeds. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 142 Managing Multiple Pages in the Gadget Window . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 150 Unobtrusive Traversing . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 152 Docked, Undocked, and Mini Me Version . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 154 Settings Page Configuration for the Mini Me Version. . . . . . . . . . . . . . . . . . . . . . . . . . . 155 Gadget Window Configuration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 156 8 Debugging and Deploying a Gadget Debugging Using WScript and VBScript Debugging Tools 159 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 161 Debugging a Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 160 Debugging Using JavaScript and DOM. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 166 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 168 Deploying a Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170 Gadget Installation Target. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 171 Gadget Installation Process . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172 Gadget Packaging . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 172 viii Creating Vista Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, AJAX, ActiveX (COM) and SilverLight Deployment Using a Cabinet File . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174 CAB File Approach . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 175 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 180 A Windows Installer (.msi File) or setup.exe Comparison of Deployment Methodologies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 180 Part III 9 Advanced Samples Site Statistics Gadget with Ajax—An Information Gadget 183 The Goal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 183 Background—www.sitemeter.com . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 184 Site Summary Page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 185 Features and Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 186 Application Programming Interface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187 Loading a Portion of a Web Page with Ajax and DOM. . . . . . . . . . . . . . . . . . . . . . . . . 190 Design Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 195 Theme and Images of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 195 Layout of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 196 Usability of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 197 Developing the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 198 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 199 . . . . . . . 200 Integrating the Existing Framework Retrieving Data for Site Summary Using API and Online Web Page Graphs and Pie Charts Based on the API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 204 10 Most Recent Used .NET Projects—An Application Gadget 211 Recent .NET Project Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 211 Target of the Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 212 Background . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 212 Features and Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 213 ActiveX COM Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 214 Windows Power Shell and Windows Management Instrumentation. . . . . . . . . . 216 Design Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 219 Theme of the Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 219 Layout of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 220 Usability of the Gadget Developing the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 222 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 225 Integrating the Existing Framework Listing MRU Items from the Registry Reading the Registry . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 234 Contents ix 11 Radio Gadget and YouTube Video Gadget—Fun Gadgets 237 Media Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 237 The Radio Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 238 Background—Internet Radio . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 238 Features and Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 239 Design Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 240 Developing the Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 243 The YouTube Video Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249 Background—YouTube Video Feeds . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 249 Features and Technology . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 250 Design Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 251 Developing the Gadget. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 255 12 A Silverlight World Clock—Utility Gadget 261 The Silverlight Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261 Background—Microsoft Silverlight. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262 Features and Technology Microsoft Silverlight . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 264 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 265 JavaScript for Creating the Silverlight Object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 266 Extensible Application Markup Language . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 267 Design Considerations . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 268 Theme and Images . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 268 Layout of the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 269 Usability of the Gadget Developing the Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 270 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 271 Integrating the Existing Framework The XAML File. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 272 Silverlight Clock Logic . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 275 Creating a Sidebar Gadget Using Microsoft Popfly. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280 Website Comparison Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 280 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 281 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 283 Creating a Mashup Using Microsoft Popfly Porting a Mashup to Vista Sidebar as a Gadget Where to Go from Here. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 284 Part IV A Appendices Tips and Tricks Checking for a New Version of the Gadget Tracking Your Users 289 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 290 Automatic Update and User Tracking . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 289 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 294 x Creating Vista Gadgets: Using HTML, CSS and JavaScript with Examples in RSS, AJAX, ActiveX (COM) and SilverLight Reading XML, XHTML, RSS/Atom, Html, Text and JSON Data. . . . . . . . . . . . . . . . . . . . . . 295 The XMLHTTPRequest object . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 295 Microsoft XML DOM . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 297 Windows RSS Platform & Microsoft Feed Manager . . . . . . . . . . . . . . . . . . . . . . . . . . . 298 Globalization and Localization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 299 Localized Gadget Example . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 300 Locales with Country Codes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302 Graphic Design. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302 Gadget Protocols for Image and Text . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 302 Sample Gadget g:Demo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 304 Creating a Transparent PNG File in Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 307 Creating Outer Edges/Shadow Effects in Photoshop . . . . . . . . . . . . . . . . . . . . . . . . . . 309 Security and Other Resources. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 311 Protecting Your Code . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 312 Gadgets in an Enterprise (Accessing SQL Server). . . . . . . . . . . . . . . . . . . . . . . . . . . . . 313 Resources and References. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 314 B Extras 315 Reusable Framework for Creating Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 315 Sample Gadgets Based on the Framework. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 317 The Widget-Box Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 317 The Comic-Strip Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 319 The Trick-of-Mind Gadget . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 319 Share Your Gadgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 320 Index 321 About the Author Rajesh Lal is an author, technology evangelist, and solutions engineer specializing in web technologies. He has received numerous awards for his articles on Windows Vista and Sidebar gadgets. He is a frequent contributor to Windows Vista Magazine and Code Project websites. With more than a decade of experience in IT industry in progressive roles from graphic designer, software developer, architect, team lead, and project leader to independent consultant, Rajesh enjoys taking an objective and pragmatic approach to developing applications using Microsoft technology. He has a master’s degree in computer science from Beaumont, Texas, and holds MCSD and MCAD titles. To read his Vista Gadget blog, go to www.innovatewithgadgets.com.

Sample Chapter : Selling Your Gadget

2008-04-24T21:35:00.000-07:00

Download the Sample Chapter Selling your Gadget or read online (HTML version)

Chapter 4 Creating Vista Gadgets - Upload a doc

CHAPTER Selling Your Gadget “Make service your first priority, not success, and success will follow.” —Anonymous 4 IN THIS CHAPTER • Gadget Revenue Model • How Gadgets Give You Business • Supporting Your Gadget Gadget Revenue Model Sidebar gadget development platform is new, but it uses standard web technologies such as HTML, CSS, and JavaScript. These technologies have matured in the last few years and have a large community of developers. Sidebar gadgets have a much shorter development life cycle than regular software: quick development, easy deployment, and almost no maintenance. This makes the Sidebar gadget development platform very attractive for developers. It’s a platform rife with the opportunity to innovate. It’s a new approach for providing quick information and tools. The revenue model of an Internet-based service company depends on one thing: traffic. And Sidebar gadgets have the potential to drive traffic. There will be more than 100 million Windows Vista users in next few years. If your gadget is popular among 1% of them, just imagine your gadget on 1 million users’ desktops. A reference to your website will also drive them directly to your online business portal. How you use this new way of interaction and this new set of customers coming to your website depends on you and your own individual service. A Sidebar gadget is a mini application with the simplicity of a web application and the power of a Windows application. It is a small and lightweight tool. A Sidebar gadget is The 76 CHAPTER 4 Selling Your Gadget not meant to be created as a complete software application, whether sold as a downloadable product or a “try before buy” tool. The revenue model of a Sidebar gadget works best as a free service to drive traffic to your website or as a side product of a bigger application. It is debatable right now whether you can make millions from a Sidebar gadget, but the potential is there and the possibilities are endless. Do the math yourself; assuming that your gadget is popular: • There will be 100 million Windows Vista users in the next year (predicted by Microsoft). • A popular gadget used by 1% of those users means 1 million users. • If 5% of those 1 million users to become customers, you have 20,000 potential customers. • Potential revenue equals 20,000 multiplied by $ x (sales per user). Users will be using the gadget for free; customers are those 5% among the gadget users who go ahead and buy a service from the gadget provider’s website. We discuss this in detail in the later sections. The type of gadget you build depends on which revenue model you want to use to attract potential buyers: • Pull model—A free utility that pulls customers to the website • Push model—A tool that enhances an existing application or service We discuss both these models in the following sections. Pull Model In the pull model, you create new ways to market your online business by distributing a useful Sidebar gadget freely on the Web. The gadget should have a subset of features you want to sell to buyers and it needs to have enough information to keep users interested and eventually convert at least some of them to buyers. Gadgets utilizing the pull model should have a link to the website providing the product or service. TIP There are two keys to creating a successful gadget with the pull model: • Using the gadget platform to create a free innovative service to pull the customers to your website. • Creating a website that sells online service(s) and uses gadgets as a marketing tool by providing free basic services in the form of Sidebar gadgets. Gadget Revenue Model 77 Steps and Different Roles in the Model A pull model needs a series of steps along with the development of sidebar gadgets. Companies that already have an online service or product to sell can also utilize this model. In action, the model follows these general steps, which are also illustrated in Figure 4.1: • You have a website that provides the service(s) and/or product(s) you want to sell. • Choose a subset of the service that you can provide as a basic free service. • Create a Sidebar gadget that delivers this free service to users. • Build a user base. • Drive interested users (potential customers) to the website where more complete services are offered (for a price). 4 Mastercard VISA Web Site providing Service(s) Customers Sidebar Gadget Basic Free Service Users Users FIGURE 4.1 A pull model uses a gadget to drive traffic to the website. The gadget provides a basic service that is available for free to all in a public server. The basic service should be sufficient enough to create user interest in related products and services. Case Study: Rare Book Seller Website TrickofMind, a Fictitious dot-com company with few developers and resources, wants to sell rare puzzle books on the Internet. It has a catalog of books and a payment gateway set up, but what it lacks is users that may become customers. You, as an analyst, have come up with a plan to leverage the Sidebar gadget platform by following these steps: 1. Create a Trick of the Day Sidebar Gadget. This has a puzzle trick every day in the form of an RSS feed. 2. Track your RSS feeds with online tracking tools such as feedburner.com. Appendix A contains a section about tracking RSS feeds. 78 CHAPTER 4 Selling Your Gadget 3. Deploy your Sidebar gadget on a publicly available server, such as http://gallery.live.com, for users to find and download. Don’t forget to add keywords and tags to make it easily searchable. 4. Provide a consistent service to users, such as the trick question every day and also some kind of interaction through the Sidebar gadgets, such as a reply link or a link to the website. 5. Provide a link to the website for users interested in puzzle books. Make your website dynamic, informative, and interesting enough for users to return to on a regular basis. Websites that provide tricks, puzzles, or questions every day already exist, but a Sidebar gadget providing puzzles at your desktop would make yours more usable. A daily trick delivered to your desktop is a very attractive service for puzzle lovers. Gadgets offer a new approach to the old model, “basic free service, paid pro service.” Almost all Internet companies try to use this model to generate traffic and revenue. The model is not new, but the approach utilizing sidebar gadgets is. Every day, millions of users search for a gadget that provides them with a daily dose of their favorite hobby. There are websites providing these daily services, but most of them deliver them by mass emails or online forums. Nobody—at the time of this writing— delivers them to your desktop in the form of a state-of-the-art Sidebar gadget. Use the gadget platform and grab those customers before somebody else does. Check the TrickofMind gadget in Appendix B in the “Extras” section. Push Model The push model relies on enhancing existing service and increasing customer satisfaction. This model works where you already have an online business with a customer base. Use a Sidebar gadget to enhance your customer experience and provide that “extra” service exclusively to your customers. This will not only boost the satisfaction of the existing customers but also act as a great marketing tool for new customers. Use the Sidebar platform to create an add-on service that provides users with quick and ready-to-use information that benefits them. Any information that changes daily and is needed by your customer can be provided as an information gadget. TIP Consider an appropriate authentication method to ensure that only your paying users have access to the gadget’s features. Steps and Different Roles in the Model A push model starts with an existing web service, but an existing customer base is what distinguishes the push model from the pull model. There is lot more potential for marketing in a push model where you already have a customer. Your users are already coming to Gadget Revenue Model 79 your website for frequently updated data or information. The following list, which is illustrated in Figure 4.2, describes the components of a push model: • Existing web application or service • Existing customer base • Ready-to-use information gadget based on an existing service • Gadget deployment in the web portal • Increased satisfaction for the existing customers, relative to the pull model 4 Existing Website with online service(s) Ready-to-use quick information Sidebar gadget Existing customers increased satisfaction FIGURE 4.2 A push model uses the existing customer base. Case Study: Real Estate Web Service Imagine you have a website that displays home rental listings for property managers. Your website receives updates from multiple agents and private sources. Currently, property managers go to the website and filter the results based on their preferences, such as area, price range, and date. The information is dynamic in nature and changes every day. The property managers are always searching for new rental listings, but it’s easy for them to miss some of the listings. As an analyst, you come up with a plan to leverage the push model for Sidebar gadgets. 1. Make global listings available in XML format as RSS feeds, with date and region as parameters. 2. Create a Recent Listing Sidebar gadget that uses settings specific to the rental listing to filter the feed data into a set of top 20 listings. Let the gadget update the feed every hour. 3. Deploy your Sidebar gadget in your web application exclusively for property managers. Here is the list of benefits: • Use of the gadget ensures proper flow of important information. • The gadget makes listings available to property managers without requiring them to go to the website. With multiple instances of the gadget, the property manager can set up different search criteria. 80 CHAPTER 4 Selling Your Gadget • This results in better flow of information, reducing search costs and potential missed listings. • Use of gadgets results in increased satisfaction among property managers. The push model facilitates the property manager in viewing useful information quickly and efficiently. With the power of the Sidebar gadget, the property managers can manage more properties in less time, which increases both their revenue and customer satisfaction. The push model can be used with many online businesses with an existing customer base. Think of this new way of providing features to your customers as something that offers you a significant competitive edge. How Gadgets Give You Business Typically, gadgets are not meant to be sold as individual products. Both push and pull revenue models utilize a Vista Sidebar gadget as a tool to do business more efficiently. The platform provides a unique way to interact with customers. The business model of a gadget is not to sell and make profit out of the gadget itself but rather out of the information, service, or product that the gadget supports. The reason is simple. Sidebar gadgets are based on HTML, CSS, and JavaScript, so the gadget’s source code actually goes with the gadget when you deploy it. The .gadget extension is nothing but a .zip extension in disguise. Anybody with this information can open the source of the HTML file and make changes to it. In addition, thousands of gadgets are freely available online, delivering all kinds of services, which makes it difficult—if not impossible—to sell a gadget. Four kinds of gadgets can generate revenue (see Figure 4.3): • Ad Gadgets, which are gadgets used as advertising tools • Gadgets that are side products for enterprise-level applications • Utility Gadgets, which provide a watered-down version of a utility • Free Information Gadgets, which collect trends and usage statistics Side product Utility Gadget Ad Gadget Revenue News Gadget FIGURE 4.3 These four types of gadgets are all capable of generating revenue. How Gadgets Give You Business 81 The Ad Gadget The Ad Gadget is meant for advertisement of a service. It is based on the pull business model in which you create a free subset of a service, but compel the user to subscribe for an advanced set of features. An Ad Gadget becomes the starting point of an already existing service on the web and helps business in the following ways: • Free basic service in the Sidebar gadget acts as an advertisement for the actual service on the website. • The service on the website can be free, with a revenue model derived from advertisement banners on the website. • The service on the website can be a paid subscription for a Pro Account. Revenue here comes from subscribers. 4 TIP The Ad Gadget is not meant for displaying advertisements but to be used as an advertisement tool for a particular service. Case Study: Site Statistics, Ad Gadget with Pull Model A website statistics provider company such as sitemeter.com shows statistical information about visitors for a particular customer’s website. It gives free information for the last single month. The statistics provider company’s revenue model is based on advertisement banners on the website and paid professional accounts. In addition to offering a free basic service (statistics for last month), what if the organization created a Sidebar gadget for advertising its free service? The information in the gadget would whet users’ appetites, and compel them to visit the website for more detailed statistics. Here is how the pull model works for the Site Statistics Gadget (also see Figure 4.4): • Free basic statistics in the Sidebar gadget pull users to the website. The gadget has a link to the website, which provides detail statistics. Users visit more often through the gadget than they do by actually navigating to the website. • The gadget provides a subset of the free basic service and still pushes users to go to the website for detail statistics. This helps drive in the revenue from banner advertisements on the website. • The gadget helps in driving traffic to the website. It also acts as a tool for marketing the paid subscription for the Pro Account. The revenue model of a paid subscription is strengthened by the presence of the gadget. 82 CHAPTER 4 Selling Your Gadget Paid Subscription to PRO Account Free detailed statistics in Web site Basic Statistics-via Sidebar Gadget FIGURE 4.4 Sidebar. Ad Gadget for Site Statistics provides a subset of free basic service on the Vista The pull model here has two modes of revenue: revenue from advertisements on the website and revenue from the users who come from the link in the Sidebar gadget. Eventually there will also be revenue from users who become subscribers to the Pro Account, an account that provides the detailed annual statistics and other advanced services and that comes with a paid subscription. Benefits of Using an Ad Gadget An Ad Gadget not only provides an advertisement of the web service but also acts as a marketing tool that is freely available in online communities. Following lists the benefits of an Ad Gadget: • Free advertisement of the service through the gadget. • Wide availability (The gadget can be made available in free online communities such as http://gallery.live.com, which gives the service exposure to millions of users.) • Increase in number of users for your service. • More satisfaction among existing paid account holders. Gadget as a Side Product A gadget as an add-on to an enterprise-level application is also a great selling tool. This kind of gadget follows the push model and is targeted toward existing users. Any enterprise-level application, such as a Customer Relationship Management (CRM) or Enterprise Resource Planning (ERP) application, deals with a lot of frequently updated data. Users sometimes find it difficult to filter down data relevant to them for a particular How Gadgets Give You Business 83 scenario. A sidebar gadget providing the ready-to-use data can be very useful in this kind of scenario (see Figure 4.5). Enterprise-level application Displayed in the Sidebar gadget Filtered information Data relevant to the user Users 4 FIGURE 4.5 A Sidebar gadget used as a side product increases both the usability of the main application as well as customer satisfaction. A gadget as a side product becomes a useful tool for existing customers. To enable a gadget for an enterprise-level application, you have to make sure of the following: • First of all, expose required data to be displayed in the gadget in an open XML format (recommended RSS feed format). • Enable a way to authenticate users to display data filtered by the individual user. • Use existing web technologies such as Ajax and SOAP to access secure data from an XML web service. This kind of gadget works as a complementary product to the actual application and is primarily used for displaying user-relevant information, as well as frequently updated data. Case Study: Microsoft CRM Gadget, Gadget as a Side Product Microsoft Dynamics Customer Relationship Management is a powerful enterprise-level application. Its capability to integrate with Microsoft Office applications, Microsoft Outlook, and Blackberry mobile devices makes it a state-of-the-art application. One important feature of the CRM is that it acts as a central repository for all customerrelated data and accounts related to a particular member. Normally a member has to log in to Microsoft Dynamics and access information filtered by different criteria, using a user interface provided by the application, an intranet application, or a website. Creating a gadget that displays the list of accounts and contacts associated with a current member is of immense help. The user no longer has to start Microsoft Dynamics and go to the 84 CHAPTER 4 Selling Your Gadget accounts page to get this information. This is possible because the enterprise application enables gadget development by supporting the following (as illustrated in Figure 4.6): • Microsoft CRM is exposes data through web APIs. • Authentication for the member is possible from the gadget. • The enterprise application provides a web service for accessing data. Web APIs Enable User Login • Expose XML web services • SOAP data exchange • Authentication • Authorization XML Data • Expose core data in XML format • Expose public data as RSS feeds FIGURE 4.6 An enterprise-level application needs to expose data through web APIs and should support the technologies for gadget development. Benefits of Using Gadgets as Side Products A gadget used as a side product compliments the main application. The case study showed how a member of an enterprise-level application can benefit from the use of the gadget. A gadget as a side product increases the usability of the main product by doing the following: • Providing ready-to-use information. • Providing filtered and relevant data. • Displaying data related to the logged-in member. • If you use multiple instance of the gadget, enabling the member to search information with different filters. Utility Gadget A utility gadget normally is a watered-down version of a Windows application, giving access to quick tools and features provided by the operating system. Some utility gadgets provide information on CPU usage or available drive space. This kind of gadget can be used to create revenue within the pull model. How Gadgets Give You Business 85 A utility gadget can be both a basic version of the main application or a side product complementing the application. For example, a basic utility in the form of a gadget can be distributed freely over the Internet, and a more feature-rich application with advanced features can be purchased from your website. If the gadget is popular, it will drive traffic to your website and eventually help sell the application. In the actual implementation, a utility gadget typically is a watered-down version of the full application. This functionality can be exposed as an active component to be called and used by the gadget. In this scenario, the full-featured application exists on the provider’s website and the Sidebar gadget platform is used in the following ways: • A Sidebar gadget with a basic or watered-down version of the application • A gadget that acts as a side product to the application Trial software is quite standard for companies selling products and doing business online. The addition of the sidebar gadget can be a major advertisement for the utility and can be leveraged as a trial version of the software. 4 Case Study: Backup Software Utility Gadget DBKP, a fictitious backup software company, provides robust, reliable, and complete backup software. The company provides a “trial version” of the software implemented as a gadget, providing some basic free services. The company creates a gadget that provides quick access to the application’s popular features, using APIs exposed in a dynamic link library that the application also uses. Benefits of the Utility Gadget The utility gadget can be both a free service for advertisement of the company as well as a side product for the actual application. It provides the following benefits to the company: • The right set of features in a Sidebar gadget can make it instantly popular, resulting in lot of traffic to the website. • The gadget provides quick access to the features of the backup application and makes the application more useful. A utility gadget’s feature set, which is meant for driving users to buy the actual product, has to be carefully chosen so that it drives potential users to purchase the product and become customers. Free Information Gadget A free information gadget, as the name suggests, provides regularly updated information as a free service. In turn it collects usage statistics from the gadget users. This can be thought of as similar to the process of mining web logs, where web logs are analyzed for page usage statistics. Information such as page views, durations on a page, and number of visits are used to make decisions. The only difference is now you are making the data available through the gadget and tracking the RSS feed instead of web pages. 86 CHAPTER 4 Selling Your Gadget The free information gadget’s revenue model is based on the current trend in advertising, which values user choice. That is to say, this revenue model depends greatly on the statistics related to the number of users who views a particular piece of information. Data related to information that was shared a greater number of times or commented or viewed are used for advertisement purposes. For example, a gadget providing video feed can use the statistical information on which video was shared or played the most. The demand for this kind of information becomes the basis of the free information gadget. These gadgets also promote a parent website and help generate revenue from banner advertisements. You’ll find more information on collecting usage statistics from the gadget in Appendix A. A free information gadget can even use live data streaming for things such as broadcasting or podcasting. It can also have built-in advertisements, just like a real radio or video channel. These gadgets take data in the form of an RSS feed from the provider website and display the data, formatted, to the user. The data in the information feed can contain links to pictures, audio, video, or just plain text or HTML. The gadget provides the title and a short description of the information. The user can click on either one to read the information or play the audio or video related to it. This revenue model is based on the usage statistics of the information and also the ad banners in the website. The whole advertisement network is switching toward this trend, which is based on this kind of usage information. To create a free information gadget, follow these steps: 1. Make your data available in the form of an RSS feed. 2. Track the usage of individual items in the feed. 3. Provide a link from the gadget to the actual website. Case Study: NYBC News Gadget, a Free Information Gadget NYBC, a New York broadcast company, provides access to the news from its website but consumers don’t seem to be using the service. It provides a lot of options for users to add their opinions, ask questions, interact with the reporters, and rate and share news with others. The company provides top local news in the form of an RSS feed that is freely available in the website. The data available is in a variety of formats: audio, video, and HTML with pictures. NYBC also provides streaming servers for live commentaries. The customers are local to New York and it has a lot of presence in the newspaper market. What it’s aiming for is an online presence. Supporting Your Gadget 87 The company leverages a Sidebar gadget platform to solve this problem. As an analyst in the company you come up with a News Gadget for New Yorkers. The gadget provides the following: • Frequently updated news in the form of an RSS feed • A radio feature built into the gadget for live streaming • Links to the news website Benefits of the Gadget Having a gadget on your desktop, which gives you regularly updated news in the form of text, audio, and video, is far more attractive than visiting a website to access information. The gadget platform can provide the following benefits in the current scenario: • Subscribers love the easy-to-use gadget for their favorite newspaper. • Online activities will increase because each news item will have a corresponding link to the website. • The RSS feed can be tracked easily for usage information. • The streaming server can also include audio and video advertisements. 4 Supporting Your Gadget Supporting a gadget is similar to supporting any product, but in many ways it is relatively easier. Gadget support is crucial because if you are developing a gadget for revenue, you have to make sure that it works properly. Because no help file comes with the gadget, if you want to include some kind of tutorial, it has to be done in the support page. Remember that gadgets are all about interactivity. A forum dedicated to the gadget is very helpful in acquiring feedback from users in the form of suggestions and new feature requests. As with any software product, you need to provide an upgrade path for new features and services. Support features that can help maintain a gadget include the following: • A link to the support page, which describes the features. • An email link to contact the developer or the company that provides the gadget. • An online forum that provides a mechanism for users to communicate with each other and the developer/company for issues. A link to a forum in the gadget is helpful. • A page dedicated for suggestions, new features, and so on. • Auto-update functionality. Detailed further in Appendix A. Links should be provided in the Settings page to enable the user to visit the corresponding web page. 88 CHAPTER 4 Selling Your Gadget TABLE 4.1 Application Differences Between an Application and a Sidebar Gadget A Sidebar Gadget No help file. A gadget’s settings page can be used to add an email address or website information. Contact information in the form of email address. A support/suggestions page is desirable. A lightweight forum for a discussion board is also helpful. Needs to be upgradeable and needs user’s interaction for upgrade. Contact information in the form of email address. A support/suggestions page is desirable. A lightweight forum or discussion board is also helpful. 320 pixels×240 pixels. Normally has a help file associated with it. Has about a page that contains company or developer information for contact. Products normally have dedicated forums for support and a huge user community. Comes with auto-update functionality. Products normally have dedicated forums for support. Flyout page.

Downloads for Creating Vista Gadgets

2008-04-22T21:20:00.000-07:00

Downloads for Creating Vista Gadgets

Chapter Downloads

Section I - The Foundation
Innovate with Windows Vista Sidebar Gadgets
The Architecture
An Approach to Design
Selling Your Gadget (free chapter available for download)
Section II - Developing a Gadget
Chapter 5: Creating a Simple Gadget with RSS/Atom Feed download
Chapter 6: Design Patterns and Standard Practices download
Chapter 7: The MyBlog Gadget Revisited download
Chapter 8: Debugging and Deploying a Gadget download
Section III - Advanced Samples
Chapter 9: Site Statistics Gadget with AJAX—An Information Gadget download
Chapter 10: Most Recent Used .NET Projects—An Application Gadget download
Chapter 11: Radio Gadget and YouTube Video Gadget—Fun Gadgets download
Chapter 12: A Silverlight World Clock—Utility Gadget download
Section IV - Appendices
Appendix A: Tips and Tricks download
Appendix B: Extras download

Download All Gadgets in the Book download
Download Everything in the book (Source code + Gadgets + Images + Templates) in a single zip file. download

Author - Creating Vista Gadgets

2008-04-22T21:01:00.000-07:00

Contact
Rajesh Lal

9334 Hillery Drive Apt # 13102
San Diego California 92126

Home: +1 858 537-0904
Cell: +1 858 335-3772
Email: connectrajesh [@] hotmail

Rajesh Lal is an author, technology evangelist, and solutions engineer specializing in windows and web technologies. He has received numerous awards for his articles on Windows Vista and Sidebar Gadgets and is a frequent contributor to Windows Vista Magazine and Code Project website.

With over a decade of experience in the IT industry, Rajesh enjoys taking an objective and pragmatic approach to developing applications using Microsoft technology. He has a master’s degree in computer science and holds both MCSD and MCAD titles.

Selling Your Gadget: Chapter 4 Creating Vista Gadgets using HTML, CSS & JavaScript

2008-04-22T04:53:00.000-07:00

Download Chapter-4-Creating-Vista-Gadgets - 192.78 KB

Read .pdf version online

Chapter 4: Selling Your Gadget

“Make service your first priority, not success, and success will follow.” --Anonymous

IN THIS CHAPTER

Gadget Revenue Model
How Gadgets Give You Business
Supporting Your Gadget

Gadget Revenue Model

The Sidebar gadget development platform is new, but it uses standard web technologies such as HTML, CSS, and JavaScript. These technologies have matured in the last few years and have a large community of developers. Sidebar gadgets have a much shorter development life cycle than regular software: quick development, easy deployment, and almost no maintenance. This makes the Sidebar gadget development platform very attractive for developers. It’s a platform rife with the opportunity to innovate. It’s a new approach for providing quick information and tools.

The revenue model of an Internet-based service company depends on one thing: traffic. And Sidebar gadgets have the potential to drive traffic. There will be more than 100 million Windows Vista users in next few years. If your gadget is popular among 1% of them, just imagine your gadget on 1 million users’ desktops. A reference to your
website will also drive them directly to your online business portal. How you use this new way of interaction and this new set of customers coming to your website depends
on you and your own individual service.

A Sidebar gadget is a mini application with the simplicity of a web application and the power of a Windows application. It is a small and lightweight tool. A Sidebar gadget is not meant to be created as a complete software application, whether sold as a downloadable product or a “try before buy” tool. The revenue model of a Sidebar gadget works best as a free service to drive traffic to your website or as a side product of a bigger application.

It is debatable right now whether you can make millions from a Sidebar gadget, but the potential is there and the possibilities are endless. Do the math yourself; assuming that your gadget is popular:

There will be 100 million Windows Vista users in the next year (predicted by Microsoft).
A popular gadget used by 1% of those users means 1 million users.
If 5% of those 1 million users to become customers, you have 20,000 potential customers.
Potential revenue equals 20,000 multiplied by $ x (sales per user).

Users will be using the gadget for free; customers are those 5% among the gadget users who go ahead and buy a service from the gadget provider’s website. We discuss this in detail in the later sections.

The type of gadget you build depends on which revenue model you want to use to attract potential buyers:

Pull model—A free utility that pulls customers to the website.
Push model—A tool that enhances an existing application or service

We discuss both these models in the following sections.

Pull Model

In the pull model, you create new ways to market your online business by distributing a useful Sidebar gadget freely on the Web. The gadget should have a subset of features you want to sell to buyers and it needs to have enough information to keep users interested and eventually convert at least some of them to buyers.

A brief description of how to use the article or code. The class names, the methods and properties, any tricks or tips. Gadgets utilizing the pull model should have a link to the website providing the product or service.

Steps and Different Roles in the Model

A pull model needs a series of steps along with the development of sidebar gadgets. Companies that already have an online service or product to sell can also utilize this model. In action, the model follows these general steps, which are also illustrated in Figure 4.1:

You have a website that provides the service(s) and/or product(s) you want to sell.
Choose a subset of the service that you can provide as a basic free service.
Create a Sidebar gadget that delivers this free service to users.
Build a user base.
Drive interested users (potential customers) to the website where more complete services are offered (for a price).

FIGURE 4.1 A pull model uses a gadget to drive traffic to the website.

The gadget provides a basic service that is available for free to all in a public server. The basic service should be sufficient enough to create user interest in related products and services.

Case Study: Rare Book Seller

TrickOfMind, a dot-com company with few developers and resources, wants to sell rare puzzle books on the Internet. It has a catalog of books and a payment gateway set up, but what it lacks is users that may become customers.

You, as an analyst, have come up with a plan to leverage the Sidebar gadget platform by following these steps:

Create a Trick of the Day Sidebar Gadget. This has a puzzle trick every day in the form of an RSS feed.
Track your RSS feeds with online tracking tools such as feedburner.com. Appendix A, “Tips, and Tricks,” contains a section about tracking RSS feeds.

Deploy your Sidebar gadget on a publicly available server, such as http://gallery.live.com/, for users to find and download. Don’t forget to add keywords and tags to make it easily searchable.

Provide a consistent service to users, such as the trick question every day and also some kind of interaction through the Sidebar gadgets, such as a reply link or a link
to the website.

Provide a link to the website for users interested in puzzle books. Make your website dynamic, informative, and interesting enough for users to return to on a regular
basis.

Websites that provide tricks, puzzles, or questions every day already exist, but a Sidebar gadget providing puzzles at your desktop would make yours more usable. A daily trick delivered to your desktop is a very attractive service for puzzle lovers.

Gadgets offer a new approach to the old model, “basic free service, paid pro service.” Almost all Internet companies try to use this model to generate traffic and revenue. The model is not new, but the approach utilizing sidebar gadgets is.

Every day, millions of users search for a gadget that provides them with a daily dose of their favorite hobby. There are websites providing these daily services, but most of them deliver them by mass emails or online forums. Nobody—at the time of this writing—delivers them to your desktop in the form of a state-of-the-art Sidebar gadget. Use the gadget platform and grab those customers before somebody else does.

Push Model

The push model relies on enhancing existing service and increasing customer satisfaction.

This model works where you already have an online business with a customer base. Use a Sidebar gadget to enhance your customer experience and provide that “extra” service exclusively to your customers. This will not only boost the satisfaction of the existing customers but also act as a great marketing tool for new customers. Use the Sidebar platform to create an add-on service that provides users with quick and ready-to-use information that benefits them. Any information that changes daily and is needed by your customer can be provided as an information gadget.

Steps and Different Roles in the Model

A push model starts with an existing web service, but an existing customer base is what distinguishes the push model from the pull model. There is lot more potential for marketing in a push model where you already have a customer. Your users are already coming to your website for frequently updated data or information. The following list, which is illustrated in Figure 4.2, describes the components of a push model:

Existing web application or service
Existing customer base
Ready-to-use information gadget based on an existing service
Gadget deployment in the web portal
Increased satisfaction for the existing customers, relative to the pull model

FIGURE 4.2 A push model uses the existing customer base.

Case Study: Real Estate Web Service

Imagine you have a website that displays home rental listings for property managers. Your website receives updates from multiple agents and private sources. Currently, property managers go to the website and filter the results based on their preferences, such as area, price range, and date. The information is dynamic in nature and changes every day. The property managers are always searching for new rental listings, but it’s easy for them to miss some of the listings.

As an analyst, you come up with a plan to leverage the push model for Sidebar gadgets.

Make global listings available in XML format as RSS feeds, with date and region as parameters.

Create a Recent Listing Sidebar gadget that uses settings specific to the rental listing to filter the feed data into a set of top 20 listings. Let the gadget update the feed
every hour.

Deploy your Sidebar gadget in your web application exclusively for property managers.

Here is the list of benefits:

Use of the gadget ensures proper flow of important information.
The gadget makes listings available to property managers without requiring them to go to the website. With multiple instances of the gadget, the property manager can
set up different search criteria.
This results in better flow of information, reducing search costs and potential missed listings.
Use of gadgets results in increased satisfaction among property managers.

The push model facilitates the property manager in viewing useful information quickly and efficiently. With the power of the Sidebar gadget, the property managers can manage more properties in less time, which increases both their revenue and customer satisfaction.

The push model can be used with many online businesses with an existing customer base. Think of this new way of providing features to your customers as something that offers you a significant competitive edge.

How Gadgets Give You Business

Typically, gadgets are not meant to be sold as individual products. Both push and pull revenue models utilize a Vista Sidebar gadget as a tool to do business more efficiently. The platform provides a unique way to interact with customers. The business model of a gadget is not to sell and make profit out of the gadget itself but rather out of the information, service, or product that the gadget supports.

The reason is simple. Sidebar gadgets are based on HTML, CSS, and JavaScript, so the gadget’s source code actually goes with the gadget when you deploy it. The .gadget extension is nothing but a .zip extension in disguise. Anybody with this information can open the source of the HTML file and make changes to it. In addition, thousands of gadgets are freely available online, delivering all kinds of services, which makes it difficult—if not impossible—to sell a gadget.

Four kinds of gadgets can generate revenue (see Figure 4.3):

Ad Gadgets, which are gadgets used as advertising tools
Gadgets that are side products for enterprise-level applications
Utility Gadgets, which provide a watered-down version of a utility
Free Information Gadgets, which collect trends and usage statistics

FIGURE 4.3 These four types of gadgets are all capable of generating revenue.

The Ad Gadget

The Ad Gadget is meant for advertisement of a service. It is based on the pull business model in which you create a free subset of a service, but compel the user to subscribe for an advanced set of features. An Ad Gadget becomes the starting point of an already existing service on the web and helps business in the following ways:

Free basic service in the Sidebar gadget acts as an advertisement for the actual service on the website.
The service on the website can be free, with a revenue model derived from advertisement banners on the website.
The service on the website can be a paid subscription for a Pro Account. Revenue here comes from subscribers.

Case Study: Site Statistics, Ad Gadget with Pull Model

A website statistics provider company such as sitemeter.com shows statistical information about visitors for a particular customer’s website. It gives free information for the last single month. The statistics provider company’s revenue model is based on advertisement banners on the website and paid professional accounts.

In addition to offering a free basic service (statistics for last month), what if the organization created a Sidebar gadget for advertising its free service? The information in the gadget would whet users’ appetites, and compel them to visit the website for more detailed statistics.

Here is how the pull model works for the Site Statistics Gadget (also see Figure 4.4):

Free basic statistics in the Sidebar gadget pull users to the website. The gadget has a link to the website, which provides detail statistics. Users visit more often through
the gadget than they do by actually navigating to the website.

The gadget provides a subset of the free basic service and still pushes users to go to the website for detail statistics. This helps drive in the revenue from banner advertisements on the website.

The gadget helps in driving traffic to the website. It also acts as a tool for marketing the paid subscription for the Pro Account. The revenue model of a paid subscription
is strengthened by the presence of the gadget.

FIGURE 4.4 Ad Gadget for Site Statistics provides a subset of free basic service on the Vista Sidebar.

Benefits of Using an Ad Gadget

An Ad Gadget not only provides an advertisement of the web service but also acts as a
marketing tool that is freely available in online communities. Following lists the benefits
of an Ad Gadget:

Free advertisement of the service through the gadget.
Wide availability (The gadget can be made available in free online communities
such as http://gallery.live.com/, which gives the service exposure to millions of users.)
Increase in number of users for your service.
More satisfaction among existing paid account holders.

Gadget as a Side Product

A gadget as an add-on to an enterprise-level application is also a great selling tool. This kind of gadget follows the push model and is targeted toward existing users.

Any enterprise-level application, such as a Customer Relationship Management (CRM) or Enterprise Resource Planning (ERP) application, deals with a lot of frequently updated data. Users sometimes find it difficult to filter down data relevant to them for a particular scenario. A sidebar gadget providing the ready-to-use data can be very useful in this kind of scenario (see Figure 4.5).

FIGURE 4.5 A Sidebar gadget used as a side product increases both the usability of the main application as well as customer satisfaction.

A gadget as a side product becomes a useful tool for existing customers. To enable a gadget for an enterprise-level application, you have to make sure of the following:

First of all, expose required data to be displayed in the gadget in an open XML format (recommended RSS feed format).
Enable a way to authenticate users to display data filtered by the individual user.
Use existing web technologies such as Ajax and SOAP to access secure data from an XML web service.

This kind of gadget works as a complementary product to the actual application and is primarily used for displaying user-relevant information, as well as frequently updated data.

Case Study: Microsoft CRM Gadget, Gadget as a Side Product

Microsoft Dynamics Customer Relationship Management is a powerful enterprise-level pplication. Its capability to integrate with Microsoft Office applications, Microsoft Outlook, and Blackberry mobile devices makes it a state-of-the-art application.

One important feature of the CRM is that it acts as a central repository for all customer related data and accounts related to a particular member. Normally a member has to log in to Microsoft Dynamics and access information filtered by different criteria, using a user interface provided by the application, an intranet application, or a website. Creating a gadget that displays the list of accounts and contacts associated with a current member is of immense help. The user no Longer has to start Microsoft Dynamics and go to the accounts page to get this information. This is possible because the enterprise application enables gadget development by supporting the following (as illustrated in Figure 4.6):

Microsoft CRM is exposes data through web APIs.

Authentication for the member is possible from the gadget.
The enterprise application provides a web service for accessing data.

FIGURE 4.6 An enterprise-level application needs to expose data through web APIs and should support the technologies for gadget development.

Benefits of Using Gadgets as Side Products
A gadget used as a side product compliments the main application. The case study showed how a member of an enterprise-level application can benefit from the use of the gadget. A gadget as a side product increases the usability of the main product by doing the following:

Providing ready-to-use information.
Providing filtered and relevant data.
Displaying data related to the logged in member.
If you use multiple instance of the gadget, enabling the member to search information with different filters.

Utility Gadget

A utility gadget normally is a watered-down version of a Windows application, giving access to quick tools and features provided by the operating system. Some utility gadgets provide information on CPU usage or available drive space. This kind of gadget can be used to create revenue within the pull model.

A utility gadget can be both a basic version of the main application or a side product complementing the application. For example, a basic utility in the form of a gadget can be distributed freely over the Internet, and a more feature-rich application with advanced features can be purchased from your website. If the gadget is popular, it will drive traffic to your website and eventually help sell the application.

In the actual implementation, a utility gadget typically is a watered-down version of the full application. This functionality can be exposed as an active component to be called and used by the gadget. In this scenario, the full-featured application exists on the provider’s website and the Sidebar gadget platform is used in the following ways:

A Sidebar gadget with a basic or watered-down version of the application
A gadget that acts as a side product to the application

Trial software is quite standard for companies selling products and doing business online. The addition of the sidebar gadget can be a major advertisement for the utility and can be leveraged as a trial version of the software.

Case Study: Backup Software Utility Gadget

DBKP, a fictitious backup software company, provides robust, reliable, and complete backup software. The company provides a “trial version” of the software implemented as a gadget, providing some basic free services. The company creates a gadget that provides quick access to the application’s popular features, using APIs exposed in a dynamic link library that the application also uses.

Benefits of the Utility Gadget

The utility gadget can be both a free service for advertisement of the company as well as a side product for the actual application. It provides the following benefits to the company:

The right set of features in a Sidebar gadget can make it instantly popular, resulting in lot of traffic to the website.
The gadget provides quick access to the features of the backup application and makes the application more useful.

A utility gadget’s feature set, which is meant for driving users to buy the actual product, has to be carefully chosen so that it drives potential users to purchase the product and become customers.

Free Information Gadget

A free information gadget, as the name suggests, provides regularly updated information as a free service. In turn it collects usage statistics from the gadget users. This can be thought of as similar to the process of mining web logs, where web logs are analyzed for page usage statistics. Information such as page views, durations on a page, and number of visits are used to make decisions. The only difference is now you are making the data available through the gadget and tracking the RSS feed instead of web pages.

The free information gadget’s revenue model is based on the current trend in advertising, which values user choice. That is to say, this revenue model depends greatly on the statistics related to the number of users who views a particular piece of information. Data related to information that was shared a greater number of times or commented or viewed are used for advertisement purposes.

For example, a gadget providing video feed can use the statistical information on which video was shared or played the most. The demand for this kind of information becomes the basis of the free information gadget. These gadgets also promote a parent website and help generate revenue from banner advertisements.

You’ll find more information on collecting usage statistics from the gadget in Appendix A. A free information gadget can even use live data streaming for things such as broadcasting or podcasting. It can also have built-in advertisements, just like a real radio or video channel.

These gadgets take data in the form of an RSS feed from the provider website and display the data, formatted, to the user. The data in the information feed can contain links to pictures, audio, video, or just plain text or HTML. The gadget provides the title and a short description of the information. The user can click on either one to read the information or play the audio or video related to it.

This revenue model is based on the usage statistics of the information and also the ad banners in the website. The whole advertisement network is switching toward this trend, which is based on this kind of usage information.

To create a free information gadget, follow these steps:

Make your data available in the form of an RSS feed.

Track the usage of individual items in the feed.

Provide a link from the gadget to the actual website.

Case Study: NYBC News Gadget, a Free Information Gadget

NYBC, a New York broadcast company, provides access to the news from its website but consumers don’t seem to be using the service. It provides a lot of options for users to add their opinions, ask questions, interact with the reporters, and rate and share news with others.

The company provides top local news in the form of an RSS feed that is freely available in the website. The data available is in a variety of formats: audio, video, and HTML with pictures. NYBC also provides streaming servers for live commentaries. The customers are local to New York and it has a lot of presence in the newspaper market. What it’s aiming for is an online presence.

The company leverages a Sidebar gadget platform to solve this problem. As an analyst in the company you come up with a News Gadget for New Yorkers. The gadget provides the following:

Frequently updated news in the form of an RSS feed
A radio feature built into the gadget for live streaming
Links to the news website

Benefits of the Gadget

Having a gadget on your desktop, which gives you regularly updated news in the form of text, audio, and video, is far more attractive than visiting a website to access information. The gadget platform can provide the following benefits in the current scenario:

Subscribers love the easy-to-use gadget for their favorite newspaper.
Online activities will increase because each news item will have a corresponding link to the website.
The RSS feed can be tracked easily for usage information.
The streaming server can also include audio and video advertisements.

Supporting Your Gadget

Supporting a gadget is similar to supporting any product, but in many ways it is relatively easier. Gadget support is crucial because if you are developing a gadget for revenue, you have to make sure that it works properly.

Because no help file comes with the gadget, if you want to include some kind of tutorial, it has to be done in the support page. Remember that gadgets are all about interactivity. A forum dedicated to the gadget is very helpful in acquiring feedback from users in the form of suggestions and new feature requests. As with any software product, you need to provide an upgrade path for new features and services.

Support features that can help maintain a gadget include the following:

A link to the support page, which describes the features.
An email link to contact the developer or the company that provides the gadget.
An online forum that provides a mechanism for users to communicate with each other and the developer/company for issues. A link to a forum in the gadget is helpful.
A page dedicated for suggestions, new features, and so on.
Auto-update functionality (Detailed further in Appendix A -Tips and Tricks).

Links should be provided in the Settings page to enable the user to visit the corresponding web page.

TABLE 4.1 Differences Between an Application and a Sidebar Gadget

Application	A Sidebar Gadget
Normally has a help file associated with it.	No help file
Has about a page that contains company or developer information for contact.	A gadget’s settings page can be used to add an email address or website information
Products normally have dedicated forums for support and a huge user community.	A support/suggestions page is desirable. A lightweight forum for a discussion board is also helpful.
Generally Comes with auto-update functionality.	Needs to be upgradeable and needs user’s interaction for upgrade
Products normally have dedicated forums for support.	Contact information in the form of email address.

Thanks

I hope you find this useful. I would be delighted to hear your comments, take care - Rajesh Lal.

Errata !

2008-04-21T20:55:00.000-07:00

I would like to tell you that this book contains no errors, but of course I'd be lying. I've done everything possible to verify the accuracy of every sentence and every code samples, but errors inevitably surface.

Here is a list of errors, that have been found in the book so far, since going to print. If you find an error that isn't listed here, let me know. or add it as a comment, for other fellow readers.

Error, will show up here, if it comes

Get The Gadget Book !

2008-04-20T20:48:00.000-07:00

Buy the Creating Vista Gadgets Book from Amazon.com

Click here or select from the following.

Below is the detail from Amazon.com

Spread the Word: Get the Gadget Book

2008-04-20T11:09:00.000-07:00

Creating Vista Gadgets
using HTML, CSS, and JavaScript

Copy the Code below and put it in your webpage to spread the word

Using the Windows Sidebar and Gadgets

2008-02-13T15:22:00.001-08:00

WidgetBox: A Windows Vista Sidebar Gadget

2007-07-25T17:39:00.000-07:00

A Vista Sidebar gadget which can add any web widget which is available online.

Information, Fun, Application, Utility, Audio, Video - all at your finger-tips...
Select millions of web widgets, games and videos – designed to access live on web pages, blogs – Put in your Vista Sidebar.

Coming Soon... What do you think about this idea ? Please add your comments

Vista Sidebar Demo

2007-04-25T19:22:00.000-07:00

Vista Sidebar Demo (2:27)

Demonstration of the basic functionality of the Windows Vista Sidebar

Video: Vista Sidebar Demo

Creating a Video Gadget (Soapbox Video Gadget)

2007-03-02T02:13:00.000-08:00

Guide to create a Sidebar gadget for a video feed (soapbox @ msn.com)

Install the latest Gadget to your sidebar- 193 Kb

Introduction

When I first started sidebar gadget development¹, I found gadgets cool and innovative. But the more I learned about them, the more I realized their usefulness. Gadget development provides a whole new platform, becoming more productive in ways unimagined. On one hand, it's a mini web application which can host a web page, call a web service, and use AJAX to read an RSS feed. On the other, it can interact with the Windows API using the power of .NET languages. Wow! That's the best of both the worlds, wouldn't you agree?

The most important factor is the unique way in which a gadget provides the interaction between the web, Windows and users. In this example I try to utilize this, to give user the "Power of Videos" in the sidebar. Check the architecture below.

To hold your interest, here is how it looks in the sidebar.

About the gadget: The power of videos

Before I start, I must warn you: this gadget is quite addictive. Indulge yourself only during your spare time.

There are a number of RSS Feeds available from the Soapbox on MSN Video Beta page which give you the contents of the videos uploaded by the users. Some of the more interesting ones are: "Most Popular Videos", "Most Rated videos", and "Most Recent Videos". There is even a feed for "Videos By Tag" available, which we will use for searching videos. The idea behind this is to use those regularly updated feeds to show the user the video of his choice on the sidebar. If you want to know the basic barebones required to create a gadget, please refer to my first article Daily Dilbert . This article is actually an extension of that first article; I try to explain only those extra features which can be used to refine a gadget further:

Create a gadget which can play a video in the flyout
How to take care of paging when you read an XML file
Settings and Search Videos
Add video to "Favorite List"
Create, read, update, & delete local XML file from Sidebar Gadget (new)
Some tips in general

The architecture overview

Let's Begin

Create a video Gadget

A standard XML file with the name Gadget.xml is required as shown below:

More information about this is available here

The name of the gadget is "Soapbox @ MSN" (as seen above). The namespace is basically to group more than one gadget (reserved for future use), which you can write in "mynamespace". MinPlatformVersion. Required. The expected value is "1.0."

"Permission" controls the amount of permission in the gadget. "Full" permission is required if you want to access a webpage through the gadget. With these two files you can deploy and test your gadget in the sidebar. The <permission> tags and <type> tags will be more flexible in future versions of gadget development.

Our Video Gadget will have these files

Gadget.xml An XML file defining the gadget properties, including name, icon and description
main.html the Main HTML page
main.js The core code/script for the gadget
Settings.html Exposes gadget settings for the user to change
Settings.js Script for the Settings file
soapboxFlyout.html The html file which will be used in Flyout window
Icon, images etc For use in the gadget selection box

You can get more details on these here

Get the RSS Feed

The Main.html file will have five elements ("DIV") to get the feed data: cell0, cell1 etc. We can show the videos as a list of five videos (below) or single video.

The Feed for the Gadget

We have the URL which we call using the MSXML2.XMLHTTP object. This is the core of the AJAX until the feed gets loaded. Here is the magical JavaScript for this:

function getRSS()
{
    document.getElementById("mylogo").Title =
        System.Gadget.Settings.
        read("feedText");

    try
    {
        error.style.visibility = "hidden";

        loading.style.visibility = "visible";
        rssObj = new ActiveXObject("Msxml2.XMLHTTP");
        rssObj.open("GET",
            System.Gadget.Settings.read("videoFeed") , true);
        rssObj.onreadystatechange = function() {
            if (rssObj.readyState = == 4)
            { if (rssObj.status == 200)
            { loading.innerText = "";
            error.innerText = "";
            error.style.visibility= "hidden";
            loading.style.visibility = "hidden";
            rssXML = rssObj.responseXML;
            page = 0;
            parseRSS();
            if
                (chkConn) { setInterval(getRSS, 60 * 60000);
            loading.style.visibility = "hidden";
                }
            }
            else
            {
                var chkConn;
                loading.style.visibility = "visible";
                chkConn = setInterval(getRSS, 30 * 60000);
            }
            } else {
                loading.style.visibility = "visible";
            }
        } 
        rssObj.send(null);
    }
    catch(err)
    {
        loading.style.visibility = "hidden";
        error.innerText = "   Service not available";
        error.style.visibility = "visible";
    }
}

Service Not available

As you can see, if there is an error while connecting the feed or an error in the internet connection, we want to show the "Service not available" screen.

Parse the XML File

Here is the portion of the RSS Feed for a single item in the XML file and the corresponding "partial" ParseXML file to give you an idea of what we are doing with the feed.

function parseRSS(page)
{
    rssItems = rssXML.getElementsByTagName("item");
    rssTitle = null; rssAuthors = null; rssDescription = null;
    rssLink = null;
         
    rssTitle = escape(rssItems[i].firstChild.text);
    rssLink =rssItems[i].getElementsByTagName("guid")[0]
    .firstChild.nodeValue;
    rssViews = rssItems[i].getElementsByTagName("vidAt:playCount")[0]
    .firstChild.nodeValue;
    rssDateUpdate = rssItems[i].getElementsByTagName("vidAt:pubDate")[0]
    .firstChild.nodeValue;
    rssRatingValue = rssItems[i].getElementsByTagName("vidAt:rating")[0]
    .firstChild.nodeValue;
    rssDuration = rssItems[i].getElementsByTagName("vidAt:duration")[0]
    .firstChild.nodeValue;
    rssVDescription= escape(rssItems[i].getElementsByTagName
    ("vidAt:description")[0].firstChild.nodeValue);
    rssDescription=rssItems[i].getElementsByTagName("description")[0]
    .firstChild
    .nodeValue;
    myTitle = unescape(rssTitle)
    myTitle1 = myTitle.substr(0,16);
    myRatingTip = "Rating: " + rssRatingValueFormated2 + ",
        View: "
    + rssViews + ", Duration: " + rssDurationFormated ;
 
    document.getElementById("cell" + (cell)).innerHTML =
        "onclick="
    showFlyout(\'' + rssTitle + '\',\'' + rssVDescription + '\',
    \'' + rssLink + '\',\'' + rssImage + '\',\'' + rssRImage + '\',\''
    + rssViews + '\',
    \'' + rssDateUpdate + '\',\'' + rssDurationFormated + '\',
    \'' + rssRatingValueFormated2 + '\');" >
}

Since we have the feed required, we can create a flyout from the video. This is the showFlyout function, which is created dynamically and is used to pass all the parameters from the item to the flyout page.

function showFlyout(sTitle,sDescription,sGuid, sImage, sRImage,sView,
    sDateUpdate,sDuration,sRatingFormated)
{

    if (System.Gadget.Settings.read("sTitle")==sTitle)
    {
    System.Gadget.Settings.write("sTitle", "myTitle");
    hideFlyout();
    }
    else
    {
        System.Gadget.Settings.write("sTitle", sTitle);
        System.Gadget.Settings.write("sView", sView);
        System.Gadget.Settings.write("sDateUpdate", sDateUpdate);
        System.Gadget.Settings.write("sGuid", sGuid);
        System.Gadget.Settings.write("sDescription", sDescription);
        System.Gadget.Settings.write("sImage", sImage);
        System.Gadget.Settings.write("sRImage", sRImage);
        System.Gadget.Settings.write("sRatingFormated",
            sRatingFormated);
        System.Gadget.Settings.write("sDuration", sDuration);
        System.Gadget.Flyout.file = "soapboxFlyout.html";
        System.Gadget.Flyout.show = true;
    }
}

Other Settings for the Gadget

Apart from the settings which are set on the showFlyout function, there are other settings which can be managed by the user. The user can search under "Video" or select from one of the Video feeds.

Once we have all the settings, we Build the video object in the flyout window.

function BuildVideoObject()
{
    try
    {
        if (System.Gadget.Settings.read("videoSize")
            =="large")
        {
        Video_HtmlString  = '‹OBJECT id="VIDEO"
            width="640" height="480" ';
        }
        else
        {
        Video_HtmlString  = '‹OBJECT id="Body1"
            width="320" height="240" ';
        } 
    Video_HtmlString += 'style="position:absolute; left:0;top:0;"';
    Video_HtmlString += 'CLASSID="CLSID:6BF52A52-394A-11d3-B153-"';
    Video_HtmlString += 'type="application/x-oleobject"
        VIEWASTEXT›';
    Video_HtmlString += '‹PARAM NAME="URL" VALUE="';
    Video_HtmlString +=
        "http:/soapbox.msn.com/StreamingUrl.aspx?vid="
    + System.Gadget.Settings.read("sGuid");
    Video_HtmlString += '"›‹param NAME="stretchToFit"
        VALUE="1"›';
    Video_HtmlString += '‹param name="AutoSize"
        value="1"›
    ‹PARAM NAME="SendPlayStateChangeEvents"
        VALUE="True"›';
    Video_HtmlString += '‹PARAM NAME="AutoStart"
        VALUE="True"›';
    Video_HtmlString += '‹PARAM name="uiMode"
        value="none"›';
    Video_HtmlString += '‹PARAM name="PlayCount"
        value="9999"›';
    Video_HtmlString += '‹/OBJECT›';
    document.write(Video_HtmlString);
    }
    catch (err)
    {
     document.write("Problem with the machine's Windows Media
         Player");
    }
}

More information on the flyout is available here

Paging

Since XML files can have hundreds of items, we need to be able to page it. So we add a DIV item in the main.html file with the following:

‹div id="tbar" title=""›
‹table width="100%" height="100%"  border="0" cellpadding="2" cellspacing="0"
ID="Table2"›
‹tr align="center" valign="middle"›
    ‹td width="12" class="arrow" onclick="chPage(-999);" align="right"›
    «‹/td›
    ‹td width="12" class="arrow" onclick="chPage(-1);" align="right"›
    ‹b›‹‹/b›‹/td›
    ‹td class="sub" id="pageNum"›1/1‹/td›
    ‹td width="12" class="arrow" onclick="chPage(+1);" align="left"›
    ‹b››‹/b›‹/td›
    ‹td width="12" class="arrow" onclick="chPage(+999);" align="left"›
    »‹/td›
‹/tr›
‹/table›
‹/div›

A Change page function will Parse the content of items to that page.

function chPage(off)
{
    try
    {

        if (System.Gadget.Settings.read("listview"))
        {
            if (rssItems.length < 100)
            {
                myval = Math.ceil (rssItems.length/5);
            }
            else
            {myval = 20;}
        }
        else
        {
            if (rssItems.length < 100)
            {
                myval = rssItems.length;
            }
            else
            {myval = 100;}
        }


        if (off === -999)
        {
            off = myval-page;
        }
        if (off === 999)
        {
            off = myval-page-1;
        }

        try
        {
            if (((page + off) > -1) && ((page + off) < myval))
            {
                page = page + off;
                parseRSS(page);
            } else if ((page + off) === myval)
            {
                page = 0;
                parseRSS(page);
            } else if ((page + off) === 0)
            {
                page = myval;
                parseRSS(page);
            }
        }
        catch (err)
        {
        }
    }
    catch (err)
    {
    }
}

Make you own Favorite Videos List

Now with each video you will see a plus icon in the bottom, so you can add the video to your favorites list.

A portion of the code behind

function addtoFavorites(sGuid)
{

  var variableName = "userprofile";
  var mytext ="Testing";

  try
            {    
   var variableName = "userprofile";
   xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
   xmlDoc.async="false";
   xmlDoc.load(System.Environment.getEnvironmentVariable
   (variableName) + "\\Videos\\SoapBoxFavorites.xml");
   xmlObj=xmlDoc.documentElement;
   rssAddItems = xmlObj.getElementsByTagName("channel");
   rssAddedItems= xmlObj.getElementsByTagName("item");
   var varAlreadythere = false;


  if (rssItems[i].getElementsByTagName("guid")[0]
     .firstChild.nodeValue == sGuid)
    {
    if (!varAlreadythere)
     {
       rssAddItems[0].appendChild(rssItems[i]);
      }
     break;
     }
               
xmlDoc.save(System.Environment.getEnvironmentVariable
(variableName) + "\\Videos\\SoapBoxFavorites.xml");

When you click on the "Add to Favorite" icon it will add the XML feed information for that video from the online feed to a local XML file.

%userprofile%/Video/soapboxfavorites.xml

Here are the new settings to view your favorite videos. Select "My Favorite Videos" to see the bookmarked videos.

If any "My Favorites" are selected, the gadget will read from the local XML file.

A portion of the code behind

 if (System.Gadget.Settings.read("feedText").indexOf("My favorite") >=0)
 {
 try
 {
  var variableName = "userprofile";
  var xmlDoc = new ActiveXObject("Msxml2.DOMDocument");
  xmlDoc.load(System.Environment.getEnvironmentVariable(variableName)
     + "\\Videos\\SoapBoxFavorites.xml");
  rssXML=xmlDoc;
  parseRSS();
  }

By default, the "My Favorite Video" list will show nine videos from the "Current Featured Feed".

Create the XML file for the first time from "Current Featured Feed".

A portion of the code behind

 var variableName = "userprofile"
 var SoapboxFavoritesPath = System.Environment.getEnvironmentVariable
  (variableName) + "\\Videos\\SoapBoxFavorites.xml";

 rssObj = new ActiveXObject("Msxml2.XMLHTTP");
 rssObj.open("GET",System.Gadget.Settings.read("videoFeed"),true);
 rssObj.onreadystatechange = function()
 {
 if (rssObj.readyState === 4)
 {
 if (rssObj.status === 200)
 {                             
 try
  {
   System.Shell.itemFromPath(SoapboxFavoritesPath);
   return;
  }
  catch (notFound)
  {
  var stream = new ActiveXObject("ADODB.Stream");                  
  stream.Type = 1;
  stream.Open();
  stream.Write(rssObj.responseBody);
  stream.SaveToFile(SoapboxFavoritesPath, 2);
  stream.Close;
  stream = null;
  }

You can also remove the video from the Video list. Select My Favorite video, and then you can see the "Remove icon" after each video in the gadget.

The code behind Remove

function removefromFavorites(sGuid)
{

   var variableName = "userprofile";
   var mytext ="Testing";
            
   xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
   xmlDoc.async="false";
   xmlDoc.load(System.Environment.getEnvironmentVariable
   (variableName) + "\\Videos\\SoapBoxFavorites.xml");
   xmlObj=xmlDoc.documentElement;
   rssRemoveItems = xmlObj.getElementsByTagName("item");

     if (rssRemoveItems[i].getElementsByTagName("guid")
         [0].firstChild.nodeValue==sGuid)
        {
        var lastNode=rssRemoveItems[i];
        var delNode=xmlObj.firstChild.removeChild(lastNode);
        xmlDoc.save(System.Environment.getEnvironmentVariable
          (variableName) + "\\Videos\\SoapBoxFavorites.xml");
        mytext = "Deleted and Saved";
        break;
        }
 }

And we are done.

Tips in general

To resize a windows media player to a custom width, set the ‹param name="AutoSize" value="1"›
Any exceptions in a sidebar gadget main window should be handled with the "Service Not Available" screen, with information icon as shown above
Whenever you use a JavaScript function, encapsulate it inside a try catch statement to avoid surprises
Escape(^) and unescape(^) are nice little JavaScript functions for URL encoding and un-encoding when you need to pass URL's, etc. as parameters to the flyout window
The HTML code for < is "«" , << is "&lsaquo;" , >> is "&rsaquo;" and > "»"
To check whether a file exists in a local folder use System.Shell.itemFromPath(Path) inside try catch
For a timer functionality, use the setinterval⁴ method
For multiple language support, create a folder for that language (e.g. 'IT-CH', if the language is it-ch Italian Switzerland) and copy all files from the 'EN-US' folder to the new created folder (language codes ^)
Check design concepts and usage pattern⁵

In Action

Soapbox Gadget in Action : Size: 400 X 360 in flash player

References

Article History

Mar 07, 2007: First published
Mar 08, 2007: Added support for flash player
Mar 11, 2007: Added architecture diagram
Mar 20, 2007: Create "My Favorite Videos"
Mar 23, 2007: Save your favorite video list to share

And thanks

For coming so far! I hope you find this useful, and give me a comment if you do and take care.

A Screen Cast on Vista Sidebar and Gadgets

2007-02-02T19:19:00.000-08:00

Screencast on Sidebar and Gadgets

The sidebar is a dock for small, lightweight applications which provide information at the user's fingertips no matter where they are on their desktop.

Video: View on Vista - Sidebar and Gadgets