From 26611780b95c44bc03f67dc1f29a597230c34d79 Mon Sep 17 00:00:00 2001
From: Elijah Steres <elijahsteres@gmail.com>
Date: Wed, 30 Dec 2020 03:50:29 -0500
Subject: [PATCH] allow page to expand as needed

---
 static/loader.js | 25 ++++++++++++++-----------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/static/loader.js b/static/loader.js
index adf4e08..ffd0035 100644
--- a/static/loader.js
+++ b/static/loader.js
@@ -1,8 +1,7 @@
 $(document).ready(function (){
     var socket = io.connect();
     var gameslist = [];
-    var maxslot = 3;
-    var totalslots = 15;
+    var maxSlot = 3;
     var grid = document.getElementById("container");
     
 
@@ -14,17 +13,23 @@ $(document).ready(function (){
         for (const timestamp in json) {
             if (!gameslist.includes(timestamp)) { //adds game to list if not there already
                 gameslist.push(timestamp)
-                var gridBoxes = grid.children;
-                for (var slotnum = 3; slotnum <= Math.min(maxslot, totalslots-1); slotnum++) {
-                    if (gridBoxes[slotnum].className == "emptyslot") {
+                for (var slotnum = 3; true; slotnum++) { //this is really a while loop but don't tell anyone
+                    if (slotnum >= grid.children.length) {
+                        for (var i = 0; i < 3; i ++) {
+                            newBox = document.createElement("DIV");
+                            newBox.className = "emptyslot";
+                            grid.appendChild(newBox);
+                        }
+                    }
+                    if (grid.children[slotnum].className == "emptyslot") {
                         insertGame(slotnum, json[timestamp], timestamp);
-                        maxslot += 1;
+                        maxSlot = Math.max(maxSlot, slotnum);
                         break;
                     };
                 };
             };
 
-            for (var slotnum = 3; slotnum <= Math.min(maxslot, totalslots-1); slotnum++) {
+            for (var slotnum = 3; slotnum <= maxSlot; slotnum++) {
                 if (grid.children[slotnum].timestamp == timestamp) {
                     updateGame(grid.children[slotnum], json[timestamp]);
                 };
@@ -34,11 +39,9 @@ $(document).ready(function (){
 
     const insertGame = (gridboxnum, gamestate, timestamp) => {
         var thisBox = grid.children[gridboxnum];
+        thisBox.className = "game";
+        thisBox.timestamp = timestamp;
         fetch("/static/game.html").then(x=>x.text()).then(gamehtml => {
-            console.log(gamehtml)
-            console.log(thisBox)
-            thisBox.className = "game";
-            thisBox.timestamp = timestamp;
             thisBox.innerHTML = gamehtml;
             updateGame(thisBox, gamestate);
         });