Abhi's Blog

Camino 1.0b2 is here

2006-01-01T08:27:00.000+10:00

Camino 1.0b2 is now available for download, I've been using it since last night, so far it has zero bugs.

It's not quite up with safari on quality, but it's a very nice browser and has some great features, certainly a *lot* better than firefox.

How to become an independent programmer in just 1068 days

2005-12-27T09:16:00.000+10:00

Gus Mueller (author of some popular mac indi software) tells how he became an independent developer.

read more | digg story

CSS shadows using multiple bg images

2005-12-01T08:36:00.000+10:00

A css shadow tutorial which was posted on digg inspired me to demonstrate how cool safari's ability to do multiple background images is.

With the story, they show the method I've been using for ages to apply drop shadows to an image. Read the article for the full description of how to implement it, but the basic idea is to apply some background images, margins and positioning css to the following html:

<div class="shadow">
   <img src="shufflegirl.jpg" />
   <div class="topleft"></div>
   <div class="topright"></div>
   <div class="bottomleft"></div>
   <div class="bottomright"></div>
</div>
<br class="clear">

As you can see, it's pretty messy. A lot of code for something that should be simple.

Starting with version 1.3 of safari (which was released *ages* ago, we're now at version 2.0.2), you can have more than one background image on a single element. This means you can apply the exact same background images using this html:

<img src="shufflegirl.jpg" class="shadowed" />

And this CSS:

img.shadowed
{
   padding: 0px 2px 4px 2px;

   background-image:
      url(shad_tlcorner.png),
      url(shad_trcorner.png),
      url(shad_blcorner.png),
      url(shad_brcorner.png),
      url(shad_top.png),
      url(shad_bottom.png),
      url(shad_left.png),
      url(shad_right.png);

   background-repeat:
      no-repeat, /* top left */
      no-repeat, /* top right */
      no-repeat, /* bottom left */
      no-repeat, /* bottom right */
      repeat-x, /* top */
      repeat-x, /* bottom */
      repeat-y, /* left */
      repeat-y; /* right */
      

   background-position:
      top left,
      top right,
      bottom left,
      bottom right,
      top,
      bottom,
      left,
      right;
}

As you can see, the CSS isn't much simpler using multiple bg images, however the html is one line of code instead of eight! And even more important, his method uses float left, which might not always be desirable. With my method the image behaves exactly the same as an image without a shadow.

I should note that there are two differences between my shadow and his. First of all he's using a combination of border and bg color to generate the left and right "shadow". I prefer using an image on the left and right, though both methods work fine.

And secondly, his example puts a 5px white margin around the image, which looks very nice. To implement this in mine, you would either use different images (and I was too lazy), or apply the shadow to a div that's around the image, with a margin on the image. I did test the second approach and it works fine, however once again you need to float the div, which requires more code and won't fit in well with some page layouts.

So can you use the multi bg image method in your website? As usual this comes down to too factors, how many of your visitors will the shadow break for, and how badly will it break.

On my website (codeservant.com), 55% of all traffic is either Safari or a Safari based browser. This drops down to about 10% FireFox, 5% IE, 3% Camino, and so on. So for me, it's probably perfectly fine to use safari only features, so long as they don't break too bad on other browsers.

And this one doesn't break badly at all, there's simply no shadow on other browsers. Just a slight padding around the image (which isn't noticeable). And since it's entirely based on standard CSS 3, future versions of FireFox and IE should be capable of rendering the site perfectly.

So, if I had a database full of photos on my website, and wanted a shadow around all of them, I would use the multi bg image method.

The iPod of home computers

2005-10-14T14:36:00.000+10:00

Apple has announced a brand new iMac. Basically they took the previous iMac G5 and added a whole lot of new features, both hardware and software.

It's got a built in iSight for video conferencing (apparently it's even higher quality than the normal iSight, which is already way above standard for webcams). It's obviously intended for video conferencing, but we all know how that works (If you don't, google for iChat AV), what I want to talk about is the new application called Photo Booth, which is for taking pictures of yourself with the iMac. It's a tiny app but really fun, basically it uses the iSight to take a picture of you, complete with live preview of what it will look like on the screen, you can easily pick from a handful of fun special effects to apply to the picture (everything from sepia tone to high end core image filters like Light Rays). Just incase you're in a dark room, it will flash the screen white at full brightness to create a primitive but effective "flash", and the whole UI is done with slick animations and sound effects that generally just make the whole app fun to use. It's pointless but extremely attractive and entertaining, and as steve said this is going to hurt productivity for a good few hours after you stick one on your desk.

But even cooler than a built in video camera is the new "Front Row" feature. Which is similar to what I assume windows media center would be like (I've never used or even seen media center). It allows you to easily use your mac to listen to music, watch DVD's, browse your photo library, and watch any home movies/music videos/tv shows/etc that you have on your mac. All of this is done with a well designed user interface that can easily be used from the other side of a large room, it's controlled by a 6 button remote control that comes with all new iMacs, the remote control and user interface is somewhat similar to what you see on an iPod with the exception of a lot more "goo" since it's running on fast hardware. Actually, I'm pretty sure it's very different from windows media center. The [hilarious] slide comparing Apple's remote to the ones used with WMC was enough to make that very clear.

And that's just the major two features, there are tons of other improvements ranging from a significant speed bump on the CPU and GPU, to an ambient light sensor tied to the brightness of the throbbing sleep LED that allows it to be clearly visible in a bright room without disturbing your sleep if you have it in your bedroom.

To top all that off, they also managed to make it thinner, while still being able to drop the price of the 17" SuperDrive model to what the 17" Combo Drive used to be (which they have discontinued). The 20" model also was graced by a $100 price drop.

Oh and they also released a video iPod, and you can buy a handful of TV shows on the iTunes music store (I'm sure more will come, this is the TV producers dipping their toes in before wading out into what is almost certainly pleasant water). I love the new iPod, and iTunes 6 is pretty cool stuff too, but the iMac overshadows them in my opinion.

I'm calling it "The iPod of home computers" because I feel this is the first computer that's truly perfect, which is exactly what I thought when I replaced my cd walkman with a 4G iPod. I don't really fit very well into the iMac's target market, but I might buy one of these.

Good Code will pay off later

2005-10-13T08:18:00.000+10:00

Late last night, I started work on a "list view" class in php, pretty much the same basic concept as an NSTableView in Cocoa/AppKit. The main aim of the class is to make it extremely easy to create a list of tabular data via PHP (mainly for use in control panels).

In my attempt to achieve ultimate simplicity, I designed the setColumns() method like this:

$listView->setColumns("First Name", 130,
                      "Last Name", 130,
                      "Email", 170,
                      "Phone", 100);

I was quite happy, hardly any code at all to specify columns! This is good right?

But after it was all working, I realized how fast this would degrade to chaos if I ever wanted more than two arguments for each column... So I re-worked the whole shebang to work like this:

$listView->addColumn("First Name", 130);
$listView->addColumn("Last Name", 130);
$listView->addColumn("Email", 170);
$listView->addColumn("Phone", 100);

Or like this (which is handy if the columns are stored in a DB):

$listView->setColumns(Array("First Name", 130),
                      Array("Last Name", 130),
                      Array("Email", 170),
                      Array("Phone", 100));

It was a good half an hour of coding where I basically ripped the guts out of the whole class, and replaced it with something fundamentally different. Not to mention it's quite a bit more code now to specify the columns for the list view, but I went to sleep happy with the fact that I'd written Good Code.

----------

This morning I actually used the class in the real world, and within a few minutes realized a major flaw. I needed it to work with keyed arrays (I refuse to use the A word), which means I need to assign a key to each column! Since not all uses would involve a keyed array, I also wanted the key argument to be optional. Now it looks like this:

$listView->addColumn("First Name", 130, "firstname");
$listView->addColumn("Last Name", 130, "lastname");
$listView->addColumn("Email", 170, "email");
$listView->addColumn("Phone", 100, "phone");

It took fully 4 lines of code to implement that in the new class, and it worked flawlessly while still being fully backwards compatible. Wohoo. But what if I had kept the original setColumns() method? I would have had to make a whole bunch of changes all over the class, and worried about bugs that might have been caused. Not to mention any existing code using the class would have instantly broke.

Motto of the story? Good Code will pay off later.

Blog Skin

2005-09-09T16:09:00.000+10:00

A few days ago I changed the skin to Minima, and since then I've been making minor tweaks a few times each day:

Content is now in the Eurostile font (thin and kind of squarish), which I'm pretty sure is only in Mac OS X 10.4 +. It's my absolute favorite font.

The header font is Zapfino (advanced calligraphy font), which has been standard on Mac's for a long time, probably not standard for windows either.

I've changed the width of the content from a fixed size to a size specified in em's (grows/shrinks when you adjust the font size). I pretty much did this to experiment. I've never really used it in clients websites since it can be difficult to work with, so the more practice I get with it the better.

After the sidebar ends, the post content will now wrap underneath it, this is because I tend to make long posts and the page height was getting out of hand.

I did make a few other very minor changes and might make more in future. But the major ones are done now, so I won't be playing with it too much going forward.

Unleashed

2005-09-08T23:30:00.000+10:00

I just returned from watching Unleashed. A movie I've been anticipating since I first saw the preview, many months ago at Apple's Quicktime Trailers website. I know, it's even been screening in Australia for ages. I've been way too busy lately!

Anyway, on to the movie. It was exactly what I expected. An intelligent (mostly) drama with a touching story line, threaded with some of the most brutal fight scenes I've ever watched.

I really enjoyed this film, though I imagine not everyone would.

SubEthaEdit

2005-09-07T12:17:00.000+10:00

A few days ago the guys from coding monkies (creators of SubEthaEdit) did an interview with CocoaRadio. This was enough for me to play with SEE again (I'm not happy with any html editor I've ever tried, and rarely stick with one for more than a couple of months).

Like all the other editors, it has it's pros and cons. Starting with the cons:

It's designed to be a light weight editor and doesn't have any "project oriented" features, most importantly FTP and FileSystem access. TextWrangler at least has a drawer that lists your open documents, but SEE doesn't even have that. Since I'm a Path Finder user, I can live without this and I'm gonna have to. I don't think they plan to implement anything like this. Then again I'm running at 1024x and it is kinda nice to have code that stretches the whole screen, so I guess I might not care so much once I get used to it.

Like just about every Cocoa app I've ever tried, the syntax colorizer sucks. I've tried several times to implement a syntax colorizer that integrates with Cocoa's text architecture so I don't hold this against them. They certainly had more success than me!! Anyway, I have two problems with it. First of all it's threaded. This means that the colors are applied a moment after you type, and when you open a document there's no colors for a second or two. And secondly, it's powered by RegEx, which is, IMO, a feature that isn't worth the performance hit (I'm finding it a little slow on some of my documents). The only apps that have gotten this right (that I know of) are Xcode and OmniWeb's source code viewer (which allows editing as well as viewing). I wonder if Wil Shipley would be willing to share his work with the rest of the world... probably not since he's no-longer part of the Omni Group.

There's no multi-file find/replace. I cover this feature in full detail under pros.

Most of the better code editors (including TextWrangler) can highlight the active line in a pale color. This makes it infinitely easier to find the tiny blashing set of 16 black pixels among the other 7.8 million pixels on my 12" display. It's usually turned off by deafault so most people have never even heard of it, but it's something I'm missing dearly when using SEE.

On with the pros:

The UI is excellent! It's very light weight and they've made it look nice where it wouldn't interfere with usability. Once you hide the toolbar (which is pretty much useless), the window is almost entirely filled by the source code editor, with only a thin status bar at the top which only contains stuff I want visible and of course the line numbers on the left and scroll bar on the right. It's deliciously light weight and still has everything I need.

The syntax colorizer, function popup and all that supports a wide range of languages, and there are more available on-line. To top it off they can all be (reasonably) easily modified if you're not quite happy with a particular module. And of course you can add your own languages if needed. This is all done by editing XML files and RegEx expressions. It's a bit of a learning curve to get into doing this, but the level of customization offered is worth the effort (and if you're not up to the task you're not hard core enough to need to modify these files anyway).

Find/Replace has full support for RegEx, and the UI is practical, compact and strait-forward. It completely lacks multi-file stuff but in every other aspect it's perfect. I can handle openning TextWrangler to do multi-file find/replace (which uses some weird RegEx format, and has an unpractical, bulky and confusing UI). Ironically, apart from the fact that they're both capable of finding stuff in your source code, SEE and TextWrangler are complete opposites here.

It's got command line integration. SEE optionally installs a command line utility called (you guessed it) "see" that will open files in SEE. I'm not going to use this much, but I'll use it often enough to appreciate not having to write an alias to achieve the same result.

Collaboration! The "SubEtha" part of the name isn't just there to sound cool, SEE allows multiple coders to work on the same document over the internet, from all around the world. It's extremely seamless and apart from a few port forwarding issues it works perfectly. Not all the coders I work with have macs, but this is an insanely handy feature when I'm able to use it.

Even when you're the only person working on a document (pretty much always the case!), part of the collaboration features are still handy. In particular I'm talking about the way it highlights what each user has changed since you opened the document. It's disabled by default when only one person is editing a file, but I strongly recommend enabling this (with the "toggle change marks" toolbar button). Here's an example of a bug I fixed in someone else's (horrible) code earlier today:

The code highlighted in orange is what I added. When it came time to jot down the bug I fixed and all that, I didn't have to worry about forgetting to mention anything thanks to this feature.

It has a light weight (of course) preview of your html documents. Since it doesn't work with PHP I can't even test it without creating a special web page just so I can play with this feature, and I'm not going to bother. I sent them an email asking for server side scripting support a few hours ago, but since it was something like 4AM in Germany when I sent it, I'm not expecting a reply for a few more hours at least! I've listed this under pro even though I don't like it, since I'll use it extensively when/if it supports PHP. I'm pretty sure it would be easy to implement, and it's the only thing holding me back from paying for SEE.

There's more that could be added to both lists, but those are the ones I care about. SubEthaEdit is one of the best code editors currently available, and with a few minor improvements it could be leaps and bounds ahead of all the others.

I will always want a full IDE with ftp syncing, debuggers, and all that cool of stuff. But until someone comes up with it (me?), SubEthaEdit combined with Path Finder, a decent FTP client, and a few browsers is a really nice setup for web coding.

Amnesty... for widgets?

2005-07-28T06:49:00.000+10:00

The name is totally weird, but Amnesty Widget Browser is one cool as system add on. It lets you run dashboard widgets on your desktop. Unlike the dev mode built into dashboard, with amnesty you have a bunch of other options.

For example I have the weather widget on my desktop, but bellow all other windows, allowing me to use Exposé to see my weather rather than having to opening dashboard. But even cooler, you can set the opacity of widgets, and you can set them to ignore clicks. I've got a nice big clock permanently on the bottom-right corner of my screen. It's above all windows and always visible, but I've adjusted the transparency and set it to ignore clicks, which means I can easily see what's under the clock, and I can still click on any buttons that are under the widget.

There are other pro's (and cons) too. It runs under Panther (I imagine not all widgets will work under panther), which is cool. And it doesn't have any of the flashy transitions in dashboard, which is not cool but kinda refreshing.

File List

2005-07-25T14:56:00.000+10:00

I just discovered a gem called File List

FileList is a freeware app for batch renaming files. It's very powerful, and apart from using the built in features to change extensions or number them, you can run a regular expression find/replace on the name, for example this one I just used:

Find: (.{15}).*\.(.*)
Replace: $1.$2

Will trim the filenames of any files passed to it down to 15 characters, plus whatever extension it has.

The UI is very nice, and shows you the result of your rename before you punch the Go button, and you can even create applets of common tasks.

It's a bit rough in places, and the documentation is a little scarce (it really needs a link to PERL's regex documentation). But it's freeware and v1.0, so I'm not complaining. But I'll hold off sending a donation until it's been improved.

CSS Specificity

2005-06-23T03:38:00.000+10:00

I was always under the impression that with CSS, whenever two rules conflicted with each other, whatever came last would be used. I started to think this might not be the case just the other day when a website didn't behave the way it should have. Since the behavior wasn't particularly important in this case, I simply ignored it and went on with my work (don't you love tight deadlines?).

But today I was browsing through a new website I came across, and found this page: CSS Specificity (HTML Dog). I wish I had've known that a bit earlier! Better late than never I suppose.

Core Data fun

2005-06-20T21:08:00.000+10:00

I finally found the time to run through CDC's tutorial on Core Data. It was my first exposure to the new features in Tiger's Xcode Tools (yeah, I've been that busy), and I loved it! Can't wait to start using Core Data in my apps.

A new version of Pixadex was released with (apparently) much improved performance loading large libraries. It's still pathetic IMO, so maybe my first Core Data app will be an icon organizer... Or maybe I'll just release a boring upgrade to jNotes.

If you can't beat them, join them

2005-06-16T07:59:00.000+10:00

Daring Fireball's latest post on Apple's switch to Intel is by far the best one I've read so far. It outlines my opinion on this article perfectly, and has me even more convinced than I was that this is a great move.

Read his article here.

Broadband!

2005-06-12T10:07:00.000+10:00

We finally got broadband connected at the new house, so last night I was able to watch the WWDC keynote. it was great, and I'm glad I didn't miss it.

Incase you've been living in a cave the last week, Apple is going to be switching to intel CPU's starting next year. Personally I think this is great news for all mac users, mainly because it'll make Apple a *lot* more competitive.

Anyway, as usual I'm in a huge rush, gotta go to work now. I'll be gone for a few days.

Been away for a few days

2005-06-01T10:26:00.000+10:00

On the spur of the moment, I decided to work for my brother (scrubbing green house roofs on a flower farm) on Tuesday, incase you were wondering why I was gone.

Anyway, it was hard work as usual, though this time it was drizzling, which means I didn't get hot, and the domes were already moist. I got through them reasonably quickly. Unfortunately last night I stayed up until 3:30 AM playing Crash and Burn on my brother in-law's Xbox, then got woken up at 5:30 to get ready for the bus back home, as you can imagine I'm running on caffeine right now...

We have a visitor staying here for a few days, can't remember his name... He's german, about 20 something. Seems like a nice guy, though he doesn't speak much english. Apparently he's the son of one of my mother's friends in Germany or something like that. He'll be here for a few days, then he'll probably do some dome washing for my brother (there's *loads* of work washing domes).

Haven't managed to do any work on PrefsMenu, but I might have some time today. I've got to write a quote for ImageSmith though, I'm not sure how long that will take.

PrefsMenu progress update

2005-05-29T19:04:00.000+10:00

Despite all the fuss with moving house, I'm managing to get somewhere with PrefsMenu 2.0. It's shaping up to be a really nice update, though I'm going to have to scale back a few of the features to get it released asap (the current version of PrefsMenu doesn't work properly under Tiger). I've still got a few things left to implement, but I'm going to shift as many of them as I can to v2.1, so hopefully I'll be able to release an update soon.

We've moved

2005-05-28T18:52:00.000+10:00

Hey guys, I'm finally in our new house! It's excellent, I wish I had a digital camera to show you. Anyway, it's air-conditioned in every room (important in Cairns), great yard, really nice lighting in all of the rooms, nice floors, double garage (with remote controled openning), deep swimming pool, quiet suburb but close to the city, reasonably good drive between here and work (long way, but traffic flows well).

We've hardly un-packed anything so far, there's a big pile of boxes in the lounge room, and an even bigger pile in the garage. But it's getting smaller slowly, one break from work at a time.

Internet access is a bit of a problem, so I'm writting this into jNotes for now, later I'll go online and post it. We're stuck with dial up for at least a week while we wait for ADSL to be connected. The main problem with that we get a lot of phone calls, and can't really afford to block it any more than necessary.

I half set-up our network this morning before going to work. Didn't have much choice for the Airport Base Station's location, as there's only three phone outlets in this house: office; living room; and main bedroom. Both the office and the main bedroom wouldn't provide wireless access to the whole house, so I chose the living room. I wasn't very happy with this at first, since it meant having a power lead running allong one of the walls of the living room, but then I saw the people who lived here before had drilled a hole in the wall (probably for an ethernet cable) right next to the phone outlet. The other side of that wall is just going to be used as a bedroom for visitors, so I ran the extension lead through the hole (had to remove the plug from the lead, pretty small whole). Nothing too difficult, but after a whole day of packing, shifting, cleaning and driving I enjoyed every second of it.

Lita, Shane and the girls also visited today, the girls were just as actian filled as usual, and I'm glad they weren't here too long, I need rest for work tomorrow! They'll be coming again next weekend, but for two days instead of a few hours.

Moving tomorrow!

2005-05-26T21:26:00.000+10:00

We're moving to Bayview Heights tomorrow. The new house is heaps better than this one, but the extra $40 a week is gonna hurt. I still haven't packed any of my gear yet, not that I'm to worried, won't take long.

I can't wait to finally see the new house, moving is stressful. Sorry guys, but you won't be seeing me in iChat much over the next few days, even though I'll prolly be spending a fair amount of time surfing.