[TUTORIAL] ChatBox: Avatar e edição de mensagens!

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

[TUTORIAL] ChatBox: Avatar e edição de mensagens!

Mensagem por Dr. em 31/01/15, 05:28 pm





Chatbox


Este tutorial trás para a visão dos administradores, a capacidade de editar mensagens e excluí-las do chatbox. Se tiver direitos administrativos, poderá controlar todas as mensagens, caso contrário poderá mudar somente a sua.


--> Tutoriais, dicas e astúcias <--
Avatar e edição de mensagens!



- Aplicação do código 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 No índice.
               
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ódigo a ser utilizado:
Em seguida, cole o seguinte código em sua página Javascript:
Código:
    /**************************************************************************
     * Module: AVATARChat + JS_EditMsgChat
     * Description: Need?!
     * Author: Made and Optimizations by JScript - 2014/11/23
     * Version: RC2 (Release candidate 2!)
     ***************************************************************************/
    function insertChatBox(chatbox_id, chatbox_url) {
        return insertChatBoxNew(chatbox_id, chatbox_url);
    }

    // Redefine function in frm_lang_xx.js, by JScript Brasil at live dot com!
    function insertChatBoxNew(chatbox_id, chatbox_url) {

        document.getElementById(chatbox_id).innerHTML = '<iframe src="/chatbox/index.forum?archives=1" id="frame_chatbox" scrolling="no" width="100%" height="100%" marginwidth="0" marginheight="0" frameborder="0"></iframe>';

        frames["frame_chatbox"].onload = function() {
            // Redefine function in chatbox7.js, by JScript Brasil at live dot com!
            var JS_search = {
                    //inVar: /">\[(?:(?:2[0-3]|[0-1][0-9]|[0-9]):[0-5][0-9]:[0-5][0-9])\]<\/span>&nbsp;<span class=\"user-msg\">(.+)&Iota;id=(.*?)&Alpha;<(.*?)>&Epsilon;<img (.*?)&Chi;<img (.*?)>&Tau;(.+)&Mu;(.*?)<\/span>/g,
                    //inHtml: /">\[(?:(?:2[0-3]|[0-1][0-9]|[0-9]):[0-5][0-9]:[0-5][0-9])\]<\/span>&nbsp;<span class=\"user-msg\">(.+)[\u0399]id=(.*?)[\u0391]<(.*?)>[\u0395]<img (.*?)[\u03a7]<img (.*?)>[\u039c](.*?)<\/span>/g
                    inVar: /&Iota;id=(.*?)&Alpha;<(.*?)>&Epsilon;<img (.*?)&Chi;<img (.*?)>&Mu;(.*?)<\/span>/g,
                    inHtml: /[\u0399]id=(.*?)[\u0391]<(.*?)>[\u0395]<img (.*?)[\u03a7]<img (.*?)>[\u039c](.*?)<\/span>/g
                },
                // JS_replace = '">[$6]$1<span class="id" id=$2><span class="js-avatar"><$3></span><span class="editor"><img onclick="editor(this, 1)" $4<img onclick="editor(this, 2)" $5></span><span class="text">$7</span>',
                JS_replace = '<span class="id" id=$1><span class="js-avatar"><$2></span><span class="editor"><img onclick="editor(this, 1)" $3<img onclick="editor(this, 2)" $4></span><span class="text">$5</span>',
                oIframe = (document.getElementById("frame_chatbox").contentWindow || document.getElementById("frame_chatbox").contentDocument),
                script = oIframe.document.createElement("script"),
                memDiv = oIframe.document.createElement('div');

            script.type = "text/javascript";
            script.innerHTML =
                'USERNAME = parent._userdata.username;' +
                'SUPERMOD = parent._userdata.user_level;' +
                'AVATAR = parent._userdata.avatar.replace(\'<img src="\', "[img]").replace(\'" alt="" />\', "[/img]");' +
                'JS_search = ' + JS_search.inVar + ';' +
                'JS_replace = \'' + JS_replace + '\';' +
                'function submitmsg(params) {' +
                ' if (document.post.message.value.length < 4 && SUPERMOD !== 1) return false;' +
                ' if (document.post.message.value.indexOf("/") !== 0) {' +
                ' var date = new Date();' +
                ' var UID = Math.ceil(date.getDate() + date.getHours() + Math.random() * Math.pow(10, 10) + date.getMinutes() + date.getSeconds() + date.getMilliseconds());' +
                ' if (UID.length < 10) {' +
                ' UID + "" + (10 - UID.length);' +
                ' }' +
                //' var time = new Date().toLocaleTimeString();' +
                //' document.post.message.value = \'&Iota;id="\' + UID + \'"&Alpha;\' + AVATAR + "&Epsilon;[img]http://goo.gl/brvCui[/img]&Chi;[img]http://goo.gl/k8FZx5[/img]&Tau;" + time + "&Mu;" + document.post.message.value;' +
                ' document.post.message.value = \'&Iota;id="\' + UID + \'"&Alpha;\' + AVATAR + "&Epsilon;[img]http://goo.gl/brvCui[/img]&Chi;[img]http://goo.gl/k8FZx5[/img]&Mu;" + document.post.message.value;' +
                ' }' +
                ' document.post.sent.value = document.post.message.value;' +
                ' document.post.message.value = "";' +
                ' document.post.message.focus();' +
                ' ajax_submit_chatbox(params);' +
                ' return false' +
                '}' +
                'function copy_user_name(user_name) {' +
                ' if (document.post.message) {' +
                ' document.post.message.focus();' +
                ' document.post.message.value += ((user_name.indexOf("@") == 0) ? "" : "@") + user_name + " -> ";' +
                ' }' +
                ' return false' +
                '}' +
                'function ajax_submit_chatbox(params, editor) {' +
                ' number_of_refresh = 0;' +
                ' if (params == "" || params == undefined) {' +
                ' params = "?achives=0"' +
                ' }' +
                ' if (editor == "" || editor == undefined) {' +
                ' var msg_sent = document.post.sent.value;' +
                ' } else {' +
                ' var msg_sent = editor;' +
                ' }' +
                ' var data = "&mode=send";' +
                ' data += "&sent=" + encodeURIComponent(msg_sent);' +
                ' data += "&sbold=" + document.post.sbold.value;' +
                ' data += "&sitalic=" + document.post.sitalic.value;' +
                ' data += "&sunderline=" + document.post.sunderline.value;' +
                ' data += "&sstrike=" + document.post.sstrike.value;' +
                ' data += "&scolor=" + document.post.scolor.value;' +
                ' if ((msg_sent.indexOf("/away") == 0) || (msg_sent.indexOf("/abs") == 0)) {' +
                ' document.getElementById("refresh_auto").checked = false' +
                ' }' +
                ' if (document.post.sent.value == "/banlist") {' +
                ' window.open("/chatbox/chatbox_banlist.forum" + params, "banlist", "toolbar=no,menubar=no,personalbar=no,width=450,height=300,scrollbars=yes,resizable=yes");' +
                ' return false' +
                ' }' +
                ' $.ajax({' +
                ' url: "/chatbox/chatbox_actions.forum" + params,' +
                ' type: "post",' +
                ' data: data,' +
                ' dataType: "script",' +
                ' success: function(response, status, xhr) {' +
                ' if (xhr.status == 200) {' +
                //' if (typeof (chatbox_messages) !== "undefined") {' +
                ' chatbox_messages = chatbox_messages.replace(JS_search, JS_replace);' +
                ' document.getElementById("memdiv").innerHTML = chatbox_messages;' +
                ' hackMsg();' +
                ' document.getElementById("chatbox").innerHTML = document.getElementById("memdiv").innerHTML;' +
                ' /*$("#chatbox").html(chatbox_messages) [0].scrollTop = $("#chatbox").prop("scrollHeight");*/' +
                ' document.getElementById("chatbox").scrollTop = 999999;' +
                //' }' +
                ' if (typeof (chatbox_memberlist) !== "undefined") {' +
                ' document.getElementById("chatbox_members").innerHTML = chatbox_memberlist;' +
                ' /*$("#chatbox_members").html(chatbox_memberlist);*/' +
                ' }' +
                ' }' +
                ' },' +
                ' })' +
                '}' +
                'function ajax_refresh_chatbox(params, force) {' +
                ' if (params == "" || params == undefined) {' +
                ' params = "?achives=0"' +
                ' }' +
                ' $.ajax({' +
                ' url: "/chatbox/chatbox_actions.forum" + params + "&mode=refresh",' +
                ' type: "get",' +
                ' dataType: "script",' +
                ' success: function(response, status, xhr) {' +
                ' if (xhr.status == 200) {' + // || force) {' + <- Fail!
                //'         if ($("#chatbox").length) {' +
                ' if (typeof (chatbox_messages) !== "undefined") {' +
                ' chatbox_messages = chatbox_messages.replace(JS_search, JS_replace);' +
                ' document.getElementById("memdiv").innerHTML = chatbox_messages;' +
                ' hackMsg();' +
                ' document.getElementById("chatbox").innerHTML = document.getElementById("memdiv").innerHTML;' +
                ' document.getElementById("chatbox").scrollTop = document.getElementById("chatbox").scrollHeight + document.getElementById("chatbox").offsetHeight;' +
                ' document.getElementById("chatbox").scrollTop = 999999;' +
                '         }' +
                //'         if (document.getElementById("chatbox_members").innerHTML != null) document.getElementById("chatbox_members").innerHTML = chatbox_memberlist;' +
                ' if (typeof (chatbox_memberlist) !== "undefined") {' +
                ' document.getElementById("chatbox_members").innerHTML = chatbox_memberlist;' +
                ' /*$("#chatbox_members").html(chatbox_memberlist);*/' +
                ' }' +
                ' }' +
                ' },' +
                ' })' +
                '}' +
                'function hackMsg() {' +
                ' var oTarget = jQuery("#memdiv > p"),' +
                ' iLen = oTarget.length,' +
                ' index = 0;' +
                ' for (; index < iLen; index++) {' +
                ' var oThis = jQuery(oTarget[index]),' +
                ' sUserName = oThis.find(".user > a").text(),' +
                ' ID = oThis.find("span.id");' +
                ' if (ID.length == 0) {' +
                ' ID = oThis.find(".msg:last").text();' +
                // XORcipher -> ' ID = XORcipher(oThis.find(".msg").text());' +
                ' var del = ID.match(/^\\/remove[\\u0399](.*?)$/);' +
                // XORcipher -> ' var del = ID.match(/^\\/remove&Iota;(.*?)$/);' +
                ' if (del !== null) {' +
                ' var oMsg = oThis.parent().find("#" + del[1]).closest("p");' +
                ' if (oMsg.length) {' +
                //' if (oMsg.find(".user > a").text() == sUserName || SUPERMOD > 0) {' +
                ' oMsg.remove();' +
                //' }' +
                ' }' +
                ' }' +
                '        var edit = ID.match(/^\\/edit[\\u0399]([0-9]+)[\\u039c](.*?)$/);' +
                // XORcipher -> '         var edit = ID.match(/^\\/edit&Iota;([0-9]+)&Mu;(.*?)$/);' +
                '        if (edit !== null) {' +
                ' var oMsg = oThis.parent().find("#" + edit[1]);' +
                ' if (oMsg.length) {' +
                //' if (oMsg.closest("p").find(".user > a").text() == sUserName || SUPERMOD > 0) {' +
                ' oMsg.find("span.text").text(edit[2]);' +
                //' }' +
                ' }' +
                '         }' +
                '         /*var nudge = ID.match(/^\\/nudge[\\u0399]([0-9]+)[\\u039d](.*?)$/);' +
                '         if (nudge !== null) {' +
                ' var oMsg = oThis.parent().find("#" + nudge[1]);' +
                ' if (oMsg.length) {' +
                ' if (nudge[2] == USERNAME) {' +
                ' // Developing!;' +
                ' }' +
                ' }' +
                '        }*/' +
                ' oThis.remove();' +
                ' } else {' +
                ' if (sUserName !== USERNAME && SUPERMOD == 0) {' +
                ' ID.find(".editor").remove();' +
                ' }' +
                ' }' +
                ' }' +
                '}' +
                'function editor(oThis, num) {' +
                ' if (num == 1 && iConfirm("Tem certeza de que deseja remover esta mensagem?\\n\\n" + jQuery(oThis).closest(".id").text() ) == 1) {' +
                ' ajax_submit_chatbox("?achives=1", "/remove&Iota;" + jQuery(oThis).closest(".id").attr("id"));' +
                ' jQuery(oThis).closest("p").remove();' +
                ' } else if (num == 2) {' +
                ' var result = prompt("Editando a frase:", jQuery(oThis).closest(".id").text());' +
                ' if (result != null) {' +
                ' ajax_submit_chatbox("?achives=1", "/edit&Iota;" + jQuery(oThis).closest(".id").attr("id") + "&Mu;" + result);' +
                ' jQuery(oThis).closest(".id span.text").text(result);' +
                ' }' +
                ' /*} else if (num == 3) {' +
                ' ajax_submit_chatbox("?achives=1", XORcipher("/nudge&Iota;" + jQuery(oThis).closest(".id").attr("id") + "&Nu;" + jQuery(oThis).closest("p").find(".user > a").text()));*/' +
                ' }' +
                '}' +
                /*'function XORcipher(sText) {' +
     ' var key = 2,' +
     ' result = "",' +
     ' len = sText.length,' +
     ' i = 0;' +
     ' for (; i < len; i++) {' +
     ' result += String.fromCharCode(key ^ sText.charCodeAt(i));' +
     ' }' +
     ' return result;' +
     '}' +*/
                'function iConfirm(text) {' +
                ' var iChoice = -1;' +
                ' if (confirm(text) == true) {' +
                ' iChoice = 1;' +
                ' } else {' +
                ' iChoice = 0;' +
                ' }' +
                ' return iChoice;' +
                '}';
            oIframe.document.getElementsByTagName("head")[0].appendChild(script);

            var style = oIframe.document.createElement("style");
     style.type = "text/css";
            style.innerHTML =
                '#chatbox p {' +
                ' background: none repeat scroll 0 0 #fff;' +
                ' border-bottom: 1px solid #e3e3e3;' +
                ' line-height: 1.3em;' +
                ' padding: 5px;' +
                '}' +
                '#chatbox span[title] {' +
                ' color: #8f8f8f !important;' +
                ' float: right !important;' +
                '}' +
                '#chatbox .user:not(:empty) {' +
                ' font-weight: 700;' +
                ' margin-left: 36px !important;' +
                '}' +
                '#chatbox .id {' +
                ' display: block;' +
                ' margin-top: 3px;' +
                '}' +
                '#chatbox .js-avatar img {' +
                ' background: none repeat scroll 0 0 #fff;' +
                ' border: 1px solid #ddd;' +
                ' float: left;' +
                ' height: 30px;' +
                ' margin-right: 5px;' +
                ' margin-top: -19px;' +
                ' max-width: 30px;' +
                ' padding: 1px;' +
                ' vertical-align: middle;' +
                ' width: 30px;' +
                '}' +
                '#chatbox .editor img {' +
                ' cursor: pointer;' +
                ' float: right;' +
                ' padding-left: 4px;' +
                '}' +
                '#chatbox {' +
                ' display: none;' +
                '}';
            oIframe.document.getElementsByTagName("head")[0].appendChild(style);

            var forceConnect = setInterval(function() {
                if (oIframe.document.getElementById("chatbox") !== null) {
                    clearInterval(forceConnect);
                    memDiv.id = 'memdiv';
                    oIframe.document.getElementsByTagName('body')[0].appendChild(memDiv);
                    oIframe.document.getElementById("memdiv").style.display = 'none';
                    oIframe.document.getElementById("memdiv").innerHTML = oIframe.document.getElementById("chatbox").innerHTML.replace(JS_search.inHtml, JS_replace);

                    oIframe.hackMsg();

                    oIframe.document.getElementById("chatbox").innerHTML = oIframe.document.getElementById("memdiv").innerHTML;
                    if (oIframe.document.getElementById('chatbox_option_disco').style.display == 'none') {
                        oIframe.CB_disconnect();
                    }
                    oIframe.document.getElementById("chatbox_option_with_archives").style.display = 'none';
                    oIframe.document.getElementById("chatbox_option_without_archives").style.display = 'none';
                    oIframe.document.getElementById("chatbox").style.display = 'block';
                }
            }, 250);
        };
    }

Feito isso, basta manter seu chatbox ativado de acordo com as instruções passadas no FAQ: http://ajuda.forumeiros.com/-t9192.htm


  • O Javascript funciona no Chatbox?
    O Javascript do fórum não afeta a página /chatbox da maneira que afeta o seu fórum no geral. Queira compreender que para seja funcional, é necessário que o mesmo esteja aplicado exatamente como explicado no tutorial.

  • Resultado:






©️ 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:
Avatar e edição de mensagens!
avatar

Dr.
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 04/02/2013
Mensagens : 2951
Pontos Ativos : 3293

Ver perfil do usuário http://www.casadosnerds.com https://www.facebook.com/MatheusAndreazzi https://twitter.com/nevesandreazzi

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