Zearch! My entry to the Zappos API Developer Challenge


I just finished work on Zearch, a browser extension that currently works for Firefox and Chrome. This project is my entry to the first Zappos API Developer Challenge. To say it’s been a learning experience is an understatement. This is my first time writing an extension for either Firefox or Chrome, so I went into this possibly too careful in some ways, maybe not careful enough in ways I have yet to realize.

I started on the Firefox extension, but from the very beginning I knew I wanted to have this work on multiple browsers. In retrospect, I don’t really know why I went for Firefox first. I prefer Chrome as both a web browser and a development platform. Regardless, I paid careful attention to making sure my code was split up properly.

My strategy ended up with splitting the files into a few key areas. I really had no previous experience to base these splits on, it was more just a feeling that this would allow me the greatest flexibility for porting to another browser.

zearch.js is the core JavaScript file. This file would ideally remain the same on every browser. It contains the guts of the operation and is in control of the majority of the functionality.

utils.js is browser specific actions. This file can change from browser to browser, although some commands may not. This is a set of utilities that zearch.js will use to turn on and off elements, create menus and other functions that are likely to differ significantly in their implementation.

bindings.js binds page elements to Zearch functions. This also will change from browser to browser. I could have integrated it in with utils for that reason, but while writing the code, there seemed to be such a sharp disconnect between utils.js and bindings.js that I felt it necessary to clearly separate the two.

zearch.html / zearch.xul define the page elements. Each browser had a very different way to define what shows up on the page, but that’s okay. I expected some things to vary wildly, and the structure of bindings.js and zearch.js made this very easy to adapt to.

When it came time to porting from Firefox to Chrome, this structure seemed to work out quite well. I’d like to end up porting it over to another browser (Opera is probably next on the list), and hopefully I can still use the same structure.

This is my first extension, but won’t be my last. I had a lot of fun writing it. I’m curious as to how long this structure will hold up before issues are brought to my attention regarding either flaws with this or better ways to do it.

, , ,

  1. No comments yet.
(will not be published)