May 4th, 2009

Quicksilver-Like Website Search for jQuery

This is a Quicksilver style client side search for your website. The server specifies the list of pages to be searched on page load, then lets the browser do the searching. For a relatively small list of pages, this is much more responsive than using AJAX auto-complete.

It is designed for power users of your website to navigate faster. It is ideal for forum websites or similar, where users may want to quickly navigate to their profile, new messages, etc.

Demo

Press Esc to see it running on this page (unless you’re using Internet Explorer).

Compatibility

I haven’t attempted to make this compatible with Internet Explorer, so it is currently disabled in IE. I have not tested with Chrome, though it works on Firefox and Safari.

Obviously compatibility with IE would be the next step. Originally I was aiming this at power users who want to navigate websites quickly, most of whom use anything but IE.

Usage

Simply specify the list of sites to be searched on the

1
2
3
4
5
6
7
8
9
10
11
12
$(document).ready(function() {
  $().quicksearch({siteList:
    { "sites": [
      {title: "Google", keyword: "goog", url: "http://www.google.com/"},
      {title: "Yahoo", keyword: "yhoo", url: "http://www.yahoo.com/", suppressKeyword: true},
      {title: "Facebook", keyword: "fb", url: "http://www.facebook.com/"},
      {title: "Say hello", keyword: "hi",
        fn: function(val){
          alert("Hello! You typed '"+val+"' to get this box.");
        }}
    ]}, visible: false, newWindow: true});
});

Notes
Any of the options can be omitted. Defaults:

1
2
3
4
5
6
7
8
9
siteList: { sites: [] }, // This is a object containing a list of sites (can be retrieved via AJAX/JSON after initial load)
showOverlay: true,  // Show the curtain
invokeKey: 27, // Esc key
overlayID: 'qsOverlay',
searchBoxID: 'qsSearchBox',
visible: false,
newWindow: false,		// Open links in a new window (beware of popup blockers)
beforeShow: function(){},  // Called before the search box is shown
beforeHide: function(){}  // Called before the search box is hidden

If the user types the keyword of a site in full, the script will automatically navigate to that link – the user will not need to press enter. This does not happen if there are two sites with the same keyword, or if the ’suppressKeyword’ property is true for that site.

Download
Please note: This is only a prototype, something I hacked together in my spare time. As such, the code needs to be seriously cleaned up. Thus I am providing it only in a minified version for now. I will provide the source if anybody is interested.

Requires jQuery. Tested on v1.2.6 and v1.3.2. Simply include jQuery, the following two files, and a script similar to that under ‘Usage’ somewhere in your web page.
jquery.quicksearch.packed.js
quicksearch.css

November 2nd, 2008

Tip and Tools for Learning Japanese

I’m almost one (academic) year into learning Japanese. My final Japanese exam is in two days, and I’ve been cramming kanji like you wouldn’t believe. Thanks to an excellent piece of software (keep reading), I’ve memorised about 250 kanji (and about 500 words using those kanji) in 3 weeks. I’m hardly a good speaker of Japanese, but for those starting out, I thought I’d share some of the tools that I use and my experiences so far.

Keep reading →

October 9th, 2008

Anti-Procrastination tool is a product of my procrastination

Note: if the picture above looks badly resized, and jagged, this post is going to be irrelevant to you anyway since you don’t use firefox :)

Do you find yourself impulsively checking certain websites when you should be working? I do. In fact its become so automatic for me that I barely notice I’m doing it until I’ve opened about 10 tabs and each of them contains something more interesting than my work.

I’ve tried various internet anti-procrastination extensions for Firefox, but they all seem to do the same thing – limit the amount of time you spend on certain websites. Personally, this doesn’t work for me. They pop up while I’m halfway through reading or watching something, and eventually I just get sick of the rude messages and uninstall the extension.

So what if you could surf the site for as long as you like without interruptions AND be more productive? Its not possible you say? Well, I’ve written my own script to test this theory. Its only a couple of days old so I haven’t tested it thouroughly yet, but I think its working. Basically it has two functions:

  • Stops you from impulsively checking time-sink websites really often.
  • Offers words of encouragement =)

When you check a website, eg facebook, the time is recorded. You can surf the website as long as you like (theoretically you’ll eventually get bored) but once you stop surfing the site – ie stop opening tabs/clicking links – you won’t be allowed to access the site for another five hours.

That’s right, five hours. I know it seems like a long time, but if you’re like me you’ll realise that don’t really need to check those sites more than once per day. In the future I’ll provide options to change that length.

I’ll post the script in the next few days, meanwhile you might want to install Greasemonkey, a Firefox extension which you’ll need to run the script.
Script has been posted