Ajax Timelines and the Semantic Web

Individual Blogs and the Planet Blog aggregator normally offer RSS 1.0 feeds. The shell commands to show a Planet on a Timeline are shown in Listing 10. The planet GNOME RSS feed URL could have been included directly into the Jena SPARQL command. Keeping it separate allows you to archive your blogs or combine many blogs into a single RDF file for querying.

The final command converts the XML file containing the results of the SPARQL query into a JSON file. Because the XSLT outputs plain text, there could be many newlines in places where a browser does not like them. The main offender here is newlines inside of a blog's HTML content. Because the output is JSON, the blog entry's content has to be contained in a JavaScript string declaration. Having a JavaScript string declaration extend over multiple lines by just ending each line with a newline will confuse many browsers. A simple remedy is to use the tr(1) utility to replace newlines with harmless space characters.

wget -O planet-gnome.xml \
  http://planet.gnome.org/rss10.xml
java jena.sparql \
  --data planet-gnome.xml \
  --query rss.rq --results xml \
  >|planet.xml
xsltproc sparql2timeline.xsl planet.xml \
  | tr '\n' ' '  >|planet.json

The SPARQL query itself is shown in Listing 11. Each Blog post is an RSS item. The first line in the WHERE clause restricts results to news items (blog posts). The subsequent lines select the information about each blog post we are interested in for the SELECT clause.

PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>
PREFIX rss:  <http://purl.org/rss/1.0/>
PREFIX rssc: <http://purl.org/rss/1.0/modules/content/>
PREFIX dc: <http://purl.org/dc/elements/1.1/>

SELECT distinct ?title ?link ?date ?description
WHERE {
  ?x rdf:type rss:item .
  ?x rss:link ?link .
  ?x rss:title ?title .
  ?x dc:date ?date .
  ?x rssc:encoded ?description
}
ORDER BY DESC(?date)

There are a few changes that can be made to the driving HTML file to make viewing the results of blog queries simpler. The first option is to set the default target date to be a few hours before the current time. We shift a few hours back from the current time because the finest granularity time band on the Timeline is hours. This places the most recent posting to the right of the Timeline instead of in the center. The fragment that needs to change revolves around the bandInfos declaration, as shown in Listing 12.

var moveRightOffetInHours = 4;
var gmtd = new Date();
var ms = gmtd.getTime()
   + (gmtd.getTimezoneOffset() * 60000)
   - moveRightOffetInHours *3600000;
var d =  new Date(ms);

var bandInfos = [
  Timeline.createBandInfo({
   eventSource:    eventSource,
   date:           d,
...

One major advantage of using JSON to keep the time events is that they are accessible as a JavaScript array object. To support viewing the output of arbitrary queries, it is convenient to have the JavaScript in the HTML center the display on the most recent time event on the Timeline. Although getting at the date is quite easy, unfortunately, we have to poke around in some private areas of the Timeline API to do this, which requires a call to layout() in order for the Timeline to update its labels to reflect the time change. This is shown in Listing 13. The Timeline is shown in Figure 3.

Figure 3. Planet GNOME on a Timeline