Split Badges with Twitter Bootstrap and HAML

I recently needed to display a few contextual numbers near each other in a web app. I’ve taken to liking the twitter bootstrap ‘badges’ for little informational numbers, especially with the color coding that badge-important, badge-info, and badge-success provide. Easy ways to quickly communicate not only the number, but a hint at what it means. The problem is that when you put a bunch of badges right next to each other, you get kindof a mess. ...

July 19, 2012 · 2 min · Mark Simoneau

Easy way to limit the length of a list

I have lots of lists on my new site that we want to show ‘only the first 5’ items on, but allow people to expand to see them all if they want. It’s common enough that I’d like to have an easy way to do it. Bonus points if it’s non-obtrusive. jQuery -> $('ul.show-more').each -> if $(this).find('li').length > 5 $(this).find('li:gt(4)').hide().end().append( $('<li><a href="#">Show More...</a></li>').click -> $(this).siblings(':hidden').show().end().remove() ) Now all I have to do is drop into my favorite haml template and bang out a list ...

June 15, 2012 · 1 min · Mark Simoneau

ImageMagick, JPEGs, and Orientation, Oh My

I’ve been working on a new project and decided to use CarrierWave to handle image uploads (and minor automatic manipulation). Everything looked great, but then my new boss, who has a penchant for finding the one or two things wrong with your latest well-tested feature uploaded a JPEG that looked fine in Preview, but automatically rotated on upload. After checking through the directory, it seemed that only the processed images were getting rotated. Actually, ‘rotated’ is a misnomer, they were actually just losing their orientation. JPEGs have EXIF meta data that can contain the orientation of a picture, no matter how it’s stored. This allows cameras to store everything as a 640x480, but display some in the reverse (480x640). The only thing different when the camera writes the image is what orientation the gyroscope adds to the meta data. ...

June 13, 2012 · 2 min · Mark Simoneau

DCI Generators in Rails

Recently, in my new project, I decided to take the DCI approach that Mike Pack outlined, which has been really cool. I’ve been able to keep my tests fast, and have very distinct buckets to put data (models), specific roles of that data (rather than cluttering up the models), and an easy way to take a use case and map it out programatically (contexts). I noticed that I was generating roles and contexts regularly and copying from previously written code examples so I decided to make role and context generators. The process wasn’t bad, but it did take a couple of steps that took a little digging to understand. ...

May 22, 2012 · 3 min · Mark Simoneau

CSS3 max-width and min-width selectors

I learned recently about min-width and max-width css selectors that allow you to specify certain properties that are applied under a maximum width and above a minimum width. This can enable a flexible layout that works on many different screens without multiple distinct layouts (instead, just CSS). This also makes it relatively easy to spot-test by simply resizing your browser to get an idea of how it will look on different size devices. ...

May 16, 2012 · 1 min · Mark Simoneau

Electronic Music Is Good for Coding

I’ve recently been curating a playlist on spotify for High Energy Electronic Music so that I could have something high energy with no lyrics, or at the very least very simple ones that were easy to ignore. The big point was to have something high energy that got me into the coding groove. I have to say that it’s worked. Having a driving beat and some hard hits has made it really easy to get motivated to code on. Suggestions for similar artists/songs welcome.

May 16, 2012 · 1 min · Mark Simoneau

Distributed Teams in the Same Room

When you’re in the same room, often your communication is done via waving at each other, overhearing a conversation, happening by a desk, etc. It’s accidental communication in many cases, and it’s good. But it can have detrimental side effects to productivity when interruptions can happen at any time. That was the main impetus behind deploying HipChat to our organization–having a way to allow people to communicate without directly interrupting. Let people come to the communication, rather than taking the communication to them ...

April 24, 2012 · 2 min · Mark Simoneau

Pull Requests on Private Teams

Pull Requests are used often in the open source world, but less so on private teams. They are a great way to provide an automatic, team-wide code review mechanism. If your private team doesn’t use pull requests, I’d encourage you to investiage it. Why would you move your team over to pull requests? it provides a mechanism for code and source control review it gives more visibility and accountability to the whole team you can (optionally) restrict access so only trusted members bless the merge What is the Pull Request process like? There are lots of resources about how to submit pull requests out there, but the basics go like this. ...

April 24, 2012 · 2 min · Mark Simoneau

Git Bisect For Great Justice

About a week ago, we had an elusive error that appeared when we deployed our latest app to staging. Suddenly, any submission resulted in a “Stack trace too deep” error that gave no meaningful way to determine where the issue was coming from. We were stuck for a couple of days, but then I was reminded of git bisect. git bisect is a great way to trace down problems to a specific commit for purposes of isolation or blame (though I’d suggest against the latter). Like you’d expect from a programmer, it even searches efficiently, using a binary search, hence bisect. ...

April 12, 2012 · 2 min · Mark Simoneau

CanCan and Devise with nil current_user on POST

I had a Rails 2.3.X app that I migrated to Rails 3. When I did, I upgraded CanCan and Devise. Suddenly, my delete links weren’t working. I remembered that unobtrusive JS was the default so I hopped into the application.html.erb template and added the relevant javascript tags. ... <head> ... <%= javascript_include_tag 'prototype', 'rails', 'application' %> ... </head> ... Great! Now my delete links weren’t just links to the show action, but when I did click them I noticed that a CanCan error appeared. After some debug statements, it became clear that current_user wasn’t set, but only on the POST/DELETE methods. Hmmm. What could be causing this? ...

April 11, 2012 · 1 min · Mark Simoneau