Problem Statement

Write a Javascript Library for OAuth Authentication Protocol
- OAuth is a protocol used by many RestFul APIs to authenticate the user
- Twitter uses OAuth Protocol Authentication
- My work is basically providing an Firefox add-on specific extension to the JS library available at Google Code
- Input: Simple authentication Information. (Refer Documentation for detailed syntax)
- Output: Authentication Token.
Write a Javascript library implementing Twitter's Restful API.
- Following Calls have been implemented
- Authenticating a User
- Updating User Status. (Publishing a new Tweet)
- Obtaining User Information
- Obtaining Friend's Timeline
- Obtaining Recent Trends (Most popular keywords)
- Obtaining Mentions by other users. (Viewing replies sent to the user by other users)
- Input output sequences for each function is trivial and is described in details in documentation.
Develop Firefox Add on using above two libraries that performs all the functions mentioned in above point
- One Time Authentication
- Add On provides interface on the browser status bar
- All operations are performed within two mouse clicks only

For handouts, its often useful to include extra notes using a div element with class="handout" following each slide, as in:

<div class="slide"> 
 ... your slide content ...
</div>

<div class="handout">
 ... stuff that only appears in the handouts ...
</div>

Motivation

Why am I doing this project?
I am writing this application to address my own long felt need for such an application. Most of the existing addons including the TwitterFox are either address non existing problems or have very bad usability. Also I realised that there are no good simple libraries available implementing oAuth and Twitter's RESTful API. Also it is a good design practice to always write an API first and then develop a frontend for it.

My intention is not to develop something that is "only usable" but to develop something that will be actually used by many people.
How does it help?
- It helps me to tweet messages very quickly from my browser. Without authenticating each time. Withtin just 2 mouse clicks.
- I can view my timeline, mentions and trends in a single mouse click
- Libraries I have developed can be used by other programmers around the world to develop their own Twitter add-ons
- Firefox Add-on developers can use my OAuth library to authenticate their applications with any other OAuth supporting site without much hassle

Proposed v/s Achieved

As per the Stage 1 report I had proposed the following. I have achieved all the "Minimum Promise" goals as evident from the table below.

Task	Minimum Promised	Delivered	Extra Work
OAuth library	Working library	as promised	none
Javascript Twitter library	10 methods	11 methods	1 extra method
Firefox Addon	5 methods will be provided a front end.	6 methods implemented	1 extra method Elegant UI

None of the Wishlist items proposed initially have been achived but I have added some extra functionality as mentioned below

More elegant XUL based UI.
Submitted the addon to Official Mozilla Add-on Library

Efforts Taken

Task	Time Taken (Hrs)	Deliverable
OAuth implementation	28	OAuth.js (700 LOC)
Twitter API	20	jsTwitt.js (1500 LOC)
Firefox Plugin	28	Atwitt.XPI (2500 LOC)
UI improvements	20
Documentation	10	Documentation
Total	78

Coding Standards

Javascript: camelCase and Object oriented code.
CSS: underscored notation

Solution Design

User Installs the Firefox plugin
When he tries to perform any operation for the first time the plugin calls Twtter's Authenticate method
Twitter API calls OAuth API's Autheticate method passing the Authentication URL and Application secret as input
OAuth redirects user to Twitter website where usr enters his credentials. Note that out Add-on does not ask for user password
Twitter website return a OAuth_Token to the addon which is used by the application in all further requests
Once the token is obtained the Twitter JS api talks directly to Restful API as shown in image
If user selects to "Tweet", the addon event handler load the XUL file that contained the UI to enter the user input.
When user submits the addon calls UpdateStatus method of Twitter API which sends an AJAX query to update user status
Similar flow is maintained for other operations like Viewing timeline, mentions and Trends

Implementation Details

Programming Lang.	Code Written by Me	Code Borrowed	Remarks
Javascript	806	650	The borrowed code mainly contains the oAuth Library and SHA1 implementation in javascript
XUL	209	0	XUL is Firfefox's markup language used to create UI similar to HTML
CSS	40	0	Most of the UI uses CSS for it's look and feel

I have extended the OAuth Library available on google code to provide one extra method that makes the use of this library extremely easy. Otherwise it is upto the programmer to call various methods in a particular sequence
There is a loss of abstraction in the extension and the library I have created is useful only in Firefox Add-on development
Twitter API jsTwitt.js implements 10 Twitter API calls. I have tried to stick to DRY principle and hence reduced the LOC

Challenges

Understanding the OAuth protocol used for authentication was the toughest. Thank to the guys at Code.Google and Twitterbar plugin I managed to understand how exactly it functions.
Only if some other programmer looks at the modifications I have done to the library available at code.google I think add-on development will be far more easier.
It is interesting to note here that Even the most popular TwitterFox add-on uses Twitter's deprecated basic authentication method instead of using OAuth
Lack of runtime debuggin tools was another problem. I had to restart firefox everytime I made some changes to the code. Venkman and Extension builder were helpful but they did not solve my problem

I would like to say..

The add-on I have developed in 2 months time is very much similar to TwitterFox addon in terms of functionality. I claim that it is easier to use as well. In fact if I add more features to this add-on and work on it's look and feel, I am confident that it can be a very useful add-on that people world over might download and use.

The graphics might be pathetically bad, the fonts, the color might look awful, it must be attributed to my asthetic handicapness rather than programming ability. Given that this was to test our programming skills. I will request you to pardon me for pathetic looking color combinations and graphics

Conclusions

I have successfully achived the objectives as stated in the First Stage Report.
I have achieved little more than the states objectives by providing a more eleborate UI and documentation to the code.
The future scope for this project is immense. my jsTwitt library should ideally have implemented all the Twitter API calls along with all possible options that the Twitter REST API provides.
The Firefox addon can have much better look and feel, making it more tempting to use.

View Documentation

Firefox Addon for Twitter (CS699 MiniProject)