Something to this effect should be used on all AJAX web pages:

function globalAjaxCursorChange() 
  {
    $("body").bind("ajaxSend", function(){
       $(this).addClass('busy');
     }).bind("ajaxComplete", function(){
       $(this).removeClass('busy');
     });
  }

Along with:

body.busy * {
  cursor: wait !important;
}

The javascript above is jQuery, but I used to do the same type of thing back when I used Prototype.

Developers sometimes go to great lengths to supplement the native behavior of a system with custom ‘busy’ indicators. And that’s great, but don’t forget what’s built-in. Users instinctively know that something’s working when they see the old hourglass/watch cursor.

At the developers’ request, I have updated it once again. The color has been brought back to the globe, and the smaller versions (32px and 16px) have been simplified a bit for a cleaner appearance. I encourage you to try the new version. You can click it to download the .icns file, which may be placed inside iTerm.app/Contents/Resources. Enjoy.

Speaking of iTerm, isn’t it about time we had an updated icon? I’ve cobbled one together using bits of the Terminal icon with elements from the previous iTerm icons. Not exactly original. Same concept as the old icon. It’s just more Leopardy now. Click it to download the .icns file. I recommend downloading the revised version below.

Let me know what you think.

What’s in your Finder toolbar?

I find it useful to keep a few extra items in my Finder toolbar. Anything to which you would drag files and folders would be appropriate to put in your Finder toolbar. Here’s mine:

From left to right:

1. Path Button is one of those buttons that is not in the default set. It’s pretty handy, though. You can click it to see a list of the parent folders for upward navigation. I’ve recently discovered you can get the same functionality by right-clicking on the name of the folder in the title bar. So, I might remove the path button.
2. CleanArchiver is an essential app for creating clean zip (or gzip, bzip, Disk Image, etc) files without the pesky .DS_Store files. Every time I need to send a zip file to a Windows user, I just drag the file to this icon. You can find CleanArchiver at Sopht Square.
3. TextMate, everybody’s favorite text editor, is handy to have here because you can drag a folder to open a project.
4. Transmit is a nice SFTP app that has a feature called ‘Dock Send’ which allows you to upload files to certain places based on the location of the file on your computer. Just drag the file to its dock icon (or, in this case, it’s toolbar icon).
5. Transmit Droplets allow you to upload files to a specific server directory.
6. AppZapper is a popular app for removing applications including all related files.

That’s about it for my Finder toolbar. What’s in yours?

For the past few years, I haven’t had too much trouble out of IE — only because I’ve become familiar with its quirks. I know that floats need display: inline to fix the margins, position: relative or zoom: 1 needs to be added to misbehaving elements to trigger hasLayout, and height: 1% will make boxes stretch to contain their floated children. That’ll fix IE6 90% of the time. But today, I struggled with something I hadn’t run into before: Lack of Multiple Class Support

I was trying to reference elements with multiple classes in my CSS:

.aside.login {
  properties: values;
  ...
}

All the other browsers (including IE7) work with this just fine. IE6, however, only sees one class. I wish I had known about this before I spent most of my afternoon trying to figure out why rules were getting applied to things they shouldn’t have.

named_scope :all, { 
  :order => 'last_name',
  :conditions => 'activated_at IS NOT NULL'
}

Thoughts, corrections and objections welcome in the comments.

(Editor’s Note: This article turned out to be a little longer than I expected. The whole process is really quite simple. It should only take about 10 minutes, at the most.)

The first thing I didn’t realize is that Apache supports something called dynamic virtual hosts. That means you don’t have to create a virtual host in your conf files and restart Apache every time you want to create a new site. This is incredibly handy for development. Combine that with a real DNS server (BIND), and you have a much smarter system. I can now create a whole new site on my MacBook just by creating a new folder! Much simpler than the old way.

The Old Way?

To put this in context, let’s quickly review the old way. For years, I’ve developed websites on Mac OS X using the standard ‘MAMP’ setup: Mac/Apache/MySQL/PHP. When starting a new site, the first thing I do is set up a virtual host for Apache. If you’re like me, you know this as a 4-step process:

1. Create a directory for the site’s files. Something like: mkdir -p ~/Sites/domain.com/public
2. Create a line in /etc/hosts for the domain: 127.0.0.1 domain.dev
3. Add a few lines to my Apache conf file to configure the virtual host:

   <VirtualHost *>
       ServerName domain.dev
       DocumentRoot /Users/jason/Sites/domain.com/public
   </VirtualHost>
   

4. Restart Apache: sudo apachectl graceful

The New Way!

1. Create a directory for the site’s files. Something like: mkdir -p ~/Sites/domain.com/public

Done.

Not only that, but I also decided to set up a few TLDs to separate my sites. I use .ppm for my personal and freelance sites, .dev for my experimental stuff, and .bsi for my company work. This allows me to separate sites like so:

Sites
|-- bsi
|   |-- this
|   |-- that
|   `-- theother
|-- dev
|   |-- experiment1
|   |-- experiment2
|   |-- youget
|   `-- thepoint
`-- ppm
    |-- postpostmodern
    `-- littlebeestudio

These would be:

• this.bsi
• that.bsi
• theother.bsi
• postpostmodern.ppm
• littlebeestudio.ppm
• experiment1.dev
• experiment2.dev
• youget.dev
• thepoint.dev

First, let’s talk about the hosts file.

The first thing you need for an Apache virtual host is a unique hostname. As can be seen in step 2, above, this is usually accomplished via the /etc/hosts file. The only problem is the hosts file doesn’t support any wildcards. So, you can’t say:

127.0.0.1    *.dev

Instead, you have to have this:

127.0.0.1    postpostmodern.dev
127.0.0.1    littlebeestudio.dev
...
...

…and eventually, you end up with a hosts file a mile long.

Enter BIND — the built-in, but inactive DNS server

BIND (named) comes with Mac OS X. We just need to configure it and turn it on.

I should mention here that DNS server stuff falls outside of my comfort zone. I just followed a few articles (on macosxhints and Ubuntu Forums) to get this working. I’m not sure how it impacts the vulnerability of your Mac from a security standpoint. All I know is that it works and provides a few advantages over the hosts file:

• You can set up TLDs to resolve to your local IP address. So, anything.dev and anything.test will automatically stay local.
• Apparently, since BIND will be caching DNS info, it will make web browsing faster. I haven’t formally tested this, but if it’s true, it’s a nice bonus. It does seem a little quicker.

Setting up rndc

This creates a configuration file and key for rndc, which controls named.

Get into sudo, and make it stick.

sudo -s

Generate the conf file.

rndc-confgen > /etc/rndc.conf

Copy the key to the key file.

head -n 6 /etc/rndc.conf > /etc/rndc.key

Exit sudo.

exit

Creating your DNS zone files

DNS zones are created via files in /var/named. Create a new file in there called dev.zone and fill it with this:

;
; BIND data file for dev sites
;
$TTL    604800
@       IN      SOA     dev. root.dev. (
                     2008101920         ; Serial
                         604800         ; Refresh
                          86400         ; Retry
                        2419200         ; Expire
                         604800 )       ; Negative Cache TTL
;
@       IN      NS      dev.
@       IN      A       127.0.0.1
*.dev.  14400   IN      A       127.0.0.1

Repeat the above for each TLD you want to set up, replacing ‘dev’ of course.

Configuring named.conf

Now, open /etc/named.conf. The first thing you want to do here is to show named where to get its DNS info (for the rest of the internet), i.e. forwarding servers. Let’s use OpenDNS. Add these lines in the options section of named.conf (after ‘directory “/var/named”;’):

forwarders {
    208.67.222.222;
    208.67.220.220;
};

Now, we just need to let named know about those zone files we created a minute ago. For each of the zone files, create a section like this:

zone "dev" IN {
  type master;
  file "dev.zone";
};

You’ll see where to put it. There’s a ‘localhost’ section already there. Just put yours below that.

Configuring and loading the LaunchDaemon

Okay. One last thing. Tell Mac OS X to activate named. Open the LaunchDaemon plist file for named (I had to use Textmate because Property List Editor didn’t let me save a file belonging to root.):

/System/Library/LaunchDaemons/org.isc.named.plist

Change ‘disabled’ from true to false, and save the file.

Now, load it:

sudo launchctl load /System/Library/LaunchDaemons/org.isc.named.plist

If everything went well, your DNS server should be up and running, and your personalized TLDs should resolve to your local machine. Try visiting something.dev and see if it resolves correctly. You might want to comment out all those custom lines from your /etc/hosts file too.

Now for the Apache Magic!

Now that the DNS stuff is out of the way, it’s just a matter of setting that magic directive in your Apache conf file. The directive is called VirtualDocumentRoot.

I don’t know how you have your Apache configured, but personally, I like to keep all of my custom configuration in my own file (the one in /etc/apache2/users). Here is what my /etc/apache2/users/jason.conf file looks like:

DocumentRoot "/Users/jason/Sites/default/public/"

NameVirtualHost 127.0.0.1

<VirtualHost 127.0.0.1>
    VirtualDocumentRoot /Users/jason/Sites/%-1/%-2+/public
</VirtualHost>

The DocumentRoot directive is for the default site — the site that comes up when you visit http://localhost. The NameVirtualHost should be the reverse IP for your local machine. Finally, the VirtualDocumentRoot is an interpolated path for finding your sites. ‘%-1’ means the last part of the domain name (the TLD). ‘%-2+’ means everything before that. So, http://example.dev/ would load files from /Users/jason/Sites/dev/example/public. If you want a different scheme, read more about directory name interpolation on Apache’s web site.

Now, restart Apache!

sudo apachectl graceful

You should be good to go!

Please let me know your thoughts and corrections in the comments.

I threw together some ActionScript 2 to rotate the wheels based on the movement of the vehicle. Not sure if it’s perfect, but it seemed to work okay.

The ActionScript to calculate the rotation of each wheel depends on two formulae:

Thanks, Pythagoras and Pi. Thorasandpi.

Here is the resulting ActionScript (attached to the wheel movie clip):

onEnterFrame = function() {

    // _parent is the vehicle clip. It's what's moving.
    // Figure out its x and y coordinates relative to last time.
    dx = _parent._x - this.lastx;
    dy = _parent._y - this.lasty;

    // The sum of the square of the two sides (horiz. and vert. change)
    sum = Math.pow(dx, 2) + Math.pow(dy, 2)

    // The hypotenuse
    dist = Math.sqrt(Math.abs(sum));

    // The direction is determined by whether dx is positive or negative
    dist = dx < 0 ? -1 * dist : dist;

    _rotation = _rotation + ( (360 / (_width * Math.PI) ) * dist );

    // Store the vehicle's x and y coordinates for next time.
    this.lastx = _parent._x;
    this.lasty = _parent._y;

}

And here is an example:

I’m sure this is basic stuff for most ActionScript people, but I don’t work with it that often. Sometimes I wish I did. I’ve always loved geometry, and I know there are all kinds of fun puzzles like this when you combine animation with math. Ah well… just not enough hours in the day.

So, how is this any better?

Well, for starters, there is no white. How is that better? Well… it just… it just is. Secondly, I’ve removed a lot of the old posts that were completely useless. I’ve also put together this here design from scratch. So, I have a little more control over the layout and the markup. It’s still a WordPress theme, which is a little limiting, but I’m slowly learning to bend it to my will.

Why are the articles here so old?

All of the articles prior to this one are from the old blog to which I hadn’t posted in over a year. But there is plenty of fresh content on the way. I have been maintaining a list of articles I plan to write. I’ll also be writing about the Github projects and scripts to which I’m slowly adding.

Some stuff doesn’t seem to work.

It’s sort of a work-in-progress. There are probably some broken links and possibly some bugs. If you find anything, just let me know in the comments below.

Cheers.

…tell you how I know.
I read it in the paper
15 years ago.
John Prine

I try not to get to obsessive about techy gadgets, but man, that iPhone is just brilliant — and not as much for what it does, but for how it works. It’s like those seamless, intuitive, nice-to-look-at interfaces that futuristic sci-fi movie makers design, but that electronics companies never seem to be able to make.¹

1. That’s what frustrates me about most electronics companies (and most companies in general): they’re not really trying to innovate; they’re just hacking together stuff. Movie makers design cool gadgets because those gadgets are based on how they look and feel; not the underlying electronics and technology. Real-life technology companies, on the other hand, have their engineers put together some electronic components. Then, a programmer builds software on top of that. Then a crappy UI gets designed. Finally, it’s all just thrown together as cheaply as possible into a plastic box that’s designed to be easy to manufacture. So, you get a mediocre device that was designed from the wrong direction by a bunch of engineers/designers/etc.

   Some of those tradespeople may have been able to do some great things if their role in the design process wasn’t so limited by every other part of the process. Picture 25 people all holding a pencil above a piece of paper. It’s only one pencil and everyone has a firm grip on it, so they all have to move in the same direction. Think about how hard it would be to draw something creative when you have to completely coordinate every movement with 24 other people. Even if each person was a fantastic artist, you’d be lucky to get a simple smiley face on that piece of paper. It’s like the old “weakest link in the chain” scenario, except exponentially worse because the limitations of each member are compounded. So, when an electronics company manages to create even the slightest improvement (the equivalent of eyebrows on the aforementioned smiley face), it’s considered a “groundbreaking innovation.” Nobody seems to care that they’re just squeezing a little more paint out of the same old tube.

   So, why this creative gridlock? It seems to me that there are two types of technology companies: The first being the type that have lots of money and resources for product development and marketing, but are stymied by big committees and giant development teams. The second being the type of company that has great ideas but much more limited resources. (I remember seeing info on the Optimus Keyboard over a year ago, and it still hasn’t made it to market.)

   I think the big companies think that larger development teams mean more-bigger-better ideas. When, in fact, big development teams usually handicap the brightest minds. Democratic teamwork is crippling. The only way you can take advantage of a large group of minds is to have one genius overseeing the whole thing, cherry picking the best ideas and integrating them into a single, brilliant, focused vision.

   Apple is one of the few companies that I know of which has the resources to produce expensive things, yet is able to rest its fate in the hands (and minds) of a tiny handful of brilliant people. I just hope there is always at least one company like Apple to lead us into the technological future. ↑ back up there