planning a sport event mashup

Last summer I walked the Nijmegen 4 days marches, 4 days of walking 50 kilometers, 200 in total. Nijmegen is the worlds largest walking event and this year was my third time. But this year I had to walk alone, and 200 kilometers can be quiet boring when you don’t have a mate to talk to. So I decided to let all my online friends “walk beside me” and share everything I encountered on my 10+ hour daily walks on a mashup site.

Planning the Mashup

When you want to build a live feed mashup you should first think of what you want to share. In my case, I wanted to let my friends exactly know where I was on the route and share my thoughts and experiences in text, photo and videos. I knew my iPhone wouldn’t be up to the task of live streaming my GPS coordinates for 10+ hours and simultaneous tweeting. I also really wanted to post video’s to the mashup to capture the atmosphere on the road and video isn’t something a iPhone 3G can’t do. Luckily the people of the Vodafone Web Relations Team helped me out and supplied a HTC Magic. Another problem I had to tackle was power. A modern smartphone survives approximately 5-6 hours of really have use. So I had to recharge on the road, I used a Philips Rechargeable Powerpack for this.

Now I knew how and what I wanted to stream while walking, I had to mash all the different feeds together in one page.

Caching

Once I began to research the possibilities and difficulties of building a mashup one of the first things that came to mind was caching. Most API’s only allow a certain number of calls per hour and if a 100 people would watch the mashup at the same time, it would be locked out. So after some debating a database solution was chosen. A cron script would make calls to all the services and place all relevant data into a MySQL database.

Tweets and Media

I’ve been mobile tweeting for a long time now and recently I’ve started using Mobypicture more and more to include pictures in my twitter stream. My iPhone Twitter app of choice was Twitterfon, but for the mashup I’ve switched to Tweetie because they feature Mobypicture integration. Mobypicture not only supports photo’s, but also send audio and video. Since my iPhone doesn’t do video, I recorded video with the HTC android phone and send them to Mobypicture via e-mail.
Accessing the Twitter API is really easy. You can get your latest tweets in as an array in PHP with these 2 lines of code:

<?php

$json = file_get_contents(‘http://twitter.com/statuses/user_timeline/martijnreintjes.json’);
$obj = json_decode($json,true);

?>

It’s then real easy to show them on a page with a simple loop:

<?php
foreach ($obj as $line) {
echo $line[‘text’].'</br>’;
};
?>

Since I wanted to directly show the pictures and video’s on my stream, a connection to the Mobypicture API and some more code was needed. While I was looping through the tweets, I searched for a Mobypicture link and if one was found, I showed the photo directly:

<?php
foreach ($obj as $line) {
if($line[‘source’] != ‘<a href=”http://mobypicture.com/”>Mobypicture</a>’){
echo $line[‘text’].'</br>’;
}else{ //mobypicture
$tinyurlcode = substr_replace(strstr($line[‘text’],”http://mobypicture.com/”),”,0,24);
$moby_json = file_get_contents(“http://api.mobypicture.com/?action=getMediaInfo&t=$tinyurlcode&k=OAM2K1scSWQDHyNq&format=json”);
$moby = json_decode($moby_json,true);

echo “<img src=”.$moby[‘post’][‘media’][‘url_full’].”></br>”;
}
}
?>

For more information go to the Twitter API or Mobypicture API documentation

Maps

To show where I was, I had to stream my GPS coördinates over the web and have the ability to access them through an API. After some googling I found Instamapper that does this and has an Android app.

Plotting the route wasn’t hard, since the 4daagse organisation provided an google earth KPI file on their site, that I tweaked.

For more info about Google Maps read their documentation

Plotting the tweets was a whole lot more difficult, since tweets don’t have a geocode. But by comparing the timestamps of a tweet with the geocodes I would be sending every 20 seconds. To do this efficiently turned out to be quite a brain breaker. Luckily Wouter Broekhof helped out with some SQL code.

SELECT * , ABS(‘1247864044’ – `timestamp`)  AS `time_diff` FROM GPS WHERE ABS(‘1247864044’ – `timestamp` ) <=100 ORDER BY `time_diff` ASC LIMIT 1;

Tying it all together

The problem with projects like these is that they always cost way more time then anticipated. Luckily I have a lot of cool friends that are willing to help me out. Special thanks to Roel van de Ven for all the database and cron work.
I couldn’t have pulled it of without you bro’!
In the end I was very content with the mashup. It looked pretty cool and people liked it a lot telling from all the great reactions.
It was also fun to generate all the content on the road and it helped me through some of the more boring parts of the walks.

For future events it would be nice to make it more of a 2-way information stream and make it easier for followers to actively support someone. I’m even considering making this into a service or opening it up for other athletes. A problem with other sports besides walking is that it would be hard to tweet and make pictures while you’re active. Typing a tweet on your mobile device while you are riding the Tour-de-France would be really tricky for example. Maybe tying it up with a voice-to-tweet service and live video streaming could be very cool. I’m always open for new ideas, so please go loose on the comments!