Projects

GIF Parade

Experiments in public APIs and lightboxes

I had so much fun designing this take-home project for a job interview that it ended up growing beyond its original specs. :)

News Fixr

Make reading the news more fun!

Inspired by an xkcd comic, I made a bookmarklet to transform ordinary, boring news stories into something... a little more interesting to read.

Unwrapr

Get to the URL behind the redirects

Unwrapr is a holiday-themed trifle, but has a useful purpose: given any URL, it returns the canonical URL contained within any click-counters or redirects (e.g. t.co, bit.ly, etc). If you're unsure about that link your friend just sent you, unwrap it before you visit!

FENJIN

Fighting game engine in JavaScript

Fenjin is intended to be a full-featured Fighting Game Engine at some point in the future. Currently, it's just a demo of some of the core underpinning classes, like an image preloader, Sprite animation core, and so forth.

Haiku.js

A lightweight DOM builder

Haiku makes DOM trees
so simple to generate,
I think you'll like it.

Atto

Ultralight JavaScript/CSS3 Widgets

Atto is a collection of several basic UI components (i.e. widgets) that I've built for my own personal use, but figured I'd share in case anyone else wants a super light widget for something where the overhead of a full-blown library like Dojo, YUI, or jQuery UI is undesirable. They have zero external dependencies, work on all modern web browsers, and degrade gracefully on IE8 (IE6 and 7 are another matter, sadly, but I'm making the conscious decision not to support those at the moment).

SwagBag

Catch up on conferences you missed

I love technical conferences, especially small ones like the JSConf series. However, as developers, we can't always attend these events, due to ticket prices, airfare, hotel stays, time away from work, or whatever other reasons my arise. Even so, I like to stay up to date on the state of the industry, and the latest happenings that affect my craft. To that end, I created SwagBag / ConfSwag.com.

The core idea behind SwagBag was to provide users the next-best thing to attending a conference in real life. I’d present the conference schedule on the left, with links to any blog coverage, videos, or slide decks from the talk sessions, which can then be displayed inline in an embedded iframe on the page. A pop-up sidebar provided real-time Twitter updates referencing the event, allowing the user the vicarious experience of participating live, even if at a distance.

I’ve since allowed the dedicated domain to expire and am not currently adding new content, as Lanyrd has since incorporated most of the features I wanted to add. But an archive of the site can be found here on a subdomain.

Sparta

A small, personalized blog system in PHP

Recently I read that Google is retiring the Blogger site, where I have published my blogs for the past 9 years. I'm sure they'll be folding the old code and content into their new Google+ ecosystem, but I'm getting tired of my content being subject to the whims of online service providers. To that end, I set out to create my own blog engine. (More on my motivation can be found in my final post on my Blogger-powered code blog)

I haven't yet shared the code on my Github account, because it's not quite ready for use by others, but it's quite functional in its current state, and I've been using it for the past 9 months or so on my personally-hosted code blog. (I have yet to migrate my other blogs, but that's mostly a factor of time, not capability). It has support for multiple authors, categories, standalone pages, and SEO-friendly post URLs: enough and then some for my purposes, and I no longer have to care about any changes to some other company's terms of service (well, except my ISP, that is. ;))

CSS3 Resume

A modern 1-page resume using modern web technologies

It's no secret that I love modern web technologies, including HTML5, CSS3, powered by the latest generation of JavaScript engines. A while back, I saw a cool one-page resume design on Scribd, and got the idea to try and reproduce its style using only web technologies. I think I did a pretty good job of it.

Canvassa

NES Zelda in HTML5 Canvas

Canvassa started out as my attempt to learn the HTML5 Canvas API, and see how closely I could duplicate the original Legend of Zelda game from the old 8-bit NES days of my youth. Turns out that modern browsers are getting pretty good at this kind of heavy lifting, formerly the sole domain of browser plugins like Java, Flash, and Silverlight.

I've been building up my object heirarchies using Dojo Base's excellent class system, and have had the good fortune to have input directly from Dojo's project lead, Peter Higgins. This project also marked my first foray into Github, so if you're interested you can go there and fork it.

Since its origin, Canvassa has begun to evolve, and in the end may become something a little more fluid and user-driven. I've written a simple map editor that I eventually hope to turn into a full-fledged quest builder, and I've been toying with the idea of trying to generalize the engine into something useful for creating other types of games as well. Time will tell how this will develop.

tagCloud.js

Simple tag cloud generation

About a year ago, I decided I wanted to add tag clouds to my blogs. I looked around online, trying to find a library I could use to do the job, and couldn't come up with anything usable. Many of the blog hosting companies (e.g. BlogSpot, WordPress) have widgets that accomplish this, but I roll my own blog layout, so widgets weren't an option for me. I decided to do it myself, and share the results with the world.

It's pretty simple, still, and requires that you fill it with info on the tag names and frequency counts, but I like the flexibility it gives me in terms of how the cloud looks and behaves across my very different blogs.

Dojo.flip

Flip text upside-down

Back in April 2009, YouTube did an April Fool's joke where they turned their site upside-down by means of a sneaky little code snippet that swapped out all alphanumeric characters with characters that looked like upside-down versions of themselves (for example, 6 became 9, M became W, etc). Later, Paul Irish adapted the code into a jQuery plugin. Still later, when I was looking for a fun "Konami Code" easter egg for one of my sites, I followed Paul's lead and adapted the code as a Dojo plugin (which, incidentally, is a great design pattern I want to use again sometime).

DC vs Marvel MUGEN

Indie fan game creations

My MUGEN site includes a character selection page that's a mockup of the in-game character select screen. It employs image preloads, an old-school image map to handle the mouseover and click events, and old-style image replacement to display the portrait of the selected character. Pretty cool for when I wrote it, although looking back on it now, I can see plenty of room for AJAX-style improvements.