it still looks bad
This commit is contained in:
parent
00cc143d6e
commit
d69812a424
72
src/app.py
72
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
|
||||
elif "amount" in msg.keys():
|
||||
pass # give player points
|
||||
|
||||
if games[room]["buzzed"] == "":
|
||||
return
|
||||
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)
|
||||
|
||||
|
||||
|
||||
@ -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)
|
||||
|
||||
@ -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": ""});
|
||||
}
|
||||
|
||||
|
||||
@ -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();
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
@ -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) */
|
||||
|
||||
@ -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>
|
||||
<div id="game">
|
||||
<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 %}
|
||||
@ -4,6 +4,7 @@
|
||||
"bonus": 20,
|
||||
"power": 15,
|
||||
"negs": 5,
|
||||
"teams": false,
|
||||
"locked": false,
|
||||
"buzzed": "",
|
||||
"players": {}
|
||||
}
|
||||
@ -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>
|
||||
|
||||
Reference in New Issue
Block a user