users add username, generates list for admin

public/admin.html

@@ -9,6 +9,12 @@
         <dl>
             <dt>Number of Current Students</dt>
             <dd id="num-users">0</dd>
+            <dt>Roster</dt>
+            <dd id="roster">
+                <ul>
+                    
+                </ul>
+            </dd>
             <dt>Complete Count</dt>
             <dd id="current-complete">0</dd>
         </dl>

public/js/admin.js

@@ -11,6 +11,16 @@ socket.on('prompt completed', function (data) {
     document.querySelector('#current-complete').innerHTML = data;
 });
 
+socket.on('username list', function (usernames) {
+    const roster = document.querySelector('ul');
+    roster.innerHTML = "";
+    for(user of usernames){
+        const newLi = document.createElement('li');
+        newLi.innerHTML = user;
+        roster.appendChild(newLi);
+    }
+});
+
 document.querySelector('form').addEventListener('submit', (event)=>{
     event.preventDefault();
     document.querySelector('#current-complete').innerHTML = 0;

public/js/index.js

@@ -1,16 +1,26 @@
 const socket = io.connect('/');
 const button = document.querySelector('button');
+
+let username;
+while(!username){
+    username = prompt("Enter a username for this session");
+    socket.emit('user joined', username);
+}
+
 socket.on('prompt sent', function (prompt) {
     if(prompt !== document.querySelector('dd').innerHTML){
         button.removeAttribute("disabled");
         document.querySelector('dd').innerHTML = prompt;
     }
 });
+
 button.addEventListener('click', (event)=>{
     button.setAttribute("disabled",true);
     socket.emit('prompt completed');
 });
+
 window.addEventListener("beforeunload", (e)=>{
+    socket.emit('user dropped', username);
     if(button.getAttribute("disabled")){
         socket.emit('remove completed');
     }

server.js

@@ -3,7 +3,7 @@ const app = express();
 const PORT = process.env.PORT || 3000;
 const http = require('http').Server(app);
 const socketserver = require('socket.io')(http);
-
+const usernames = [];
 app.use(express.static('public'));
 
 let connectedUsers = 0;
@@ -12,6 +12,7 @@ let currentPrompt = "Nothing Yet";
 socketserver.on('connection', (socket)=>{
     connectedUsers++;
     socketserver.emit('users connected', connectedUsers);
+    socketserver.emit('username list', usernames);
     socketserver.emit('prompt sent', currentPrompt);
     socket.on('disconnect', ()=>{
         connectedUsers--;
@@ -30,6 +31,10 @@ socketserver.on('connection', (socket)=>{
         currentComplete--;
         socketserver.emit('prompt completed', currentComplete);
     });
+    socket.on('user joined', (username)=>{
+        usernames.push(username);
+        socketserver.emit('username list', usernames);
+    });
 });
 
 http.listen(PORT);