[TUTORIAL] Juntar mensagens seguidas de um membro no ChatBox

Quem nunca achou chato uma postagem atrás da outra em um ChatBox que atire a primeira pedra... Pensando nisto foi desenvolvido um código que unifica as mensagens seguidas de um mesmo membro, tornando a leitura bem agradável.

--> Tutoriais, dicas e astúcias <--
Juntar mensagens seguidas de um membro no ChatBox

1º - 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 >>

Título Correspondente ao nome da página JavaScript/jQuery que será criada.

Localização- São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. No nosso caso, aplicaremos No índice.

Código JavaScript Campo destinado para receber os códigos JavaScript e jQuery.

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.

2º - Código a ser usado:
Em seguida, cole o código a seguir:

Código:

        /**************************************************************************
        * Module: JS_ChatMSGJoin
        * Description: Join duplicate messages in Chat Box!
        * Author: Made and Optimizations by JScript - 2014/11/02
        * Version: Beta tester only!
        ***************************************************************************/
        jQuery(function() {
            try {
                if (jQuery('#frame_chatbox').length) {
                    if (jQuery('object#frame_chatbox').length) {
                        //  console.log('Replaced by JS_ChatMSGJoin');
                        var sHtml = '<iframe src="/chatbox/index.forum?archives=1" id="frame_chatbox" scrolling="yes" width="100%" height="100%" type="text/html" style="border: 0px;" />';
                        jQuery('#frame_chatbox').replaceWith(sHtml);
                    }
                    // jQuery(window).load(function() {
                    var ChatIframeExist = setInterval(function() {
                        if (document.getElementById("frame_chatbox").contentWindow.document.getElementById('chatbox') !== null) {
                            clearInterval(ChatIframeExist);

                            document.getElementById("frame_chatbox").contentWindow.document.getElementById('chatbox').style.display = 'none';

                            jQuery('#frame_chatbox').contents().find('#chatbox').after('<div id="js-chatbox" increment="10" pageincrement="0" maxpos="325" curpos="188"></div>');
                            // Copy entire CSS style from #chatbox to #js-chatbox id!
                            // Implemented by JScript...
                            var oStyleOrign = document.getElementById("frame_chatbox").contentWindow.document.getElementById('chatbox');
                            var oStyleCopy = document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox');

                            oTarget = document.getElementById("frame_chatbox").contentWindow.getComputedStyle(oStyleOrign, "");
                            for (index = 0; index < oTarget.length; index++) {
                                oStyleCopy.style.setProperty(oTarget[index], oTarget.getPropertyValue(oTarget[index]), null);
                            }

                            document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox').style.display = 'block';
                            document.getElementById("frame_chatbox").contentWindow.refresh_chatbox("?archives=1");

                            var chatbox_updated = 1,
                                chatbox_last_update = 0,
                                oTarget = jQuery('#frame_chatbox').contents().find('#chatbox > p'),
                                iLen = oTarget.length,
                                index = 0;
                            forNext(oTarget, index, iLen);

                            setInterval(function() {
                                try {
                                    if (document.getElementById("frame_chatbox").contentWindow.document.getElementById('chatbox_members').innerHTML !== '') {
                                if (!chatbox_last_update) {
                                  document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox').style.display = 'block';
                                }
                                        chatbox_updated = document.getElementById("frame_chatbox").contentWindow.chatbox_updated;
                                        chatbox_last_update = document.getElementById("frame_chatbox").contentWindow.chatbox_last_update;
                                        if (chatbox_updated !== chatbox_last_update) {
                                            try {
                                                oTarget = jQuery('#frame_chatbox').contents().find('#chatbox > p');
                                                iLen = oTarget.length;
                                                index = 0;

                                                forNext(oTarget, index, iLen);
                                                document.getElementById("frame_chatbox").contentWindow.chatbox_updated = document.getElementById("frame_chatbox").contentWindow.chatbox_last_update;
                                            } catch (e) {
                                                // console.log(e);
                                            }
                                            // console.log('Changes!');
                                        }
                                    } else if (chatbox_last_update) {
                                chatbox_last_update = 0;
                                document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox').style.display = 'none';
                            }
                                } catch (err) {
                                    // console.log(err)
                                }
                            }, 150);
                        }
                    }, 80);
                    // });
                }
            } catch (err) {
                // console.log(err)
            }
        });

        function forNext(oTarget, index, iLen) {
            for (; index < iLen;) {
                var oThis = jQuery(oTarget[index]),
                    sHref = oThis.find('.user > a').attr('href'),
                    oNext = oThis.next();

                if (sHref == undefined) break;

                if (oNext !== undefined) {
                    var sHrefP = oNext.find('.user > a').attr('href');

                    if (sHrefP == sHref) {
                        oThis.find('.msg').append('<div style="border: 1px solid rgb(240, 240, 240);padding: 2px 0;"><span title="">' + oNext.find('span[title]').text() + '</span> * ' + oNext.find('.msg').html() + '</div>');
                        oNext.remove();
                    } else {
                        index++;
                    }
                } else {
                    break;
                }
            }
            document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox').innerHTML =
                document.getElementById("frame_chatbox").contentWindow.document.getElementById('chatbox').innerHTML;
            document.getElementById("frame_chatbox").contentWindow.document.getElementById('js-chatbox').scrollTop = 999999;
        }

• Observações do desenvolvedor
  A atualização do código contém notas do autor.

  JScript escreveu:Funciona em todas as versões e o código confere se já existe um "iframe" do ChatBox, se não existir será criado um!

  
  
• Resultado:
  

  Antes:

  Depois:

---

© Fórum dos Fóruns & JScript

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: Juntar mensagens seguidas de um membro no ChatBox