larger buzzing thingy

src/app.py

@@ -92,7 +92,7 @@ def join():
 	form = JoinForm()
 	if form.validate_on_submit():
 		wlist = whitelist()
-		if not all([a in wlist for a in form.name.data]):
+		if (not all([a in wlist for a in form.name.data])) or (len(form.name.data) > 12):
 			return render_template('badname.html', title='Join Game', version=str(version))
 		hash = form.roomcode.data
 		if hash in games.keys():

src/static/game.js

@@ -75,13 +75,21 @@ socket.on("buzz_event", function(data) {
 	var player = data["username"];
 	document.getElementById(player).childNodes[0].style.color = "#2c26e2";
 	document.getElementById(player).childNodes[1].style.color = "#2c26e2";
+	document.getElementById(player).childNodes[0].style.color = "#2c26e2";
+	var buzztext = document.createElement("p");
+	buzztext.setAttribute("id", player + "_buzz");
+	buzztext.innerHTML = "[BUZZ] "
+	buzztext.style.color = "#2c26e2";
+	document.getElementById(player).insertBefore(buzztext, document.getElementById(player).childNodes[0]);
+	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 = "";
-
+	var buzztext = document.getElementById(player + "_buzz")
+	buzztext.parentNode.removeChild(buzztext);
 	data = datas["players"]
 	div = document.getElementById("sidebar");
 	removeAllChildren(div);

src/static/host.js

@@ -116,6 +116,11 @@ socket.on("buzz_event", function(data) {
 	audio.play();
 	var player = data["username"];
 	document.getElementById(player).childNodes[0].style.color = "#2c26e2";
+	var buzztext = document.createElement("p");
+	buzztext.setAttribute("id", player + "_buzz");
+	buzztext.innerHTML = "[BUZZ] "
+	buzztext.style.color = "#2c26e2";
+	document.getElementById(player).insertBefore(buzztext, document.getElementById(player).childNodes[0]);
 	document.getElementById(player).childNodes[1].style.color = "#2c26e2";
 	game = document.getElementById("game");
 	var tossup = document.createElement("a");
@@ -156,6 +161,8 @@ 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 = "";
+	var buzztext = document.getElementById(player + "_buzz")
+	buzztext.parentNode.removeChild(buzztext);
 	data = datas["players"]
 	div = document.getElementById("sidebar");
 	removeAllChildren(div);

src/templates/badname.html

@@ -8,7 +8,7 @@
 		</div>
 		<div class="text">
 			<center>
-				<p>Names can only be alphanumeric. </p>
+				<p>Names can only be alphanumeric and must be less than 13 characters. </p>
 			</center>
 		</div>
 {% endblock %}