it still looks bad

src/app.py

@@ -8,6 +8,7 @@ from logging.config import dictConfig
 from flask_socketio import SocketIO, emit, join_room, leave_room
 import json
 
+
 # Loading logging preferences
 with open("logger.json", "r") as f:
 	dconf = json.load(f)
@@ -20,6 +21,7 @@ app = Flask(__name__)
 app.logger.info("Flask app loaded at " + __name__)
 app.config.from_object(Config)
 
+
 # Version allows css / js to load instead of taking hours to update even on run smh
 version = rint(0, 300000000)
 
@@ -52,8 +54,12 @@ def host():
 		games[hash]["negs"] = form.negs.data
 		app.logger.debug("Game host at %s", hostcode)
 		app.logger.info("Game created at %s", hash)
+		session.permanent = True
 		return resp
-	default = [10, 20, 15, 5]
+
+	with open("src/templates/games.json", "r") as f:
+		tmp = json.load(f)
+	default = [tmp["tossup"], tmp["bonus"], tmp["power"], tmp["negs"]]
 	return render_template('host.html', title="Host Game", version=str(version), form=form, default=default)
 
 
@@ -97,6 +103,7 @@ def join():
 			return resp
 		else:
 			return render_template('gamenotfound.html', title="Join Game", version=str(version))
+	session.permanent = True
 	return render_template('join.html', title="Join Game", version=str(version), form=form)
 
 
@@ -114,10 +121,7 @@ socketio = SocketIO(app)
 #    V
 
 
-@socketio.on('json')
+
-def handle_json(json):
-	print('received message: ' + str(json))
-	emit('json', json)
 
 
 # Checks when a player / host joins the room
@@ -132,7 +136,8 @@ def on_join(data):
 		if dohash(gid) == room:
 			username = "host"
 	join_room(str(room))
-	emit('player_join_event', games[room]["players"], room=room)
+	msg = {"locked": games[room]["locked"], "players": games[room]["players"]}
+	emit('player_join_event', msg, room=room)
 
 
 # When the host sends data to server
@@ -144,35 +149,64 @@ def host_msg(data):
 		return
 	msg = data["data"]
 	if "lock" in msg.keys():
-		pass  # lock buzzers
+		games[room]["locked"] = True
+		emit("locked_event", msg, room=room)
+	elif "unlock" in msg.keys():
+		games[room]["locked"] = False
+		emit("unlocked_event", msg, room=room)
 	elif "kick" in msg.keys():
 		msg["url"] = url_for('kick')
 		username = msg["kick"]
 		del games[room]["players"][username]
 		emit("player_kick_event", msg, room=room)
+	elif "close" in msg.keys():
+		emit("host_leave_event", {"host": 0}, room=room)
 	elif "tossup" in msg.keys():
-		pass  # give player points
+		if games[room]["buzzed"] == "":
+			return
+		games[room]["players"][games[room]["buzzed"]] += games[room]["tossup"]
+		username = games[room]["buzzed"]
+		games[room]["buzzed"] = ""
+		emit("update_score_event", {"username":username, "players": games[room]["players"]}, room=room)
+		emit("unlocked_event", {}, room=room)
 	elif "bonus" in msg.keys():
-		pass  # give player points
+		if games[room]["buzzed"] == "":
+			return
+		games[room]["players"][games[room]["buzzed"]] += games[room]["bonus"]
+		username = games[room]["buzzed"]
+		games[room]["buzzed"] = ""
+		emit("update_score_event", {"username":username, "players": games[room]["players"]}, room=room)
+		emit("unlocked_event", {}, room=room)
 	elif "power" in msg.keys():
-		pass  # give player points
+		if games[room]["buzzed"] == "":
+			return
+		games[room]["players"][games[room]["buzzed"]] += games[room]["power"]
+		username = games[room]["buzzed"]
+		games[room]["buzzed"] = ""
+		emit("update_score_event", {"username":username, "players": games[room]["players"]}, room=room)
+		emit("unlocked_event", {}, room=room)
 	elif "negs" in msg.keys():
-		pass  # give player points
+		if games[room]["buzzed"] == "":
-	elif "amount" in msg.keys():
+			return
-		pass  # give player points
+		games[room]["players"][games[room]["buzzed"]] -= games[room]["negs"]
-
+		username = games[room]["buzzed"]
+		games[room]["buzzed"] = ""
+		emit("update_score_event", {"username":username, "players": games[room]["players"]}, room=room)
+		emit("unlocked_event", {}, room=room)
 
 # When the player buzzes
 @socketio.on('buzz')
 def buzz(data):
 	room = data["room"]
-	emit("buzz", data, room=room)  # Just send it back
+	if not games[room]["locked"]:
+		games[room]["buzzed"] = data["username"]
+		emit("buzz_event", data, room=room)  # Just send it back
+		emit("locked_event", {}, room=room)
 
 
 # When a player / host leaves
 @socketio.on('leave')
 def on_leave(data):
-	print("player leave")
 	room = data['room']
 	username = ""
 	if "username" in data.keys():
@@ -180,9 +214,11 @@ def on_leave(data):
 	else:
 		gid = data["_gid"]
 		if dohash(gid) == room:
-			username = "host"
+			leave_room(str(room))
+			emit('host_leave_event', {'host': 0}, room=room)
+			return
 	del games[room]["players"][username]
-	leave_room(room)
+	leave_room(str(room))
 	emit('player_leave_event', {"player": username}, room=room)
 
 

src/config.py

@@ -1,8 +1,10 @@
 from dotenv import load_dotenv
 import os
+from datetime import timedelta
 
 load_dotenv()
 
 
 class Config(object):
 	SECRET_KEY = os.getenv('SECRET_KEY') or "debug-secret-key-for-testing-only"
+	PERMANENT_SESSION_LIFETIME = timedelta(days=31)

src/static/game.js

@@ -3,6 +3,7 @@ var socket = io();
 code = document.getElementById("code").value;
 name = document.getElementById("name").value;
 kickurl = document.getElementById("kick").value;
+hostleave = document.getElementById("hostleave").value;
 
 function removeAllChildren(e) {
 	var child = e.lastElementChild;
@@ -17,7 +18,8 @@ socket.on("connect", function() {
 	socket.emit("join", {"username": name, "room": code, "_gid": ""});
 })
 
-socket.on("player_join_event", function(data) {
+socket.on("player_join_event", function(datas) {
+	data = datas["players"]
 	div = document.getElementById("sidebar");
 	removeAllChildren(div);
 	if (Object.keys(data).length == 0) {
@@ -32,11 +34,20 @@ socket.on("player_join_event", function(data) {
 		playerDisplay.setAttribute("id", keys[key]);
 		playerDisplay.setAttribute("class", "playertag");
 		var playerLink = document.createElement("p");
-		playerLink.appendChild(document.createTextNode(keys[key]));
+		playerLink.appendChild(document.createTextNode(keys[key] + ": "));
+		var playerPoints = document.createElement("p");
+		playerPoints.setAttribute("id", keys[key] + "_points");
+		playerPoints.appendChild(document.createTextNode(data[keys[key]].toString()));
 		playerDisplay.appendChild(playerLink);
+		playerDisplay.appendChild(playerPoints);
 		playerDisplay.appendChild(document.createElement("br"));
 		div.appendChild(playerDisplay);
 	}
+	locked = datas["locked"]
+	if (locked) {
+		lock();
+	}
+
 });
 
 socket.on("player_leave_event", function(data) {
@@ -52,8 +63,68 @@ socket.on("player_kick_event", function(data) {
 		element.parentNode.removeChild(element);
 	}
 
+});
+
+socket.on("host_leave_event", function(data) {
+	window.location = hostleave;
 })
 
+socket.on("buzz_event", function(data) {
+	var audio = new Audio('/static/buzz.mp3');
+	audio.play();
+	var player = data["username"];
+	document.getElementById(player).childNodes[0].style.color = "#2c26e2";
+	document.getElementById(player).childNodes[1].style.color = "#2c26e2";
+})
+socket.on("update_score_event", function(datas) {
+
+	var player = datas["username"];
+	document.getElementById(player).childNodes[0].style.color = "";
+	document.getElementById(player).childNodes[1].style.color = "";
+
+	data = datas["players"]
+	div = document.getElementById("sidebar");
+	removeAllChildren(div);
+	if (Object.keys(data).length == 0) {
+		var keepSidebarOpen = document.createElement("input");
+		keepSidebarOpen.setAttribute("type", "hidden");
+		div.appendChild(keepSidebarOpen);
+		return
+	}
+	var keys = Object.keys(data);
+	for (var key in keys) {
+		var playerDisplay = document.createElement("div");
+		playerDisplay.setAttribute("id", keys[key]);
+		playerDisplay.setAttribute("class", "playertag");
+		var playerLink = document.createElement("p");
+		playerLink.appendChild(document.createTextNode(keys[key] + ": "));
+		var playerPoints = document.createElement("p");
+		playerPoints.setAttribute("id", keys[key] + "_points");
+		playerPoints.appendChild(document.createTextNode(data[keys[key]].toString()));
+		playerDisplay.appendChild(playerLink);
+		playerDisplay.appendChild(playerPoints);
+		playerDisplay.appendChild(document.createElement("br"));
+		div.appendChild(playerDisplay);
+	}
+})
+
+socket.on("locked_event", function(data) {
+	lock();
+})
+socket.on("unlocked_event", function(data) {
+	unlock();
+})
+
+function lock() {
+	var button = document.getElementById("b_buzzer");
+	button.innerHTML = "LOCKED";
+}
+
+function unlock() {
+	var button = document.getElementById("b_buzzer");
+	button.innerHTML = "BUZZ! [SPACE]";
+}
+
 function buzz() {
 	// when client hits buzz
 	socket.emit("buzz", {"username": name, "room": code, "_gid": ""});
@@ -68,7 +139,6 @@ $(document).on('keypress', function(e) {
 
 window.onbeforeunload = function leave() {
 	// when client leaves
-	console.log("leave")
 	socket.emit("leave", {"username": name, "room": code, "_gid": ""});
 }
 

src/static/host.js

@@ -1,6 +1,7 @@
 var socket = io();
 
 code = document.getElementById("copycode").value;
+close_url = document.getElementById("close_url").value;
 
 function readCookie(name) {
     var nameEQ = name + "=";
@@ -42,7 +43,9 @@ window.onbeforeunload = function leave() {
 }
 
 
-socket.on("player_join_event", function(data) {
+socket.on("player_join_event", function(datas) {
+
+	data = datas["players"]
 	div = document.getElementById("sidebar");
 	removeAllChildren(div);
 	if (Object.keys(data).length == 0) {
@@ -57,11 +60,15 @@ socket.on("player_join_event", function(data) {
 		playerDisplay.setAttribute("id", keys[key]);
 		playerDisplay.setAttribute("class", "playertag");
 		var playerLink = document.createElement("p");
-		playerLink.appendChild(document.createTextNode(keys[key]));
+		playerLink.appendChild(document.createTextNode(keys[key] + ": "));
+		var playerPoints = document.createElement("p");
+		playerPoints.setAttribute("id", keys[key] + "_points");
+		playerPoints.appendChild(document.createTextNode(data[keys[key]].toString()));
 		var removeLink = document.createElement("a");
 		removeLink.setAttribute("onclick", "removePlayer('" + keys[key] + "');");
 		removeLink.appendChild(document.createTextNode("Kick"));
 		playerDisplay.appendChild(playerLink);
+		playerDisplay.appendChild(playerPoints);
 		playerDisplay.appendChild(removeLink);
 		playerDisplay.appendChild(document.createElement("br"));
 		div.appendChild(playerDisplay);
@@ -83,8 +90,138 @@ function removePlayer(playername) {
 	send({"kick": playername});
 }
 
-socket.on("buzz", function(message) {
+function closeGame() {
+	send({"close": "game"});
+
+	setTimeout(function(){ window.location = close_url; }, 10);
+}
+
+function tossup() {
+	send({"tossup": 0});
+}
+function bonus() {
+	send({"bonus": 0});
+}
+
+function power() {
+	send({"power": 0});
+}
+
+function neg() {
+	send({"negs": 0});
+}
+
+socket.on("buzz_event", function(data) {
 	var audio = new Audio('/static/buzz.mp3');
 	audio.play();
+	var player = data["username"];
+	document.getElementById(player).childNodes[0].style.color = "#2c26e2";
+	document.getElementById(player).childNodes[1].style.color = "#2c26e2";
+	game = document.getElementById("game");
+	var tossup = document.createElement("a");
+	tossup.setAttribute("onclick", "tossup();");
+	tossup.setAttribute("id", "tossup");
+	tossup.innerHTML = "TOSSUP [T]"
+	var bonus = document.createElement("a");
+	bonus.setAttribute("onclick", "bonus();");
+	bonus.setAttribute("id", "bonus");
+	bonus.innerHTML = "BONUS [B]"
+	var power = document.createElement("a");
+	power.setAttribute("onclick", "power();");
+	power.setAttribute("id", "power");
+	power.innerHTML = "POWER [P]"
+	var negs = document.createElement("a");
+	negs.setAttribute("onclick", "neg();");
+	negs.setAttribute("id", "negs");
+	negs.innerHTML = "NEG [N]"
+	game.appendChild(tossup);
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(bonus);
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(power);
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(document.createElement("br"));
+	game.appendChild(negs);
+	lockBuzzers();
+
 })
 
+socket.on("update_score_event", function(datas) {
+
+	var player = datas["username"];
+	document.getElementById(player).childNodes[0].style.color = "";
+	document.getElementById(player).childNodes[1].style.color = "";
+	data = datas["players"]
+	div = document.getElementById("sidebar");
+	removeAllChildren(div);
+	if (Object.keys(data).length == 0) {
+		var keepSidebarOpen = document.createElement("input");
+		keepSidebarOpen.setAttribute("type", "hidden");
+		div.appendChild(keepSidebarOpen);
+		return
+	}
+	var keys = Object.keys(data);
+	for (var key in keys) {
+		var playerDisplay = document.createElement("div");
+		playerDisplay.setAttribute("id", keys[key]);
+		playerDisplay.setAttribute("class", "playertag");
+		var playerLink = document.createElement("p");
+		playerLink.appendChild(document.createTextNode(keys[key] + ": "));
+		var playerPoints = document.createElement("p");
+		playerPoints.setAttribute("id", keys[key] + "_points");
+		playerPoints.appendChild(document.createTextNode(data[keys[key]].toString()));
+		var removeLink = document.createElement("a");
+		removeLink.setAttribute("onclick", "removePlayer('" + keys[key] + "');");
+		removeLink.appendChild(document.createTextNode("Kick"));
+		playerDisplay.appendChild(playerLink);
+		playerDisplay.appendChild(playerPoints);
+		playerDisplay.appendChild(removeLink);
+		playerDisplay.appendChild(document.createElement("br"));
+		div.appendChild(playerDisplay);
+	}
+	document.getElementById("game").innerHTML = "";
+	unlockBuzzers();
+})
+
+function lockBuzzers() {
+	send({"lock": 0});
+	var button = document.getElementById("lock_bz");
+	button.setAttribute("onclick", "unlockBuzzers();");
+	button.innerHTML = "Unlock Buzzers [L]";
+}
+
+function unlockBuzzers() {
+	send({"unlock": 0});
+	var button = document.getElementById("lock_bz");
+	button.setAttribute("onclick", "lockBuzzers();");
+	button.innerHTML = "Lock Buzzers [L]";
+}
+
+$(document).on('keypress', function(e) {
+	if (e.key === 'T' || e.key === 't') {
+		e.preventDefault();
+		tossup();
+	} else if (e.key === 'B' || e.key === 'b') {
+		e.preventDefault();
+		bonus();
+	} else if (e.key === 'P' || e.key === 'p') {
+		e.preventDefault();
+		power();
+	} else if (e.key === 'N' || e.key === 'n') {
+		e.preventDefault();
+		neg();
+	} else if (e.key === 'L' || e.key === 'l') {
+
+		var button = document.getElementById("lock_bz");
+		if (button.innerHTML === "Unlock Buzzers [L]") {
+			unlockBuzzers();
+		} else {
+			lockBuzzers();
+		}
+	}
+})

src/static/index.css

@@ -142,6 +142,7 @@ body {
 /* Style page content */
 .game {
   padding: 0px 10px;
+  display: block;
 }
 
 /* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */

src/templates/gamehost.html

@@ -12,10 +12,26 @@
 			<center>
 				<p>Click to copy the game code: </p>
 				<input id="copycode" class="copycode" name="copycode" value="{{ gamecode }}" type="text" size="32" readonly onclick="copycode();"/>
+				<input type="hidden" id="close_url" name="close_url" value="{{ url_for('host') }}">
+				<br><br><br>
+				<div class="button">
+					<a onclick="lockBuzzers();" id="lock_bz">Lock Buzzers [L]</a>
+				</div>
+				<br><br><br>
+				<div class="button">
+					<a onclick="closeGame();" id="leave">Close Game</a>
+				</div>
 			</center>
 		</div>
+		<br><br><br>
+		<div class="button game">
+			<center>
 				<div id="game">
+
 				</div>
+			</center>
+		</div>
+		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
 		<script src="//cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js" integrity="sha256-yr4fRk/GU1ehYJPAs8P4JlTgu0Hdsp4ZKrx8bDEDC3I=" crossorigin="anonymous"></script>
 		<script src="/static/host.js?version={{ version }}" type="text/javascript" charset="utf-8"></script>
 {% endblock %}

src/templates/games.json

@@ -4,6 +4,7 @@
   "bonus": 20,
   "power": 15,
   "negs": 5,
-  "teams": false,
+  "locked": false,
+  "buzzed": "",
   "players": {}
 }

src/templates/play.html

@@ -22,6 +22,7 @@
 		<br><input type="hidden" id="code" name="code" value="{{ gamecode }}"><br>
 		<br><input type="hidden" id="name" name="name" value="{{ username }}">
 		<br><input type="hidden" id="kick" name="kick" value="{{ url_for('kick') }}">
+		<input type="hidden" id="hostleave" name="hostleave" value="{{ url_for('join') }}">
 		<div class="sidebar" id="sidebar">
 		</div>
 		<div id="game">
@@ -30,7 +31,7 @@
 
 				</div>
 				<div class="button buzzer">
-					<a onclick="buzz();">BUZZ! [SPACE]</a>
+					<a onclick="buzz();" id="b_buzzer">BUZZ! [SPACE]</a>
 				</div>
 			</center>
 		</div>