67 lines
1.9 KiB
HTML
67 lines
1.9 KiB
HTML
<!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>
|