From 28497b06e208cd8fd4aa94756c7a5626c18d9878 Mon Sep 17 00:00:00 2001 From: Maks Jopek Date: Wed, 26 May 2021 08:38:37 +0200 Subject: Added all features --- src/index.ts | 168 +++++++++++++++++++++++++++++++++++++---------------------- 1 file changed, 106 insertions(+), 62 deletions(-) (limited to 'src/index.ts') diff --git a/src/index.ts b/src/index.ts index b074be1..670e861 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,64 +1,108 @@ -type Message = { - text: string; - user: string; - color: string; -}; -const url = "http://localhost:5000/"; -const input = document.getElementById("msg") as HTMLInputElement; -let username: string; -let color: string; -color = "#123456"; -// @ts-ignore -const chatListScroll = $("#chatlist").tinyscrollbar(); -function init() { - const username = prompt("Gimme your name: "); - if (username === null) { - document.body.innerHTML = "You should give me your name!"; - return; +import Messages, { Message } from "Modules/messages"; +import Helpers from "Modules/helpers"; + +export default class Irc { + private username: string; + private color: string; + private readonly messages = new Messages(); + private readonly helpers = new Helpers(); + + readonly input = document.getElementById("msg") as HTMLInputElement; + readonly divError = document.getElementById("error") as HTMLDivElement; + + constructor() { + this.username = this.helpers.getUsername; + this.color = this.helpers.getRandomColor; + + if (this.input === null) throw new Error("NoInputError"); + + this.input.onkeyup = (e: KeyboardEvent) => { + if (e.code === "Enter") { + if (this.messageExe(this.input.value) === true) { + if (this.input.value === "") return; + const msg = { + text: this.input.value, + username: this.username, + color: this.color, + time: Date.now(), + }; + this.input.value = ""; + this.messages.sendMessage(msg); + } + } + }; + + this.poll(); + } + + poll(): void { + console.log("polling"); + $.ajax({ + url: this.messages.url + "poll", + success: msg => { + this.messages.addMessage(msg); + const update = + document.activeElement === this.input ? "bottom" : "relative"; + + this.helpers.updateScrollbar(update); + this.poll(); + }, + error: () => { + this.poll(); + }, + timeout: 30000, // 30 seconds + }); + } + + messageExe(msg: string): boolean { + if (msg[0] !== "/") return true; + + const msgToSend: Message = { + time: Date.now(), + color: "black", + username: "Server", + text: "", + }; + + msg = msg.slice(1); + + if (msg.startsWith("quit") === true) { + msgToSend.text = `User ${this.username} has left the chat`; + this.messages.sendMessage(msgToSend); + + this.helpers.suicide( + "Thank you for using this site, you can now safely close it." + ); + } else if (msg.startsWith("color") === true) { + const color = msg.split(" ")[1]; + + if (this.helpers.isColor(color) === true) { + msgToSend.text = `User ${this.username} has changed his color to ${color}`; + this.messages.sendMessage(msgToSend); + + this.color = color; + } else { + this.divError.innerText = "You need to give correct color!"; + } + } else if (msg.startsWith("nick") === true) { + const username = msg.slice(4).trim(); + + if (username === "Server") { + this.divError.innerText = "You have to give legal nick!"; + } else { + msgToSend.text = `User ${this.username} has changed his nick to ${username}`; + this.messages.sendMessage(msgToSend); + + this.username = username; + } + } else { + this.divError.innerText = "Wrong command!"; + } + + setTimeout(() => (this.divError.innerText = ""), 3000); + this.input.value = ""; + return false; } - // @ts-ignore - // chatList.tinyscrollbar(); - // //@ts-ignore - // $("#emot").emoticonize(); - if (input === null) return; - input.onclick = sendMessage; - poll(); -} -function poll() { - $.ajax({ - url: url + "poll", - success: addMessage /* data => { - console.log(data); // { text: "Some data" } -> will be printed in your browser console every 5 seconds - poll(); - } */, - error: () => setTimeout(() => poll(), 1000), - timeout: 30000, // 30 seconds - }); -} -function sendMessage() { - const msg = { - text: input.value, - user: username, - color: color, - }; - fetch(url + "send", { - method: "POST", - headers: { - Accept: "application/json", - "Content-Type": "application/json", - }, - body: JSON.stringify(msg), - }); -} -function addMessage(msg: Message) { - const board = $(".overview")[0]; - const div = document.createElement("div"); - div.innerHTML = JSON.stringify(msg); - board.appendChild(div); - console.log(msg); - // @ts-ignore - $(chatListScroll).data().plugin_tinyscrollbar.update("relative"); - // $(chatListScroll).data().plugin_tinyscrollbar.update("bottom"); - poll(); } -init(); + +new Irc(); -- cgit v1.3.1