Singpolyma

Technical Blog

coComment JSONP

Posted on

coComment is a new service like Commentosphere that helps you tracks your comments/conversations across the web. If you haven’t heard of coComment yet check out Johan’s article at Ecmanaut.

One of the features missing from coComment has been JSON(P) feeds of data. They have a ‘blog box’ JavaScript include, but it is limitedly customisable. So, frustrated with the way it did work, but still wanting to display my coComment data in my sidebar like I have been doing with Commentosphere, I created a hack that generates JSONP feeds for coComment.

Using the script is simple. You pass the URL to the JavaScript for a customised blog box on coComment to the script, along with optionally the name of a callback function (using ‘&callback’). You can tack on ‘&raw’ to make it output raw JSON data. If no callback is specified and you do not specify raw data it will check to see if you have a coComment.callbacks objects with a comments function and call that. The URL is:
http://comment.ning.com/cocomment/json.php?url=URLtoBLOGBOX

If you want a sidebar element, or just some example JavaScript code to work with, here is what I use. Put this in your <head> section:

<script type=”text/javascript”>
//<![CDATA[
var list_cocomment_limit = NUMBER OF CHARACTERS;
var list_cocomment_id = “cocomment”;
var list_cocomment_url = “URL TO BLOG BOX“;
function list_cocomment_callback() {
val = ”;
val += ‘<ul class=”cocomment”>’;
for(var i=0; i<coComment.comments.length; i++) {
val += ‘ <li><a href=”‘+coComment.comments[i].articlelink+'”>’+coComment.comments[i].body.substr(0,list_cocomment_limit)+’…</a></li>’;
}//end for
val += ‘</ul>’;
val += ‘<a href=”‘+coComment.url+'”>More</a> on <a href=”http://www.cocomment.com;;
item = document.getElementById(list_cocomment_id);
item.innerHTML = val;
}//end function list_cocomment_callback
coComment = {};
coComment.callbacks = {};
coComment.callbacks.comments = list_cocomment_callback;
function list_cocomment() {
coComment = {};
coComment.callbacks = {};
coComment.callbacks.comments = list_cocomment_callback;
var thescript = document.createElement(“script”);
thescript.type = “text/javascript”;
thescript.src = ‘http://comment.ning.com/cocomment/json.php?url);
document.body.appendChild(thescript);
}//end function list_cocomment
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != ‘function’) {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}//end if
}//end function addLoadEvent
addLoadEvent(list_cocomment);
//]]>
</script>

And in your sidebar put ‘<div id=”cocomment”><i>Loading…</i></div>‘.

One Response

Johan Sundström

The trusty DIY of feeds JSONPification. 🙂 Love it. Now if we only show a few great examples of the endless customizability of the result, I’m sure they will budge too, offering upstream JSONP support too. 🙂

Leave a Response