Wednesday, May 05, 2010

"Add2Calendar" an IE8 - Web Accelerator

I receive one or two emails every day inviting me to attend some work, hobby, school, or sporting event. Many of these events, however, do not offer the "add this event to your Outlook calendar" functionality. If I want to add these events to my calendar, I have to do so manually - "cut and paste" the event details into a new Outlook appointment. Ok, it's not hard, it's tedious. It caused me to automate the process, via an Internet Explorer 8 "Web Accelerator".

I first learned about accelerators in an MSDN "Roadshow" put on by two Microsoft Developer Evangelists (Chris Bowen and Jim O'Neil.) They said it was simple to create one... I didn't believe them. I thought it was going to take several days to get started. It didn't. It was as simple as they said!

My accelerator parses highlighted text from the web browser, and return a calendar invitation "on-the-fly" that Outlook easily interprets. There are several ways of adding appointments to Outlook -- I chose iCalendar, since Outlook supports this open standard calendaring format.

What will the user see?

Here is an example of the accelerator in use. I received an email telling me about an upcoming Cambridge Science Festival event. The email directed me to "Boston.com" where I read the event details. I highlighted the event name and time, and right-hand clicked to launch the accelerator:



Here is what appeared in my calendar:



Voila! You can see Add2Calendar captured the event name, date and time, the event summary in the notes area, plus the URL of the event.
For the more technically inclined
This accelerator requires two components:
  1. An XML file to define how the browser communicates with that service, and
  2. A "URL-based service"
The process to create the XML file is well documented in MSDN. Here is the XML that defines how the browser communicates with the service:

<?xml version="1.0" encoding="UTF-8"?>
<os:openServiceDescription
xmlns:os="http://www.microsoft.com/schemas/openservicedescription/1.0">
<os:homepageUrl>http://www.sumatra.com</os:homepageUrl>
<os:display>
<os:name>Add appointment with Sumatra's Add2Calendar</os:name>
<os:icon>http://www.sumatra.com/images/favicon.ico</os:icon>
<os:description>
Highlight something on a web page and add the item into your calendar
</os:description>
</os:display>
<os:activity category="Appointment">
<os:activityAction context="selection">
<os:execute method="post"
action="http://www.sumatra.com/add2calendar/">
<os:parameter name="sel" value="{selection}" type="text" />
<os:parameter name="docURL" value="{documentUrl}" type="text" />
</os:execute>
</os:activityAction>
</os:activity>
</os:openServiceDescription>


I created my URL-service using PHP. The accelerator passes two parameters back to the PHP code ($sel and $DocURL). If those variables are not null, the PHP code can determine if it should show the "add the accelerator to your browser" page, or parse the selection string and return an iCalendar file.

The PHP code creates a form with a button to add the accelerator to the browser. There is also javascript to check if the accelerator exists:

<script language=\"JavaScript\">
window.onload = function()
{
if (window.external.IsServiceInstalled ('http://www.sumatra.com/add2calendar/add2calendar.xml','Appointment'))
{
document.getElementById('btnAdd2Calendar').disabled = true;
alert("Sumatra Add2Calendar accelerator is already installed!");
}
}
</script>
<BODY>
<h1>Welcome to Sumatra's Add2Calendar Web Accelerator.</h1gt;<br>
<h2>Overview:</h2><p>Not all web sites have an "add this event to your calendar" button....
<br><br><br><Please click the button to add the accelerator to your browser.<br>
<button id="btnAdd2Calendar" onclick="window.external.AddService('http://www.sumatra.com/add2calendar/add2calendar.xml')">Install Sumatra's Add2Calendar Accelerator</button>
<p>Copyright © 2000-2010 Sumatra Development LLC. All rights reserved.<br>


Hopefully this gets you started!

The accelerator doesn't parse everything, yet. It's work in progress. If you use the accelerator, and you have comments (and issues, too!), please post or email us: info AT sumatra DOT com

1 comment:

Raj said...

What an amazing accelerator!! I have been looking for one just like this. I don't have a smartphone so my phone syncs with Outlook via bluetooth. With me getting invitations left and right on my private emails, it was hard for to add each one of them to Outlook! With ur accelerator...its easy as!!! Thanks a lot buddy and keep up the good work!!

P.S: Any chance of defaulting the reminders to atleast 10 min? I always forget to set the reminders after I add the event