Extending JQuery UI widgets

JQuery UI is a useful project that provides theme-able widgets built on top of the JQuery project. It has an active community and lots of community contributed widgets that do a lot of interesting and sometimes out of the world stuff!

For a mini-project, I had to work on replicating the GMail filter labels widget. I looked around if any were available and the closest I came to was the dropdownchecklist project. Then I had to figure out how to extend this widget and in the process learned a lot of cool stuff that I would love to share on this post. These are two very good posts that you must read before you try to extend widgets:

• Understanding jQuery UI widgets: A tutorial
• Extending JQuery UI widgets

Here are some observations from my attempt at overriding the widget:

• The JQuery extend method is the best way to extend the widgets.
• JQuery UI hides methods that start with an _ (underscore) from being called by the instance.

So here are two snippets of extending the widget:

$.ui.widgetName.prototype.someMethod = function(someArgs) {
  // Function body ...
}

$.extend($.ui.widgetName.prototype, {newMethod: function(someArgs) {
    // Function body ...
  }
});

Use the Windows key as Ctrl Key on Linux

The Ctrl key on the Samsung R517 laptop is placed awkwardly for comfortable use with Emacs. Off late due to the strain of hitting the Ctrl key often, I started to feel a mild tingling on my pinky. I was anxious if this was the first stage of the infamous Emacs pinky. So I started looking for ways of reducing the pain and I came across a beautiful article by Steve Yegge on Effective Emacs. If you wish to become a power Emacs user, then you ought to read it. This article came as a real blessing in disguise and I hope my post might be useful to some other soul.

The article actually recommends swapping the Caps Lock and the Ctrl key. But as a fairly frequent user of the Caps Lock key, I did not like the idea and hence decided to swap it with the 'vestigial' Windows key. This is fairly simple process on Linux. Here's how I went about it...

1. Figure out the key code of the windows key. Linux comes with an X utility called 'xev'. After firing that utility, I pressed the windows key several times and noted down the key symbol and key code. In my case, they were "Super_L" and "133".

2. Map the key using 'xmodmap'.

keysym Control_L = Super_L
keycode 37 = Control_L
remove mod4 = Super_L
add Control = Control_L Control_R Super_L

What the code above does is that it first assigns the left control to the windows key and deassigns the left control. But we want an additional control key instead of deassigning it. So we take the key code of the left control as mentioned in Step 1 and reassign it to the Control_L key symbol. We then, remove the Windows key from the modifier group called 'mod4'. The 8 modifier groups are Shift, Lock, Control, Mod1, Mod2, Mod3, Mod4 and Mod5. These modifier groups hold a collection of keys for a specific action. For example, by default the Caps Lock is part of the Lock modifier. Suppose, you add another key to this group, you can make it function like a Caps Lock. This is the basis for the last line, where I wish to use the Left Control, Right Control and Windows key as control keys.

3. Add the above xmodmap file to your bashrc (or bashrc_profile depending on your distro)

source path/to/the/above/xmodmap/file

May the power of Emacs be with you!

Released django-check-constraints

Ever since model validation hit the django trunk, I had been having thoughts of reviving my Google Summer of Code 2007 project. So nearly a couple of weeks back, I started resurrecting django-check-constraints. Today, I released the code into wild here.

The feature of the project is that it not only generates the required SQL statements for creating the constraints during syncdb but also adds validators to the model fields so that any errors can be gracefully handled exactly like normal model validation. All this without having to write extra validation in the form or model!

The usage is fairly simple.

• Define the constraints in the inner Meta class of the model
• Override the model's metaclass with the CheckConstraintMetaClass provided.

Here are some screenshots (they say a picture is worth a thousand words):

Use the power of git to develop with both git and svn

I was one of the thousands who jumped on to Google Code when it was released sighing a relief that Sourceforge was no more a Hobson's choice.

But very soon github was released and showcased git's amazing power. Again like the thousands, I too switched but this time I really wanted to mirror the github changes to Google Code rather than orphan the repo. This would ensure that I could utilize the power of git (mainly local branches for development).

So here is a step by step procedure of how to go about it (mainly as an archival purpose after having struggled for more than two hours). You need to have git-svn installed to be able to fetch the changes from google code for the initial code:

# Clone the google code svn repo first
$ git svn clone https://<google_code_project_url>/trunk checkout_name --username=<google_username>
$ cd checkout_name
# Add a remote to github and fetch
$ git remote add -f -m master git_origin git@github.com:<username>/<git_project.git>
# Track the 'master' remote branch on github
$ git branch -t github remotes/git_origin/master
// Make the changes in the master repo (say)
# Commit from the local 'master' branch to google code
$ git svn dcommit
# Move to the local 'github' branch
$ git checkout github
# Merge the changes from master into github
$ git merge master
# Push the changes to github
$ git push

Not very difficult but slightly cumbersome to repeat! Google Code offers mercurial support but I have not had an opportunity to work it.

Confista: A conference management app

I can't believe I had been living under a rock all this while! How could I have missed Pinax? I knew it existed but was under a wrong impression that it was only for the social stuff.

Recently, I forced myself to look at Pinax for a project and after evaluating it, I must admit that I was blown off my feet. It is really awesome! If django is a "web framework for perfectionists with deadlines" then Pinax is "the fastest way to develop awesome django apps without repeating and embarassing yourself".

Coming to the point of this post, I have managed to port the fossconf app that powered Pycon India 2009 to Pinax. Actually, I have not ported all the features but the current version is fairly usable. I would love to hear feedback from you regarding the app that I named Confista (Conference + Assistant). I know the name sucks but could not think of something better! If you wish to contribute to the project, please fork the code and suggest improvements.

And there is another Pinax based project underway to power the Avayam Trust site that I am associated with as a web master.