My father-in-law and I play a lot of bridge together and as the evening wends along we often forget exactly how to keep score. Enter in the current debate regarding HTML5 versus native Obj-C iPhone applications, and I saw a weekend project. I present my first iPhone web-app: Bridge Score.

Kids, listen up: do what you want to do. I couldn’t get enough of computers. They were just so cool! I came out of college, and got a job… (wait for it)

… working in the woods. But when I got back to the city, I played on my computer. I went to the library. I stayed interested. I read. I tinkered. I played. I convinced people to let me make their websites. I stayed up late. I launched failed projects. I sold my first webapp. And now, I am officially a full-time web developer for a leading financial services firm. This is awesome.

My prior online repository (Small Batch Studios) was inadvertently in a name-space occupied by another (more awesome) web company, so now we’re here. Thanks for tracking us down!

My wife and I are traveling over the next 2 months, and as an exercise I created a page to let our families and friends know our location (roughly).

The result is quite neat, and I’ll explain a few of the finer points.

The Javascript Flipping Clock is a direct borrow from a NetTuts tutorial. Javascript wizard I ain’t, but it looks pretty swell.

The current activities are stored in one array per activity for a total of 6. To determine which array to pull from, I did a fairly straight forward elseif tree:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

$array_to_use = ''; //always initialize

if ($now < 1258783201) {
  $array_to_use = $boston;
}
elseif (1258783201 < $now && $now < 1258956001 ) {
  $array_to_use = $driving;
}
//many other elseif
else {
  $array_to_use = $default; //in case the page is viewed later
}

$quote = $array_to_use[rand(0,count($array_to_use)-1)]; //picks one from the array

Some key points are highlighted, and these lead to robust code: Always initialize your variables and provide default values. There’s a potentially confusing part at the end to choose the actual phrase to display.

To access an array element, you provide it with an index. The first element in $Array is $Array[0], for example. This uses several nested functions. First it counts the elements in $array_to_use and subtracts 1 (to make the first element = 0). Then it picks a random number from 0-(# of elements in array), and uses that as the index for the array. The result is that each time to access the page, it shows a pseudo-random phrase.

The timeline was all displayed using CSS and HTML. It’s hard to be semantic for something so abstract, but the code is there for your inspection. There was a fair amount of math to ensure the chart was actually to scale, and I believe I wound up at roughly 8px per day. The final bit was making the yellow indicator move (slowly) as time passed. The HTML is a fairly straightforward

$Diff is calculated by some subtraction and scaling of times, like so:

1
2
3

$start = 1258092001; //midnight start date
$now = time() + 3600; //plus an hour for EST
$diff = round(($now-$start)/10800); //division puts it in the 3hrs/pixel range

This is a good demonstration of some basic PHP scripting. Let me know if you have any questions about it.

I’ve been doing a lot of work on the Facebook platform these days and kept finding myself presenting comps with personal information mistakenly included!

I had taken screenshots of the various “chromes” that a designer has to create for a fan page, tabbed view, canvas view, friend pickers, dialogue boxes… The list of designs was huge and they all had my targeted ads in the rail and my name and message count sprayed about. Nonsense, I say!

So I made an anonymized .PSD that I’d like to share. Highlights include:

• Generic names for all application areas
• Pleasant image placeholders that are the same size as those on Facebook
• Text treatments that are as close as possible to what Facebook shows you (it appears that Safari and Photoshop don’t quite render Tahoma identically)

This will be updated as I take on more projects that necessitate generic templates; let me know what you’d like to use most.

Download

Twitter launched a new aggregation tool called “Lists” today. You follow a list, which has been curated (hopefully) by someone you know or respect, and you follow all of the people on that list.

As they say (with only a little irony) in the software world, shipping is a feature. The verb for web developers would be “launching”, but the sentiment is the same: Nip, tuck, tweak, and nudge only until you can get something out the door. In front of people. That’s the idea behind this early iteration of McPherson Industries’ very own website.