semiBad

Using the Apple Remote with your browser

A couple of days ago I posted an article about creating an offline portfolio, and why you might want to. At the end of that post, I briefly mentioned setting up the Apple remote to allow you to easily navigate through your portfolio during an interview — without getting in the way of the people you're trying to demonstrate to.

When I put this project together over the weekend, I didn't find a bunch of information on the best way to do this. My main reference was this blog post, although sadly it's out of date and the files it references are missing. I ended up tackling it a totally different way — thus, I thought I'd write this process up as a separate post for the sake of findability, in case anyone else is attempting the same thing.

Enable keyboard shortcuts for your browser

Since for the most part we'll be binding the various buttons on the remote to keystrokes, the first step is to enable your browser's keyboard navigation functions. For some reason, these are disabled by default on all OSX browsers — fortunately, there's a very thorough guide to enabling keyboard accessibility over at 456 Berea Street. It also has a few notes on the ways different browsers implement keyboard shortcuts — something you might want to bear in mind while planning how you'd like to navigate your site.

Set up Mira

Mira is a great little application by Twisted Melon which allows you to configure pretty much any app on your machine to work with the Apple remote. It's free for thirty days, but it's only $15.95 (under a tenner at time of writing) so it's hardly going to break the bank. Basically, once installed, Mira adds itself under your System Preferences, allowing you to change the remote's functionality for pretty much any app you want.

Once it's downloaded and installed, all you need to do is select your browser of choice from the list, and assign the relevant controls to each button on the remote. This is very much down to your choice of browser, the kind of sites you're likely to be navigating, and so on. You can see my settings for Firefox in the screenshot above, which are tailored specifically to my offline portfolio site (you can find more information on why I chose these in the article itself). In short, I used the up and down buttons to scroll through my links (tab and shift-tab) and left and right to scroll horizontally through the pages themselves, and the central button to 'click'. The menu button is bound to a URL — it just skips straight back to the main menu.

The simplicity of this particular site, as well as the narrow scope of what I needed the remote to handle, meant that I could get away with this sort of setup — your milage may vary. If you need your remote setup to be a bit more robust, you might consider using the 'DuoClick' options provided by Mira — they allow you to set two actions to each button, with a long press activating a different action to a short one.