friends/TheChaseBuzzer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

userlist now provides buzzer info

Browse Source
This commit is contained in:
Samuel Kent
2022-12-27 16:07:41 +11:00
parent 252fa97606
commit 221414aff4
5 changed files with 68 additions and 80 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app.js
+25 -33
View File
@@ -17,34 +17,39 @@ const io = new Server(server, {
});
const userMap = new Map();
let buzzList = [];
let playerList = [];
let chaserList = [];
let buzzInfo = [];
let userInfo = new Object();//Each user has properties, and is stored as a property of userInfo
const teamsList = ["Players","Chasers"]
const teamsScore = [0,0]
let currentTeamNumber = 0;
io.on("connection", (socket) => {
console.log("a user connected");
// console.log(userMap);
// userMap.set(socket.id, "Guest");
// console.log(socket.client.conn.id);
// console.log(socket.client.id);
// console.log(socket.id);
// console.log(userMap);
socket.on("disconnect", () => {
console.log("user disconnected");
console.log(userMap);
});
//initial info on connection
socket.emit("gameStateToClient", teamsList[currentTeamNumber], teamsScore[currentTeamNumber]);
// socket.emit("buzzListToClient", buzzList);
socket.on("buzzerPressed", (userName) => {
buzzList.push(userName);
io.emit("buzzListToClient", buzzList);
socket.on("buzzerPressed", (newUserName, newTimeStamp) => {
let firstBuzzTimeStamp = (function() {
if (buzzInfo.length == 0) {
return newTimeStamp
}
else {
return buzzInfo[0].timeStamp;
}
})();
buzzInfo.push({
userName: newUserName,
timeStamp: newTimeStamp,
lateTime: newTimeStamp-firstBuzzTimeStamp
});
io.emit("buzzInfoToClient", buzzInfo);
});
socket.on("scoresToServer", score => {
@@ -55,33 +60,20 @@ io.on("connection", (socket) => {
// io.emit("switchCurrentteam");
// io.emit("dataToClient", buzzList, teamsList[currentTeamNumber], teamsScore[currentTeamNumber]);
}
buzzList = [];
buzzInfo = [];
io.emit("gameStateToClient", teamsList[currentTeamNumber], teamsScore[currentTeamNumber]);
//todo ping test
io.emit("clearBuzzers", teamsList[currentTeamNumber]);
io.emit("userInfoToClient", userInfo);//resets the buzzer info
});
socket.on("registerUser", (userName, teamName) => {
console.log("reg");
if (teamName == "Players") {
if (!playerList.includes(userName)) {
playerList.push(userName);
}
}
else if (teamName == "Chasers") {
if (!chaserList.includes(userName)) {
chaserList.push(userName);
}
socket.on("registerUser", (newUserName, newTeamName) => {
userInfo[newUserName] = {
teamName: newTeamName
}
io.emit("userListsToClient", playerList, chaserList);
io.emit("userInfoToClient", userInfo);
});
// socket.emit("playerRoundScoreToClient");
// socket.emit("chaserRoundScoreToClient");
// socket.emit("currentTeamToClient");
// socket.emit("buzzListToClient");
});
// const io = new Server(server);
browserFunctions.js
+17 -13
View File
@@ -5,26 +5,30 @@ function setupBuzzerOptions() {
});
return buzzerOptions;
}
function userListsToClient(playerList, chaserList) {
$("#playerList").html("");
$("#chaserList").html("");
playerList.forEach((playerName) => {
$("#playerList").append("<li>"+playerName+"</li>");
});
chaserList.forEach((chaserName) => {
$("#chaserList").append("<li>"+chaserName+"</li>");
});
function userInfoToClient(userInfo) {
$("#PlayersList").html("");
$("#ChasersList").html("");
for (const user in userInfo) {
$("#"+userInfo[user].teamName+"List").append("<li id="+user+">"+user+"<var></var></li>");
}
}
function gameStateToClient(currentTeam, currentScore) {
$("#currentTeam").html(currentTeam);
$("#currentTeam").html(currentTeam+" turn");
$("#currentScore").html(currentScore);
}
function buzzListToClient(buzzList, buzzerSound) {
function buzzInfoToClient(buzzInfo, buzzerSound) {
//play sound for first buzz in
if ($("#buzzList").html() == "") {
if (buzzInfo.length == 1) {
buzzerSound.play();
$("#firstBuzz").html(buzzInfo[0].userName);
$("#userListPanel").find("#"+buzzInfo[0].userName).css("font-weight", 900);
$("#userListPanel").find("#"+buzzInfo[0].userName).find("var").html(" (BUZZ)")
}
$("#buzzList").html(buzzList.join());
for (let i=1; i < buzzInfo.length; i++) {
$("#userListPanel").find("#"+buzzInfo[i].userName).find("var").html(" ("+buzzInfo[i].lateTime/1000+")");
}
}
pages/home.html
-8
View File
@@ -7,14 +7,6 @@
<!-- <script src="https:/socket.io/socket.io.js"></script> -->
<script>
$(document).ready(function() {
// var socket = io();
// const buzzerSound = new Audio('TheNumberEight.wav');
// // const buzzerSound = new Audio('Cat.wav');
// $("#buzzer").mousedown(function() {
// buzzerSound.play();
// socket.emit("buzzerPressed", userName);
// });
const okdesuka = new Audio('Okdesuka.wav');
$("#userName").change(function() {
okdesuka.play();
pages/host.html
+10 -11
View File
@@ -13,9 +13,8 @@
let buzzerOptions = setupBuzzerOptions();
let buzzerSound = new Audio(buzzerOptions[0]+".wav");
socket.on("userListsToClient", (playerList, chaserList) => {
userListsToClient(playerList, chaserList);
socket.on("userInfoToClient", (userInfo) => {
userInfoToClient(userInfo);
});
socket.on("gameStateToClient", (currentTeam, currentScore) => {
@@ -23,11 +22,11 @@
});
socket.on("clearBuzzers", () => {
$("#buzzList").html("");
$("#firstBuzz").html("");
});
socket.on("buzzListToClient", (buzzList) => {
buzzListToClient(buzzList, buzzerSound);
socket.on("buzzInfoToClient", (buzzInfo) => {
buzzInfoToClient(buzzInfo, buzzerSound);
});
$("#plus0").click(function() {
@@ -51,21 +50,21 @@
<p id="message">hi quetz :]</p>
<div id="interface">
<p id="currentTeam"></p>
Progress:
<p id="currentScore"></p>
<!-- <br> -->
(all buttons clear buzzers)
<br>
<p style="font-size: 15px">(all buttons clear buzzers)</p>
<button id="plus0" type="button">+0 Points</button>
<button id="plus1" type="button">+1 Point</button>
<button id="plus2" type="button">+2 Points</button>
<br>
<p id="buzzList"></p>
<p id="firstBuzz"></p>
</div>
<div id="userListPanel">
Players:
<ul id="playerList"></ul>
<ul id="PlayersList"></ul>
Chasers:
<ul id="chaserList"></ul>
<ul id="ChasersList"></ul>
</div>
<div id="buzzerOptions">
</div>
pages/play.html
+16 -15
View File
@@ -11,7 +11,7 @@
var socket = io();
let startTime;//for ping check
let buzzInTime;//for ping check
let queryString = new URL(location.href);
let userName = queryString.searchParams.get("user");
$("#message").html("hi "+userName+" :]")
@@ -27,8 +27,8 @@
socket.emit("registerUser", userName, teamName);
socket.on("userListsToClient", (playerList, chaserList) => {
userListsToClient(playerList, chaserList);
socket.on("userInfoToClient", (userInfo) => {
userInfoToClient(userInfo);
});
socket.on("gameStateToClient", (currentTeam, currentScore) => {
@@ -44,15 +44,15 @@
buzzable = false;
$("#buzzer").css("opacity", "0.2");
}
$("#buzzList").html("");
$("#firstBuzz").html("");
});
socket.on("buzzListToClient", (buzzList) => {
buzzListToClient(buzzList, buzzerSound);
if (buzzList.slice(-1) == userName) {
let ping = new Date().getTime() - startTime;
console.log("ping: "+ping);
}
socket.on("buzzInfoToClient", (buzzInfo) => {
buzzInfoToClient(buzzInfo, buzzerSound);
// if (buzzList.slice(-1) == userName) {
// let ping = new Date().getTime() - buzzInTime;
// console.log("ping: "+ping);
// }
});
$(document).keydown(function(e) {
@@ -69,8 +69,8 @@
if (buzzable) {
buzzable = false;
$("#buzzer").css("opacity", "0.2");
startTime = new Date().getTime();
socket.emit("buzzerPressed", userName);
buzzInTime = new Date().getTime();
socket.emit("buzzerPressed", userName, buzzInTime);
}
}
@@ -86,17 +86,18 @@
<p id="message"></p>
<div id="interface">
<p id="currentTeam"></p>
Progress:
<p id="currentScore"></p>
<br>
<img id="buzzer" alt="The buzzer" style="width: 200px">
<br>
<p id="buzzList"></p>
<p id="firstBuzz"></p>
</div>
<div id="userListPanel">
Players:
<ul id="playerList"></ul>
<ul id="PlayersList"></ul>
Chasers:
<ul id="chaserList"></ul>
<ul id="ChasersList"></ul>
</div>
<div id="buzzerOptions">
</div>