gadget (definition courtesy of Merriam Webster) |
Pronunciation: ˈga-jət
Function: noun
Etymology: origin unknown
Date: 1886
: an often small mechanical or electronic device with a practical use but often thought of as a novelty
My friends over at InDepth Technology approached me with a fun project recently. It involved creating a Vista gadget to act as a countdown to the largest technical event of the year - Tech·Ed 2008. I have never created a gadget before but the potential of making this a fun and exciting project made me jump right into it.
Interestingly enough creating a gadget is a very straightforward process. Technically it is nothing more than a combination of HTML/XHTML, CSS, and image files accompanied by a manifest in a form of a XML file. My gadget was simple enough that I decided to embed the JavaScript directly into the HTML file representing the timer counting down the seconds to the Tech·Ed 2008. Interesting point I have discovered in calculating time difference between now and the event start: if you express the event start with the UTC offset (in this case “Jun 3 2008 7:00:00 AM UTC-5:00″ since the event is on the east coast) the subtraction of now and event date objects, event.getTime() - now.getTime(), will be properly adjusted based on the local machine time zone.
Here are the steps to create a gadget:
- Create an HTML page providing a presentation layer and referencing relative path image(s) and CSS file(s) as necessary.
- In the same folder or subfolder add your images and/or css/js files referenced by the HTML.
- Add the gadget.xml manifest file describing the icon Vista should display when choosing gadget, copyright information as well as what HTML page will be used on gadget startup (gadget can contain multiple pages just like any Internet site).
- Package all the files and subfolders into a zip file and rename the extension to gadget.
There is much more to gadget creation including the ability to access its own namespace for property/setting persistence as well as special presentation elements. I hope this post will be sufficiently interesting to get you started on your own gadget at which point you will need a bit more research into the advanced gadget functionality. In a meantime you can enjoy my Tech·Ed 2008 countdown gadget here. 
