Instance Arrays in Flash

One thing that I thought wasn’t planned very well in Flash 9 and AS3 is having a bunch of instances on your stage, and then having to declare each one in your ActionScript files. Up until now, I have been naming all my objects something like “obj0”, “obj1”, “obj2”, etc and then in my constructor, adding each of those objects manually to an array one at a time. The problem with this, obviously, as it doesn’t cater well to expansion or large numbers of objects. If I added more objects to the stage, I’d have to update the code.

Here’s code I came up with today:

public class RollingNumberDisplay extends MovieClip {

    protected var digits:Array;

      * Constructor
    public function RollingNumberDisplay() {
        var counter:uint;

        digits = new Array();

        counter = 0;
        while(this.hasOwnProperty("digit" + counter)) {
            digits.push(this["digit" + counter]);

        trace("length=" + digits.length);


Creating CSS layouts with the 960 Grid System

Put up your hand if you like spending hours creating CSS layouts. Or not…

There are not many aspects of web design that take more time and involve so many frustratingly small calculations than getting everything pixel-perfect in a CSS-based layout. Starting right at the sketches of a design on paper or in Photoshop, there are decisions that have to be made that can affect the CSS code you’ll have to write later. A new system called the 960 Grid System is here to help.

I just stumbled upon the 960 site while looking through one day, and noticed something that jumped out at me right away:

All modern monitors support at least 1024 × 768 pixel resolution. 960 is divisible by 2, 3, 4, 5, 6, 8, 10, 12, 15, 16, 20, 24, 30, 32, 40, 48, 60, 64, 80, 96, 120, 160, 192, 240, 320 and 480. This makes it a highly flexible base number to work with.

I recently started a couple designs, including this blog, which were designed for 1024 x 768 resolution, however at the time, I arbitrarily chose to have a width of 900 for my design. I wish now, that I had read about the 960 Grid System beforehand. Tonight I downloaded the zip file and opened it up to see what it was all about.

There are 2 variants of the 960 Grid System: A 12-column layout and a 16-column layout. Each variant starts by dividing 960 pixels into either 12 or 16 columns with exactly 10 pixels of padding in between each column. After dividing into small columns, you can then arrange boxes that are multiples of the column widths. It’s sort of hard to explain in words so take a look at the demo page that is set up at

The 960 package includes everything you need to get you started. Begin with a printable PDF that you can use to sketch out your design by hand, divided into either 12 or 16 columns. Once you’ve sketched out your design on paper, you can use a template designed for Photoshop, Fireworks, OmniGraffle or Visio to create your digital design. Finally, once you’ve sliced up your image, you can use the pre-made CSS styles to create your layouts. In your HTML, all you have to do is create a container div and assign a class of either “container_12” or “container_16”. Then you simply use the numbered grid elements along with clearing divs to make layouts. The whole system is pretty simple, and it makes a lot of sense.

Note: I’m not a big fan of the underscores used in the class names, however these days, it’ll be a rare occurrence if a browser chokes on the underscores. For me, it’s just a matter of good code.

I’m very glad to have found this system. I will definitely be using it in the future. I believe that it will be a huge aid for designing layouts and then converting to CSS. No more arbitrary column widths or painful margin, padding and width calculations in CSS. Hoorah!


From nothing to something with Django

Recently I published a new version of my site, including this blog. The entire site is now powered by Django. For those who don’t know, Django is a web framework written in Python and I have been toying with it for a few months. Feeling fairly comfortable with most aspects of Django, I set out to rewrite my blog… again… from scratch. As I worked on the redesign, I monitored how long each task took me. Here are my results:

  • ~45mins: Getting my rough models set up. I started with only articles and tags
  • ~45mins: Setting up rough views for articles. Listing all articles, displaying article details
  • ~20mins: Adding Django’s basic comment system to the articles
  • ~15mins: Integrating a JavaScript Markdown implementation into the admin site for writing articles
  • ~15mins: A few touch-ups to allow inactive articles and comment filtering
  • ~30mins: Adding pagination to the article list
  • ~30mins: Setting up Context Processors to display information in the sidebar on every page (tags, latest post, etc)
  • ~15mins: Going through and tagging all my articles (I hadn’t previously done so)
  • ~40mins: Setting up my RSS feeds. I now have feeds for latest posts, and latest comments
  • ~2hours 20 mins: Moving my entire project to my production server and configuring apache.

Total Time: ~6.5 hours

I’m not sure whether you would consider that good or bad. I feel like it went pretty well, however some tasks took longer than I’d hoped, mostly because of something tiny and stupid or because I would have to refer to documentation. For example, I used subversion for version control and when I deployed my blog, I had to install subversion on my production server. This added some unexpected time to deployment. I also hadn’t used some of the features such as comments and RSS in Django previous to this little project.

Overall I’m pleased with how clean Django is. It really emphasizes clean object-oriented design. There are lots of built-in features that can be really helpful, however it takes a while to learn them all or even discover them. The documentation for Django is alright, however I’ve found that the DjangoBook is a very good learning resource. I even ordered the hard copy to have at my side while I code.

Anyway, enjoy the new blog. I finally got tags working properly and added a new feed for comments. Let me know what you think.


How to shop online for cheaper

Yesterday I found something that I had to share. With Christmas only a month and a half away, if you haven’t started thinking about shopping, now’s the time.

I found a site yesterday while shopping for new shoes online. The site is Yes, I’ve included my referral ID in that URL. You’ll see why in a second. Let me cut to the chase and describe the big picture.

Mr. Rebates makes money because they have a big list of web sites where you can go to shop. Each time you click through Mr. Rebates and buy something, they get a percentage of your purchase price. Lucky for you though, Mr. Rebates will give you a chunk of that percentage back. On my shoe purchase, I received 5% back. On top of that, Mr. Rebates gave me $10 just for signing up.

As an added bonus, Mr. Rebates keeps a current list of coupons for most of the sites that it lists, so you save even more. Yesterday, I saved 20% off the purchase price of my shoes.

But wait… There’s more: For every person you refer to, you will receive 20% of their cash back money (at no cost to your friend of course).

Last but not least, if you’re Canadian there’s the added bonus of our strong Canadian dollar right now. This morning, 1 CAD = 1.10022 USD.

Purchase price minus coupon discount minus cash back minus $10 sign-up bonus minus referral bonus minus USD exchange

It’s practically stealing!

Last year I did about 60% of my Christmas shopping online. It was quick and relatively easy if you start early. You get to avoid malls and now, you can enjoy some of the cheapest prices on the net. This year, I’m going to try and do 100% of my shopping online. You should try it too. Why not start your Christmas shopping today. Go visit


Five Things I Recommend

It’s autumn 2007 and, as always, I have a handful of things that are currently filling my life with joy. I’d like to take a minute to list 5 of these things and recommend them to you. I’m sure that some of these recommendations will eventually fade off my top 5 list, but as of right now, you should try these:

  1. Django. Django is a web framework written in Python. I’ve been experimenting with a couple Python web frameworks recently, and over the last month, I’ve written a couple small applications using Django. The installation is easy, development is fast and support is plentiful.
  2. French Onion Soup from M&M Meat Shops. These were recommended to me by my brother, Nick. They are amazing. They come completely frozen, and you put them in the oven. If you like French Onion Soup, you have to try these.
  3. Guitar Hero. As many of you already know, Guitar Hero is the game that revived my Xbox 360. If you still haven’t played this game, you should find someone with it and give it a try. Guitar Hero III comes out next week, and you can be certain that I am going to buy it.
  4. Plant bulbs. Fall is the time of year to plant spring flowers. There are tons of types of flowers that you plant now, and they will be the first ones to burst through the soil after the snow melts. Tulips, Daffodils and Crocus are among the many great varieties of flowers to be planted now. Check with your local garden centre to see which ones would be best for your garden.
  5. All-you-can-eat-sushi. I’ve gone twice in the last month. I’ve always enjoyed sushi but I’ve never really had the chance to venture out of my comfort zone when ordering. That was, until I went with co-workers for all-you-can-eat sushi. This is not like the typical buffet as you would find in Chinese restaurants. At most A.Y.C.E. sushi restaurants, you order off a menu, and each dish is made fresh for you. With a large group of people, you have the chance to try a lot of new dishes and things you wouldn’t normally order on your own. Another added bonus is that you never really feel full while eating sushi, so you can just keep eating and eating.

Why I shave with olive oil

Shaving is a fact of life for most. Both men and women have felt the need to chop off hair as close as possible to their skin for thousands of years. I am no exception. Seeing as I shave my face almost every day and realizing that there’s millions of other things I would rather be doing at 7:00AM, I have made it my mission to find the best, most comfortable, fastest and generally most enjoyable method of shaving available. I have tried disposable razors, fancy razors with up to 6 blades, straight razors, shaving cream, shaving gel, shaving soap and for a period of time I even just gave up and let my beard grow. This has all changed now though, because I found olive oil.


Unblocking backgrounds in Flash

A long while ago I wrote an article describing how to block background elements in Flash. The problem I used to encounter was that my background elements were clickable through other movie clips on the stage.

Recently, I’ve had the opportunity to use Flash CS3 and ActionScript 3.0 and my problems with click handling have been flipped upside-down. The annoyance I encounter now, is that I cannot click through movie clips, even if their alpha is set to be completely transparent. For example, if I have a series of clickable movie clips positioned under another clip acting as a glare.


Guitar Hero optimal strategies

Just when I thought I was starting to get a bit good at Guitar Hero I stumbled upon a site that opened my eyes to an entire new world of Guitar Hero skill. is a site which documents most of the best Guitar Hero scores in the world. You see, the thing about Guitar Hero, is that you could hit every single note in a song, but if you don’t use your Star Power and whammy bar at exactly the right point, you may find that you only rank about 500th in the world.

Poking around a bit further in the site, I found this list of note charts and optimal “paths” through each song in the game. It appears as though a fellow named debr5836 created a program which extracts the songs of Guitar Hero, analyzes them and then finds the optimal strategy to maximize your score. This means using the whammy bar at exactly the right time, and hitting your Star Power so that you get the longest streak of notes possible. That is, of course, if you need something more challenging than getting 100% on Expert. Sigh…


Thank you Firefox

I just stumbled upon something in Mozilla Firefox that saved me a lot of time: Recently Closed Tabs.

I had just finished typing up a new wiki page and just before saving, I accidentally closed the tab I was working in. After a quick moment of panic, I thought to myself, “Maybe Firefox has a feature to undo the closing of that tab.”

A quick click on the History menu revealed Recently Closed Tabs. I could instantly open up the tab again, complete with all the text I had just typed in my wiki entry. Thank you Firefox!

This has saved me about 10 minutes today, and probably many more future minutes. It also follows inline with an article that I read recently. The article explains the importance of providing an “undo” feature just like the one in Firefox that saved me today.

Update Apr 10, 2013 – This is now supported in most major web browsers.


Flash addXMLPath example

I was recently working on an application in Flash which required the use of Flash’s Locale class. It didn’t take long before I was consulting the documentation for some of the methods and I ran across the addXMLPath method. Adobe (Macromedia at the time) was nice enough to include an example of how to use Locale.addXMLPath, however the example provided doesn’t even use addXMLPath()! The example provides no extra help whatsoever. I’ve created this small article to give an example on how to use Locale.addXMLPath().