Thursday, February 11, 2010

My 1st jQuery plugin - jQuery.fn.timeSink

My first contact with jQuery was last summer when i was exploring Django. Indeed, i just used jQuery autocomplete plugin only. In this month, I have another project aimed to explore ESAPI and MongoDB. The project is in its very early stage that just allows student submission for a course assignment. As i don't want to use any framework that may distribute my experience with ESAPI and MongoDB, I opt to use pure Servlet and JSP. (Although i prefer python, but my "boss" prefer java anytime.)

This project has a JSP to list out all submissions from student. My first intuition is to provide a keyword filter (jquery-livesearch-plugin that uses quicksilver algorithm for filtering) to assist information lookup. Then my boss ask me.. in a run long, can it be filtered by time? Then, django admin page comes to my mind.

Django admin page has a very nice time-based filter on the right to filter out entries. So, my question is, can I have a time-based filter to work with the nice quicksilver filter? I did a brief search on google and find none such time-based filter for jQuery. Thus... I have to create one for my purpose.

You may goto github to obtain a copy of the so called "time sink" plugin. I call it a "sink" because it uses a time sieve... (a sink always has a sieve to prevent big particles entering the pipe... right?) There is a demo html and you will see how can the plugin be used with two separate html-list.

You may also checkout the JSP that actually migrates the two different filters applying on the same set of items. They cooperate with each other using custom events dispatched from those filters.

© 2009 Emptiness Blogging. All Rights Reserved | Powered by Blogger
Design by psdvibe | Bloggerized By LawnyDesignz