kass/matteo-the-prestige
1
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

add removal of completed games (I think)

Browse Source
This commit is contained in:
Elijah Steres 2020-12-30 18:53:15 -05:00
parent 6656c5cb0c
commit f7d650e559
2 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
static/games_page.css
View File

@ -119,11 +119,9 @@ h2 {
display: grid; display: grid;
grid-template-columns: 60% 40%; grid-template-columns: 60% 40%;
grid-template-areas: grid-template-areas:
"teams info" "teams info" "players info" "update update";
"players players" grid-template-rows: 100px;
"update update"; grid-row-gap: 14px;
grid-template-rows: 130px;
grid-row-gap: 10px;
grid-column-gap: 10px; grid-column-gap: 10px;
flex: 1; flex: 1;
} }
@ -133,7 +131,6 @@ h2 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: space-around;
flex: 1;
} }
.team { .team {
@ -151,7 +148,7 @@ h2 {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-around;
background: #4f545c; background: #4f545c;
padding-top: 8px; padding-top: 8px;
padding-bottom: 4px; padding-bottom: 4px;
@ -203,9 +200,9 @@ h2 {
grid-area: players; grid-area: players;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-around;
align-items: center; align-items: center;
height: max-content; height: 100%;
width: 100%; width: 100%;
} }
@ -223,6 +220,8 @@ h2 {
.update { .update {
grid-area: update; grid-area: update;
margin-right: 10px;
margin-top: 10px;
} }
.update_emoji, .update_text { .update_emoji, .update_text {

25
static/loader.js
View File

@ -1,7 +1,6 @@
$(document).ready(function (){ $(document).ready(function (){
var socket = io.connect(); var socket = io.connect();
var gameslist = []; var gameslist = [];
var maxSlot = 1;
var grid = document.getElementById("container"); var grid = document.getElementById("container");
@ -11,7 +10,7 @@ $(document).ready(function (){
socket.on("states_update", function (json) { //json is an object containing all game updates socket.on("states_update", function (json) { //json is an object containing all game updates
if (Object.keys(json) == 0) { if (Object.keys(json).length == 0) {
$('#footer div').html("No games right now. Why not head over to Discord and start one?"); $('#footer div').html("No games right now. Why not head over to Discord and start one?");
} else { } else {
$('#footer div').html(""); $('#footer div').html("");
@ -23,26 +22,38 @@ $(document).ready(function (){
for (var slotnum = 1; true; slotnum++) { //this is really a while loop but shh don't tell anyone for (var slotnum = 1; true; slotnum++) { //this is really a while loop but shh don't tell anyone
if (slotnum >= grid.children.length) { if (slotnum >= grid.children.length) {
for (var i = 0; i < 3; i ++) { for (var i = 0; i < 3; i ++) {
newBox = document.createElement("DIV"); insertEmpty(grid);
newBox.className = "emptyslot";
grid.appendChild(newBox);
} }
} }
if (grid.children[slotnum].className == "emptyslot") { if (grid.children[slotnum].className == "emptyslot") {
insertGame(slotnum, json[timestamp], timestamp); insertGame(slotnum, json[timestamp], timestamp);
maxSlot = Math.max(maxSlot, slotnum);
break; break;
}; };
}; };
}; };
for (var slotnum = 1; slotnum <= maxSlot; slotnum++) { for (var slotnum = 1; slotnum < grid.children.length; slotnum++) {
if (grid.children[slotnum].timestamp == timestamp) { if (grid.children[slotnum].timestamp == timestamp) {
updateGame(grid.children[slotnum], json[timestamp]); updateGame(grid.children[slotnum], json[timestamp]);
}; };
}; };
}; };
for (var slotnum = 1; slotnum < grid.children.length; slotnum++) {
if (grid.children[slotnum].className == "game" && !(Object.keys(json).includes(grid.children[slotnum].timestamp))) {
grid.removeChild(grid.children[slotnum]);
}
}
while((grid.children.length - 1) % 3 != 0 || grid.children.length == 0) {
insertEmpty(grid);
}
}); });
const insertEmpty = (grid) => {
newBox = document.createElement("DIV");
newBox.className = "emptyslot";
grid.appendChild(newBox);
}
const insertGame = (gridboxnum, gamestate, timestamp) => { const insertGame = (gridboxnum, gamestate, timestamp) => {
var thisBox = grid.children[gridboxnum]; var thisBox = grid.children[gridboxnum];