Friendly Phone Format

5205552381 is hard to read

I’ve been building a new version of my employer’s Intranet. One of the new features I added is an Employee Directory (Goodbye ridiculous Excel file w/ 5 tabs and the headache it was to maintain it!). Unfortunately, in demoing it to a few folks, the common complaint was that the phone numbers were displayed in a format that was difficult to read — especially when looking at row after row of them.

I really wasn’t looking forward to touching each record in the db to correct the phone number format. I wondered if I could fake it w/ some javascript after the page loaded.

jQuery("table.gf_directory td[title*='Direct']").each(function() {
    var phoneString = jQuery(this).text();

With jQuery, I search for table cells w/ the title attribute containing “Direct”… and for each one, I filter the text of the cell through a new nicePhone() function.

function nicePhone(direct) {
    if (direct != "" && direct != null) {
        return direct.replace(
            "($1) $2-$3"

It works!

Sweet! 5205552381 gets turned into (520) 555-2381.


Then, of course, I run across this today: formatter.js



Chevrons Code Sprint

Is it still a code sprint if you’re the only one doing it? 😉

Last night, I spent some time adding a couple new features to Chevrons for Dropplets as well as adding a little polish. I’m feeling pretty good about the theme at this point and will be committing the latest changes soon.

Here’s what I managed to bake in last night:


Then, three weeks later:

  • flipped back to a darker color scheme
  • update FontAwesome again
  • switched to Adobe Edge Web Fonts (freely available, thus distributable)
  • ditched Bootstrap

Setting up Sublime Text

Setting up Sublime Text