Post #435
You are currently only viewing posts within the category: Site news
You are here: Home → Archive → Site news → 2004 → July → 23rd → this post
Redesign explained: time presentation
23rd July 2004, early evening | Comments (66)
Part one of the redesign explanations is going to look at time (specifically post and comment time), and how it gets presented on this site.
Presenting post times
The idea
Until recently I didn’t present post times (as different from post dates) on my blog, as I didn’t really see that they were relevant. However, the redesign got me looking at this area in a little more detail and I came to the conclusion that while an impersonal timestamp might not be very interesting, something with a more human touch might draw the eye in its place.
It’s a little long winded, but I wrote some code that helps present a more casual version of ‘post time’ to visitors. It also adds some emotion to the presentation, with phrases such as “Terribly early in the morning” or “Lunch time” conveying something more than “03:00” or “12:00”.
Here’s an example of it in action:
The code
Here’s the time_of_day() function:
<?php// $hour must be 00-23 (in 24-hour clock)function time_of_day($hour){switch($hour){case 00:case 01:case 02:$tod = 'the wee hours';break;case 03:case 04:case 05:case 06:$tod = 'terribly early in the morning';break;case 07:case 08:case 09:$tod = 'early morning';break;case 10:$tod = 'mid-morning';break;case 11:$tod = 'late morning';break;case 12:case 13:$tod = 'lunch time';break;case 14:$tod = 'early afternoon';break;case 15:case 16:$tod = 'mid-afternoon';break;case 17:$tod = 'late afternoon';break;case 18:case 19:$tod = 'early evening';break;case 20:case 21:$tod = 'evening time';break;case 22:$tod = 'late evening';break;case 23:$tod = 'late at night';break;default:$tod = '';break;}return $tod;}?>- Download this code: 435a.txt
And here’s an example of how to call it:
<?php// example usage of time_of_day()// I get $post_hour from the db using:// SELECT DATE_FORMAT(post_datetime, '%k') AS post_hour// Example 1// - - - - - - - - - - - - - - - - -// set post_hour$post_hour = 08;// set human-friendly post time$post_tod = time_of_day($post_hour);// debugprint $post_tod;// > early morning// Example 2// - - - - - - - - - - - - - - - - -// set post_hour$post_hour = 21;// set human-friendly post time$post_tod = time_of_day($post_hour);// debugprint $post_tod;// > evening time// Example 3// - - - - - - - - - - - - - - - - -// set post_hour$post_hour = 05;// set human-friendly post time$post_tod = time_of_day($post_hour);// debugprint $post_tod;// > terribly early in the morning?>- Download this code: 435b.txt
Presenting comment times
The idea
Natalie Downe’s idea of showing post dates as time passed has become enormously popular on the web. It puts a twist on time-presentation which makes it a lot easier (for many people) to take in a glance, and I’m a big fan of anything that makes information more palatable. It occurred to me that a similar presentation method could be used to convey the age of a comment with respect to the post it related to; something I often want to know, but can’t be bothered to scroll up and down to compare dates.
To that end I added in a second (and optional) variable to time_since(), letting me specify a total of two dates. Now if I pass one variable to the function it calculates the time difference between that date and the current time, whereas if I pass two variables to the function it will calculate the difference between those two dates.
So, when presenting comment timestamps I pass time_since() two variables: the first represents the post’s UTC post time; and the second represents the comment’s UTC post time. The value that’s returned shows the time that passed between the post going live, and the comment being made.
And for those people who still want to know the exact moment the comment was made, the title text of this unusual timestamp contains all the information you could want.
Here’s an example of it in action:
The code
Here’s the time_since() function:
<?php// adapted from original code by Natalie Downe// http://blog.natbat.co.uk/archive/2003/Jun/14/time_since// inputs must be unix timestamp (seconds)// $newer_date variable is optionalfunction time_since($older_date, $newer_date = false){// array of time period chunks$chunks = array(array(60 * 60 * 24 * 365 , 'year'),array(60 * 60 * 24 * 30 , 'month'),array(60 * 60 * 24 * 7, 'week'),array(60 * 60 * 24 , 'day'),array(60 * 60 , 'hour'),array(60 , 'minute'),);// $newer_date will equal false if we want to know the time elapsed between a date and the current time// $newer_date will have a value if we want to work out time elapsed between two known dates$newer_date = ($newer_date == false) ? time() : $newer_date;// difference in seconds$since = $newer_date - $older_date;// we only want to output two chunks of time here, eg:// x years, xx months// x days, xx hours// so there's only two bits of calculation below:// step one: the first chunkfor ($i = 0, $j = count($chunks); $i < $j; $i++){$seconds = $chunks[$i][0];$name = $chunks[$i][1];// finding the biggest chunk (if the chunk fits, break)if (($count = floor($since / $seconds)) != 0){break;}}// set output var$output = ($count == 1) ? '1 '.$name : "$count {$name}s";// step two: the second chunkif ($i + 1 < $j){$seconds2 = $chunks[$i + 1][0];$name2 = $chunks[$i + 1][1];if (($count2 = floor(($since - ($seconds * $count)) / $seconds2)) != 0){// add to output var$output .= ($count2 == 1) ? ', 1 '.$name2 : ", $count2 {$name2}s";}}return $output;}?>- Download this code: 435c.txt
And here’s an example of how to call it:
<?php// example usage of time_since()// I get $post_timestamp_utc from the db using:// SELECT UNIX_TIMESTAMP(post_datetime_utc) as post_timestamp_utc// I get $cmnt_timestamp_utc from the db using:// SELECT UNIX_TIMESTAMP(cmnt_date) as cmnt_timestamp_utc// Example 1 - using one variable// - - - - - - - - - - - - - - - - -// set post_timestamp_utc// 10:25:15 22/07/2004$post_timestamp_utc = 1090491915;// get the age of the post$post_age = time_since($post_timestamp_utc);// debugprint $post_age;// > 13 hours, 51 minutes// Example 2 - using two variables// - - - - - - - - - - - - - - - - -// set post_timestamp_utc// 10:25:15 22/07/2004$post_timestamp_utc = 1088677515;// set cmnt_timestamp_utc// 22:08:09 24/07/2004$cmnt_timestamp_utc = 1090706889;// get time between post going live and comment being made$after_fact = time_since($post_timestamp_utc, $cmnt_timestamp_utc);// debugprint $after_fact;// > 2 days, 11 hours?>- Download this code: 435d.txt
And that’s it, folks.
Jump up to the start of the post ↑
Blogmarks
A collection of miscellaneous links that don't merit a main blog posting, but which are interesting none-the-less.
Our enemies are innovative and resourceful, and so are we. They never stop thinking about new ways to harm our country and our people, and neither do we.
— George W Bush (9)- What WordPress is doing to combat comment spam. (1)
- Mobile web tools, from Pukupi. (1)
- Pukupi’s top 10 hints for building interoperable mobile Web sites. (3)
- The photography of E.J. Peiker. (4)
Stuff from the intersection of design, culture and technology.
(3)- Some handy tips for advanced Google use. (35)
- Make your own church signs, or view some real ones. (8)
- Michael Heilemann is doing a great job with his new WordPress theme; Kubrick. (1)
- I’m late to the party, but Dan has a book out. (1)
- What a crazy concept for laying out housing estates. (3)
- In San Francisco, I live here. (Try the zoom feature.) (1)
- Spider-Man reviews crayons. [Via] (3)
- Some beautiful images from photographer Greg Downing. (2)
- Lots of links, from the Link Bunnies. (1)
- Nice “when I was a child” sort of post from Stuart. (1)
- How much does SafariSorter cost? (4)
- Some handy maintenance tips for Mac owners running Panther. (2)
- Alex King launches Use Tasks: a hosted service for Tasks and Tasks Pro™. (2)
- Min Jung, Anil Dash, and I get interviewed for HBO’s Real Sex. (10)
Blog-roll
A selection of blogs I read on a regular basis.
- Hmm, the blog-roll seems to be a little bit broken right now (it may be that the blo.gs service is having problems). I’ve sent myself an email about this problem, and will try to fix it ASAP.