Scoped CSS

Posted on May 17, 2013 in Blog, HTML5 | 0 comments

CSS has always been the weakest link for me in terms of creating larger web apps. PHP, JS? Now manageable. But over the years, CSS has remained the most stubborn language to structure well. You can have dozens of CSS files, but any line in any one of them can affect any element in any page. The horror. It seems like no matter what decisions you make on how to organize the CSS, you end up running into problems. I think the relative absence of CSS design patterns relative to other languages hints at the problem – it’s just not something that developers have been able to properly address, due to the limitations of the language itself.

(On a related note, thank heavens for CSS pre-parsers).

This is why I’m so excited about the new scoped HTML5 attribute for the style tag, which just landed in Firefox 21 (out now!). It lets you scope your CSS based on the location in the DOM. Here’s a simple example:

<!doctype html>
   <h1>An h1, styled according to the browser defaults</h1>
      <style scoped>
      h1 {
         color: red;
      <h1>A style-scoped h1. Holy crap it's red!</h1>

If you’re running FF21 you can see an example here:

There’s still a long way to go, but this is tremendously encouraging. I have little doubt that Web Component shim developers (Polymer, anyone?) will be making use of this new feature in no time.

Hopefully the other browser vendors will implement this soon. As always, see to keep up to date:

Read More

New job: CBC Music!

Posted on May 15, 2013 in Blog, Training / Conferences | 0 comments

I’m extremely excited to say I’ll be starting a new position at CBC Music, here in Vancouver in mid-June. I’ll be in a similar role as web developer, doing what I can do to help out with – mobile, desktop – as well as hanging out with the celebs, naturally.

I’ve been at Central1 Credit Union for a total of 3 years now (with a year break in the middle) and as much as I’ve enjoyed it, it’s definitely time for a change. This last year I’ve worked almost entirely on helping design and develop a large-scale JS framework built on requireJS. I learned a fair amount but it’s time for some new challenges.

So, in a little over a week I’ll be saying goodbye to my co-workers, then flying off to Florida for a couple of weeks to go to JSConf (a javascript conference) and for my honeymoon (did I mention I got married?) then back to Vancouver to start the new position.

Can’t sodding wait. CBC!

Read More 3.0.0 beta

Posted on Apr 14, 2013 in Blog,, Open Source Projects | 0 comments

I just released the Data Generator 3.0.0 beta. You can find it here:

The host is PAINFULLY slow right now, but the code seems pretty solid at this point.

Over the new couple of weeks my focus is going to be on:
- speeding the whole thing up with requireJS optimizer.
- finishing the Developer Doc (80% there!)
- getting the JS and PHP Doc up to date.
- working on the new website.

All the best!


Read More

JSConf 2013

Posted on Feb 25, 2013 in Blog, Training / Conferences | 0 comments

Nice! I secured a very-late ticket for this year’s JSConf. This’ll be the first time I’ve attended this conference – always meant to, but somehow it never happened.

Plus it’s being held in Florida, the land of great birds… this by no means influenced my decision to go. Not one bit.

Read More

JS Error Logs

Posted on Jan 23, 2013 in JavaScript, Open Source Projects | 0 comments

Many javascript errors on production sites go unnoticed: they’re only ever visible to the visitor and never tracked – what a wasted opportunity!

This script catches any client-side errors that occur in any modern browser and pass the information – line number, URL, stack trace – to the server for logging. It can provide significant insight into problems occurring on your web sites and applications that otherwise would go missed.

Read More 3.0.0 alpha available

Posted on Jan 1, 2013 in Blog,, Open Source Projects | 0 comments

Happy New Year! To start the new year off right, I’ve just released the first alpha of 3. It’s early days yet – lots of bugs to resolve, lots more hair to pull out, lots more yelling at the cat to stop scratching at the door because I’m working, damnit. But it’s coming together well and it’s time to “get it out there”.

I pared back a few items on the feature list so I could get it released and start getting some feedback. The following features didn’t make the initial cut, but will be appearing in later versions:
- Excel export type
- “Tree” data type
- Accounts. Right now everyone shares a single anonymous admin account.
- Translations (right now, English only).
- Developer Documentation
- IE support! Right now the script only supports Chrome + FF.

You can find the online demo here:

The entire codebase is on github. You can download the alpha1 tag here:

Bug reports would be most appreciated – and of course, feel free to fork the project and fix them too. ;)

Enjoy! :)

Read More

Canvas spinner script fork

Posted on Dec 28, 2012 in Code, HTML5, JavaScript, Open Source Projects | 0 comments

I came across this marvellous little script yesterday by Nick Stakenburg which creates a loading icon spinner using Canvas, letting you avoid having to use animated gifs. Very nice!

It was almost perfect for my needs, except I needed a few small tweaks. So here’s my fork of the script, with fadeOutSpeed, pauseColor and pauseOpacity options.

You can download it from github here:

Read More

Avoiding DOM-insertion timing problems with JS

Posted on Dec 8, 2012 in Code,, JavaScript | 0 comments

This afternoon I revisited some old code I wrote to address the problem where sometimes you want to do the following:


Even though that’s perfectly acceptable within JS, it takes time for the browser rendering engine to do the job of actually inserting the DOM, so it may not be ready for the second line to actually find the content it just inserted. I outlined the whole problem in an old post here.

Anyway, I updated the code in that post and rewrote it into a requireJS module. You can find it here: It’ll be included in the upcoming Data Generator rewrite.

Read More 3.0.0 update

Posted on Dec 8, 2012 in Blog,, Open Source Projects | 1 comment

Here’s a screenshot of the now-finally-relatively-stable new interface for 3.0.0 of the Data Generator. This will be the “classic” theme – very much just a continuation and improvement of the existing design. Once I’m a little further along, a friend (an actual designer) is going to design a new theme which I’ll probably end up using as the default. I’m personally quite happy with how it now looks, but I’m well aware my design abilities aren’t exactly “epic”.

That said, I do think it’s a substantially better UI than the existing version, aesthetically and functionally. The script now offers some useful new options:

  • New export formats (JSON, programming languages)
  • New data types (Company Names, Lat/Lng, GUID, Composite field, Tree)
  • New country-specific data (Australia, Belgium)
  • New ways to view/download the generated data: in-page, download + new tab/window.

But by far the biggest improvement is that the entire script is now modular. You can write your own Data Types, Export Types and provide new Country-specific data to generate data appropriate to your own country. Pretty frickin’ cool.

Coming soon! (I’m shooting for getting the alpha ready for Jan 1st).

Read More

Hawaii birding pics

Posted on Nov 22, 2012 in Birding, Fun Stuff | 0 comments

Just got back from Kauai, Hawaii. Not the best place on earth for birds, but I added another 27 species to my life list – and cracked the 400 species bird count for the year! I just put up a gallery of the better shots I took. No real stunners but a couple aren’t too bad.

As always, I’ve uploaded the better pictures to Wikimedia Commons and updated the odd wikipedia page as well (e.g. the Kauai Amakihi).

Sadly, that’s the last trip I’ll be taking this year. The year’s highlights were definitely New Zealand and Costa Rica. Should be returning to Costa Rica next spring – pity NZ is so damn far away…!


Read More