From c7b3012c7aba9cdbe90932c9d37057f26b3a1e33 Mon Sep 17 00:00:00 2001 From: Maks Jopek Date: Mon, 24 May 2021 17:38:15 +0200 Subject: Backend added --- src/index.html | 98 +++++++++++++++++++++++++++++++++++++++++++++++++--------- src/index.ts | 76 ++++++++++++++++++++++++++++++++++++++------- 2 files changed, 148 insertions(+), 26 deletions(-) (limited to 'src') diff --git a/src/index.html b/src/index.html index 9637b67..8341455 100644 --- a/src/index.html +++ b/src/index.html @@ -25,7 +25,7 @@ -
+
@@ -35,22 +35,92 @@
-
    -
  • :) :D :P ;)
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
  • item
    • -
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+
[12:02] <@maks> Hello world
+ \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index 61abe7d..b074be1 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,12 +1,64 @@ -// import moduleFunction from "Modules/dummy"; - -// const userName = prompt("Gimme your name:"); -// if (userName === null) { -// document.body.innerHTML = 'You should give me your name'; -// } else { -// document.body.innerHTML = userName; -// } -//@ts-ignore -$("#chatlist").tinyscrollbar(); -//@ts-ignore -$("#emot").emoticonize(); +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; + } + // @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(); -- cgit v1.3.1