aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorLibravatar Renard 2020-03-13 14:14:08 -0300
committerLibravatar Renard 2020-03-13 14:14:08 -0300
commitc70be11d6c1f208a507d11fbd2b701bdcc92951e (patch)
tree61f795f3ecb5deee59650efe44911bdb9d63251d
parentc6e1413e44a7c77accfffa28ce6a0a650da575d8 (diff)
downloadbairadio-app-c70be11d6c1f208a507d11fbd2b701bdcc92951e.tar.gz
bairadio-app-c70be11d6c1f208a507d11fbd2b701bdcc92951e.tar.xz
bairadio-app-c70be11d6c1f208a507d11fbd2b701bdcc92951e.zip
Implementación completa del protocolo de ChatHEADmaster
-rw-r--r--src/App.css20
-rw-r--r--src/Chat.js116
2 files changed, 118 insertions, 18 deletions
diff --git a/src/App.css b/src/App.css
index 1b1cca9..22fe12f 100644
--- a/src/App.css
+++ b/src/App.css
@@ -24,3 +24,23 @@ body {
overflow-y: scroll;
overflow-wrap: break-word;
}
+
+.iidx {
+ animation-name: notice;
+ animation-duration: 0.1s;
+ animation-iteration-count: infinite;
+}
+@keyframes notice {
+ 0% {
+ color: #ffa400;
+ }
+ 25% {
+ color: #467fff;
+ }
+ 50% {
+ color: #d0ffe1;
+ }
+ 100% {
+ color: #ff5a98;
+ }
+}
diff --git a/src/Chat.js b/src/Chat.js
index c2c6841..b55610c 100644
--- a/src/Chat.js
+++ b/src/Chat.js
@@ -12,7 +12,8 @@ class Chat extends Component {
chatMessage: "",
chatUserCount: 0,
isChatOnline: false,
- filterMessages: false
+ filterMessages: false,
+ isAdministrador: false
};
this.client = {};
this.chatColors = [
@@ -45,7 +46,8 @@ class Chat extends Component {
own = false,
sender = "",
color = "grey",
- timestamp = ""
+ timestamp = "",
+ isNotice = false
) {
const ts = timestamp ? new Date(parseInt(timestamp)) : new Date();
this.setState(
@@ -58,7 +60,8 @@ class Chat extends Component {
own,
timestamp: ts,
author: sender,
- color: color
+ color: color,
+ isNotice: isNotice
}
]
}),
@@ -71,8 +74,46 @@ class Chat extends Component {
);
}
- printMessage(message, color) {
- this.addMessage(message, "", false, "", color);
+ printMessage(message, color, notice = false) {
+ this.addMessage(message, "", false, "", color, "", notice);
+ }
+
+ processCommand(command) {
+ const args = command.split(" ");
+ const argCount = args.length;
+ switch (args[0]) {
+ case "/login":
+ if (argCount === 2) {
+ this.client.send("LOGIN:" + args[1]);
+ }
+ break;
+ case "/logout":
+ this.client.send("LOGOUT");
+ break;
+ case "/notice":
+ if (argCount > 1) {
+ this.client.send("NOTICE:0:" + command.replace(args[0], ""));
+ }
+ break;
+ case "/kick":
+ if (argCount === 2) {
+ this.client.send("KICK:" + args[1]);
+ }
+ break;
+ case "/ban":
+ if (argCount === 2) {
+ this.client.send("BAN:" + args[1]);
+ }
+ break;
+ case "/title":
+ if (argCount > 1) {
+ this.client.send("SETTITLE:" + command.replace(args[0], ""));
+ }
+ break;
+ default:
+ break;
+ }
+ this.setState({ chatMessage: "" });
}
componentWillMount() {
@@ -94,10 +135,13 @@ class Chat extends Component {
sendMessage() {
const { chatMessage } = this.state;
const { stream } = this.props;
- console.log(stream);
if (chatMessage === "") {
return;
}
+ if (chatMessage.startsWith("/")) {
+ this.processCommand(chatMessage);
+ return;
+ }
this.client.send(`MSG:${stream.server_name}:${chatMessage}`);
this.addMessage(chatMessage, stream.server_name, true, "", "black");
this.setState({ chatMessage: "" });
@@ -110,7 +154,6 @@ class Chat extends Component {
this.addMessage(this.translateColon(args[2]), args[1]);
break;
case "HMSG":
- console.log(line);
this.addMessage(
this.translateColon(args[3]),
args[2],
@@ -121,12 +164,7 @@ class Chat extends Component {
);
break;
case "FMSG":
- this.addMessage(
- this.translateColon(args[3]),
- this.chatColors[args[2]],
- false,
- args[1]
- );
+ this.addMessage(this.translateColon(args[3]), args[2], false, args[1]);
break;
case "WELCOME":
this.printMessage("Conectado al chat, " + args[1], "green");
@@ -146,6 +184,36 @@ class Chat extends Component {
Renard: me lo meto en la raja?
z411: bien adentro */
break;
+ case "BADPASS":
+ this.printMessage("Error: contraseña incorrecta!", "red");
+ break;
+ case "LOGIN_OK":
+ this.printMessage(
+ `Bienvenido ${args[1]}, ahora tienes permisos de administrador.`,
+ "blue"
+ );
+ this.setState({ isAdministrador: true });
+ break;
+ case "FORBIDDEN":
+ this.printMessage(
+ "Error: No tienes permisos suficientes para ejecutar esta acción",
+ "red"
+ );
+ break;
+ case "KICKED":
+ this.printMessage("Has sido expulsado del chat", "red");
+ this.client.close();
+ break;
+ case "TITLE":
+ this.printMessage(
+ "El streamer ha cambiado el título de la transmisión",
+ "orange"
+ );
+ this.client.close();
+ break;
+ case "NOTICE":
+ this.printMessage(args[2], "yellow", true);
+ break;
default:
console.error("[Chat] Unsupported command " + args[0]);
break;
@@ -158,15 +226,19 @@ class Chat extends Component {
chatMessage,
chatUserCount,
isChatOnline,
- filterMessages
+ filterMessages,
+ isAdministrador
} = this.state;
const { stream } = this.props;
- const MessageItem = ({ message, index }) => {
+ const MessageItem = ({ message, index, showAuthor }) => {
return (
<List.Item key={index}>
[<Moment format="HH:mm:ss" date={message.timestamp} />]{" "}
- <span className={`ui text ${message.color}`}>
+ {message.author !== "" && showAuthor && `(${message.author})`}
+ <span
+ className={message.isNotice ? "iidx" : `ui text ${message.color}`}
+ >
{`${message.stream && "[" + message.stream + "]"} ${
message.content
}`}
@@ -186,10 +258,18 @@ class Chat extends Component {
{chat.map((message, i) =>
filterMessages ? (
message.stream === stream.server_name && (
- <MessageItem message={message} index={i} />
+ <MessageItem
+ message={message}
+ index={i}
+ showAuthor={isAdministrador}
+ />
)
) : (
- <MessageItem message={message} index={i} />
+ <MessageItem
+ message={message}
+ index={i}
+ showAuthor={isAdministrador}
+ />
)
)}
</List>