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.
Conectar-se

Esqueci minha senha

Últimos assuntos
» [Ajuda] HTML & CSS
Hoje à(s) 01:20 pm por Luiz

» Gif na foto do perfil
Hoje à(s) 01:19 pm por Luiz

» Status do servidor
Hoje à(s) 01:04 pm por Ketholy123

» Concurso do Dia das Bruxas: Vossas participações
Hoje à(s) 02:16 am por GutaUKP

» STAFF ONLINE Widgets
Ontem à(s) 11:04 pm por Luiz

» Grupos de usuarios
Ontem à(s) 09:06 pm por Gaaratsu

» Erro ao colocar barra de estatisticas
Ontem à(s) 08:21 pm por Luiz

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
loveshubby26
 
Ketholy123
 
Luiz
 
GutaUKP
 
xDominiC_.
 

Quem está conectado
216 usuários online :: 6 usuários cadastrados, 1 Invisível e 209 Visitantes :: 2 Motores de busca

DustyRhodes, Guzonaro, Holkis, iScroll, Ketholy123, Luiz

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

[TUTORIAL] Códigos para personalizar o seu chatbox

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

[TUTORIAL] Códigos para personalizar o seu chatbox

Mensagem por Shek em 11/04/15, 08:26 pm




 

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
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 16949
Pontos Ativos : 21272

Ver perfil do usuário http://www.shiftactif.com https://go.topicit.net/ZosT/61pMt1mPsG 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