A Firefox extension to add contacts, events and view addresses

1. A Firefox extension to add contacts, events and view addresses By Vijay Rao under guidance of Prof. Chris Pollett

2. Problem • A lot of communication happens on the web • Contacts and Events data are found on the web and no automated tool exists to harness this information • Users have mail clients such as Outlook or Thunderbird already installed • Need something that harnesses this client • Viewing several addresses together and have ability to add additional landmarks

3. State of the Art • Several applications such as “Contact Manager” and “Contacts Sidebar” from Thunderbird exist to manage contacts albeit manually • User manually types information such as name, address, email etc into such tools to save it • To add events to the user’s calendar user has to manually create an event or receive an invitation • Google toolbar detects addresses automatically but the user can only view one address at a time

4. Solution • A Firefox extension that extends the browser to perform some of the above mentioned tasks • User selects portions of text from a webpage and expresses intent to either add a contact or an event • The extension automatically parses the text to identify names, addresses and email addresses and converts the data into industry standard formats such as VCF or ICS format • The standard exchange format makes it compatible with any mail client such as Outlook or Thunderbird. • Use Google Maps API to geocode addresses that are parsed from a web page and display them

5. Technology • Used the following technologies • XUL • XML User Interface used by Mozilla to render the browser. Can be extended easily by providing overlays • XPCOM • A component object technology used by Mozilla that is similar to Microsoft COM and exposes the internal functionality of the browser • Javascript • The scripting language used in the browser chrome to handle events and programming • JSP • To display addresses on Google Maps

6. Initial Challenges - Technology • Firefox extension creation has great documentation  • Firefox modules such as XPCOM are poorly documented  • XPCOM exposes the underlying functionality of Firefox • Had to dig the source code of Firefox to figure stuff out • Used Regular Expressions but could get really long and complex

7. Picture of source file

8. Initial Challenges - Parsing • Parsing web pages can get excruciating painful • Dependant on the web designer’s coding style • Navigating the DOM can get tricky due to use of unnecessary elements in design of the web page

9. Add Contacts Name Street City State Zip • Parse Selected Text • Text could be of several formats • Used Regular Expressions for STATE ZIP pattern to identify addresses Name Street City State Zip Street City State Zip Phone Email

10. Add Contacts (Cont’d.) • Example of Regex that was used to locate a State Zip pattern. Other building blocks were built around this pattern • /\b(AL|AK|AS|AZ|AR|CA|CO|CT|DC|DE|FM|FL|GA|GU|HI|ID|IL|IN|IA|KS|KY|LA|ME|MH|MD|MA|MI|MN|MS|MO|MT|NE|NV|NH|NJ|NM|NY|NC|ND|MP|OH|OK|OR|PW|PA|PR|RI|SC|SD|TN|TX|VI|UT|VT|VA|WA|WV|WI|WY|AA|AE|AP)\b \b[0-9]{5}(-[0-9]{4})?\b/;

11. VCF Format • Industry standard format for exchange of contact information • Defines all attributes of a person such as Name, Address, Phone Number, Email etc • Recognized by all mail clients such as Outlook, Thunderbird etc.

12. VCF Format Sample • BEGIN:VCARD • VERSION:2.1 • N:Google Inc. • FN:Google Inc. • TEL;WORK;VOICE:650-253-0000 • TEL;FAX:650-253-0001 • ADR;WORK:;;1600 Amphitheatre Parkway;Mountain View ;CA;94043 • END:VCARD

13. Add Events • Parsing Selected Text to automatically detect • What • What is the event about • When • When is the event supposed to happen • Where • Where is the event happening

14. Add Events (Contd.) • Example of a Regex that was used to locate a date time pattern • ((0?[1-9])|(1[012]))[/](0?[1-9]|[12][0-9]|3[01])[/](19|20)?\d\d\s\d\d?(:\d\d)?\s(AM|PM)(\s(to|TO)\s(((0?[1-9])|(1[012]))[/](0?[1-9]|[12][0-9]|3[01])[/](19|20)?\d\d\s)?\d\d?(:\d\d)?\s(AM|PM))?/

15. ICS Calendar Format • Industry standard format for exchange of calendar data such as events • Defines attributes for the When, Where and What • Can specify rules for recurring events

16. ICS Calendar Format Sample BEGIN:VCALENDAR BEGIN:VEVENT DTSTART:20080517T093000 DTEND:20080517T213000 LOCATION:233 W Santa Clara Street San Jose, CA 95113 DESCRIPTION:5/17/08 9:30 AM to 9:30 PM \n\nDetox Secret's Revealed One Day Workshop\nDetox Secret's Revealed One Day Workshop\nWhether you're just starting out in the health and diet arena, or you consider yourself a health expert, what I've found is that everybody needs a little support and guidance. You may want to take better care of yourself but feel like you're too busy to achieve optimal health & vitality. In fact, you might feel like you take 1 step forward and 3 steps back when it comes to achieving optimal health. All my life, I struggled with food, weight and body image. I know what it feels like to look in the mirror and not...\n Hedley Club - Hotel De Anza\n233 W Santa Clara Street\nSan Jose, CA 95113 SUMMARY:Detox Secret's Revealed One Day Workshop BEGIN:VALARM TRIGGER:-PT15M ACTION:DISPLAY DESCRIPTION:REMINDER END:VALARM END:VEVENT END:VCALENDAR

17. View Addresses • Works with Tabular display of addresses • View all addresses in a cluster on Google Maps • View them in context of other landmarks • Gives the user a context of reference to the addresses he is looking at

18. View Addresses (Contd.) • Example of a regex that was used to detect addresses on a web page • \d+\s[\w\s]+\b(AVENUE|AV|AVE|WY|WAY|TE|DRIVE|DR|COURT|CT|Boulevard|Blvd|Road|RD|Street|ST|LANE|LN|TL|EL CAMINO REAL|Highway|HWY)\b

19. Conclusion • Several challenges were involved such as parsing of information and detecting patterns in web pages • Contacts and Events can now be automatically parsed and saved with a mere right click on the browser • Ability to add contacts and events as an extension to the browser while leveraging the user’s mail client makes the browser a natural extension to the user’s browsing experience • Viewing addresses on Google Maps makes it very inituitive as the user is no longer dependant on the website’s ability to show the address on a map

20. Demo • View Demo

21. Bibliography • Jonah Bishop Firefox Toolbar Tutorial Retrieved May 01, 2008 from http://www.borngeek.com/firefox/toolbar-tutorial/ • Mark James Retrieved May 01,2008 from http://www.famfamfam.com/lab/icons/silk/ • Jan Goyaverts (28th Aug 2007) Regular Expression Tutorial Retrieved May 01, 2008 from http://www.regular-expressions.info/tutorial.html • Internet Mail Consortium Retrieved May 01, 2008 from http://www.imc.org/pdi/vcard-21.txt • Internet Mail Consortium Retrieved May 01, 2008 from http://www.imc.org/pdi/vcal-10.txt • Captain's Mozilla XUL LOG Firefox Toolbar tutorial Retrieved May 01, 2008 from http://www.captain.at/programming/xul/ • Google Map APIs Retrieved May 01, 2008 from http://code.google.com/apis/maps/ • John Resig (2006) Pro Javascript Techniques Apress • Mozilla Developer Center XUL Overlays Retrieved May 01, 2008 http://developer.mozilla.org/en/docs/XUL_Overlays • Mozilla Developer Center XPCOM Retrieved May 01, 2008 http://developer.mozilla.org/en/docs/XPCOM

22. Q&A • Thank You