Fun with jQuery

Over the weekend I decided to play around a bit with jQuery.  I had done tiny bits of Javascript front end stuff previously and had heard a lot of good things about jQuery.  As a disclaimer upfront, I have not looked at any of the other Javascript libraries, so this is not a comparative view (not even a comprehensive view for that matter).  I had a concrete project in mind.  DailyLit breaks books up into installments of roughly 1,000 words.  As a brief historic aside, when Dickens went from monthly to weekly installments, he went down to 5,000 words per week, so it provides a continuation of that trend that Susan picked 1,000 words for daily installments.  There is a process that selects initial installment boundaries which are then manually reviewd.  My goal was to create a web based tool for reviewing and adjusting installment breaks.  So I wanted to have Javascript that would display the length of the existing installments and let a reviewer easily move paragraphs between installments.

You can see a prototype of what I came up with here (try clicking on the first or last paragraph in an installment).  I was impressed by how easy jQuery made all the relevant steps:  Registering click handlers for the paragraphs. Determining which installment a paragraph is in (traversing the DOM).  But it was the last step where I was really impressed.  Moving a paragraph from one installment to another (modifying the DOM) while keeping the event handlers in place wound up being two lines of code.  Wow.  I have no idea how many lines of raw Javascript code this would have required, but I am certain I could not have built the whole thing in a few hours, initial jQuery learning curve included.  Now I am sure that my code could be improved significantly and also be made more elgant in the jQuery chaining paradigm, but the fact that this was possible at all has me impressed by jQuery.

Reblog this post [with Zemanta]
Loading...
highlight
Collect this post to permanently own it.
Continuations logo
Subscribe to Continuations and never miss a post.
#tech#programming#javascript#jquery