CVE-2022-24781: Session Fixation (CWE-384)
value: Geon is a board game based on solving questions about the Pythagorean Theorem. Malicious users can obtain the uuid from other users, spoof that uuid through the browser console and become co-owners of the target session. This issue is patched in version 1.1.0. No known workaround exists.
CWE description: Authenticating a user, or otherwise establishing a new user session, without invalidating any existing session identifier gives an attacker the opportunity to steal authenticated sessions.
CVSS v3 base score: 7.1
Published: 2022-03-24T21:15Z
Repository: https://github.com/math-geon/Geon
Language: JavaScript
Files changed: backend/src/connectionhandler.js, frontend/Geon.html, frontend/staGeon/main.js, frontend/staGeon/styles.css
Commit date: 2022-02-21 19:18:35 -0300
Commit message: Corrigido saida de usuarios crash do backend se o client manda algo que não seja do tipo string e implementação inicial de contador de usuarios conectados

Co-Authored-By: Lobo Metalúrgico <43734867+lobometalurgico@users.noreply.github.com>

Diff: diff --git a/backend/src/connectionhandler.js b/backend/src/connectionhandler.js
index da10702..4523566 100644
--- a/backend/src/connectionhandler.js
+++ b/backend/src/connectionhandler.js
@@ -1,30 +1,37 @@
 const RoomMaxPersons = 4;
 const UsableHomes = 37;
 
 const ActiveRooms = [];
+const timeouts = [];
 const ids = [];
 
 function cleaner() {
   setTimeout(() => {
     if (ids.length < 1) { return; }
     ActiveRooms.forEach((element, index) => {
       element.Players.forEach((element2, index2) => {
         if (!ids.includes(element2.Id)) {
+          console.log('Disconnecting ' + element2.Id);
+          console.log(ActiveRooms[index].Players[index2]);
           ActiveRooms[index].Players.splice(index2, 1);
           ActiveRooms[index].Players.forEach((element3) => {
             element3.socket.emit('UserLeave', JSON.stringify({ RoomId: element.Id, UserLeaved: element2.Id }));
           });
+          element2.socket.emit('ConnectionFailed');
+          element2.socket.disconnect(0);
         }
       });
     });
     ActiveRooms.forEach((element, index) => {
       if (element.Players.length === 0) {
+        console.log('Closing Room ' + element.Id);
         ActiveRooms.splice(index, 1);
       }
     });
-    // ids = [];
+    console.log('Active Rooms: ' + ActiveRooms.length);
+    console.log('Rooms: ', ActiveRooms);
   }, 5000);
 }
 
 function getRandomString(length) {
   var randomChars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
@@ -35,15 +42,31 @@ function getRandomString(length) {
   return result;
 }
 
 function reconnect(socket) {
   console.log('Reconnect requested');
+  ActiveRooms.forEach((element, index) => {
+    element.Players.forEach((element2, index2) => {
+      if (element2.socket === socket) {
+        const timeouter = {};
+        timeouter[element2.Id] = setTimeout(() => {
+          console.log('Timeout ' + element2.Id);
+          ids.splice(ids.indexOf(element2.Id), 1);
+          timeouts.splice(timeouts.indexOf(timeouter), 1);
+          cleaner();
+        }, 15000);
+        timeouts.push(timeouter);
+        socket.broadcast.emit('Reconnecting', JSON.stringify({ RoomId: element.Id, UserId: element2.Id }));
+      }
+    });
+  });
   socket.broadcast.emit('reconnect');
   cleaner();
 }
 
 function GenerateRoom(socket, Data) {
+  if (typeof Data !== 'string') return;
   var RoomScheme = {
     Id: '',
     Players: [],
     Turn: 0,
   };
@@ -58,13 +81,23 @@ function GenerateRoom(socket, Data) {
   ActiveRooms.push(RoomScheme);
   socket.emit('RoomId', JSON.stringify({ RoomId: RoomScheme.Id }));
 }
 
 function Updater(socket, Data) {
+  if (typeof Data !== 'string') return;
   Data = JSON.parse(Data);
   var UserNewId = getRandomString(12);
   console.log('Updating User ' + Data.oldUserId);
+
+  timeouts.forEach((element, index) => {
+    if (element[Data.oldUserId]) {
+      console.log('User Reconnected');
+      clearTimeout(element[Data.oldUserId]);
+      timeouts.splice(index, 1);
+    }
+  });
+
   ActiveRooms.forEach((element, index) => {
     element.Players.forEach((element2, index2) => {
       if (element2.Id === Data.oldUserId) {
         ActiveRooms[index].Players[index2].Id = UserNewId;
         element2.socket.emit('ChangeID', JSON.stringify({ RoomId: element.Id, oldUserId: Data.oldUserId, newUserId: UserNewId }));
@@ -79,10 +112,16 @@ function Updater(socket, Data) {
 
 function verifyer(socket, executer, Data, UserIn) {
   if (UserIn === undefined) {
     UserIn = true;
   }
+  if (typeof Data !== 'string') {
+    socket.emit('ConnectionFailed');
+    socket.disconnect(0);
+    socket.destroy();
+    return;
+  }
   Data = JSON.parse(Data);
   var RoomContainsUser = false;
   var RoomExists = false;
   ActiveRooms.forEach((element, index) => {
     if (element.Id === Data.RoomId) {
@@ -128,10 +167,11 @@ function LogUserIn(socket, Data) {
     if (element.Id === Data.RoomId) {
       RoomIndex = index;
       ActiveRooms[index].Players.forEach((element2) => {
         element2.socket.emit('NewUser', JSON.stringify({ RoomId: element.Id, EnteredUserId: UserId }));
         socket.emit('NewUser', JSON.stringify({ RoomId: element.Id, EnteredUserId: element2.Id }));
+        socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: element2.Id, NickName: element2.Name }));
       });
     }
   });
 
   const PlayerScheme = {
@@ -168,11 +208,12 @@ function RegisterUserName(socket, Data) {
           console.log('UserName already exists');
           return socket.emit('UserNameAlreadyExists');
         } else if (element2.Id === Data.UserId) {
           ActiveRooms[index].Players[index2].Name = userName;
         }
-        socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: element2.Id, NickName: element2.Name }));
+        console.log('Sending UserName to user: ' + element2.Id + ' ' + userName);
+        element2.socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: Data.UserId, NickName: userName }));
       });
     }
   });
 }
 
diff --git a/frontend/Geon.html b/frontend/Geon.html
index bbab042..4af0bfe 100644
--- a/frontend/Geon.html
+++ b/frontend/Geon.html
@@ -75,16 +75,17 @@
                     </div>
                 </div>
                 <div class="CreditsScreen" style="display: none">
                     <button class="BackToMainMenuFromCredits" onclick="BackToMainMenu('Credits')">Voltar</button>
                     <h1 class="CreditsHeader">Créditos:</h1>
-                    <span><a href="https://github.com/emanuelfranklyn" target="_blank" >Emanuel <a target="_blank" href="https://www.talesgardem.com.br/">Franklyn</a></a>: <a target="_blank" class="EasterEgg" href="https://www.youtube.com/watch?v=KvJHqk4IgGE">Instrutor de programação do jogo.</a></span><br/>
+                    <span><a target="_blank" href="https://github.com/emanuelfranklyn">Emanuel <a target="_blank" href="https://www.talesgardem.com.br/">Franklyn</a></a>: <a target="_blank" class="EasterEgg" href="https://www.youtube.com/watch?v=KvJHqk4IgGE">Instrutor de programação do jogo.</a></span><br/>
                     <span><a target="_blank" href="https://twitter.com/wTOPwOficial">Emmanuel Florêncio</a>: Game Designer, criação de regras.</span><br/>
                     <span><a target="_blank" href="https://www.instagram.com/_filipin_s/">Filipe Santos</a>: Confecção de imagens do jogo.</span><br/>
                     <span><a target="_blank" href="https://www.instagram.com/Gabriel._moreira_.05/">Gabriel Moreira</a>: Programação do jogo, revisão de erros ortográficos.</span><br/>
                     <span><a target="_blank" href="https://www.instagram.com/_joaofrancisco.f/">João Francisco</a>: Revisão de erros ortográficos, criação de regras.</span><br/>
                     <span><a target="_blank" href="https://www.instagram.com/ricardopfilho/">Ricardo Filho</a>: Projeto Escrito, apresentador.</span><br/>
+                    <span><a target="_blank" href="https://github.com/LoboMetalurgico">Lobo </a> <a target="_blank" href="https://beta.allonsve.com/">Metalurgico</a>: Contribuidor, progamação</span><br/>
                 </div>
                 <div class="ConnectingScreen" style="display: none">
                     <h1 class="ConnectingText">Conectando ao servidor...</h1>
                     <div class="ProgressBar">
                         <div class="ProgressProgressBar"></div>
@@ -133,11 +134,11 @@
                             <input class="QuestionTextInput" required='required' type="text" placeholder="Resposta" onInput="HipotenusaResulver()" onPropertychange="HipotenusaResulver()">
                             <input class="QuestionTextSubmit" type="submit" value="Enviar" disabled>
                         </form>      
                     </div>
                     <div class="PlayerInTheRoom">
-                        <p class="PlayerInTheRoomHeader">Jogadores na sala:</p>
+                        <p class="PlayerInTheRoomHeader">Jogadores na sala: (0/4)</p>
                         <div class="Players"></div>
                     </div>
                     <div class="Dice" onclick="RunDice()" style="background-image: url('/staGeon/resources/DiceIcon.png');">
                         <div class="DiceNumber" style="display: none">7</div>
                     </div>
diff --git a/frontend/staGeon/main.js b/frontend/staGeon/main.js
index f818e4e..aabf8f4 100644
--- a/frontend/staGeon/main.js
+++ b/frontend/staGeon/main.js
@@ -74,38 +74,73 @@ function Loaded() {
     document.getElementsByClassName('Losing')[0].style.display = 'block';
   });
 
   socket.on('NewUser', (Data) => {
     Data = JSON.parse(Data);
-    CreateUsers(Data.EnteredUserId);
+    if (!document.getElementById(Data.EnteredUserId)) {
+      CreateUsers(Data.EnteredUserId);
+    }
     AddUserPawn();
     const Playrs = [...document.getElementsByClassName('Players')[0].children];
     Playrs[0].style.webkitTextStroke = '1px #FFF';
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   });
 
   socket.on('UserNameInformation', (Data) => {
+    console.log('Received UserNameInformation: ' + Data);
     Data = JSON.parse(Data);
     const Players = [...document.getElementsByClassName('Players')[0].children];
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
     Data.NickName = Data.NickName.split('>').join(' ');
     Data.NickName = Data.NickName.split('<').join(' ');
     Data.NickName = Data.NickName.split('/').join(' ');
+    var userFounded = false;
+    console.log(Data.UserId);
     Players.forEach((element) => {
       if (element.id === Data.UserId) {
-        playingPlayers.push({
-          id: Data.UserId,
-          name: Data.NickName,
-        });
-        element.innerHTML = Data.UserId === UserId ? `Você(${Data.NickName})` : Data.NickName;
+        userFounded = true;
+        if (playingPlayers.find((object) => { return object.id === Data.UserId; })) {
+          const player = playingPlayers.find((object) => { return object.id === Data.UserId; });
+          playingPlayers[player.index].name = Data.NickName;
+          console.log('Updated user on the list: ' + JSON.stringify(playingPlayers));
+        } else {
+          playingPlayers.push({
+            id: Data.UserId,
+            name: Data.NickName,
+            index: playingPlayers.length,
+          });
+          console.log('Added new user to the list: ' + JSON.stringify(playingPlayers));
+        }
+        element.innerHTML = Data.UserId === UserId ? `Você (${Data.NickName})` : Data.NickName;
       }
     });
+    if (!userFounded) {
+      playingPlayers.push({
+        id: Data.UserId,
+        name: Data.NickName,
+        index: playingPlayers.length,
+      });
+      console.log('Created new user to the list: ' + JSON.stringify(playingPlayers));
+      console.log(Data.UserId);
+      const Player = document.createElement('div');
+      Player.className = 'PlayerWrapper';
+      Player.id = Data.UserId;
+      Player.innerHTML = Data.UserId === UserId ? `Você (${Data.NickName})` : Data.NickName;
+      document.getElementsByClassName('Players')[0].appendChild(Player);
+    }
   });
 
   socket.on('UserLeave', (Data) => {
     Data = JSON.parse(Data);
     if (document.getElementById(Data.UserLeaved)) {
       document.getElementById(Data.UserLeaved).remove();
     }
+    if (playingPlayers.find((object) => { return object.id === Data.UserId; })) {
+      playingPlayers.splice(playingPlayers.find((object) => { return object.id === Data.UserId; }).index, 1);
+    }
+    document.getElementsByClassName('Players')[0].children[0].style.webkitTextStroke = '1px #FFF';
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
     AddUserPawn();
   });
 
   socket.on('FullRoom', () => {
     document.getElementsByClassName('MenuBackground')[0].style.display = 'block';
@@ -120,10 +155,11 @@ function Loaded() {
     UserName = '';
     const Playrs = [...document.getElementsByClassName('Players')[0].children];
     Playrs.forEach((element, index) => {
       element.remove();
     });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
     playingPlayers = [];
   });
 
   socket.on('RoomNotExists', () => {
     document.getElementsByClassName('MenuBackground')[0].style.display = 'block';
@@ -138,10 +174,11 @@ function Loaded() {
     UserName = '';
     const Playrs = [...document.getElementsByClassName('Players')[0].children];
     Playrs.forEach((element, index) => {
       element.remove();
     });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
     playingPlayers = [];
     document.getElementById('C0').style.top = 0 + 'vw';
     document.getElementById('C0').style.left = 0 + 'vw';
     document.getElementById('C1').style.top = 0 + 'vw';
     document.getElementById('C1').style.left = 0 + 'vw';
@@ -157,10 +194,25 @@ function Loaded() {
   socket.on('SetID', (id) => {
     UserId = id;
     console.log('My new ID is: ' + id);
   });
 
+  socket.on('Reconnecting', (Data) => {
+    Data = JSON.parse(Data);
+
+    if (Data.RoomId !== CurrentRoom) return;
+
+    const Players = [...document.getElementsByClassName('Players')[0].children];
+
+    Players.forEach((element) => {
+      if (element.id === Data.UserId) {
+        element.innerHTML = 'Reconnecting...';
+      }
+    });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
+  });
+
   socket.on('reconnect', () => {
     console.log('Reconnect!');
     socket.emit('Reconnector', JSON.stringify({ oldUserId: UserId }));
   });
 
@@ -170,25 +222,34 @@ function Loaded() {
     Data = JSON.parse(Data);
     const Players = [...document.getElementsByClassName('Players')[0].children];
     Players.forEach((element, index) => {
       if (element.id === Data.oldUserId) {
         element.id = Data.newUserId;
-        playingPlayers.find((object) => { return object.id === Data.oldUserId; }).id = Data.newUserId;
+        const player = playingPlayers.find((object) => { return object.id === Data.oldUserId; });
+        if (player) {
+          playingPlayers[player.index].id = Data.newUserId;
+          console.log('changed id actual user NewId:' + Data.newUserId + ' OldId:' + Data.oldUserId + ' Index:' + player.index + ' Full Object:' + JSON.stringify(playingPlayers[player.index]));
+        }
       }
     });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
     UserId = Data.newUserId;
   });
 
   socket.on('UpdateUserId', (Data) => {
     Data = JSON.parse(Data);
     const Players = [...document.getElementsByClassName('Players')[0].children];
     Players.forEach((element, index) => {
       if (element.id === Data.OldId) {
         element.id = Data.NewId;
-        playingPlayers.find((object) => { return object.id === Data.OldId; }).id = Data.NewId;
+        const checkPlayer = playingPlayers.find((object) => { return object.id === Data.OldId; });
+        if (!checkPlayer) return;
+        playingPlayers[checkPlayer.index].id = Data.NewId;
+        console.log('Updated some user ID: ' + Data.NewId + ' OldId:' + Data.OldId + ' Index:' + checkPlayer.index + ' Full Object:' + JSON.stringify(playingPlayers[checkPlayer.index]));
       }
     });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   });
 
   socket.on('ConnectionFailed', () => {
     document.getElementsByClassName('ErrorScreen')[0].style.display = 'block';
     CurrentRoom = '';
@@ -241,15 +302,17 @@ function Loaded() {
     if (Row < 0) {
       Row = 0;
     }
     document.getElementById('C' + UserIndex.toString()).style.top = (Math.floor(Collumn - 1) * 7) + 'vw';
     document.getElementById('C' + UserIndex.toString()).style.left = (Math.floor(Row) * 7) + 'vw';
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   });
   socket.on('QuestionToAnswer', (Data) => {
     questionPopupToRespond = true;
     Data = JSON.parse(Data);
     document.getElementsByClassName('QuestionInput')[0].id = 'popup';
+    document.getElementsByClassName('QuestionTextInput')[0].value = '';
     setTimeout(() => { document.getElementsByClassName('QuestionInput')[0].id = ''; }, 300);
     document.getElementsByClassName('QuestionInput')[0].style.display = 'block';
     document.getElementsByClassName('SideA')[0].innerHTML = Data.SideA;
     document.getElementsByClassName('SideB')[0].innerHTML = Data.SideB;
   });
@@ -265,12 +328,16 @@ function Loaded() {
 
   socket.on('Turn', (Data) => {
     Data = JSON.parse(Data);
     const Playrs = [...document.getElementsByClassName('Players')[0].children];
     Playrs.forEach((element, index) => {
-      var userName = playingPlayers.find((object) => { return object.id === element.id; }).name || 'Aguardando...';
-      if (element.id === UserId) userName = `Você(${userName})`;
+      var userName = playingPlayers.find((object) => { return object.id === element.id; });
+      console.log('UserName:' + userName.name);
+      console.log('object:' + JSON.stringify(userName));
+      if (!userName) { userName = 'Aguardando...'; } else { userName = userName.name; }
+      console.log('UserName:' + userName.name);
+      if (element.id === UserId) userName = `Você (${userName})`;
       if (index === Data.Turn) {
         element.style.webkitTextStroke = '1px #FFFFFF';
         element.innerHTML = userName + ' <--';
       } else {
         element.style.webkitTextStroke = '0px #0000';
@@ -284,10 +351,11 @@ function Loaded() {
         element.style.color = '#FFCC33';
       } else if (index === 3) {
         element.style.color = '#FFAAFF';
       }
     });
+    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   });
 
   socket.on('UserNameAlreadyExists', () => {
     console.log('Let\'s change my name!');
 
@@ -414,11 +482,10 @@ function RunDice() {
   socket.emit('RunDice', JSON.stringify({ RoomId: CurrentRoom, UserId: UserId }));
 }
 
 function AddUserPawn() {
   const Players = [...document.getElementsByClassName('Players')[0].children];
-  Players.length -= 1;
   if (Players.length === 2) {
     document.getElementById('C0').style.display = 'block';
     document.getElementById('C1').style.display = 'block';
     document.getElementById('C2').style.display = 'none';
     document.getElementById('C3').style.display = 'none';
@@ -436,10 +503,11 @@ function AddUserPawn() {
     document.getElementById('C0').style.display = 'block';
     document.getElementById('C1').style.display = 'none';
     document.getElementById('C2').style.display = 'none';
     document.getElementById('C3').style.display = 'none';
   }
+  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
 }
 
 function HipotenusaResulver() {
   if (document.getElementsByClassName('QuestionTextInput')[0].value.length > 0 && !isNaN(document.getElementsByClassName('QuestionTextInput')[0].value)) {
     document.getElementsByClassName('QuestionTextSubmit')[0].disabled = false;
@@ -476,10 +544,11 @@ function Win() {
   UserName = '';
   const Playrs = [...document.getElementsByClassName('Players')[0].children];
   Playrs.forEach((element, index) => {
     element.remove();
   });
+  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   playingPlayers = [];
   document.getElementById('C0').style.top = 0 + 'vw';
   document.getElementById('C0').style.left = 0 + 'vw';
   document.getElementById('C1').style.top = 0 + 'vw';
   document.getElementById('C1').style.left = 0 + 'vw';
@@ -503,10 +572,11 @@ function Lose() {
   UserName = '';
   const Playrs = [...document.getElementsByClassName('Players')[0].children];
   Playrs.forEach((element, index) => {
     element.remove();
   });
+  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
   playingPlayers = [];
   document.getElementById('C0').style.top = 0 + 'vw';
   document.getElementById('C0').style.left = 0 + 'vw';
   document.getElementById('C1').style.top = 0 + 'vw';
   document.getElementById('C1').style.left = 0 + 'vw';
diff --git a/frontend/staGeon/styles.css b/frontend/staGeon/styles.css
index 57ade86..b52194a 100644
--- a/frontend/staGeon/styles.css
+++ b/frontend/staGeon/styles.css
@@ -1078,11 +1078,10 @@ body {
     margin-top: 8vw;
     width: 5vw;
     height: 5vw;
     margin-left: 12vw;
     font-size: 3vw;
-    align: right;
 }
 .SideB {
     position: absolute;
     margin-top: 17vw;
     width: 10vw;

Vulnerable code:     // ids = [];
        socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: element2.Id, NickName: element2.Name }));
                    <span><a href="https://github.com/emanuelfranklyn" target="_blank" >Emanuel <a target="_blank" href="https://www.talesgardem.com.br/">Franklyn</a></a>: <a target="_blank" class="EasterEgg" href="https://www.youtube.com/watch?v=KvJHqk4IgGE">Instrutor de programação do jogo.</a></span><br/>
                        <p class="PlayerInTheRoomHeader">Jogadores na sala:</p>
    CreateUsers(Data.EnteredUserId);
        playingPlayers.push({
          id: Data.UserId,
          name: Data.NickName,
        });
        element.innerHTML = Data.UserId === UserId ? `Você(${Data.NickName})` : Data.NickName;
        playingPlayers.find((object) => { return object.id === Data.oldUserId; }).id = Data.newUserId;
        playingPlayers.find((object) => { return object.id === Data.OldId; }).id = Data.NewId;
      var userName = playingPlayers.find((object) => { return object.id === element.id; }).name || 'Aguardando...';
      if (element.id === UserId) userName = `Você(${userName})`;
  Players.length -= 1;
    align: right;
Fixed code: const timeouts = [];
          console.log('Disconnecting ' + element2.Id);
          console.log(ActiveRooms[index].Players[index2]);
          element2.socket.emit('ConnectionFailed');
          element2.socket.disconnect(0);
        console.log('Closing Room ' + element.Id);
    console.log('Active Rooms: ' + ActiveRooms.length);
    console.log('Rooms: ', ActiveRooms);
  ActiveRooms.forEach((element, index) => {
    element.Players.forEach((element2, index2) => {
      if (element2.socket === socket) {
        const timeouter = {};
        timeouter[element2.Id] = setTimeout(() => {
          console.log('Timeout ' + element2.Id);
          ids.splice(ids.indexOf(element2.Id), 1);
          timeouts.splice(timeouts.indexOf(timeouter), 1);
          cleaner();
        }, 15000);
        timeouts.push(timeouter);
        socket.broadcast.emit('Reconnecting', JSON.stringify({ RoomId: element.Id, UserId: element2.Id }));
      }
    });
  });
  if (typeof Data !== 'string') return;
  if (typeof Data !== 'string') return;

  timeouts.forEach((element, index) => {
    if (element[Data.oldUserId]) {
      console.log('User Reconnected');
      clearTimeout(element[Data.oldUserId]);
      timeouts.splice(index, 1);
    }
  });

  if (typeof Data !== 'string') {
    socket.emit('ConnectionFailed');
    socket.disconnect(0);
    socket.destroy();
    return;
  }
        socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: element2.Id, NickName: element2.Name }));
        console.log('Sending UserName to user: ' + element2.Id + ' ' + userName);
        element2.socket.emit('UserNameInformation', JSON.stringify({ RoomId: element.Id, UserId: Data.UserId, NickName: userName }));
                    <span><a target="_blank" href="https://github.com/emanuelfranklyn">Emanuel <a target="_blank" href="https://www.talesgardem.com.br/">Franklyn</a></a>: <a target="_blank" class="EasterEgg" href="https://www.youtube.com/watch?v=KvJHqk4IgGE">Instrutor de programação do jogo.</a></span><br/>
                    <span><a target="_blank" href="https://github.com/LoboMetalurgico">Lobo </a> <a target="_blank" href="https://beta.allonsve.com/">Metalurgico</a>: Contribuidor, progamação</span><br/>
                        <p class="PlayerInTheRoomHeader">Jogadores na sala: (0/4)</p>
    if (!document.getElementById(Data.EnteredUserId)) {
      CreateUsers(Data.EnteredUserId);
    }
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    console.log('Received UserNameInformation: ' + Data);
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    var userFounded = false;
    console.log(Data.UserId);
        userFounded = true;
        if (playingPlayers.find((object) => { return object.id === Data.UserId; })) {
          const player = playingPlayers.find((object) => { return object.id === Data.UserId; });
          playingPlayers[player.index].name = Data.NickName;
          console.log('Updated user on the list: ' + JSON.stringify(playingPlayers));
        } else {
          playingPlayers.push({
            id: Data.UserId,
            name: Data.NickName,
            index: playingPlayers.length,
          });
          console.log('Added new user to the list: ' + JSON.stringify(playingPlayers));
        }
        element.innerHTML = Data.UserId === UserId ? `Você (${Data.NickName})` : Data.NickName;
    if (!userFounded) {
      playingPlayers.push({
        id: Data.UserId,
        name: Data.NickName,
        index: playingPlayers.length,
      });
      console.log('Created new user to the list: ' + JSON.stringify(playingPlayers));
      console.log(Data.UserId);
      const Player = document.createElement('div');
      Player.className = 'PlayerWrapper';
      Player.id = Data.UserId;
      Player.innerHTML = Data.UserId === UserId ? `Você (${Data.NickName})` : Data.NickName;
      document.getElementsByClassName('Players')[0].appendChild(Player);
    }
    if (playingPlayers.find((object) => { return object.id === Data.UserId; })) {
      playingPlayers.splice(playingPlayers.find((object) => { return object.id === Data.UserId; }).index, 1);
    }
    document.getElementsByClassName('Players')[0].children[0].style.webkitTextStroke = '1px #FFF';
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
  socket.on('Reconnecting', (Data) => {
    Data = JSON.parse(Data);

    if (Data.RoomId !== CurrentRoom) return;

    const Players = [...document.getElementsByClassName('Players')[0].children];

    Players.forEach((element) => {
      if (element.id === Data.UserId) {
        element.innerHTML = 'Reconnecting...';
      }
    });
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
  });

        const player = playingPlayers.find((object) => { return object.id === Data.oldUserId; });
        if (player) {
          playingPlayers[player.index].id = Data.newUserId;
          console.log('changed id actual user NewId:' + Data.newUserId + ' OldId:' + Data.oldUserId + ' Index:' + player.index + ' Full Object:' + JSON.stringify(playingPlayers[player.index]));
        }
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
        const checkPlayer = playingPlayers.find((object) => { return object.id === Data.OldId; });
        if (!checkPlayer) return;
        playingPlayers[checkPlayer.index].id = Data.NewId;
        console.log('Updated some user ID: ' + Data.NewId + ' OldId:' + Data.OldId + ' Index:' + checkPlayer.index + ' Full Object:' + JSON.stringify(playingPlayers[checkPlayer.index]));
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
    document.getElementsByClassName('QuestionTextInput')[0].value = '';
      var userName = playingPlayers.find((object) => { return object.id === element.id; });
      console.log('UserName:' + userName.name);
      console.log('object:' + JSON.stringify(userName));
      if (!userName) { userName = 'Aguardando...'; } else { userName = userName.name; }
      console.log('UserName:' + userName.name);
      if (element.id === UserId) userName = `Você (${userName})`;
    document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;
  document.getElementsByClassName('PlayerInTheRoomHeader')[0].innerHTML = `Jogadores na sala: (${playingPlayers.length}/4)`;