Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

ChatBox - Versão atual!

+6
TiagoDJ7
FrOsTyXi
GyGu
waghcwb
JScript
Dark-Avenger
10 participantes

JScript JScript  • Qui 5 Fev 2015 - 10:06

ChatBox - Versão atual! Empty ChatBox - Versão atual! Qui 5 Fev 2015 - 10:06

Reputação da mensagem: 100% (1 votos)
Olá pessoal!

Eu estive verificando como está a estrutura atual do response dessa nova versão do chatbox e fiquei surpreso com o conteúdo que agora está em formato JSON!!!

Isso mesmo, agora está mais profissional e com isso já podemos ter certeza de que o avatar nas postagens está mais próximo do que imaginamos...

Vejam abaixo o formato retornado pela função initListening():
Código:

{
    "url": "http:\/\/f36.dnspro.org\/sub\/cb.366bc21",
    "lastModified": "Thu, 05 Feb 2015 12:23:56 GMT",
    "tag": "0"
}

Agora o retorno da url [Tens de ter uma conta e sessão iniciada para poderes visualizar este link] <- esse final eu acho que é relativo ao meu fórum...
Código:

{
    "channel": "cb.366bc21",
    "text": "init",
    "tag": "0",
    "time": "Thu, 05 Feb 2015 12:23:56 GMT"
}

E por fim, o retorno das postagens pelo prototype get():
Código:

{
    "connected": true,
    "messages": [{
        "userId": "-10",
        "msg": "Messages cleared by JScript",
        "time": "1423140436",
        "username": "JScript",
        "action": "clear",
        "chat_level": null,
        "user_level": null,
        "date": "05 Feb 2015",
        "datetime": "05:47:16 05\/02\/2015"
    }, {
        "userId": "1",
        "msg": "<span style=\"color: #222222\">Test 01<\/span>",
        "time": "1423140440",
        "username": "JScript",
        "action": "msg",
        "chat_level": "2",
        "user_level": "1",
        "date": "05 Feb 2015",
        "datetime": "05:47:20 05\/02\/2015",
        "user": {
            "color": "#000099",
            "admin": true
        }
    }],
    "users": {
        "1": {
            "online": true,
            "id": "1",
            "username": "JScript",
            "admin": true,
            "userLebel": "1",
            "chatLevel": "2",
            "color": "#000099"
        }
    }
}

Percebam que está bem estruturado e que para termos o avatar, falta bem pouco...

Meu código foi aceito, vejam: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Alguém quer comentar algo?

JS


Última edição por JScript em Ter 17 Fev 2015 - 11:18, editado 1 vez(es)

Dark-Avenger Dark-Avenger  • Qui 5 Fev 2015 - 10:31

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qui 5 Fev 2015 - 10:31

Olá [Tens de ter uma conta e sessão iniciada para poderes visualizar este link],
No novo chatbox estão lá as habilidades sobre avatar, editar / apagar mensagens Caixa de mensagens como seu módulo similar?

JScript JScript  • Qui 5 Fev 2015 - 10:46

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qui 5 Fev 2015 - 10:46

Reputação da mensagem: 100% (1 votos)
A estrutura está toda preparada, só faltam os itens que tornarão isso possível...

JS

JScript JScript  • Qui 5 Fev 2015 - 14:28

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qui 5 Fev 2015 - 14:28

Bem, enquanto a nova versão do chat box ainda está em constante desenvolvimento pela equipe de técnicos da forumeiros, adicionar o avatar nesta versão está mais fácil ainda!!!

Quem desejar testar, basta adicionar o código abaixo com investimento apenas no índice:

Link para o novo código: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

JS


Última edição por JScript em Sex 13 Fev 2015 - 18:35, editado 1 vez(es)

FrOsTyXi FrOsTyXi  • Sex 6 Fev 2015 - 23:27

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Sex 6 Fev 2015 - 23:27

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] Eu testar isso e ainda questões Vou esperar por código final obrigado por seu trabalho em vão , este é um ótimo sistema de chat!

waghcwb waghcwb  • Seg 9 Fev 2015 - 17:17

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Seg 9 Fev 2015 - 17:17

Reputação da mensagem: 100% (1 votos)
Mal posso esperar para poder começar a desenvolver para essa versão do chat! Facilitaram demais nossa vida assim da maneira que deixaram...

GyGu GyGu  • Ter 10 Fev 2015 - 8:56

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 10 Fev 2015 - 8:56

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] quando fala em nova versão como assim? O que é preciso alterar? De momento eu não possuo nenhum outro JS para a chatbox, utilizei o seu e ficou assim:
Não consigo acertar os botões a baixo e depois tem aqueles icones em branco tambem a mais penso eu

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

JScript JScript  • Ter 10 Fev 2015 - 14:17

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 10 Fev 2015 - 14:17

Reputação da mensagem: 100% (1 votos)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] escreveu:Jscript quando fala em nova versão como assim?
Leia novamente:
Bem, enquanto a nova versão do chat box ainda está em constante desenvolvimento pela equipe de técnicos da forumeiros, adicionar o avatar nesta versão está mais fácil ainda!!!

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] escreveu:O que é preciso alterar?
Que eu saiba: Todos os códigos de personalização/modificação do chatbox precisam ser modificados para se adequarem ao novo formato!

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] escreveu:De momento eu não possuo nenhum outro JS para a chatbox, utilizei o seu e ficou assim:
Então ficou como eu esperava e com o propósito do meu código: com os avatares!

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link] escreveu:Não consigo acertar os botões a baixo e depois tem aqueles icones em branco tambem a mais penso eu
Isso é problema do CSS no qual os técnicos da Forumeiros ainda estão trabalhando para corrigir!

JS

FrOsTyXi FrOsTyXi  • Ter 10 Fev 2015 - 16:55

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 10 Fev 2015 - 16:55

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link], Obrigado senhor ! Estou certo de que o código final será incrível!

Pelo jeito que eu gosto de sua assinatura , muito verdadeiro!

Cumprimentos
FrOsTyXi

JScript JScript  • Ter 10 Fev 2015 - 17:15

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 10 Fev 2015 - 17:15

Reputação da mensagem: 100% (1 votos)
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
Com certeza será meu amigo!

Cumprimentos,

JS

Dark-Avenger Dark-Avenger  • Qua 11 Fev 2015 - 7:45

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qua 11 Fev 2015 - 7:45

Olá [Tens de ter uma conta e sessão iniciada para poderes visualizar este link],
Você pode adicionar o avatar e editar / apagar funções em chatbox como o javascript anterior?

JScript JScript  • Qua 11 Fev 2015 - 10:32

Dark-Avenger Dark-Avenger  • Qua 11 Fev 2015 - 10:35

JScript JScript  • Qua 11 Fev 2015 - 11:16

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qua 11 Fev 2015 - 11:16

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]
I've added these features, but the code is still in testing on my computer!
When the code is ready I will publish, you understand now?

JS

Dark-Avenger Dark-Avenger  • Qua 11 Fev 2015 - 11:27

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Qua 11 Fev 2015 - 11:27

Olá Jscript sim agora entendo obrigado.

JScript JScript  • Sex 13 Fev 2015 - 18:34

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Sex 13 Fev 2015 - 18:34

Reputação da mensagem: 100% (1 votos)
Meu código foi aceito, vejam: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Olá pessoal!

O código abaixo somente adiciona o avatar no chat, a edição das mensagens ainda está em testes.

Quem desejar ter o avatar no chat, basta adicionar o código abaixo somente no "Índice" ou "In the home page":
Código:

Done!

Nota: O código acima só funciona na nova versão do chat box e se não tiver outro código JS de personalização do chat!
Use somente para testes, uma vez que o código final poderá ser bem diferente do atual e com isso poderás ter problemas!


Resultado:
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

JS


Última edição por JScript em Ter 17 Fev 2015 - 11:17, editado 1 vez(es)

TiagoDJ7 TiagoDJ7  • Seg 16 Fev 2015 - 15:01

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Seg 16 Fev 2015 - 15:01

A variável "msg": retornar em html, o que pode ser considerador um erro grande, imaginem um cara com mal intenção bugar uma pagina só configurando por uma postagem usando css e tag
Código:
<style>
.
O certo seria retornar em bbcode ou broquear tags html especificas.


Última edição por TiagoDJ7 em Seg 16 Fev 2015 - 15:09, editado 1 vez(es) (Motivo da edição : Style do forum bugou.)

JScript JScript  • Seg 16 Fev 2015 - 15:46

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Seg 16 Fev 2015 - 15:46

TiagoDJ7 escreveu:A variável "msg": retornar em html, o que pode ser considerador um erro grande, imaginem um cara com mal intenção bugar uma pagina só configurando por uma postagem usando css e tag
Código:
<style>
.
O certo seria retornar em bbcode ou broquear tags html especificas.
Imagine um indivíduo desses sendo pego em "flagrante" e tendo seus dados (ou dos tutores) expostos em toda web em cada um dos FDFs existentes!

Eu não vejo a hora de isso acontecer!!![/b] [Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

JS


Última edição por JScript em Ter 17 Fev 2015 - 4:39, editado 1 vez(es)

Julinho Julinho  • Seg 16 Fev 2015 - 22:10

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Seg 16 Fev 2015 - 22:10

ASU e normalidade voltou a Haver chatbox se você atualizar seu código será appreciateJScript Smile

waghcwb waghcwb  • Seg 16 Fev 2015 - 22:53

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Seg 16 Fev 2015 - 22:53

TiagoDJ7 escreveu:A variável "msg": retornar em html, o que pode ser considerador um erro grande, imaginem um cara com mal intenção bugar uma pagina só configurando por uma postagem usando css e tag
Código:
<style>
.
O certo seria retornar em bbcode ou broquear tags html especificas.

[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Nem tanto.. O retorno é feito com HTML "escapado" (não sei um bom termo em português kkk), sendo assim as tags são mostradas como strings literais e não interpretadas pelo navegador...

Esse novo chat está tão bom que até mesmo uma vulnerabilidade existente nos tópicos, mp's, etc já não existe nele!! Eu pessoalmente gostei muito.

E agora com a galera da Forumeiros começando a por em práticas várias melhoriar propostas pelos seus membros, vai melhorar mais ainda...
[Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

JScript JScript  • Ter 17 Fev 2015 - 4:48

Houdini Houdini  • Ter 17 Fev 2015 - 8:08

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 17 Fev 2015 - 8:08

JScript escreveu:Meu código foi aceito, vejam: [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

JS

Humrum, percebi ontem JS esta nova atualização, ficou muito boa e já estou usando...

Parabéns pra ti.

waghcwb waghcwb  • Ter 17 Fev 2015 - 13:37

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 17 Fev 2015 - 13:37

Merecidamente aceito cheers

Igor_Ruiz Igor_Ruiz  • Ter 17 Fev 2015 - 13:48

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 17 Fev 2015 - 13:48

Js sempre inovando com esses chat, mile duque, esse manja Smile

JScript JScript  • Ter 17 Fev 2015 - 17:27

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual! Ter 17 Fev 2015 - 17:27

Reputação da mensagem: 100% (1 votos)
Obrigado pelas palavras de incentivo amigos!


Que tal termos o avatar dos membros na lista de usuários "Online / Ausente" ?

Basta adicionar o código abaixo com investimento apenas no "Índice" ou "In the home page":
Código:

/**************************************************************************
 * Module: cb_avatar
 * Description: Add avatar on chat user list!
 * Author: Made and Optimizations by JScript - 2015/02/05
 * Version: RC1 (Release candidate 1!)
 ***************************************************************************/

// Redefine function!
function insertChatBox(chatbox_id, chatbox_url) {
   return insertChatBoxNew(chatbox_id, chatbox_url);
}
// Redefine function!
function insertChatBoxNew(chatbox_id, chatbox_url) {
   // Put the chat box on top of widgets!
   // $('#' + chatbox_id).parent().detach().prependTo('#wrapper');

   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>';

   $('#frame_chatbox').load(function(){
      var oIframe = (document.getElementById("frame_chatbox").contentWindow || document.getElementById("frame_chatbox").contentDocument),
         script = oIframe.document.createElement("script");

      script.type = "text/javascript";
      script.innerHTML =
         'Chatbox.prototype.refresh = function(data) {\n' +
         '   if (data.error) {\n' +
         '      $("body").html(data.error)\n' +
         '   } else {\n' +
         '      if (this.connected && !this.archives) {\n' +
         '         $("#chatbox_footer").css("display", "block");\n' +
         '         $("#chatbox_messenger_form").css("display", "block");\n' +
         '         $("#chatbox_messenger_form").css("visibility", "visible")\n' +
         '      } else {\n' +
         '         $("#chatbox_footer").css("display", "none");\n' +
         '         $("#chatbox_messenger_form").css("display", "none");\n' +
         '         $("#chatbox_messenger_form").css("visibility", "hidden")\n' +
         '      }\n' +
         '      if (this.connected) {\n' +
         '         $("#chatbox_display_archives").show();\n' +
         '         $("#chatbox_option_co").hide();\n' +
         '         $("#chatbox_option_disco, #chatbox_footer").show();\n' +
         '         $(".format-message").each(function() {\n' +
         '            var name = $(this).attr("name");\n' +
         '            var value = my_getcookie("CB_" + name);\n' +
         '            $(this).prop("checked", parseInt(value) ? true : false)\n' +
         '         });\n' +
         '         this.format();\n' +
         '         if (data.lastModified) {\n' +
         '            this.listenParams.lastModified = data.lastModified\n' +
         '         }\n' +
         '      } else {\n' +
         '         $("#chatbox_option_co").show();\n' +
         '         $("#chatbox_option_disco, #chatbox_footer").hide()\n' +
         '         $("#chatbox_display_archives").hide()\n' +
         '      }\n' +
         '      if (data.users) {\n' +
         '         this.users = [];\n' +
         '         $(".online-users, .away-users").empty();\n' +
         '         $(".member-title").hide();\n' +
         '         for (var i in data.users) {\n' +
         '            var user = data.users[i];\n' +
         '            this.users[user.id] = user;\n' +
         '            if (user.avatar) {\n' +
         '               var username = "<span class=\'cb-avatar\'><img src=\'" + user.avatar + "\' style=\'height: 24px; width: 24px; margin-right: 4px;\'/></span>" + "<span style=\'color:" + user.color + "\'>" + (user.admin ? "@ " : "");\n' +
         '            } else {\n' +
         '               var username = "<span style=\'color:" + user.color + "\'>" + (user.admin ? "@ " : "")\n' +
         '            }\n' +
         '            username += "<span class=\'chatbox-username chatbox-user-username\' data-user=\'" + user.id + "\' >" + user.username + "</span></span>";\n' +
         '            var list = user.online ? ".online-users" : ".away-users";\n' +
         '            $(list).append("<li>" + username + "</li>")\n' +
         '         }\n' +
         '         if (!$(".online-users").is(":empty")) {\n' +
         '            $(".member-title.online").show()\n' +
         '         }\n' +
         '         if (!$(".away-users").is(":empty")) {\n' +
         '            $(".member-title.away").show()\n' +
         '         }\n' +
         '      }\n' +
         '      if (data.messages) {\n' +
         '         var scroll = !this.messages || this.messages.length != data.messages.length;\n' +
         '         this.messages = data.messages;\n' +
         '         $("#chatbox").empty();\n' +
         '         if (this.messages) {\n' +
         '            var cb_content = "",\n' +
         '               message = "",\n' +
         '               html = "",\n' +
         '               msg = "";\n' +
         '            for (var j = 0, len = this.messages.length; j < len; j++) {\n' +
         '               message = this.messages[j];\n' +
         '               html = "<p class=\'chatbox_row_" + (j % 2 == 1 ? 2 : 1) + " clearfix\'><span class=\'right desc\'><span class=\'date-and-time\' title=\'" + message.date + "\'>(" + message.datetime + ")</span></span>";\n' +
         '               if (message.userId == -10) {\n' +
         '                  html += "<span class=\'msg\'><span style=\'color:" + message.msgColor + "\'><strong> " + message.msg + "</strong></span></span>"\n' +
         '               } else {\n' +
         '                  html +=\n' +
         '                     "<span class=\'user-msg\'>";\n' +
         '                        if (this.avatar) {\n' +
         '                           html += "   <span class=\'cb-avatar\'><img src=\'" + message.user.avatar + "\' /></span>";\n' +
         '                        }\n' +
         '                     html +=\n' +
         '                        "<span class=\'user\' style=\'color:" + message.user.color + "\'>" +\n' +
         '                           "<strong> " + (message.user.admin ? "@ " : "") +\n' +
         '                              "<span class=\'chatbox-username chatbox-message-username\' data-user=\'" + message.userId + "\' >" + message.username + "</span> :&nbsp;" +\n' +
         '                           "</strong>" +\n' +
         '                           "<span class=\'msg\'>" + message.msg + "</span>" +\n' +
         '                        "</span>"\n' +
         '                     "</span>";\n' +
         '               }\n' +
         '               html += "</p>";\n' +
         '               cb_content += html;\n' +
         '            }\n' +
         '            $("#chatbox").append(cb_content);\n' +
         '            if (scroll) {\n' +
         '               $("#chatbox")[0].scrollTop = $("#chatbox").prop("scrollHeight") * 2\n' +
         '            }\n' +
         '         }\n' +
         '      }\n' +
         '   }\n' +
         '};';
      oIframe.document.getElementsByTagName("head")[0].appendChild(script);
   });
}

O código acima tem um grande potencial que nos permite modificar toda a estrutura do HTML retornado pelas mensagens do atual chat box!

Resultado:
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

JS

Conteúdo patrocinado  • 

ChatBox - Versão atual! Empty Re: ChatBox - Versão atual!

Permissões neste sub-fórum
Não podes responder a tópicos