March 14, 2008

Creating Google Reader Interface from Scratch; but Stuck on a Bug

With a little down time at work, I started to make a few jQuery example pages for some quick documentation.  One thing led to another, and I’ve decided to build a light version of the Google Reader interface. Check it out.

Ground Rules

  1. No cheating. I didn’t want to see how Google did it—I wanted to plan the app from scratch. This way, I get a little practice planning the app’s architecture; How I track if each article is read, collapsed, etc.
  2. Baby steps. Rome wasn’t built in a day, and this app won’t be up and running full speed ahead any time soon.  For starters, I’m just building the thread view.  Perhaps sometime later we’ll have the feed menu on the side, but not today.

Progress

Day 1
Day 1 was basic framework and concept. This is were I started with the basic expand and collapse example, and it grew from there.
Day 2
Thread views done. Mark all read and mark all unread buttons working, threads expanding and collapsing, and a read all button.
Day 3
I realized that I was missing the Expanded View and List View tabs.  Adding these in required changing the way I track the read state of each thread, basically a complete change on my methodology—more on this later.  I also found a doozy of a bug—more on this later, too.
Day 4
Major code overhall.  Slimmed down my code to make shorted lines and smarter actions.  I pulled out any duplicate actions and created reusable, chainable functions.

The Bug

I wrote a detailed, albeit probably jumbled, post to on jQuery’s Google Group about my bug.  Here’s a quick recap:  I have two functions that depend on a wrapper div’s class.  When I first load the page, I set that wrapper’s class based on a cookie.  From then on, my two functions don’t function based on what the wrapper div currently is, but what it was at page load. Somehow it’s not seeing the current wrapper class.  Do you know why? Two gold stars to anyone who solves it!

The Future

I started building this interface just to see what I could do with jQuery. Once I get all the bugs worked out, I'd be nice to hook it up to a RSS feed and see it actually function. Perhaps a good excuse to start learning PHP, and maybe even Code Igniter.

2 of 2  <  1 2

Who?

Howdy. I'm Richard W. Baker - a designer based in Jacksonville, Florida with a passion for information architecture and usable interfaces. At my day job, I work for the City of Jacksonville as a User Interface Designer.

If you still have questions, or you're interested in hiring me for your next project, .

Active ingredients: XHTML + CSS + Expression Engine
Page rendered in 0.2680 seconds  |  51 SQL queries total