Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Conectar-se

Esqueci minha senha

Últimos assuntos
» Fundo do tópico
Hoje à(s) 11:02 por Luiz~

» Borda do Perfil
Hoje à(s) 10:47 por Luiz~

» Existe maneira de adulterar o sistema de login?
Hoje à(s) 7:00 por juleic1123

» "Erro Geral: Could not insert struct portal table"
Hoje à(s) 5:43 por juleic1123

» Widget TeamSpeak3
Hoje à(s) 4:57 por HittFire

» [Sugestão] Mensagem automática ao mover tópico
Hoje à(s) 2:46 por VitorC.

» Nome do usuário
Hoje à(s) 2:37 por Biel_Staff

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Quem está conectado
181 usuários online :: 3 usuários cadastrados, Nenhum Invisível e 178 Visitantes :: 2 Motores de busca

HittFire, Luiz~, SarkZKalie

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

[TUTORIAL] Códigos para personalizar o seu chatbox

Novo Tópico   Responder ao tópico

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[TUTORIAL] Códigos para personalizar o seu chatbox

Mensagem por Shek Crowley em Dom 12 Abr 2015 - 0:26




 

Chatbox


Com a chegada das novas mudanças do Chatbox, você poderá corrigir alguns códigos que já não funcionam mais devido à essa nova atualização. Os códigos abaixo são de alguns respectivos tutoriais que já encontram-se desativados no fórum de tutoriais.


- Aplicação do javascript:
As páginas javascript ativas em seu fórum possibilita inserir scripts e jquery para personalizar seu fórum, contudo é importante saber que qualquer script encontrado na internet acabam por não surgir efeito nos fóruns.

Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts >>
Seta Título Correspondente ao nome da página JavaScript/jQuery que será criada.
Seta Localização- São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. No nosso caso, aplicaremos Em todas as páginas ou no local que você desejar.
Seta Código JavaScript Campo destinado para receber os códigos JavaScript e jQuery.
Seta Habilitar o gerenciamento dos códigos JavaScript Ao selecionar a opção sim, estará ativando a função páginas Javascript no seu fórum. Se selecionar não, as páginas serão desabilitadas no fórum.

- Códigos & correções:
Temos uma lista de códigos que foram corrigidos de acordo com a nova estrutura do Chatbox. Por isso, os usuários que tem um código antigo podem simplesmente alterá-lo.

Efeito sonoro no chatbox

Ao receber novas mensagens, você ouve um som a escolha do Administrador. O tutorial Efeito sonoro no chatbox recebe um novo código, que já pode ser aplicado:
Código:
   window.localStorage && $(window).load(function() {
      var chatbox_script = function() {
        var sounds = {
          'future': 'http://illiweb.com/fa/fdf/future.mp3',
          'hal': 'http://illiweb.com/fa/fdf/hal.mp3',
          'secret': 'http://illiweb.com/fa/fdf/secret.mp3',
          'zelda': 'http://illiweb.com/fa/fdf/zelda.mp3'
        };
        var default_sound = sounds['zelda'];
        var default_freq = 'new';
        var default_when = 'once';
        var default_volume = 100;

    
        if(localStorage.cb_sound && !localStorage.cb_sound.indexOf('https://dl.dropboxusercontent.com/u/181621985/')) localStorage.removeItem('cb_sound');
        var a = document.createElement('audio');
        if(!a.canPlayType) return;
        a.volume = Math.min(1, Math.max(0, localStorage.cb_volume||(default_volume/100)));
    
        var origin_send = Chatbox.prototype.send;
        Chatbox.prototype.send = function(params) {
          var m = $.trim($("#message").val());
          if(m.indexOf('/sound')&&m.indexOf('/soudn'))
            return origin_send.call(this, params);
          m = $.trim(m.substr(6)).split(/\s+/,3);
          var bad_apple = false;
          switch(m[0].toLowerCase()) {
            case "":
              if(!a.src) {
                a.src = localStorage.cb_sound||default_sound;
                a.load();
            }
              a.play();
              break;
            case "all":
            case "new":
              localStorage.cb_freq = m[0]; break;
            case "always":
            case "off":
            case "on":
            case "once":
            case "never":
              localStorage.cb_when = m[0]; break;
            case "stop":
              if(!a.paused) a.pause();
              if(!a.ended) a.currentTime = 0;
              break;
            case "pause":
              if(!a.paused) a.pause();
              break;
            case "volume":
              if(m.length>1) {
                localStorage.cb_volume = Math.min(1, Math.max(0, parseFloat(m[1].replace(',','.'))/100));
                a.volume = localStorage.cb_volume;
                break
              }
            default:
              bad_apple = true;
          };
          if(bad_apple) {
            if(m[0] in sounds) {
              m[0]= sounds[m[0]];
            }
            if(m[0]=="default") {
              m[0]=default_sound;
              localStorage.removeItem('cb_sound');
              localStorage.removeItem('cb_freq');
              localStorage.removeItem('cb_volume');
              localStorage.removeItem('cb_when');
              a.volume = Math.min(1, Math.max(0, default_volume/100));
            }
            if(/^https?:\/\/.+/.test(m[0])) {
              localStorage.cb_sound = m[0];
              a.pause();
              a.src = m[0];
              a.load();
              a.play();
            } else {
              var message = $('#message').val();
              alert('/sound [all | new]\n/sound [always | off | on | once | never]\n/sound [stop | pause]\n/sound default\n/sound volume 0-100\n/sound ['+$.map(sounds,function(_,k){return k}).join(' | ')+']\n/sound [http://* | https://*]');
              setTimeout(function(){ $("#message").val(message).select().focus(); }, 100);
              return;
            }
          }
          return $("#message").val('').focus();
        };

        $(window).on("focus", function(){ localStorage.removeItem('cb_once'); localStorage.removeItem('cb_blurred') }).on("blur", function(){ localStorage.cb_blurred=1; });

        var play_sound = function(){
          if(a.paused || a.ended) {
            a.currentTime=0;
            if(!a.src) {
              a.src = localStorage.cb_sound||default_sound;
              a.load()
            }
            a.play()
          }
        };
        var overrided = Chatbox.prototype.refresh;
        Chatbox.prototype.refresh = function(data) {
          if (data.messages && data.messages.length) {
            var lm = data.messages.slice(-1)[0];
            var last_message = lm.time+','+lm.action+','+lm.msg;
            if(this.last_message_sound != last_message) {
              var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
              user = user.length ? user[0] : [{}];
              if(this.last_message_sound!==undefined) {
                var freq = (localStorage.cb_freq||default_freq);
                var when = (localStorage.cb_when||default_when);
                console.log([when, freq, localStorage.cb_blurred, localStorage.cb_once]);
                if(when != "never" && (when != "off" || localStorage.cb_blurred) && (when != "on" || !localStorage.cb_blurred) && (when != "once" || (localStorage.cb_blurred && !localStorage.cb_once))) {
                  console.log([when, freq, localStorage.cb_blurred, localStorage.cb_once]);
                  if(freq =="all" || (lm.userId!=chatbox.userId && user.username!=lm.username)) {
                    if(when!="once" || !localStorage.cb_once) {
                      play_sound();
                      localStorage.cb_once = 1;
                    }
                  }
                }
              }
              this.last_message_sound = lm;
            }
          }
          overrided.call(this, data);
        };
      };
      var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";jQuery('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{jQuery(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });
Assim que aplicar, saiba que há uma série de mudanças que deve ser feito. default_sound corresponde a pasta com o áudio ou URL da mesma.

Notificações na barra de títulos

Este tutorial ainda não está disponível. A nossa equipe de suporte estaria lançando um código funcional na versão antiga do chatbox no pacotão anterior, contudo, devido a atualização nós decidimos não lançar. Agora, é possível mudar o título da página ao receber novas mensagens no chat.

Código:
   window.localStorage && $(window).load(function() {
      var chatbox_script = function() {
        var t_icon = window.top.$.find('link[rel="shortcut icon"]')[0];
        var t_doc = window.top.document;
        var title = t_doc.title;
        var icon = t_icon.getAttribute('href');

        var rep_title = '!! New message !! '+title;
        var rep_icon = 'http://s301826463.onlinehome.fr/f/al.ico';

        $(window).on("focus", function(){ localStorage.cb_blurred='' }).on("blur", function(){ localStorage.cb_blurred=1; });
        var overrided = Chatbox.prototype.refresh;
        Chatbox.prototype.refresh = function(data) {
          if (data.messages && data.messages.length) {
            var lm = data.messages.slice(-1)[0];
            var last_message = lm.time+','+lm.action+','+lm.msg;
            if(this.last_message != last_message) {
              var user = $.grep(data.users, function(v){return v.id==chatbox.userId});
              user = user.length ? user[0] : [{}];
              if(this.last_message!==undefined) {
                if(lm.userId!=chatbox.userId && user.username!=lm.username) {
                  if(localStorage.cb_blurred) (function(){
                    var blink = function(){
                      if(title == t_doc.title) {
                        if(!localStorage.cb_blurred) return;
                        var new_title = rep_title;
                        var new_icon = rep_icon;
                      } else {
                        var new_title = title;
                        var new_icon = icon;
                      }
                      t_doc.title = new_title;
                      var new_t_icon = t_icon.cloneNode(true);
                      new_t_icon.setAttribute('href', new_icon);
                      var t_icon_parent = t_icon.parentNode;
                      t_icon_parent.removeChild(t_icon);
                      t_icon_parent.appendChild(new_t_icon);
                      t_icon = new_t_icon;
                      setTimeout(blink, 500);
                    };
                    blink();
                  })();
                } else {
                  localStorage.cb_blurred='';
                }
              }
              this.last_message = lm;
            }
          }
          overrided.call(this, data);
        };
      };

      var
    s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });

Alterar o título do chatbox

Altere o valor do código MEU_TEXTO_AQUI para definir um título para o chatbox:
Código:
   $(window).load(function() {
      var chatbox_script = function() {
        $("a.chat-title").text("MEU_TEXTO_AQUI");
      };

      var
    s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });

Remover linhas "... conectado ao chatbox" e "... desconectado do chatbox"

Com este novo código você pode retirar as mensagens padrão .. foi desconectado... e ... se juntou ao chat em...:


Código:
   $(window).load(function() {
      var chatbox_script = function() {
        $('#chatbox > p > .msg > span').filter('[style="color:green"],[style="color:red"]').closest('p').remove();
        var overrided = Chatbox.prototype.refresh;
        Chatbox.prototype.refresh = function(data) {
          if (data.messages && data.messages.length) {
            data.messages = $.grep(data.messages, function(v) {
              return v.userId != -10 || $.inArray(v.msgColor, ["red", "green"]) == -1;
            });
          }
          overrided.call(this, data);
        };
      };

      var
    s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });

Abrir "Pasta de Arquivos" em nova aba

Ao clicar no link Arquivos abre em uma nova guia em vez de recarregar a página. Ele é especialmente útil quando se utiliza outros scripts (que não funcionam mais depois de clicar Arquivos).

Código:
   $(window).load(function() {
      var chatbox_script = function() {
        $("#chatbox_option_with_archives a").attr('target', 'ChatBox');
      };
      var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });

Adicionar mensagem de LOGIN personalizada

Já pensou fazer isso? Bem, é possível sim! Adicionar uma mensagem personalizada quando o usuário se conecta ao chatbox.


Código:
   $(window).load(function() {
      var chatbox_script = function() {
        $('#chatbox_option_co').click(function(){
          $('#chatbox').addClass('recently-connected');
          setTimeout(function(){ $('#chatbox').removeClass('recently-connected') }, 60000)
        })
      };
      var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });
Em seguida, acesse Painel de Controle >> Visualização >> Imagens e Cores > Cores > Folha de estilos CSS > e adicione este CSS:
Código:
   #chatbox.recently-connected:after {
      font-family: "trebuchet ms", serif;
      font-size: 1.5em; line-height:1.5em; font-weight: bold; color: #8BC34A;
      box-shadow:0 0 5px #AED581; display:block; background: #F1F8E9; margin:auto;
      width:80%; margin:1.5% auto; padding:1%; white-space: pre;
      content: "Bem vindo ao chatbox do fórum de suporte Forumeiros!!";
    }
Você poderá modificar o texto "Bem vindo ao chatbox do fórum de suporte Forumeiros!!" pelo texto de seu gosto.

Mudar prefixo do Moderador

Este script irá substituir ou remover o @ antes do nome de um moderador chatbox:


Código:
   $(window).load(function() {
      var chatbox_script = function() {
        var overrided = Chatbox.prototype.refresh;
        Chatbox.prototype.refresh = function(data) {
          overrided.call(this, data);
          $('.chatbox-username').each(function(){
            this.previousSibling&&$.trim(this.previousSibling.nodeValue)=="@"&&$(this.previousSibling).replaceWith('<img src="http://i.imgur.com/zICIAne.png" /> ')
          })
        };
      };
      var s=document.createElement('script');s.text="("+chatbox_script.toString()+")();";$('object[data^="/chatbox/index.forum"],iframe[src^="/chatbox/index.forum"]').each(function(){try{$(this.contentDocument||this.contentWindow.document).find("#chatbox").closest("html").find("head").first().each(function(){this.appendChild(s.cloneNode(true))})}catch(a){}})
    });

Você pode substituir <img src = "http://i.imgur.com/zICIAne.png" /> pela imagem de sua escolha ou um texto vazio se você quer ele seja removido.

Conexão automática

Atualizamos o tutorial de conexão automática. Você poderá consultá-lo neste endereço: http://ajuda.forumeiros.com/t95430-




© Fórum dos Fóruns


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Códigos para personalizar seu chatbox atual
avatar

Shek Crowley
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 15861
Pontos Ativos : 23384

http://www.shiftactif.com https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum