abrendan_dev/MicDropMessages
1
0
Fork 0
mirror of https://github.com/abrendan/MicDropMessages.git synced 2025-08-25 05:52:02 +02:00
Code Issues Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
abrendan
2023-11-30 14:15:19 +00:00
commit e4599df811
5457 changed files with 500139 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
html/Ding.mp3 Normal file
View File

Binary file not shown.

42
html/index.html Normal file
View File

@@ -0,0 +1,42 @@
<!DOCTYPE HTML>
<html>
<head>
<title> chat.abrendan.dev </title>
<meta name = "charset" charset = "utf-8">
<meta name = "viewport" content = "width=device-width">
<link rel = "stylesheet" type = "text/css" href = "style.css">
<script src = "script.js"></script>
<script src= "socket.io/socket.io.js"></script>
</head>
<body onload = "onload()">
<div id = "Main">
<audio id = "Ding" src = "Ding.mp3"> </audio>
<h1 id = "Title"> chat.abrendan.dev </h1>
<div id = "AccessPort">
<label id = "NameLabel"> Username </label>
<input id = "NameInput" type = "text">
<br><br>
<label id = "IDLabel"> Chatroom </label>
<input id = "IDInput" value = "Room1" type = "text">
<input id = "ConnectButton" class = "Button" type = "submit" value = "Connect" onclick = "Connect()">
</div>
<h2 id = "RoomID"> Chatroom : None </h2>
<div id = "Chat">
<p id = "Message0" class = "Message"> - </p>
<p id = "Message1" class = "Message"> - </p>
<p id = "Message2" class = "Message"> - </p>
<p id = "Message3" class = "Message"> - </p>
<p id = "Message4" class = "Message"> - </p>
<p id = "Message5" class = "Message"> - </p>
<p id = "Message6" class = "Message"> - </p>
<p id = "Message7" class = "Message"> - </p>
<p id = "Message8" class = "Message"> - </p>
<p id = "Message9" class = "Message"> - </p>
<label id = "MessageLabel"> Message </label>
<input id = "ComposedMessage" type = "text">
<input id = "SendMessage" onclick="Send()" value = "Send" class = "Button" type = "submit">
</div>
<br><br>
</div>
</body>
</html>

55
html/script.js Normal file
View File

@@ -0,0 +1,55 @@
var socket;
var usernameInput
var chatIDInput;
var messageInput;
var chatRoom;
var dingSound;
var messages = [];
var delay = true;
function onload(){
socket = io();
usernameInput = document.getElementById("NameInput");
chatIDInput = document.getElementById("IDInput");
messageInput = document.getElementById("ComposedMessage");
chatRoom = document.getElementById("RoomID");
dingSound = document.getElementById("Ding");
socket.on("join", function(room){
chatRoom.innerHTML = "Current Chatroom : " + room;
})
socket.on("recieve", function(message){
console.log(message);
if (messages.length < 9){
messages.push(message);
dingSound.currentTime = 0;
dingSound.play();
}
else{
messages.shift();
messages.push(message);
}
for (i = 0; i < messages.length; i++){
document.getElementById("Message"+i).innerHTML = messages[i];
document.getElementById("Message"+i).style.color = "#b30000";
}
})
}
function Connect(){
socket.emit("join", chatIDInput.value, usernameInput.value);
}
function Send(){
if (delay && messageInput.value.replace(/\s/g, "") != ""){
delay = false;
setTimeout(delayReset, 1000);
socket.emit("send", messageInput.value);
messageInput.value = "";
}
}
function delayReset(){
delay = true;
}

32
html/style.css Normal file
View File

@@ -0,0 +1,32 @@
body{
background: #000000;
color: #ff0000;
font-family: 'Segoe UI';
}
label{
width: 5%;
display: inline-block;
text-align: right;
}
input{
background: #aa0000;
color: #000000;
font-size: 120%;
border: none;
}
.Message{
color: #b30000;
}
#Main{
background: #000000;
border-radius: 1%;
padding-left: 1%;
}
#Title{
font-size: 300%;
}