< Detroit Coder />

I use a lot of different editors (BBEdit, TextMate, Coda, Espresso – I know I know kind of a weakness of mine) but I also like using vi a lot as well. One thing that is missing on the Mac install however is the ability to launch the GUI version of vi from the command line. Here is how to set this up.

1. Grab the gvim script from http://macvim.org/OSX/files/gvim and save the file locally as gvim (ignore the extensions).

2. Move the file to your active bin, try /bin on your system.

3. Make sure you make the file executable

$ chmod 555 gvim

4. And for good measure you can turn over ownership to root

$ chown root:wheel gvim

5. Close your terminal and open it again to initiate your changes and now you can launch the gui version of vi from your command line.

$ gvim newfile.txt

This is a common PHP/MySQL issue. You have a list of something that needs to be displayed in output, and you have no idea how long the list will be etc. So for example you a database with authors, books and of course a book can have more than one author, but you need output that looks like this:

“Robot Visions, the sequel” authors: Michael Gator, Amanda Ade

So what is the easy way?

Say your tables look like this:

create table author (
id int unsigned not null auto_increment,
name varchar(60),
primary key(id)
);
create table book (
id int unsigned not null auto_increment,
book_name varchar(120),
primary key(id)
);
create table book2author (
bookID int unsigned not null,
authorID int unsigned not null,
primary key(bookID, authorID)
);

Your php could look like this

query($query)) {
	$objBook = $result->fetch_object();
	/* Get Authors */
	$sql = "select author.name as author from author,
                  author2book where author2book.bookID = $objBook->id";
	$result = $mdbCurs->query($sql);
	if ($result->num_rows > 0)
	{
		$authors = "";
		while ($row = $result->fetch_object()) {
			$authors .= $row->author . ", ";
		}
		$objBook->authors = substr($authors, 0, -2);
	} else {
		$objBook->authors =  "Anonymous";
	}
?>

Then simple call the $objBook->authors in your html

<h2><?= $objBook->book_name ?></h2>
<h3>Authors: <?= $objBook->authors ?></h3>

If you have been developing for the web, the request for things like “less boxy”, “rounded corners” and “drop shadows” have made you cringe more than once.

Now there might be plenty of design reasons not to have drop shadows and rounded corners, but for the times that it makes sense, here is a solution that will work for Firefox, Safari and Chrome*: [For those that ask what about IE, please read an interview with Dan Cederholm on Graceful Degradation]

Four images with incremental CSS applied

The above image show the same image with 4 different stylesheets.

The html is straightforward

<img src="/images/icon.jpg" alt="example" />

And the CSS for each image:

First Image:

img.game-icon {
}

Second Image:

img.game-icon {
   padding: 4px;
   background: #fff;
}

Third Image:

img.game-icon {
   padding: 4px;
   background: #fff;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
}

Forth Image:

img.game-icon {
   padding: 4px;
   background: #fff;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;

      -moz-box-shadow: 3px 3px 6px #ccc;
      -webkit-box-shadow: 3px 3px 6px #ccc;
}

And that is it. IE works up to the first 2 images, then Firefox picks up “-moz” requests and Safari and Chrome picks up “-webkit” requests, all without IE choking on the requests that it doesn’t understand.

This of course is just the tip of the iceberg for what you can start to do with CSS3, including animations, delayed styles, pretty cool stuff. A quick Google search on “-webkit” or “-moz” will reveal a lot – happy exploring!