Archive for the ‘JavaScript’ Category

URL Lister - My First Firefox Plugin

Wednesday, May 7th, 2008

URL Lister Logo

I just released my first firefox plugin - URL Lister. It shows the URLs of all the open tabs in a textarea so that they can be copied easily.

Download/Install

Install URL Lister

If you have installed it, consider rating it or reviewing it at Firefox plugins sandbox. Go to the public page for URL Lister and write a review for the application. I need reviews to promote it to the main extensions page - sandbox plugins are for registered users only.

Usage

Lets say you have these four tabs open…

Right click any tab and click on the ‘URL Lister…’ to open up the main dialog. You can also use ‘Tools > URL Lister’. You will find the URLs of all the open tabs there.

URL Lister Screenshot

There is a drop down menu at the bottom - it has these three options…

  • Plain Text
  • HTML Anchors
  • Linked List

Open URLs

If you have a list of URLs and want to open them all, all you have to do is copy those URLs into this dialog and press OK - this will open up all the given URLs.

And my thanks goes to…

URL Lister is sort of a response to this post by Matt Cutts. I want to thank him for the idea.

There is another plugin with a similar function - Tab URL Copier. I lifted some code from that plugin when creating URL Lister. Thanks.

Keyboard Shortcuts JavaScript Library

Saturday, July 21st, 2007

I have created the second version of the JavaScript Shortcut Library. It is one of my more popular scripts. This script eases the work involved in making shortcuts in JavaScript.

Despite the many JavaScript libraries that are available today, I cannot find one that makes it easy to add keyboard shortcuts(or accelerators) to your javascript app. This is because keyboard shortcuts where only used in JavaScript games - no serious web application used keyboard shortcuts to navigate around its interface. But Google apps like Google Reader and Gmail changed that. So, I have created a function to make adding shortcuts to your application much easier.

Changelog

  • The single function method was abandoned for an object with two functions
  • Shortcut Remove function added
  • New option to disable shortcuts in textarea, input fields.

If you are using this script in any of your projects, please switch to the latest version.

Previous Version Documentation

Success/Error Design Pattern For Ajax

Friday, June 22nd, 2007

‘Success/Error’ design pattern for Ajax requests is a JSON encoded string in a specific format - each response has a minimum of two elements in it - ie ’success’ and ‘error’ - like this…

{
"success":"Task done successfully",
"error":false
}

OR

{
"success":false,
"error":"Database Connection Error!"
}

This method is used extensivly in Nexty. Almost all Ajax response in Nexty ares in this format.

Since this is in the JavaScript domain, I thougt it might be better to pubish the details in my OpenJS site. Read more about Success/Error Design Pattern For Ajax.

Google Gears - Offline Functionality for Web Apps

Thursday, May 31st, 2007

Google Gears Logo

There has been many ideas about a offline storage mechanism for web applications. Dojo implemented this in its Library. Firefox 3 promises this. Now we have a new arrival in this area - Google Gears. Unlike Dojo’s implementation, Gears require an extension for it to work.

Google Gears is an open source browser extension that lets developers create web applications that can run offline.

See Gears In Action

To see Gears in action, first install the extension…

Google Gears

Then go to Google Reader - you will see a ‘Offline’ mode button in the top right corner. If you click on that the script will download 2000 entries into your local database(SQLite).

Downloading Online Entries using Google Gears

To see this database, open up the Firefox Profile folder and enter the ‘Google Gears for Firefox’ folder. You will find many Database files there. Just open any of these in a SQLite V3 supporting viewer.

After the download is complete, you can use the Reader without a net connection.

When you get the connection back, just click on the same button - all the changes will be send to the online server.

Syncing Local DB changes with online server in Google Gears

Advantages of the Google Gears

  • Once the extension is installed, the script will work across all the supported browser. No JavaScript hacks required.
  • Full featured Database support - this makes it much easier to work with.
  • Supported by Google
  • Open Source

Disadvantages of Google Gears

  • The user must install an extension for this to work.
  • Requires user action before going offline. If your connection breaks suddenly(as it often happens here in India), you are left with nothing.
  • All browsers are not supported(yet)
  • Beta software - some bugs are to be expected. But, this will be solved in time.

I am still exploring the code - expect a new post with working javascript examples soon.

Google Gear Links

Subscribe to Feed