Sunday, March 11, 2007

Using JSON to access Google data

Google supports JSON format data for most services, including Google Reader shared items. I just tried to use JSON to read the entries from my shared items in Google Reader, and display them in the sidebar of index page using the native CSS. The code is as follows.


<div class="module-info module">
  <h2 class="module-header">
    My reading</h2>
  <div id="reading" class="module-content">
  </div>
</div>
<script>
function listEntries(root) {
var html = ['<ul class="module-list">'];
for (var i = 0; i < root.items.length; ++i) {
var entry = root.items[i];
var title = entry.title;
var link = entry.alternate.href;
html.push('<li class="module-list-item">',"<a href=\""+link+"\" target= \"_blank\">"+title+"</a>", '</li>');
}
document.getElementById("reading").innerHTML = html.join("");
}
</script>
<script src="http://www.google.com/reader/public/javascript/user/00357859579464014466/state/com.google/broadcast?n=5&callback=listEntries">
</script>