wizebot chat history

Por que esse script WizeBot-Chat-History?

Eu sou uma serpentina na plataforma Twitch.

To display the chat in OBS, we can use a Wizebot widget overlay. This allows us to have a different chat while enjoying effects and features from Wizebot.
No entanto, ao usar algumas cenas em OBS com diferentes configurações de bate -papo para cada cena, o histórico de bate -papo é perdido.

O objetivo deste script é manter esse histórico e garantir que ele esteja disponível mesmo se não estivermos transmitindo.

Como preparar seu Almalinux 9.3 ou 9.4

Conecte -se a um SSH com uma raiz ou conta semelhante no seu Almalinux:

dnf install epel-release

dnf module enable nodejs:20

dnf install nodejs -y

dnf install chromium -y

dnf install git -y

node -v

Instale o script

Com sua sessão SSH:

cd /var

mkdir nodejs

cd nodejs

git clone https://github.com/AlexiaGossa/wizebot-chat-history

cd wizebot-chat-history

npm i puppeteer

npm install puppeteer-core

npm install -g npm

Como usar o script

1. Vá para o seu painel de administração do wizebot.tv

2. Widgets abertos (sobreposições)

3. Abra o widget chatbot

4. Crie um novo widget

5. Selecione o modelo limpo (no lado direito)

6. Importe o código HTML a seguir para a parte WizeBot HTML :

 < link href =" https://fonts.googleapis.com/css?family=Inter " rel =" stylesheet " >

< div class =" template message_div animated fadeIn " >
    < div >
        < div class =" sticker " style =" background-color:{user_color}; " > </ div >
        < div class =" time " > {message_time} </ div >
        < div class =" badges " > </ div >
        < div class =" nicksimple " > {user_display_name} </ div >
        < div class =" nick " > </ div >
        < div class =" left " > </ div >
        < div class =" message " msgtype =" {message_type} " > </ div >
    </ div >
</ div >
< div id =" messagescontainer " >
< div id =" messages " dir =" ltr " > </ div >
</ div > 

<!-- Horizontal order : dir="ltr" = Left to right / dir="rtl" = Right to left -->
<!-- TAGs available : {user_name} {user_display_name} {user_name_full} (Display name + Username) {user_color} {user_invert_color} (For background ?) {user_badges} {message_text} {message_time} {message_type} {message_color} (For announcement type) -->

7. Limpe o código CSS na parte do WizeBot CSS

8. Altere o nome do canal no código JavaScript na parte do wizebot javascript para o nome do seu canal

   Para o meu canal Twitch, eu uso: var channel_name = "alexia_vassiliki";

9. Clique em "Copiar o link" na parte superior da página da web do Wizebot

10. Com sua sessão SSH, abra o wizebot-url.txt com nano nano wizebot-url.txt e cole o link no Nano.

Personalize o design

Agora você pode modificar o arquivo CSS chamado wizebot-inject.css para aplicar seu próprio design.

Don't forget to restart the nodeJS script after each modification.

Run the script

Configure suas portas de firewall / aberto

Abra 1 ou 2 portas TCP em seu sistema:

8080 para http

8443 para https se você fornecer alguns certificados

Quer testar imediatamente o script?

Você deseja executar o script de história do wizebot-bate-pau agora?

Execute o comando: node wizebot-node.js

Você verá o seguinte texto:

 HTTP server started
Running...

Pressione Ctrl+C para interromper o script.

Instale e inicie o script com o sistema

Com sua sessão SSH:

chmod +x wizebot-run.sh

Adicionamos o script ao Cron na startup, este comando editar o cron com vim:

crontab -e

E adicionando a seguinte linha ao Cron

@reboot sh /var/nodejs/wizebot-chat-history/wizebot-run.sh > /var/nodejs/wizebot-chat-history/wizebot-run.log

Nota: Se você preferir editar o cron com nano em vez de vim

export VISUAL=nano

Ou seletar Vim

export VISUAL=vim

Parâmetros de URL da história do WizeBot

Assumimos que o script está em execução em um sistema usando o IP 192.168.1.126 e usando a porta HTTP 8080.

---

Exibição básica

> http: // 192.168.1.126:8080/

---

História clara imediatamente

A história é imediatamente limpa. Todas as páginas da web abertas precisam ser recarregadas.

Abra uma nova guia do navegador e cole o URL a seguir.
> http: // 192.168.1.126:8080/?reset

Aguarde o carregamento da guia e feche -o. Agora você precisa recarregar todas as outras guias e janelas exibindo o bate -papo.

Esse recurso é muito útil antes de iniciar uma nova transmissão ao vivo para limpar todas as mensagens anteriores.

---

Exibir uma cor plana abaixo do chatbot

Existem 2 parâmetros: altura e altura:
A altura é a área de texto de chatbot em porcentagens.
A altura é a cor da área plana usando um valor RGB.

Amostras de URL
> http: // 192.168.1.126:8080/?height=80%&HeightColor=RGB(255.230.200)
> http: // 192.168.1.126:8080/?height=63%&HeightColor=RGB(255.255.255)

---

Alterar o tamanho das mensagens de texto

O Mensize é o tamanho da mensagem nas unidades CSS (recomendo que você use VW e VH).
Mais informações sobre as unidades CSS.

Amostras de URL
> http: // 192.168.1.126:8080/?messagesize=2.5vw
> http: // 192.168.1.126:8080/?messagesize=4vh

---

Altere o tamanho do apelido

nicksize is nickname size in css units (I recommand you to use vw and vh).

URL samples
> http:// 192.168.1.126:8080/?nicksize=4vw
> http: // 192.168.1.126:8080/?nicksize=5.2vh

---

Destacar uma nova mensagem

Destacar uma nova mensagem é um recurso muito útil para a Streamer destacar todas as novas mensagens recebidas.
Destaque o parâmetro sem qualquer valor, ativará o recurso. As novas mensagens recebidas piscam alguns segundos para destacá -las.

Amostra de URL
> http:// 192.168.1.126:8080/?height=60%&heightcolor=rgb(255,255,255)&messagesize=3vw&nickname=5vw&highlight

---

Combine multiple parameters

You could combine multiple parameters... You must use ? para o primeiro parâmetro e para cada um dos seguintes parâmetros.

Amostras de URL
> http: // 192.168.1.126:8080/?height=80%&HeightColor=rgb(200,255,200)&messagesize=2vh&nickname=3vh
> http: // 192.168.1.126:8080/?height=60%&HeightColor=rgb(255,255,255)&Messagesize=3vw&nickname=5vw