Idle Hacking

I’ve been doing a lot of thinking about how to use xul templates to generate a nice display of an rss feed. I decided I might be able
to get further using Javascript. In fact after writing a little code
to fetch the rss document and grab the fields in javascript I think
this approach isn’t half bad.

Here’s what I’ve come up with:

// a global array of each RSSFeedvar gFeeds = new Array();
// loads a resource file listing each rss feed we're
// tracking
// TODO: provide a callback for progress
function loadRSSFeeds(){
  // TODO: actually load this info from a file
  loadRSSFeed( gFeeds, "http://kernel.org/kdist/rss.xml", true );
}
// TODO: provide a callback for progress
// load a single RSS Feed, non blocking
function loadRSSFeed( feeds, feedURL, display ){
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function(){
    if( xmlhttp.readyState == 4 && xmlhttp.status == 200 ){
       var feed =  new RSSFeed( xmlhttp.responseXML );
       feeds.push( feed );
       if( display )
         feed.show();
    }
  };
  xmlhttp.open( "GET", feedURL, true );
  xmlhttp.overrideMimeType("text/xml");
  xmlhttp.send(null);
}

// simple helper to extract the firstChild nodeValue from
// a DOM Element
function getFirstChildValue( element, name ){
  return element.getElementsByTagName( name )[0].firstChild.nodeValue;
}
function getFirstChildValueNS( element, ns, name ){
  return element.getElementsByTagNameNS( ns, name )[0].firstChild.nodeValue;
}

// given an RSS DOM object walk it's
// tree and display the content
function RSSFeed( rssDoc ){
  var channel = rssDoc.getElementsByTagName( "channel" )[0];
  this.title = getFirstChildValue( channel, "title" );
  this.link = getFirstChildValue( channel, "link" );
  this.desc = getFirstChildValue( channel, "description" );
  this.lang = getFirstChildValueNS( channel, "http://purl.org/dc/elements/1.1/", "language" );
  this.creator = getFirstChildValueNS( channel, "http://purl.org/dc/elements/1.1/", "creator" );
  this.date = getFirstChildValueNS( channel, "http://purl.org/dc/elements/1.1/", "date" );
  this.show = RSSFeed_show;  this.items = new Array();

  // now walk the items
  var items = rssDoc.getElementsByTagName( "item" );
  for( var i = 0; i < items.length; ++i ){
    this.items.push( new RSSItem( items[i] ) );
  }
}

function RSSItem( rssItem ){
  this.about = rssItem.getAttributeNS( "http://www.w3.org/1999/02/22-rdf-syntax-ns#", "about" );
  this.title = getFirstChildValue( rssItem, "title" );
  //rssItem.getElementsByTagName( "title" )[0].firstChild.nodeValue;
  this.link = getFirstChildValue( rssItem, "link" );
  //rssItem.getElementsByTagName( "link" )[0].firstChild.nodeValue;
  this.desc = getFirstChildValue( rssItem, "description" );
  //rssItem.getElementsByTagName( "description" )[0].firstChild.nodeValue;
  this.show = RSSItem_show;
}

function RSSFeed_show(){
  dump( "RSSFeed\n" );
  dump( "Title:" + this.title + "\n" );
  dump( "Link: " + this.link + "\n" );
  dump( "Desc: " + this.desc + "\n" );
  dump( "Lang: " + this.lang + "\n" );
  dump( "Date: " + this.date + "\n" );

  for( var i = 0; i < this.items.length; ++i ){
   this.items[i].show();
  }
}

function RSSItem_show(){
  dump( "RSSItem\n" );
  dump( "About: " + this.about + "\n" );
  dump( "Title: " + this.title + "\n" );
  dump( "Link: " + this.link + "\n" );
  dump( "Desc: " + this.desc + "\n" );
}

Then I found this document: http://developer.apple.com/internet/webcontent/xmltransformations.html

After reading this I have started to think that it might work nicely to have a default rss style sheet with more of a browser like interface. This needs some more thought...

Anyways, I'm happy to say I finally have my own blog setup! Hopefully, I'll be able to keep this more up to date then my website.

Software DOM, Javascript, RSS, XUL