Its 2008, so wishing all readers here a very happy new year!
Yesterday, I touched about glancing back at a previous year (2007) , and one good way is to retrieve all the posts on your blog and place visualise it on a timeline. Of course there are other ways, say looking and sharing photo albums with friends could be a better way to bring back memories.
I revisited Dandelife (A Social Biography Network?), and found that they have made more features and progress, compared to the last time I tried using it. Some features include importing “life streams” from flickr, facebook, blogs, feeds etc… anyway I didn’t manage to import my blog so I moved on.
Next I tired SIMILE Timeline plugin for Wordpress. Pretty good it seems, but I encountered couple of problems which i didn’t bother to troubleshoot and fix much. I considered implementing my own wordpress plugin when I got the idea to create a client which uses MetaWeblog API, so that it can work not only for my blog, but any wordpress blogs, blogger sites etc.
I will use the metaWeblog.getRecentPosts method to retrieve the post from the webservice. Since metaweblogapi is based on xmlrpc, I used the library phpxmlrpc. The data returned is then formatted as timeline xml to be used the timeline api (in my case I chose to truncate blog contents too). Pretty simple right?
Here’s my source code which I glued together quickly, isn’t too pretty, but works dandy for me. I’ve placed the script online, so you may want to try it.
<?php
/* by http://zz85.is-a-geek.com/ 31 December 2007 */
session_start();
if ($_POST['login']) {
$reponse = blogconnect ($_POST['blogaddr'],1, $_POST['username'],$_POST['password']);
if ($reponse->errno=="0") {
$_SESSION['blogaddr'] = $_POST['blogaddr'];
$_SESSION['posts'] = $_POST['posts'];
$_SESSION['username'] = $_POST['username'];
$_SESSION['password'] = $_POST['password'];
showhtml();
} else {
echo "login failed";
showform();
}
} elseif ($_GET['js']) {
$_SESSION['username'].$_SESSION['password'];
printxml(blogconnect($_SESSION['blogaddr'],$_SESSION['posts'], $_SESSION['username'],$_SESSION['password']));
exit;
}else {
showform();
}
function blogconnect($link, $posts, $username, $password) {
//requires xmlrpc.inc from http://phpxmlrpc.sourceforge.net/
require_once('lib/xmlrpc.inc');
// Using metaWeblogApi http://www.xmlrpc.com/metaWeblogApi
$client = new xmlrpc_client($link);
$client->return_type = 'phpvals';
//$client->setDebug(1);
$params[] = new xmlrpcval("n/a");
$params[] = new xmlrpcval($username); //your wordpress login
$params[] = new xmlrpcval($password);
$params[] = new xmlrpcval($posts);
$msg = new xmlrpcmsg("metaWeblog.getRecentPosts",$params);
$response = $client->send($msg);
return $response;
}
function printxml($response) {
header('Content-type: text/xml; charset=utf-8');
echo "<data date-time-format=\"iso8601\">";
foreach ($response->val as $entry) {
/*
['dateCreated']
['userid']
['postid']
['description']
['title']
['link']
['permaLink']
['categories']
['mt_keywords']
['wp_author_display_name']
['date_created_gmt'] -8
*/
$description = htmlentities (substr($entry['description'],0,255)."...");
?>
<event
start="<?=$entry['dateCreated'];?>"
end="<?=$entry['dateCreated'];?>"
link="<?=$entry['link'];?>"
title="<?=htmlentities($entry['title']);?>"
>
<?=htmlentities ($description);?>
<?=htmlentities('<br/>by '.$entry['wp_author_display_name'].'');?>
</event>
<?php
}
echo "</data>";
}
function showform(){
?>
<form method="post">
Blog Address: <input name="blogaddr" value="http://yoursite/blog/xmlrpc.php" size="40"/><br/>
No. of posts: <input name="posts" value="100" /><br/>
Username: <input name="username" /><br/>
Password: <input name="password" type="password" /><br/>
<input name="login" type="hidden" value="1"/>
<input type="submit"/>
</form>
<a href="http://zz85.is-a-geek.com/">http://zz85.is-a-geek.com/</a>
<?php }
function showhtml() {
?>
<html>
<head>
<title>Wordpress (MetaWeblog) API and Timeline API Integration</title>
<link rel='stylesheet' href='http://simile.mit.edu/timeline/docs/styles.css' type='text/css' />
<script src="http://simile.mit.edu/timeline/api/timeline-api.js" type="text/javascript"></script>
<script>
var tl;
var eventSource = new Timeline.DefaultEventSource();
function onLoad() {
createTimeline();
}
function createTimeline() {
var bandInfos = [
Timeline.createBandInfo({
width: "25%",
//timeZone: 8,
eventSource: eventSource,
intervalUnit: Timeline.DateTime.DAY,
intervalPixels: 50
}),
Timeline.createBandInfo({
showEventText: true,
eventSource: eventSource,
width: "60%",
intervalUnit: Timeline.DateTime.WEEK,
intervalPixels: 100
}),
Timeline.createBandInfo({
width: "15%",
eventSource: eventSource,
showEventText: false,
intervalUnit: Timeline.DateTime.MONTH,
intervalPixels: 95
}),
];
// sync bands
bandInfos[1].syncWith = 0;
bandInfos[1].highlight = true;
bandInfos[2].syncWith = 1;
bandInfos[2].highlight = true;
tl = Timeline.create(document.getElementById("my-timeline"), bandInfos);
Timeline.loadXML("<?php echo $PHP_SELF; ?>?js=1", function(xml, url) { eventSource.loadXML(xml, url); });
}
var resizeTimerID = null;
function onResize() {
if (resizeTimerID == null) {
resizeTimerID = window.setTimeout(function() {
resizeTimerID = null;
tl.layout();
}, 500);
}
}
</script>
</head>
<body onload="onLoad();" onresize="onResize();">
<h2>Laying Out a Year (2007) Full of Blog Posts on the Timeline</h2>
Using Simile Timeline Library, Wordpress API/MetaWeblog API, and PHP to translate that into Timeline XML. <br/>
<div id="my-timeline" style="height:450px; border: 1px solid #aaa"></div>
<a href="http://zz85.is-a-geek.com/">http://zz85.is-a-geek.com/</a>
</body>
</html>
<?php } ?>
So now, I can have twitter and blog posts displayed on the timeline. If I have the time, calendars and metadata would be next. But there’s also too many other data sources around. Emails- run a search on gmail. On handphone, view the calendar data and smses for a year. Photos: Run time view in Picasa. Diary: read. Gps: Color tag them on googlemaps? Too many! so I’ll be satisfied with the blogs posts on the timeline for now.
Happy revisiting your posts!



Recent Comments