diff --git a/html/logic.js b/html/logic.js
index e0d0465..592d1a5 100644
--- a/html/logic.js
+++ b/html/logic.js
@@ -6,6 +6,7 @@ var canvas = document.getElementById("board");
var colorInput = document.getElementById("color");
var canvasHidden = document.getElementById("hidden");
var timer = document.getElementById("timer");
+var online = document.getElementById("online");
var ctx = canvas.getContext("2d");
var ctx2 = canvasHidden.getContext("2d");
@@ -28,6 +29,7 @@ function drawTimer() {
function connect() {
// socket.close();
const handler = (event) => {
+ console.log(event.data)
event.data.text().then(function(packet){
packet = JSON.parse(packet)
let code = packet.code
@@ -60,6 +62,10 @@ function connect() {
drawPixel(contentJson.x * 4, contentJson.y * 4, color)
redraw();
break;
+ case 2:
+ online.textContent = packet.online;
+ console.log(`Online: ${packet.online}`);
+ break;
case undefined:
console.log("ping!");
break
diff --git a/src/index.js b/src/index.js
index ce76559..54378f8 100644
--- a/src/index.js
+++ b/src/index.js
@@ -103,6 +103,13 @@ server.on('connection', (client) => {
response.content = board;
response.timeBetweenPixels = timeBetweenPixels;
client.send(Buffer.from(JSON.stringify(response)));
+ response = {}
+ for (let i = 0; i < clients.length; i++) {
+ response.code = 2;
+ response.online = clients.length;
+ clients[i].send(Buffer.from(JSON.stringify(response)));
+ }
+
break;
case 1:
response.code = 1;
diff --git a/views/index.pug b/views/index.pug
index 1e6aae8..afc7b4c 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -16,6 +16,9 @@ html(lang='en')
br
| timer:
b(id="timer")
+ br
+ | online:
+ b(id="online")
canvas(id="board" width="1920" height="1080" style="border:1px solid #000000;" display="block")
canvas(hidden id="hidden" width="1920" height="1080")
script(type="text/javascript" src="./logic.js")
\ No newline at end of file