Hi, I'm Andre Lewis and I'm on the Internet

There is a lot of good plugin development going on for jQuery. Here are two which have come up on the list lately:

HighlightFade by Blair Mitchelmore is a very thorough jQuery implementation of the "yellow fade" technique. Options include the type of fade (linear, sinusoidal, exponential), the duration, and a function to call on completion. The plugin weighs in at 3.5K (uncompressed, so it could be made smaller), and should handle all your yellow-fading needs.

tablesorter by Christian Bach is browser-side table sorter (click on a column heading to sort the table accordingly). It's fast (in the demo, sorts 400 rows in about .3 seconds), and it auto-detects the column type to provide the appropriate kind of sorting. For example, it automatically recognizes date vs. text vs. URL contents, and sorts accordingly. For URLs, it disregards the http/https/ftp/file prefix for sorting purposes, which is more likely to give you the sort you actually want. You can also define your own auto-detects, which usually involves 5-10 lines of code. The plugin is about 10.5K uncompressed.

Did you know there are lots more jQuery plugins listed on the wiki at http://proj.jquery.com/plugins? Note that the URL to the wiki will change when jQuery goes 1.0.

I am going to be contributing to the official jQuery blog from time to time -- starting with my next post on jQuery plugins. Most posts that I put on the jQuery blog will also appear here.

As you probably know, I've been a fan of jQuery for some time, and have been using it on some of my Rails projects instead of Prototype.js. I'm happy to be working with John Resig and the rest of the jQuey community to get the word out on this great library.

GZoom is a custom Google Maps control which allows you to zoom by dragging a rectangle on the map. Read on for an example.

Update #1: I've posted the uncompressed source code here: gzoom_uncompressed.js . The code is released under an MIT-style license. Enjoy, and let me know if you make enhancements to the code that others might find useful -- I'll try to roll useful enhancements back into the core.

Update #2: version 0.2 released 11/21/06. What's new:

• handles maps that move or are resized on the page
• more flexible activation button, can use images, arbitrary text, etc.
• tested and confirmed to work with GMaps new Marker Manager
• you can specify optional callback functions for the following events: buttonClick,dragStart,dragging,dragEnd
• Here's a new example demonstrating some of the new options and the callbacks.

Update #3: GZoom has been incorporated into Google's own Google Maps Utility Library, and renamed DragZoom. From now on, you should use the code from Google's repository. Get DragZoom here.

Continue reading "GZoom drag-to-zoom Google Maps control" »

If you were there for my presentation at the San Francisco Ruby meetup this evening -- thanks for coming! I was impressed by the turnout and the thoughtful questions everyone was asking.

The final slide was some resources from the talk you may find useful:

• SF Wireless: http://wifi.earthcode.com
• jQuery tutorial: http://15daysofjquery.com
• jQuery CSS selectors: http://jquery.com/docs/CSS/
• jQuery interface library: http://eyecon.ro/interface
• jQuery interactive documentation: http://visualjquery.com
• JSLog: http://earthcode.com/blog/2005/12/jslog.html
• Rails & geocoding: http://earthcode.com/blog/2006/04/rails_geocoding_and_google_map.html

I'll be putting up a detailed tutorial on the Google Maps Zoom Control soon.

Hotspotr (hotstpor.com) is a community-driven directory of cafes with wireless internet access here in San Francisco. This is a community effort, and the more listings it has the better -- so if you're in the San Francisco area, go ahead and add your favorite cafe.

Hotspotr is built in Ruby on Rails, and has served as a testing ground for my Rails/Google Maps development over the last couple months. I hope it will become a useful resource for others who enjoy getting out of the office and doing work in cafes.

Some things to note as you look around the site:

• Open listings: anyone can add or update cafe listings
• Google maps integration: the map view lets you see cafes citywide, or filtered by a specific San Francisco neighborhood
• GMaps "Zoom" control: if you're using Firefox, there's a nifty "zoom" control on the main map view, which lets you outline a region on the map to center and zoom. Safari users -- this feature is coming soon
• Ratings & collective opinion: there's a nice AJAXy rating system to aggregate collective opinion on important things like the availability of power outlets

The link again: hotstpor.com/

Since I last posted on Lightbox for modal dialogs in May, some additional relevant projects have sprung up. This is a roundup of more Lightbox-type modal dialog options. As you go about choosing the perfect script for your needs, Here are some questions to keep in mind:

1. What's your content? Do you need to just display images? Or arbitrary HTML? Many scripts support both, and some are tailored around displaying images very easily.
2. Is your content remote? You may need to retrieve your content from the server, or the content may already be rendered on the page in a hidden div. I actually find the second case the more common one -- the dialog content is already loaded on the page, and I just want to reveal it in a modal window.
3. What are your bandwidth requirements? These scripts vary quite a bit in size. If you're building an internal application you can get away with a bulkier script, but otherwise you might want to look for one of the leaner ones.
4. How important is look-and-feel? Some of these scripts offer a slick and customizable look, and others are more spartan. I appreciate the nice looking options, but usually end up using the scripts with less flourish. Your needs may be different.
5. What JS Library are you using? Prototype? Moo.fx? Dojo? jQuery? Your choice may narrow the field for modal scripts, since you typically will not include another whole JS library just for the modal dialog functionality.

Continue reading "Lightbox for Modal Dialogs Redux" »