Initial working version

2022-12-22 20:22:22 +11:00
parent ce9675a1cc
commit ced7fa5092
902 changed files with 150252 additions and 0 deletions
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>The cooler buzzer website</title>
+		<link rel="stylesheet" href="styleMain.css">
+		<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
+		<script src="https:/socket.io/socket.io.js"></script>
+		<script>
+			$(document).ready(function() {
+				var socket = io();
+				let buzzerSound = new Audio('MPYosh.wav');
+				socket.on("gameStateToClient", (currentTeam, currentScore) => {
+					$("#currentTeam").html(currentTeam);
+					$("#currentScore").html(currentScore);
+				});
+				socket.on("clearBuzzers", () => {
+					$("#buzzList").html("");
+				});
+				socket.on("buzzListToClient", (buzzList) => {
+					//play sound for first buzz in
+					if ($("#buzzList").html() == "") {
+						buzzerSound.play();
+					}
+					$("#buzzList").html(buzzList.join());
+				});
+				$("#plus0").click(function() {
+					socket.emit("scoresToServer", 0);
+				});
+				$("#plus1").click(function() {
+					socket.emit("scoresToServer", 1);
+				});
+				$("#plus2").click(function() {
+					socket.emit("scoresToServer", 2);
+				});
+
+				$("#buzzerOptions").contents().mousedown(function() {
+					buzzerSound = new Audio($(this).attr("id")+".wav");
+					buzzerSound.play();
+				});
+			});
+		</script>
+	</head>
+	<body>
+		<header>
+			<h1>hi quetz :]</h1>
+		</header>
+		<div class="interface">
+			<p id="currentTeam"></p>
+			<p id="currentScore"></p>
+			<br>
+			<button id="plus0" type="button">Clear buzzers</button>
+			<button id="plus1" type="button">+1 Point</button>
+			<button id="plus2" type="button">+2 Points</button>
+			<br>
+			<p id="buzzList"></p>
+		</div>
+		<div id="buzzerOptions">
+			<img id="MPYosh" src="MPYosh.png">
+			<img id="MPDog" src="MPDog.png">
+			<img id="MPCat" src="MPCat.png">
+			<img id="Wow" src="Wow.png">
+			<img id="TheNumberEight" src="TheNumberEight.png">
+			<img id="Ooh" src="Ooh.png">
+		</div>
+	</body>
+</html>