Archive for August, 2005

SeeSS

If you do any CSS related web development, the SeeSS widget may be just the thing to help you code the styles for your site. It allows you to view all the important attributes for CSS styles, and browse them all by name or alphabetical increments such as A through D. [via] Combined with CSSEdit, you have a complete CSS solution.

The developer’s site also has another widget, Oblique Strategies, which provides interesting approaches to problems and ideas. It’s a really unique widget that’s worth a look if you like little tidbits of information to make you think or inspire you.

Show All Results

Here’s a preview image of what I’m working on for the “Show All” results page for SpotlightSiteSearch. At the moment, the script simply redirects you to the default WordPress search page, showing you only posts. The new menu, as well as the search page, will feature the ability to search not only posts, but comments, links (powered by del.icio.us), and even images (powered by Flickr).

SpotlightSiteSearch

Mac users visiting Command-Tab, specifically those using Apple’s Safari web browser, will see a new search field in the sidebar which looks quite similar to the Spotlight field built into Mac OS X 10.4. What you may not expect is that the field on this site also works like Spotlight! Begin typing a query, and results appear before your eyes without whisking you away to a new page. With the results visible, you can either go straight to a search result or view all results via WordPress’ default search page (as opposed to the Spotlight window).

A lot of effort went into recreating the Spotlight look, covering everything from the rounded search field to the slightly transparent results menu. Some other interpretations were made, such as the white spinning indicator and “Search” text hiding. Despite the changes, literally every pixel was agonized over, and there was much hair-pulling over the CSS to make everything look “just so,” however I’m quite proud of the end product.

A good portion of the XMLHttpRequest JavaScript is from the Bitflux LiveSearch plugin, which helps request the results and display them without refreshing the page. While the code has been ripped apart and reassembled in a slightly different fashion, much thanks to Bitflux is still in order, for the initial inspiration as well as some JavaScript which really helped speed up development.

This was mostly a project to experiment with CSS, JavaScript, PHP, and MySQL all at once, but it turned into a feature which worked well and looked really sharp, so it earned a permanent spot on my site. For those interested in the code, I plan to release it in the near future — you can already grab the majority of it now by viewing the page source and digging through it. The only file you can’t directly retrieve is a single PHP file which talks to the database and returns matching posts by essentially doing a LIKE “%form%” MySQL SELECT statement on post titles and content. At the moment, though, there are a number of issues I’d like to work out, such as browser compatibility and other shortcuts that were taken (see the second XMLHttpRequest for the link URL). Public support and criticism is welcome, as I’d like to see it improve and be used on others’ sites. In the future, I’d like to add multiple categories for results, making use of the Flickr API for image searching, and possibly related del.icio.us link searches using tags. Overall, though, it turned out beautifully.

Go ahead and try it out. Start typing something slowly in the search field, like “ipod” or “podcasting” and watch the results narrow!

Update: Since many people were interested in this, so I went ahead and cleaned up the code enough to make it portable, and I’m calling it version 1.0. If you want all the code, images, and Photoshop files that went into creating SpotlightSiteSearch, get it here (zipped to an impressively small 56 KB). A ReadMe RTF is included to point you in the right direction as well as document some ideas for the future. Feel free to post in the comments if you have any troubles installing. Enjoy!

Revision3 Broadcatching Feeds

Jon has created some excellent RSS/Broadcatching feeds for the internet TV shows published by Revision3, which includes Diggnation and Systm. You can use the RSS plugin for Azureus and have the high definition versions of the shows automatically download as they’re published.

 
Obama '08