How to Create a Comment Archive Using CSV to Generate HTML

I've been trying to find a workable way to manage my comments for quite some time. By which I mean, the comments that I make on other people's blogs. You need to be able to go back and see if the conversation has progressed. It's also nice just to have a record of what you said and when you said it.

I was using CoComment for a while. This is a service that tracks comments on blogs. It's pretty cool. Trouble is, it only works for the main blogging engines, and you have to install a plugin. I removed all plugins from my Firefox recently because it was acting up, and I'm not keen on reinstalling just at the moment. In any case, the CoComment plugin tended to slow down non-blog sites (looking for comment forms I suppose).

So I've decided on a simpler solution: just have a page on my blog where all my comments are listed in reverse chronological order, with a link back to the relevant blog entry. I can skim through the first few to see if recent conversations have anything new. As for the old conversations, well, I guess I won't know if there are more comments. But that's “good enough” for the time being. The easiest way to build this page is cut-and-paste. Come up with a bit of HTML and copy it for each new entry. Yeah, it has to be done by hand, but hey! The archive of comments is interesting enough to be worth recording.

Here's the comments archive, so you can see what I mean.

Well, you're right, cut-and-paste is such a bad smell. It's better to have your data in a manageable format. So Ricebridge to the rescue! You can put the data into a CSV file and generate the HTML (or rather XHTML) from it. For example, here's a record of some comments:

Date,Blog,Link,Comment
2007-04-10,mariosalexandrou.com, 
  http://www.mariosalexandrou.com/blog/?p=291&c=y, 
  "Hey! I did all that already! Where's my six figures? love it :) "
2007-04-04,Tyner Blain, 
  http://tynerblain.com/blog/2007/04/03/ba-profit-center, 
  "It’s amazing how naming something almost completely defines it."
...

It's just a CSV file. Easy to update by hand. Whenever you make a new comment, throw in the details (date, blog title, link and comment text) at the top of the CSV file.

So then how do we turn this into HTML? Well, here's the HTML I'm producing from this CSV file:

<div class="commentbox">
  <div class="comment">
    <b>
      <span>2007-04-10</span>
      <a href="http://www.mariosalexandrou.com/blog/?p=291&c=y">mariosalexandrou.com</a>
    </b>
    <p>Hey! I did all that already! Where's my six figures? it :) </p>
  </div>
  <div class="comment">
    <b>
      <span>2007-04-04</span>
      <a href="http://tynerblain.com/blog/2007/04/03/ba-profit-center">Tyner Blain</a>
    </b>
    <p>It's amazing how naming something almost completely defines it.</p>
  </div>
</div>

It's a nice little microformat of sorts, I suppose.

To produce this, you need to take the CSV columns and place them into the right positions in the XML format. We're generating XHTML, which is just XML, which is just well-behaved HTML, so this is all cool and froody.

Using XML Manager, you can define a set of XPath expressions to handle this. And here they are:

each row     -> /div/div
'commentbox' -> /div/@class
'comment'    -> @class
Date         -> b/span
Blog         -> b/a
Link         -> b/a/@href
Comment      -> p

This creates a main <div class="commentbox"> containing a set of <div class="comment"> elements, one for each comment. The CSV columns all go into subelements of the comment div.

And here's the code to tie it all together:

CsvManager csvman = new CsvManager();
csvman.getCsvSpec().setStartLine(2);
csvman.getCsvSpec().setIgnoreEmptyLines(true);
List in = csvman.load("data/comment.csv");

RecordSpec rs = new RecordSpec("/html/body/div/div", 
    new String[] { "/html/body/div/@class", "@class", 
      "b/span","b/a","b/a/@href","p"});

List out = new ArrayList();
for( Iterator cI = in.iterator(); cI.hasNext(); ) {
  String[] inrow = (String[]) cI.next();
  String[] outrow = new String[] {"commentbox","comment",
    inrow[0],inrow[1],inrow[2],inrow[3]};
  out.add(outrow);
}

XmlManager xmlman = new XmlManager(rs);
xmlman.save("data/comment.htm",out);

You just load up the CSV, and spit it out again as XML… “there's nothing to it, really…”

And then all you do is dynamically include this file on your web page, and you're done!

tag gen:Technorati Tags: blog comment archive csv html convert Del.icio.us Tags: blog comment archive csv html convert