Generación OPin: Widget Top-Ten comentaristas con Avatar

Hace tiempo que escribí algunos artículos sobre el tema de los widgets sociales y en especial sobre los comentarios y la necesidad de insentivar a los comentaristas. Esta vez voy a compartir el widget Top Comentaristas con Avatar. Este aparato está fabricado con MS-potilas ~ y le da al comentarista la satisfacción de verse reflejado dentro de una competencia inocente que lo posiciona en un ranking de los 10 que más comentan. Como el nombre lo sugiere, este widget muestra una lista de los 10 visitantes que dan la mayoría de los comentarios.

Añadir un elemento de página HTML / JavaScript, y luego copiar el siguiente código :

<div id="topkoment">
<style type="text/css">
.top-commenter-line {margin: 0px;border-top: 1px solid #8D8C8C;border-bottom: 1px solid #E7E7E7;background-color: #CECECE;padding: 2px 3px;}
.top-commenter-avatar {display:inline-block;vertical-align:middle;}
#topkoment {width: 300px;margin: 0 auto;padding: 5px;border: 3px solid #797979;}
#topkoment a {color: #B10C0C;}
.profile-name-link {padding-left: 2px;}
</style>
<script type="text/javascript">
// Top Commentators gadget with avatars, by MS-potilas 2012.
// Gets a list of top commentators from all comments, or specified number of days in the past.
// See http://yabtb.blogspot.com/2012/05/top-commenters-gadget-with-avatars.html

// CONFIG:
var maxTopCommenters   = 10,  // How much?
    minComments        = 1,  // How many comments must top commentator have at least
    numDays            = 0,  // From how many days (ex. 30), or 0 from "all the time"
    excludeMe          = true,  // true: exclude my own comments
    excludeUsers       = ["Anonymous", "someothertoexclude"],  // Exclude these usernames
    maxUserNameLength  = 42,  // 0: don't cut, >4: cut usernames
    txtTopLine         = '<div style="font-weight:bold;display:inline-block;width:2em;text-align:right;">
<b>[#].</b></div>
[image] [user] ([count])',  // List number
    txtNoTopCommenters = 'No top commentators at this time.',
    txtAnonymous       = '',  // Empty, or Anonymous user name localized if you want to localize
    sizeAvatar         = 32,  // Avatar size
    cropAvatar         = true,
    urlNoAvatar        = 'http://lh4.googleusercontent.com/-069mnq7DV_g/TvgRrBI_JaI/AAAAAAAAAic/Iot55vywnYw/s' + sizeAvatar + '/avatar_blue_m_96.png',  // http://www.blogger.com/img/avatar_blue_m_96.png resizeable
    urlAnoAvatar       = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar,
    urlMyProfile       = '',  // Set if you have no profile gadget on page
    urlMyAvatar        = '';  // Can be empty (then it is fetched) or url to image
// END CONFIG
// for old IEs & IE modes
if(!Array.indexOf) { 
 Array.prototype.indexOf=function(obj) {
  for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
  return -1;
}}
function replaceTopCmtVars(text, item, position)
{
  if(!item || !item.author) return text;
  var author = item.author;

var authorUri = "";
  if(author.uri && author.uri.$t != "")
    authorUri = author.uri.$t;

var authorName = author.name.$t;
  if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
    authorName = txtAnonymous;
  var imgcode = '<img class="top-commenter-avatar" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
  if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';

if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
    authorName = authorName.substr(0, maxUserNameLength-3) + "...";
  var authorcode = authorName;
  if(authorUri!="") authorcode = '<a class="profile-name-link" href="'+authorUri+'">'+authorcode+'</a>';

text = text.replace('[user]', authorcode);
  text = text.replace('[image]', imgcode);
  text = text.replace('[#]', position);
  text = text.replace('[count]', item.count);
  return text;
}

var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
  var one_day=1000*60*60*24
  var today = new Date();

if(urlMyProfile == "") {
    var elements = document.getElementsByTagName("*");
    var expr = /(^| )profile-link( |$)/;
    for(var i=0 ; i<elements.length ; i++)
      if(expr.test(elements[i].className)) {
        urlMyProfile = elements[i].href;
        break;
      }
  }

if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
    var entry = json.feed.entry[i];

if(numDays > 0) {
      var datePart = entry.published.$t.match(/\d+/g); // assume ISO 8601
      var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);
  
      //Calculate difference btw the two dates, and convert to days
      var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
      if(days > numDays) break;
    }

var authorUri = "";
    if(entry.author[0].uri && entry.author[0].uri.$t != "")
      authorUri = entry.author[0].uri.$t;

if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
      continue;
    var authorName = entry.author[0].name.$t;
    if(excludeUsers.indexOf(authorName) != -1)
      continue;

var hash=entry.author[0].name.$t + "-" + authorUri;
    if(topcommenters[hash])
      topcommenters[hash].count++;
    else {
      var commenter = new Object();
      commenter.author = entry.author[0];
      commenter.count = 1;
      topcommenters[hash] = commenter;
    }
  }

if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200) {
    ndxbase += 200;
    document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');

return;
  }

// convert object to array of tuples
  var tuplear = [];
  for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);

tuplear.sort(function(a, b) {
    if(b[1].count-a[1].count)
        return b[1].count-a[1].count;
    return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
  });

// list top topcommenters:
  var realcount = 0;
  for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
    var item = tuplear[i][1];
    if(item.count < minComments)
        break;
    document.write('<di'+'v class="top-commenter-line">');
    document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
    document.write('</d'+'iv>');
    realcount++;
  }
  if(!realcount)
    document.write(txtNoTopCommenters);
}
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></' + 'script>');
</script>
</div>

Guardar
Algunos parámetros y su utilidad:

Opción	información
maxTopCommenters	Máximo comentarios que aparecen
minComments	El número mínimo de comentarios
numDays	El número del día del juicio final para los comentarios : por ejemplo, 30 significa contará comentarios de 30 días. 0 significa contar todos los comentarios
excludeMe	Si es true, no va a mostrar los comentarios del administrador (dueño del blog), si es false calculará los comentarios del dueño del blog (admin)
excludeUsers	Quién no quieres que sea contado, por ejemplo comentarios: Anonymius
maxUserNameLength	Longitud máxima del nombre, seleccionar 0 si se desea mostrar el nombre completo
txtTopLine	formato de la lista: [#] [image] [user] [count], [#]que muestra la numeración, [image] mostrar avatar, [user] el nombre de los comentarios dador, [count] número de observaciones
txtNoTopCommenters	Mensajes que aparecen cuando hay comentarios
txtAnonymous	si desea cambiar el nombre de un anónimo, por lo demás vacío
sizeAvatar	el tamaño del avatar
cropAvatar	si se corta verdadera imagen del avatar, si no falsa imagen de avatar cortar
urlNoAvatar	url si el donante no tiene avatar comentario
urlAnoAvatar	URL de la imagen de anónimo
urlMyProfile	url para tus propias fotos de perfil, escriba la dirección URL si usted no tiene un perfil de avatar
urlMyAvatar	url avatar del propietario del blog, podría ser vaciadas si ya existe o especificar la URL de la imagen en sí