benlog.org

merb_has_json_flash: JavaScript accessible Flash for Merb

2009-10-12T00:00:00Z

Several months ago, I began using Michael Ivey’s merb_has_flash gem on Guestlist. The gem, which provides Rails-like flash accessors to Merb, works as advertised, until I wanted to manipulate the flash contents via JavaScript. The use case: setting a success message and then reloading the page, all client-side. It was difficult because, although the Gem stores the flash contents in the user’s cookies, it’s stored as a Ruby serialized hash that seems unreadable via JavaScript.

The solution? A fork called merb_has_json_flash, which instead of serializing the flash in Ruby, does so using JSON. Now you can set the success message in Ruby or JavaScript, and the behaviour is identical. The only downside is that the flash store is no longer obfuscated, so it’s user-readable – not a big deal.

Here’s an example, using the jQuery cookie plugin:

<script type="text/javascript">
  $.cookie('flash', JSON.stringify({
      notice: 'Ticket successfully saved.'
    }), { path: '/' }
  );
  window.location.reload();
</script>

Anyways, that’s it. I hope someone else finds this useful – although it seems like Merb users are far and few between these days.

Blog now powered by Jekyll

2009-10-08T00:00:00Z

Huzzah. I’ve successfully migrated this blog from an ancient version of Mephisto to Jekyll, a static site generator written in Ruby. Since it’s statically generated, I don’t need a fancy hosting platform anymore, so I’ve cancelled my $20/mo Slicehost account and begun hosting the content out of a cheap Dreamhost account. Yeah, that Dreamhost.

If you’re thinking of making the move yourself, I’ve got a couple tips. First off, New Bamboo has an article that goes over the migration process. After that, the biggest pain is preserving inbound links because Mephisto and Jekyll generate their pretty URLs differently. I followed New Bamboo’s lead and forked my own version of Jekyll that patches this.

As for the deploy process, I’ve got it down pretty simple: I build the entire site locally, then rsync the result to Dreamhost. I’ve read about some complicated setups that use GitHub post-commit hooks to have your server check out the latest version and build it in place, but I think rsync does the trick just fine. It also means my Dreamhost account doesn’t need Ruby, the latest gems, nothing – just a dumb folder system where I can dump static content. So far, pretty happy about it.

Now, just to do something about this design …

FreshBooks.rb now maintained by Ben Curren

2009-04-04T00:00:00Z

I’ve been late to announce this, but Ben Curren (of Outright) has been maintaining the canonical copy of FreshBooks.rb for a few months now. He’s improved the library ten fold, so if you’re a FreshBooks/Ruby integrator, I encourage you to take a look.

Revised date, datetime helpers for Merb 1.x

2009-01-31T00:00:00Z

I’ve expanded on both mine and Jamie Macey’s original date helper code to support Merb 1.x, and add a datetime helper to the mix.

Usage:

<%= form_for @person %>

  <%= date_field :birth_date :label => 'Birthdate' %>

  <%= datetime_field :birth_date_and_time, :label => 'Birthdate and time' %>

<% end =%>

You’ll find the code here, via GitHub. I generally name this file date_field.rb, and stick it in app/helpers.

GitHub Pages for project docs, demos

2008-12-29T00:00:00Z

Have you seen GitHub Pages? As of mid-December, GitHub now hosts complete web pages that are backed onto GitHub-hosted Git repositories. To start, just define an alternate ‘gh-pages’ branch for your repo, add your web content and push, and it will appear at yourname.github.com/repo-name. It’s perfect for small one-off project pages, or even complete blogs.

I’ve already migrated my project documentation pages over (see: Abbreviator, Labelize). I like the idea that these pages are accessible at the same location as their corresponding source code, with complete revision history, even if my blog is down or – dare I say it – long defunct.

Abbreviator: a jQuery plugin for fitting chunky content

2008-12-22T00:00:00Z

Inside FreshBooks (the application), there’s a few places where we abbreviate long-ish text with ellipses to make it fit inside small table cells. This is done in PHP by a single function, whose two parameters are a string and the desired character length.

Of course, not all characters are made equal. We estimate appropriate character lengths as best we can, but it doesn’t always work. If users have a penchant for typing in capital letters, or use text zoom, our little abbreviating function can fail. And of course, every design change to these areas require new character length settings – a task that is easily forgotten.

So, after some sanity checking/brainstorming with my co-workers Taavi and Justin, I put together a little jQuery library for accomplishing this feat in Javascript. It’s called Abbreviator, and it adjusts for font size, browser rendering differences, padding, and more. Take a look at the project page for more.

That’s it for me for the year – Happy holidays!

Labelize: a jQuery plugin for making big honking labels

2008-08-21T00:00:00Z

Labelize is a handy jQuery plugin that lets you give input-containing elements <label/> like properties, so that clicking on the container activates the input inside. The goal? To improve usability by giving hard-to-click input elements like radio buttons and checkboxes generous target areas. Surprisingly, this can’t be done with a <label/> element alone — if you want it supported in IE6, that is.

Say we have the following markup:

<div class="myLabel">
  <input type="checkbox"/>
</div>

To make the “myLabel” div become a label-like container for the checkbox its holding, we simply do the following:

<script>
  $('.myLabel').labelize()
</script>

That’s it! Now if we click anywhere on “myLabel”, the checkbox is clicked — and its onclick() event is fired too. Huzzah.

If you’d like to see the plugin in action, I’ve whipped up a quick project page with some working examples. Please have a look and let me know what you think.

Rogers starts re-directing DNS misses

2008-07-19T00:00:00Z

Beginning some time this past week, Rogers, the largest ISP in Canada, starting re-routing missed DNS hits to their own branded Yahoo-search page. Not only is this totally unhelpful and full of irrelevent ads (no, I do not want a Chatelaine subscription, thanks), it also re-writes the attempted URL in your browser’s address bar – making efforts to correct the typo you made a total pain in the ass.

Here’s the explanation from the about page:

These search results were provided because the domain name you entered into the address bar is either improperly formatted, currently unavailable, nonexistent, or part of a key word search. Rogers Supported Search Results is a service designed to enhance your web surfing experience by eliminating many of the error pages you encounter as you surf.

Thankfully, Rogers lets you disable these “helpful” search result pages. Except, they’re not really disabled. Instead of showing you the search results page, you get a mocked up IE-style 404 error served to you by Rogers. Meaning, the URL is still being clobbered.

Between this and the web content tampering fiasco from earlier this year, I’m about done with Rogers. But since I’m moving in a few months, I’ll have to maintain this abusive relationship until then.

Update: This is now being covered on Slashdot.

Fun with Yahoo Pipes

2008-07-15T00:00:00Z

In the middle of some recent web-based wanderlust, I found myself toying around with Yahoo Pipes, the aggregate web feed builder. Released earlier this year and still in beta, Pipes’ slick Javascript-based GUI lets you drag-and-drop feed sources, user inputs, and operators (like sort, filter, search and replace), and pipe them out to a single output – a consumable web feed. In case it’s not obvious, Pipes is inspired by Unix-style pipelines.

My first creation is a “Pipe” titled FreshFriends. It’s an aggregated feed of FreshBooks employees’ personal blogs. This took me about 30 minutes to create, most of which was spent tracking down everyone’s feed URLs.

Afterwards, I built a classifieds search feed that aggregates local Craigslist and Kijiji listings. I happen to be on the lookout for a used Settlers of Catan board game (don’t ask), so I created this feed to receive new listings directly in my feed reader. The Pipe is generalized so that you can create your own customized feed by changing the supplied search params, including minimum and maximum prices, and location.

Aside from my own creations, there’s also some really cool stuff in the public Pipe browser. I’ve subscribed to one that cleans up Penny Arcade comic feeds to include only comic entries, and scrape the comic image directly into the feed (normally you have to click an embedded link to view the image). No more senseless and artist-supporting ad views!

Long story short, Yahoo Pipes is a nifty – and useful – tool. It makes a lot of mundane scripting tasks fun, and combined with handy source cloning tools, easily shareable too.

API Podcast from SXSW Is Up

2008-07-12T00:00:00Z

It’s kind of old news now, but my SXSW Interactive panel presentation, Developer Friendly Web Service APIs, is available in podcast form on the SXSW website. Once again, it features Carl Mercier of Defensio, Avi Bryant from DabbleDB, Leah Culver from Pownce, Ari Steinberg of Facebook. Topics covered include ideal request and response formats, strategies for reducing API changes, request throttling, and more.

You can listen to the podcast here.

Looking to get involved next year? SXSW has begun taking panel submissions for 2009.

Bare bones date picker for Merb

2008-06-29T00:00:00Z

I’ve been fooling around with Merb these past few months. Can’t say I’ve created anything of consequence, but along the way I’d written this simple date picker, and thought I’d share it.

Used inside a form_for block, it creates 3 separate drop-downs for year, month, and day from a Time object.

Example:

<% form_for @person %>

  <%= date_control :birthdate, :label => 'Birthdate' %>

<% end %></code


Note: This should be run against Merb 0.9.3.
Edit: Jamie Macey (below) has contributed an updated version for Merb 0.9.4.



Quick and dirty meshU recap
2008-05-26T00:00:00Z

      

meshU, the workshop-oriented sister conference of mesh, took place this past Tuesday in Toronto. It sold out a few days beforehand, but with only four presentation slots and an estimated ~200 attendees, it had the feeling of a very small and tight-knit conference, big names aside.
Turning the tables
Avi Bryant kicked off the development track with a talk on relational database alternatives. Instead of getting too deep into the why, Avi focused on design considerations / best-practices when building an application on top of services like Amazon’s SDB, Google’s AppEngine, and Microsoft’s forthcoming SSDS (now in beta). He finished off with a first look at MagLev, a new Ruby VM (and Bryant / Gemstone joint), demonstrating two irb-like shells accessing the same global objects, complete with transactional support. Very curious stuff; more details on MagLev are to be revealed during Bryant’s upcoming RailsConf talk.
Managing great software teams
Afterwards I snuck into Reg Braithewaite’s talk on managing great software teams. I’ve been reading Raganwald for the better part of two years, and I’ve generally enjoyed reading his management-type articles, so I was looking forward to hearing him speak in person – even with Daniel Burka of Digg/Pownce fame presenting next door. Unsurprisingly, Reg is as a good a speaker as he is a blogger, and it felt like management and developer-types alike enjoyed his assortment of management anti-patterns, golden rules, and hindsights. You can catch his slides here, but despite being aesthetically pleasing, they’re hard to appreciate on their own.
Implementing OAuth
After lunch, my co-worker Taavi and I took in Leah Culver’s talk on OAuth, an open API authentication protocol. Her presentation was both introductory and yet very-technical, with fairly complex slides depicting a number of authentication interactions, complete with source code examples. With a dizzying number of token names and types, OAuth was perhaps the most complicated subject of the day, but Leah had a helpful hand; Flickr’s Cal Henderson, author and celebrity audience member, answered questions throughout (OAuth is largely based on the Flickr authentication model).
Thin and Rack
Last, but not least, Marc-Andre Cournoyer gave a development talk on Thin, a speedy event-driven web server for Ruby, and Rack, a web server interface and library. Marc-Andre coded up a couple of Rack/Thin examples while he presented, and I’m not sure what impressed me more: Thin, Rack, or Marc-Andre’s expert command of TextMate. It was a great presentation (with a hilarious introduction), so it’s a shame it was scheduled opposite Ryan Carson and John Resig, as the audience was minimal. Oh well;  this subject would be better suited for a [Ruby|Rails]Conf, anyways.
So that wraps things up. From all the feedback I’ve heard, meshU was a pretty big success, and all indications point to a repeat event next year. Thanks again to all the volunteers, organizers and sponsors* for making it happen.
Disclosure note: FreshBooks is a sponsor of both Mesh Conference and meshU.
    
  



Catch me on Twitter, and other updates
2008-05-19T00:00:00Z

      
So much for that New Year’s resolution. Since I began micro-blogging via Twitter after SXSW, finding inspiration for a full-blown blog post has been tough. So, if you’re curious what I’m up to, I recommend following me there. If you’re looking for non-stop brilliant observations, however, be warned: my tweets are reserved exclusively for sarcastic retorts and lunchbox content reporting.
What’s going on this week
Switching gears, it’s looking like an interesting week here in Toronto. meshU kicks off Tuesday morning, which I’ll be attending along with the entire FreshBooks technical crew. Panel-wise, I’ll probably be sticking to the ‘development’ track, which begins with a talk by Avi Bryant on relational database alternatives. After mesh, DrupalCamp2 takes place Friday and Saturday, which FreshBooks is also sponsoring.
    
  



meshU featuring Avi Bryant, Leah Culver
2008-03-30T00:00:00Z

      

Just a heads up that two of my fellow SXSW panelists, Avi Bryant and Leah Culver, will be making their way to Toronto to speak at Mesh Conference’s new sister-event, meshU.
meshU is a one-day event taking place May 20th, composed of a series of best-practice and how-to workshops intended for developers/designers. Other confirmed speakers include jQuery creator John Resig, and Carsonified’s Ryan Carson.
From the meshU site:
meshU is a one-day event that will be filled with small, focused workshops by those who have earned their stripes in the startup game; people who can talk knowledgeably about everything from interface design to using Amazon’s S3 distributed server network.
Disclosure note: FreshBooks is an “in-kind sponsor” of Mesh Conference, and my boss Mike McDerment is one of it’s co-founders. Oh, and he totally put me up to this.
    
  



Four things I learned at SXSW (the hard way)
2008-03-14T00:00:00Z

      


So, SXSW Interactive is good and over. The panel went well (or so they tell me), I met some nice folk, and drank some darn good beer.
Unfortunately, things weren’t completely rosy. I made a couple of critical errors which slightly marred an otherwise brilliant weekend:
Don’t hand out the wrong business cards (as in, somebody else’s)
SXSW is a business card trading frenzy. So, a good idea is to make sure your business cards are your own. Mine weren’t.
I was sorting through my remaining business card supply half-way through the conference, and was horrified to notice that a handful were labeled “Kathy Donaghue”, a former FreshBooks co-worker who’d left the team back in August. I guess our cards got mixed up some time ago, and I hadn’t bothered to check them before handing them out. So, if you’re back from SXSW and wondering who the heck Kathy is, look no further – it was me!
MacBooks don’t have VGA-out
Unlike 99% of my web-developer peers – I don’t presently own a laptop. So I borrowed my colleague Sunir’s MacBook for the trip. As a PC-user-4-life, it didn’t occur to me that MacBooks don’t have VGA out – you need a separate adapter. So, before my presentation, I actually borrowed a second laptop just to play the slides – a Dell PC running Windows Vista (!). My street cred dropped 50% instantly.
Remember to introduce yourself during your own panel
Yep – no joke. We were about 20 minutes through the panel before I’d realized that, during introductions, I’d completely forgotten to introduce myself, or FreshBooks. Months of organizing, planning, and slide-preparing and nobody even knew who I was. Bummer!
(If you’re reading this now, I was the guy on the right.)
Bring a phone (that works)
My mobile phone company, Virgin, doesn’t offer roaming. With no connection to the outside world, I was always tethered to someone who did. Not being able to find your friends, hand out your number, find the latest party, or Twitter, was a complete drag. Never again!
Anyways, all things considered, I had a great time, and let’s face it – these aren’t big deals. Still, next year, I’ll be way more prepared … maybe.