Skip to content

Commit a5038fd

Browse files
PythonicBoatPythonicBoat
authored
Add files via upload
1 parent 803d84a commit a5038fd

File tree

3 files changed

+216
-0
lines changed

3 files changed

+216
-0
lines changed

‎v1/static/favicon.ico‎

10.1 KB
Binary file not shown.

‎v1/static/message.js‎

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
window.onload = function(e) {
2+
if (location.protocol === 'https:') {
3+
window.location.replace(window.location.href.replace('http', 'https'));
4+
}
5+
const BASE_URL = location.origin;
6+
7+
function timestamp() {
8+
const months = {
9+
0: 'Jan',
10+
1: 'Feb',
11+
2: 'Mar',
12+
3: 'Apr',
13+
4: 'May',
14+
5: 'Jun',
15+
6: 'Jul',
16+
7: 'Aug',
17+
8: 'Sep',
18+
9: 'Oct',
19+
10: 'Nov',
20+
11: 'Dec'
21+
};
22+
23+
var str = ''
24+
const date = new Date();
25+
str+=months[date.getMonth()] + '-';
26+
var day = day.getDate();
27+
if (day < 10) {
28+
day = '0' + day.toString();
29+
}
30+
str+=day + '-';
31+
str+=date.getFullYear() + ' ';
32+
str+=hour = date.getHours() + ':';
33+
var min = date.getMinutes();
34+
if (date.getMinutes() < 10) {
35+
min = '0' + min.toString();
36+
}
37+
str+=min + ')';
38+
return str
39+
}
40+
function utcToLocal(ts) {
41+
const months = {
42+
"Jan": "01",
43+
"Feb": "02",
44+
"Mar": "03",
45+
"Apr": "04",
46+
"May": "05",
47+
"Jun": "06",
48+
"Jul": "07",
49+
"Aug": "08",
50+
"Sep": "09",
51+
"Oct": "10",
52+
"Nov": "11",
53+
"Dec": "12"
54+
}
55+
var ts = ts.split("-");
56+
var year = ts[2].split(" (")
57+
var utc = `${year[0]}-${months[ts[0]]}-${ts[1]}T${year[1].split(")")[0]}:00.000Z`;
58+
var localDate = new Date(utc);
59+
var localDate = localDate.toString().split("GMT-")[0];
60+
61+
var t = localDate.toString().split(" ")
62+
var messages = `${t[1]}-${t[2]}-${t[3]} (${t[4].split(":")[0]}:${t[4].split(":")[1]})`
63+
return messages;
64+
}
65+
66+
var room_id = location.pathname.split("/")[location.pathname.split("/").length-1];
67+
68+
$("#messageForm").submit(function(e) {
69+
e.preventDefault();
70+
});
71+
72+
var socket = io.connect(location.protocol + "//" + document.domain + ":" + location.port);
73+
74+
socket.on("connect", () => {
75+
var textArea = document.getElementById("message");
76+
textArea.addEventListener("input", () => {
77+
console.log("typpppiiiing")
78+
socket.emit("typing", {"room_id": room_id});
79+
})
80+
var button = document.getElementById("sendMessageButton");
81+
button.onclick = () => {
82+
var message = document.getElementById("message").value;
83+
document.getElementById("message").value = " ";
84+
if (message.length !== 0) {
85+
socket.emit("broadcast message", {"message": message, "room_id": room_id})
86+
};
87+
}
88+
// socket.emit("connect")
89+
});
90+
91+
socket.on("show message", data => {
92+
if (data["room_id"] == location.pathname.split("/")[location.pathname.split("/").length-1]) {
93+
var message = document.createElement("SPAN");
94+
message.innerHTML = `<small>${utcToLocal(data.timestamp)}</small><h4>${data.name}:</h4><p>${data.message}</p>`
95+
$(".container").append(message);
96+
var objDiv = document.getElementById("messages");
97+
objDiv.scrollTop = objDiv.scrollHeight;
98+
}
99+
});
100+
101+
socket.on("update status", data => {
102+
console.log("status updated")
103+
if (data["status"] == "online") {
104+
if (data["room_id"].includes(room_id)) {
105+
try {
106+
document.getElementById(data["user"]).setAttribute("style", "color: green;");
107+
} catch (err) {
108+
var SPAN = document.createElement("SPAN");
109+
// SPAN.setAttribute("id", data["user"]);
110+
SPAN.innerHTML = `${data["user"]} <span id="${data['user']}" style="color: green;">online</span> <br>`
111+
document.getElementById("users").appendChild(SPAN);
112+
$(".container").append(`<small>${utcToLocal(timestamp())}</small><h4>Bot:</h4><p>Welcome ${data["user"]}</p>`);
113+
var objDiv = document.getElementById("messages");
114+
objDiv.scrollTop = objDiv.scrollHeight;
115+
}
116+
}
117+
} else {
118+
try {
119+
document.getElementById(data["user"]).setAttribute("style", "color: gray;");
120+
} catch(err) {
121+
var SPAN = document.createElement("SPAN");
122+
// SPAN.setAttribute("id", data["user"]);
123+
SPAN.innerHTML = `${data["user"]} <span id="${data['user']}" style="color: gray;">offline</span> <br>`
124+
document.getElementById("users").appendChild(SPAN);
125+
// $(".container").append(`<small>${utcToLocal(timestamp())}</small><h4>Bot:</h4><p>Welcome ${data["user"]}</p>`);
126+
var objDiv = document.getElementById("messages");
127+
objDiv.scrollTop = objDiv.scrollHeight;
128+
}
129+
}
130+
document.getElementById(data["user"]).innerHTML = data["status"];
131+
});
132+
133+
socket.on("new people joined", data => {
134+
console.log("hi")
135+
var room_id = location.pathname.split("/")[location.pathname.split("/").length-1];
136+
console.log(room_id)
137+
if (room_id === data["room_id"]) {
138+
$(".container").append(`<small>${utcToLocal(data.timestamp)}</small><h4>${data.name}:</h4><p>${data.message}</p>`);
139+
var objDiv = document.getElementById("messages");
140+
objDiv.scrollTop = objDiv.scrollHeight;
141+
}
142+
});
143+
144+
fetch(`${BASE_URL}/api?room_id=${room_id}&api=users`, {
145+
method: 'GET', // or 'PUT'
146+
headers: {
147+
'Content-Type': 'application/json',
148+
},
149+
})
150+
.then(response => response.json())
151+
.then(data => {
152+
console.log(data)
153+
for(let i=0; i<data["users"].length; i++) {
154+
console.log(data["users"][i])
155+
try {
156+
document.getElementById(data["users"][i]).innerHTML = "online";
157+
document.getElementById(data["users"][i]).setAttribute("style", "color: green;")
158+
} catch(err) {
159+
var span = document.createElement("SPAN");
160+
span.innerHTML = `${data["users"][i]} <span id=${data["users"][i]} style="color: green;">online</span>`
161+
document.getElementById("users").appendChild(span);
162+
}
163+
}
164+
});
165+
166+
fetch(`${BASE_URL}/api?room_id=${room_id}&api=messages`, {
167+
method: "GET",
168+
headers: {
169+
"Content-Type": 'application/json',
170+
},
171+
})
172+
.then(response => response.json())
173+
.then(data => {
174+
for (let i=0; i<data.messages.length; i++) {
175+
var message = document.createElement("SPAN");
176+
message.innerHTML = `<small>${utcToLocal(data["messages"][i].timestamp)}</small><h4>${data["messages"][i].author}:</h4><p>${data["messages"][i].message}</p>`
177+
$(".container").append(message);
178+
};
179+
var objDiv = document.getElementById("messages");
180+
objDiv.scrollTop = objDiv.scrollHeight;
181+
});
182+
183+
}
184+
185+
/**Create Message event*/

‎v1/static/private.js‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
window.onload = function(e) {
2+
3+
$("#messageForm").submit(function(e) {
4+
e.preventDefault();
5+
});
6+
7+
var socket = io.connect(location.protocol + "//" + document.domain + ":" + location.port);
8+
9+
socket.on("connect", () => {
10+
var button = document.getElementById("dmButton");
11+
button.onclick = () => {
12+
console.log("clicked")
13+
var username = document.getElementById("username").value;
14+
var message = document.getElementById("message").value;
15+
var author = document.getElementById("sender").value;
16+
socket.emit("dm", {"username": username, "message": message, "author": author});
17+
}
18+
})
19+
20+
socket.on("broadcast dm", data => {
21+
console.log("dm received")
22+
if (data["receiver"] == document.getElementById("sender").value) {
23+
console.log(data);
24+
var message = document.createElement("SPAN");
25+
message.innerHTML = `<small>${(data["t"])}</small><h4>${data["author"]}:</h4><p>${data["message"]}</p>`
26+
$(".container").append(message);
27+
}
28+
})
29+
}
30+
31+
/**DM message event*/

0 commit comments

Comments
 (0)