digital Infuzion
DIFZ Blogs Home Contact Us Site Map Employee Login
About Us Industries Services Contracting Vehicles Publications

 
DIFZ Blogs
 
DIFZ Blogs : DIFZ Blogs
Outlook Contacts Gadget
My boss, Hemant, came into my office one day and said, “Tom, I wish there was a Gadget that would let me retrieve information from my Outlook Contacts, so that when I need a clients phone number I could just look it up, without going through all my Contacts in Outlook, or switching from my email.”

I thought to myself, there should definitely be one available, that Microsoft built, to do this.  But all I could find was an Inbox, Appointment and some gadget that looked up information from Windows Vista Contacts (Who uses that anyway?).  I could not find one that would search into Outlook Contacts and retrieve me the information my boss was looking for, so I had to make my own.

I am not going to walk you through how Gadgets are built, there are many fine examples of this on the web, and in my references below, but I am going to give you the highlights on what technologies I used to architect this Gadget.  I am also going to provide this Gadget, so that you can dissect it, learn from it and use it in your own solutions.

The basic requirements for this Contacts Gadget are as follows:

  1. Provide an input box that would let the user type in a contacts name.
  2. This input box should automatically list all users from outlook and filter as the user types.
  3. Once the user selects a contact, the gadget should retrieve the phone contact information from Outlook.
  4. In addition to this, the Gadget should remember the history of the last three contacts retrieved by the user.
  5. The History should scroll down the Gadget, so the most recent search is on the top and as the max contacts are retrieved the oldest retrieved contact will scroll off the screen.
  6. Because there is not a lot of room to display information, in this gadget we are only displaying phone contact information,  there should be a Fly-Out that should display all of the Outlook’s Contact information (Addresses, Contact mechanisms, Email, etc)
  7. This Gadget should be able to be used on any computer and not restricted to in the office use.

To build this Gadget, I used several code snippets and examples, which are listed below:

  • The first component is a JavaScript Auto-complete Textbox – This code I got from the Code Project and its reference is below.  This allows me to meet requirements #1 and #2 above.  Since Gadgets are basically web pages, the best way to provide interactive content is to use JavaScript.  This is a nice JavaScript auto-complete textbox that is easy to use and has nice features for filtering on key commands.
    jsactb
  • The second component is a .NET Interop for Gadgets assembly – This code, I also got from the Code Project and is reference below.  This component allows you to write code in .NET and let you call it through JavaScript.  Since Gadgets are simple web pages, they cannot natively use compiled .NET code, you must provide an Interop layer, so that the JavaScript can call out to a Com component.  Since I needed to work with Outlook and retrieve information from Exchange, I wanted to use .NET to write this code.  I find that using .NET to write this code is easier than straight JavaScript.  That is where this component and example comes into play.
    GadgetInterop
  • The third and final component is to use WebDAV.  This allows you to query Microsoft Exchange by using similar technology as Outlook Web Access (OWA).  I used several examples from the web to learn how to do this and this allowed me to meet requirements #3 and #6 above.  These references are listed below.
    exchange_webdav_examples
    aa123736.aspx
  • The rest of the code was taken from examples and walkthroughs on how to build Gadgets.  This allowed me to meet the remander of the requirements listed above.  Below is a great link for building Gadgets.
    ms723694.aspx

As you can see in the pictures below, the gadget is fairly basic, but provides a good example of how to build Gadgets using Visual Studio .NET as well as integrate with the Exchange Store (Outlook Web Access).  I hope that you found this Blog useful, and as always, I welcome your comments.

To download the gadget and source, click on the links below.

Outlook Contact Gadget (after download, strip the .zip from the file and install)
Outlook Contact Gadget c# Source Code

Gadget Selector
This image above shows the Gadget Selector screen. This is where you can drag and drop the Outlook Contact Gadget onto the SideBar
Gadget Settings
The image above is used to set the settings for the gadget. This is accessed by hovering over the gadget, once it is on the sidebar, and clicking on the little wrench icon.  There are 4 settings that must be set:
  1. UserID - This is your domain user id used to log you into Outlook Web Access (OWA)
  2. Password - This is your domain account password
  3. Domain - This is the domain your user id and password needs to be validated against
  4. Outlook Web Access URL - this is the OWA url. This can be and is usually https://smtp....
Gadget Main Picture
The image on the left shows the gadgets dynamic drop down list. This list is pulled from your OWA contacts. As you type, it filters the list automatically. You can also use the arrow keys and mouse to select a persons name.
 
The image on the right shows the gadget after selecting 3 different contacts. This list will be rolling, so as you select another user the last user in the list will fall off.
Gadget Main Picture
What the below image shows is the Gadget Flyout Window. This dialog gives you additional details on the contact selected from the main screen. You can get to this by simply clicking, underneath the contacts name in the main gadget (On the phone numbers ).
Gadget Flyout Picture


 
 
 Copyright © 1999-2009 Digital Infuzion, Inc. All Rights Reserved.