Wulf's Webden

The Webden on WordPress

Updates to jQuery Comments Script

I have been using my new comments concept – using some javascript to help me piggy back onto the back of my Flickr photos – for a month or so now. In most respects, I’m very happy with it but it has been quite demanding adding a photo id, secret and server number to the end of each posting. The whole point of using some scripting is to get the computer to do all the hard work, not to slow me down with another set of tasks as I set about my daily blogging.

Therefore, I have delved a bit deeper into the Flickr API and reworked the script that lives back on the server so that it only needs the photo id (eg. id=”flickr-33914938-6232fa9c0f-22″). It then makes two calls to Flickr; the first gets the secret and server number and the second finds out how many comments have been made on it.

Here is the server script (written in PHP):

$method = “flickr.photos.getInfo”;
$apikey = “INSERT YOUR API KEY HERE“;
$photo = $_POST[“photo_id”];

// First, get secret and server for image id
$api = “http://api.flickr.com/services/rest/”;
$api .= “?method=$method&api_key=$apikey&photo_id=$photo”;
$curl = curl_init();
curl_setopt ($curl, CURLOPT_URL, $api);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
$result = curl_exec ($curl);
curl_close ($curl);
$aPos[0] = strpos($result,”secret=””) + 8;
$aPos[1] = strpos($result,”” server”) – $aPos[0];
$aPos[2] = strpos($result,”server=””) + 8;
$aPos[3] = strpos($result,”” farm”) – $aPos[2];
$secret = substr($result,$aPos[0],$aPos[1]);
$server = substr($result,$aPos[2],$aPos[3]);

// Now get number of comments
$method = “flickr.photos.comments.getList”;
$api = “http://api.flickr.com/services/rest/”;
$api .= “?method=$method&api_key=$apikey&photo_id=$photo”;
$curl = curl_init();
curl_setopt ($curl, CURLOPT_URL, $api);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
$result = curl_exec ($curl);
curl_close ($curl);
$comments = substr_count($result,”<comment id”);

// Finish by writing comment
echo “t<a href=”http://www.flickr.com/photos/FLICKR USER ID HERE/$photo/”>”;
echo “<img src=”http://static.flickr.com/$server/$photo”;
echo “_”.$secret.”_s.jpg” “;
echo “title=”Click here to add a comment” alt=”Comment Link” /></a>n”;
echo “t<p>There “;
if ($comments == 1) {
echo “is 1 comment “;
} else {
echo “are $comments comments “;
}
echo “on this post. Want to add something? Click on the picture “;
echo “to add a comment and join the conversation about this “;
echo “posting.</p>n”;
echo “t<p>(Nb. Flickr or Yahoo! account required)</p>n”

That’s longer than the script I was calling before, because of the extra API call. However, the jQuery driven javascript can be condensed by several more lines:

$(document).ready(function() {
  $(“div.flickrcomment”).each(function(){
    var aFlickr = this.id.split(“-“);
    var sPicID = aFlickr[1];
    $(this).load(“http://www.web-den.org.uk/scripts/flickrgrab.php”,
      {photo_id:sPicID},function(){
        $(this).show(2000);
      }
    );
  });
});

I think that is why jQuery claims to put the fun back into javascript – such incredible power in such short and simple code!

Want to add something? Please join the conversation about this posting (nb. Flickr or Yahoo! account required).

Technorati Tags:

Comments are closed.