Cool little comment count Java Script
I wrote a script today to redo Vindy.com’s current way of displaying the number of comments on a story (on the most commented block).
Previously it would grab an image which was named with the number (of which there were that many comments).
It would look kind of like this: <img src=”image/directory/<? comment_count ?>.gif”/> and print an image with that name. This example using PHP short hand style tags. It would display an image the output would look kind of like this:
<img src=”image/directory/213.gif”/>
This method is fine if you are OK with having hundreds of gifs in your image folders that you have to change when colors on your site are considered old and need re-done. Images like this one:
would have to have 214 others before it and more after it if you had a very popular discussion going on.
Now that number (of comments) is passed to a JavaScript and processed as a string.
I was able to create 12 images that do what I had hundreds of images doing before:
I created this using the following principals:
- JavaScript automatically determines the length of a string (used for the for loop)
- JavaScript has a string.charAt() function which prints just one character at a point in the string.
- Looping through the string version of the number lets you print one character at a time until the string ends
What this allowed me to do is call individual digit images instead of the number 123.gif getting referenced for a story with a hundred and twenty-three comments, I was able to break it up to something like this:
startscript{ define string variable; print start_image.gif print individual digit images in javascript loop ending in string.length {1.gif 2.gif 3.gif} print end_image.gif }endjavascript
My LinkedIn Profile 
My Photostream
My facebook (for friends and family)