Game rooms with page hash

client/main.js

@@ -4,7 +4,7 @@ const ctx = canvas.getContext('2d');
 let hsize = 300;
 let current;
 let players;
-
+let room;
 let history = {};
 
 function ellipse(cx, cy, rx, ry) {
@@ -70,13 +70,23 @@ function drawGame() {
   ctx.clearRect(0, 0, canvas.width, canvas.height);
   const ratio = canvas.height / window.innerHeight;
 
-  ctx.font = `bold ${ratio * 120}px Roboto`;
+  const writeTitleText = function (txt, x, y) {
+    ctx.font = `bold 120px Roboto`;
     ctx.textAlign = 'center';
 
+    const lines = txt.split('\n');
+
+    lines.forEach(function (line, i) {
       ctx.fillStyle = '#4b4b4b';
-  ctx.fillText('snex.io', canvas.width / 2 - ratio * 3, canvas.height / 2 + ratio * 37);
+      ctx.fillText(line, x - 3, y + 37 - (120 * lines.length) / 2 + 120 * i);
       ctx.fillStyle = '#545454';
-  ctx.fillText('snex.io', canvas.width / 2, canvas.height / 2 + ratio * 40);
+      ctx.fillText(line, x, y + 40 - (120 * lines.length) / 2 + 120 * i);
+    });
+
+
+  };
+
+  writeTitleText(`snex.io\n#${room}`, canvas.width / 2, canvas.height / 2);
 
   ctx.lineCap = 'round';
   ctx.lineJoin = 'round';
@@ -101,9 +111,11 @@ const socket = io({
 });
 socket.on('connect', function () {
   console.log('connected');
-  $(window).focus(function () {
+  if (window.location.hash) {
-    socket.emit('history', current);
+    socket.emit('room', window.location.hash.slice(1));
-  });
+  } else {
+    socket.emit('room', undefined);
+  }
 });
 socket.on('disconnect', function () {
   console.log('disconnected');
@@ -114,7 +126,12 @@ socket.on('info', function (res) {
   history = res.history;
   hsize = res.hsize;
   players = res.players;
-  drawGame()
+  room = res.room;
+  window.location.hash = '#' + room;
+  drawGame();
+  $(window).focus(function () {
+    socket.emit('history', current);
+  });
 });
 
 socket.on('history', function (h) {

server.js

@@ -47,16 +47,17 @@ const MAXY = 900;
 const SPD = 5;
 const MAX_ANGLE_SPEED = Math.PI / 32;
 
-const players = {};
+const rooms = {};
-const history = {};
 
-let upc = 0;
+let updateCount = 0;
-let ic = 0;
+let intersectCount = 0;
+let playerCount = 0;
 
 setInterval(function () {
   //main loop
-  Object.keys(players).forEach(function (name) {
+  Object.keys(rooms).forEach(function (room) {
-    const p = players[name];
+    Object.keys(rooms[room].players).forEach(function (name) {
+      const p = rooms[room].players[name];
       if (p.alive) {
         const lastpos = clone(p.pos);
         p.pos.x += SPD * Math.cos(p.angle);
@@ -81,7 +82,7 @@ setInterval(function () {
         }
 
         if (p.starting <= 0) {
-        const h = history[name];
+          const h = rooms[room].history[name];
           h.i0 = (h.i0 + 1) % HSIZE;
           h.list[h.i0] = clone(p.pos);
         }
@@ -93,9 +94,9 @@ setInterval(function () {
           if (ds >= SPD * 1.1)
             process.stdout.write(`\r${name} moved too quickly : ${ds} [${lastpos.x},${lastpos.y}]->[${p.pos.x},${p.pos.y}]\n`);
 
-        Object.keys(history).forEach(function (name2) {
+          Object.keys(rooms[room].history).forEach(function (name2) {
             if (p.alive && name !== name2) {
-            const h2 = history[name2];
+              const h2 = rooms[room].history[name2];
               let lastpoint = h2.list[h2.i0];
               if (!lastpoint)
                 return;
@@ -103,7 +104,7 @@ setInterval(function () {
                 const point = h2.list[(h2.i0 - di + HSIZE) % HSIZE];
                 if (point !== undefined) {
                   if (Math.abs(lastpoint.x - point.x) < 1600 * .9 && Math.abs(lastpoint.y - point.y) < 900 * .9) {
-                  ic++;
+                    intersectCount++;
                     if (intersects(lastpos, p.pos, lastpoint, point)) {
                       process.stdout.write(`\r${name} collided with ${name2}                            \n`);
                       p.alive = false;
@@ -124,20 +125,41 @@ setInterval(function () {
 
       }
     });
-  io.emit('players', players);
+    io.to(room).emit('players', rooms[room].players);
-  upc++;
+  });
+  updateCount++;
 }, 20);
 
 setInterval(function () {
-  process.stdout.write(`\rtick ${20 * upc * 20 / 1000}/20 ms (${Object.keys(players).length} connected) (${ic} intersect/s)               `);
+  process.stdout.write(`\rtick ${20 * updateCount * 20 / 1000}/20 ms (${Object.keys(rooms).length} rooms) (${playerCount} players) (${intersectCount} intersect/s)               `);
-  upc = 0;
+  updateCount = 0;
-  ic = 0;
+  intersectCount = 0;
 }, 1000);
 
 io.on('connection', function (socket) {
   socket.name = '#' + ('0000' + randInt(0, 10000)).slice(-4);
   process.stdout.write(`\r${socket.name} connected                            \n`);
-  players[socket.name] = {
+  playerCount++;
+
+  socket.on('room', function (name) {
+    if (socket.room)
+      return;
+    if (name) {
+      socket.room = name;
+    } else {
+      socket.room = ('000000' + randInt(0, 1000000)).slice(-4);
+    }
+
+    socket.join(socket.room);
+
+    if (!rooms[socket.room]) {
+      rooms[socket.room] = {
+        players: {},
+        history: {}
+      }
+    }
+
+    rooms[socket.room].players[socket.name] = {
       pos: {
         x: randInt(100, MAXX - 100),
         y: randInt(100, MAXY - 100)
@@ -149,29 +171,44 @@ io.on('connection', function (socket) {
       alive: true,
       starting: 2000
     };
-  history[socket.name] = {
+    rooms[socket.room].history[socket.name] = {
       i0: -1,
       list: new Array(HSIZE)
     };
+
     socket.emit('info', {
-    self:players[socket.name],
+      room: socket.room,
-    players:players,
+      self: rooms[socket.room].players[socket.name],
-    history:history,
+      players: rooms[socket.room].players,
+      history: rooms[socket.room].history,
       hsize: HSIZE
     });
 
+    process.stdout.write(`\rroom #${socket.room} > ${socket.name} connected                            \n`);
+  });
+
   socket.on('history', function () {
-    socket.emit('history', history);
+    if (socket.room)
+      socket.emit('history', rooms[socket.room].history);
   });
 
   socket.on('disconnect', function () {
-    delete players[socket.name];
+    playerCount--;
-    delete history[socket.name];
+    if (!socket.room)
-    process.stdout.write(`\r${socket.name} disconnected                            \n`);
+      return;
-    io.emit('players', players);
+    delete rooms[socket.room].players[socket.name];
+    delete rooms[socket.room].history[socket.name];
+    process.stdout.write(`\rroom #${socket.room} > ${socket.name} disconnected                            \n`);
+    if (Object.keys(rooms[socket.room].players).length === 0) {
+      delete rooms[socket.room];
+      process.stdout.write(`\rroom #${socket.room} deleted                            \n`);
+    }
   });
+
   socket.on('update', function (newp) {
-    const p = players[newp.name];
+    if (!socket.room)
+      return;
+    const p = rooms[socket.room].players[newp.name];
     if (!p) {
       socket.disconnect();
       return;
@@ -179,11 +216,11 @@ io.on('connection', function (socket) {
     if (!p.alive)
       return;
     if (newp.angleSpd > 0)
-      players[newp.name].angleSpd = MAX_ANGLE_SPEED;
+      rooms[socket.room].players[newp.name].angleSpd = MAX_ANGLE_SPEED;
     else if (newp.angleSpd < 0)
-      players[newp.name].angleSpd = -MAX_ANGLE_SPEED;
+      rooms[socket.room].players[newp.name].angleSpd = -MAX_ANGLE_SPEED;
     else
-      players[newp.name].angleSpd = 0;
+      rooms[socket.room].players[newp.name].angleSpd = 0;
   });
 });