Informações:
Autor: Sliw
Funcionalidade: PunBB

---

Nesse Tutorial iremos ensinar como por estatísticas referente ao chatbox.

Acesse:

Painel de Controle ☛ Modulos ☛ Html e Javascript ☛ Gestão dos codigos Javascript

Crie um novo Javascript com investimento no indice com esse codigo:

Código:

;$(window).load(function(){
 
  var messages = ~~$("#frame_chatbox").contents().find('.user-msg .user').length;
  var online = ~~$("#frame_chatbox").contents().find('.online-users li').length;
  var absent = ~~$("#frame_chatbox").contents().find('.away-users li').length;
  var infos =
      '<div class="chat-infos">' +
      '  Total de mensagens: <span class="chat-info chat-info-messages">' + messages + '</span>' +
      '  Total de usuários: <span class="chat-info chat-info-online">' + parseInt(online + absent) + '</span>' +
      '  Total de usuários ausentes: <span class="chat-info chat-info-absent">' + absent + '</span>' +
      '  Total de usuários online: <span class="chat-info chat-info-total">' + online + '</span>' +
      '</div>';

  $(".chatbox").after(infos);

  setInterval(function(){
      $('.chat-info-messages').html($("#frame_chatbox").contents().find('.user-msg .user').length);
  }, 2000);

});

Feito isto acesse:

Painel de Controle ☛ Visualização ☛ Imagens e Cores ☛ Cores ☛ Folha de Estilo

Adicione esse codigo CSS em sua folha de estilo:

Código:

/* Chat infos */
.chat-infos{
  font-size: 1.2em;
  padding: 1em .4em .4em;
  text-align: center;
}
.chat-info{
  background: #eee;
  padding: .1em .7em;
  border-radius: 3px;
}

Resultado: