jeobeardy
/
Jeobeardy
1
0
Fork 0
Code Issues 2 Pull Requests Packages Projects Releases Wiki Activity

Updated Dependencies; Added webp/avif support; adjust buzzer activation timings; always show question to host

This commit is contained in:
Baer 2026-04-17 23:55:02 +02:00
parent e0280bafe6
commit 9d38272d1b
15 changed files with 2618 additions and 4865 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Dockerfile
View File

@ -1,6 +1,6 @@
# syntax=docker/dockerfile:1
FROM node:19.9.0-alpine
FROM node:25.9.0-alpine
WORKDIR /app
COPY . .
RUN npm install --production

7275
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

67
package.json
View File

@ -1,6 +1,6 @@
{
"name": "jeobeardy",
"version": "1.0.0",
"version": "1.1.0",
"description": "Jeobeardy (/dʒebeərdi/) is similiar to but not quite like Jeopardy. It is a quiz game where you can create your own boards with categories and then make your friends compete in a fun and interactive way",
"keywords": [
"jeobeardy",
@ -29,40 +29,39 @@
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore"
},
"dependencies": {
"@fortawesome/fontawesome-svg-core": "6.5.1",
"@fortawesome/free-regular-svg-icons": "6.5.1",
"@fortawesome/free-solid-svg-icons": "6.5.1",
"@fortawesome/vue-fontawesome": "3.0.6",
"@popperjs/core": "2.11.8",
"@vitejs/plugin-vue": "5.0.4",
"archetype": "github:LaurentGoderre/archetype#fix-lodash_set-vuln",
"axios": "1.6.7",
"bcryptjs": "2.4.3",
"body-parser": "1.20.2",
"bootstrap": "5.3.3",
"connect-history-api-fallback": "2.0.0",
"connect-mongodb-session": "5.0.0",
"cors": "2.8.5",
"dotenv": "16.4.5",
"express": "4.18.2",
"express-session": "1.18.0",
"helmet": "7.1.0",
"mongoose": "8.2.0",
"morgan": "1.10.0",
"multer": "1.4.5-lts.1",
"pinia": "2.1.7",
"uuid": "9.0.1",
"vite": "5.1.4",
"vue": "3.4.20",
"vue-router": "4.3.0",
"ws": "8.16.0"
"@fortawesome/fontawesome-svg-core": "~7.2.0",
"@fortawesome/free-regular-svg-icons": "~7.2.0",
"@fortawesome/free-solid-svg-icons": "~7.2.0",
"@fortawesome/vue-fontawesome": "~3.1.3",
"@popperjs/core": "~2.11.8",
"axios": "~1.15.0",
"bcryptjs": "~3.0.3",
"body-parser": "~2.2.2",
"bootstrap": "~5.3.8",
"connect-history-api-fallback": "~2.0.0",
"connect-mongodb-session": "~5.0.0",
"cors": "~2.8.6",
"dotenv": "~17.4.2",
"express": "~5.2.1",
"express-session": "~1.19.0",
"helmet": "~8.1.0",
"mongoose": "~9.4.1",
"morgan": "~1.10.1",
"multer": "~2.1.1",
"pinia": "~3.0.4",
"uuid": "~13.0.0",
"vite": "~8.0.8",
"vue": "~3.5.32",
"vue-router": "~5.0.4",
"ws": "~8.20.0"
},
"devDependencies": {
"@rushstack/eslint-patch": "1.7.2",
"@vue/eslint-config-prettier": "9.0.0",
"eslint": "8.57.0",
"eslint-plugin-vue": "9.22.0",
"prettier": "3.2.5",
"sass": "1.71.1"
"@rushstack/eslint-patch": "~1.16.1",
"@vitejs/plugin-vue": "~6.0.5",
"@vue/eslint-config-prettier": "~10.2.0",
"eslint": "~10.2.0",
"eslint-plugin-vue": "~10.8.0",
"prettier": "~3.8.2",
"sass": "~1.99.0"
}
}

10
src/server/controllers/GameControllerMongoose.js
View File

@ -162,7 +162,7 @@ exports.findGameAndAddAnsweredEntry = ( id, categoryIndex, boardEntryIndex ) =>
categoryIndex: categoryIndex,
boardEntryIndex: boardEntryIndex,
}
GameModel.findByIdAndUpdate(id, { $addToSet: { "answeredBoardEntries": dbEntry } }, { new: true } ).populate("board")
GameModel.findByIdAndUpdate(id, { $addToSet: { "answeredBoardEntries": dbEntry } }, { returnDocument: 'after' } ).populate("board")
.then( ( game ) => {
if( game === null ){
let gameNotFoundError = new Error(`No game found with id "${id}"`);
@ -187,7 +187,7 @@ exports.findGameAndAddAnsweredEntry = ( id, categoryIndex, boardEntryIndex ) =>
*/
exports.findGameAndRemoveAnsweredEntry = ( id, categoryIndex, boardEntryIndex ) => {
return new Promise((resolve, reject) => {
GameModel.findByIdAndUpdate(id, { $pull: { answeredBoardEntries: { categoryIndex: categoryIndex, boardEntryIndex: boardEntryIndex } } }, { new: true } ).populate("board")
GameModel.findByIdAndUpdate(id, { $pull: { answeredBoardEntries: { categoryIndex: categoryIndex, boardEntryIndex: boardEntryIndex } } }, { returnDocument: 'after' } ).populate("board")
.then( ( game ) => {
if( game === null ){
let gameNotFoundError = new Error(`No game found with id "${id}"`);
@ -205,7 +205,7 @@ exports.findGameAndRemoveAnsweredEntry = ( id, categoryIndex, boardEntryIndex )
exports.findAcceptingGameAndSetNotAccepting = ( id ) => {
return new Promise((resolve, reject) => {
GameModel.findOneAndUpdate({ _id : id, acceptAnswers: true }, { acceptAnswers: false }, { new: true })
GameModel.findOneAndUpdate({ _id : id, acceptAnswers: true }, { acceptAnswers: false }, { returnDocument: 'after' })
.then((game) => {
if( game === null){
resolve( false );
@ -221,7 +221,7 @@ exports.findAcceptingGameAndSetNotAccepting = ( id ) => {
exports.findGameAndSetAccepting = ( id, isAccepting ) => {
return new Promise((resolve, reject) => {
GameModel.findByIdAndUpdate( id, { acceptAnswers: isAccepting }, { new: true }).populate("players")
GameModel.findByIdAndUpdate( id, { acceptAnswers: isAccepting }, { returnDocument: 'after' }).populate("players")
.then((game) => {
if( game === null){
let gameNotFoundError = new Error(`No game found with code "${id}"`);
@ -264,7 +264,7 @@ exports.setPlayerPointsAndReturnGame = ( gameId, playerId, pointsAdjusted ) => {
points: pointsAdjusted,
}
},
{ new: true }
{ returnDocument: 'after' }
)
.then( ( player ) => {
if( player === null ){

2
src/server/controllers/PlayerControllerMongoose.js
View File

@ -93,7 +93,7 @@ exports.checkPlayerAcceptAnswers = ( playerId ) => {
*/
exports.checkPlayerAcceptAnswersAndSetAccepting = ( playerId, canAcceptAfter ) => {
return new Promise((resolve, reject) => {
PlayerModel.findByIdAndUpdate( playerId, { acceptAnswers: canAcceptAfter }, { new: false } )
PlayerModel.findByIdAndUpdate( playerId, { acceptAnswers: canAcceptAfter }, { returnDocument: 'before' } )
.then( ( player ) => {
if( player ){
resolve( player.acceptAnswers );

2
src/server/controllers/UserControllerMongoose.js
View File

@ -159,7 +159,7 @@ exports.updateProfilePicture = ( userId, pfpFilename ) => {
}
})
.then( () => {
return UserModel.findById( userId , {}, { new: true });
return UserModel.findById( userId , {}, { returnDocument: 'after' });
})
.then( ( user ) => {
resolve( user );

16
src/server/routes/UserRouter.js
View File

@ -12,11 +12,20 @@ const storage = multer.diskStorage({
destination: (req, file, cb) => {
cb( null, 'public/uploads' )
},
limits: {
fileSize: 1024 * 1024 * 2,
},
filename: (req, file, cb) => {
let fileExtension = '.jpg';
if( file.mimetype === 'image/png' ){
fileExtension = '.png';
}
if( file.mimetype === 'image/webp' ){
fileExtension = '.webp';
}
if( file.mimetype === 'image/avif' ){
fileExtension = '.avif';
}
if( file.mimetype === 'image/gif' ){
fileExtension = '.gif';
}
@ -50,13 +59,12 @@ const fileFilterFn = function( req, file, cb ){
return;
}
if( !["image/jpeg","image/jpg","image/png","image/gif","audio/mpeg"].includes( file.mimetype ) ){
if( !["image/jpeg","image/jpg","image/png","image/gif","image/webp","image/avif","audio/mpeg"].includes( file.mimetype ) ){
cb( new Error( "MIME Type not supported!" ) );
return;
}
if( file.size > 1024 * 1024 * 5){
cb( new Error( "File is too large! Must be less than 5MB" ) );
if( file.size > 1024 * 1024 * 2){
cb( new Error( "File is too large! Must be less than 2MB" ) );
return;
}

34
src/server/websocket/handler.js
View File

@ -161,10 +161,20 @@ exports.handleMessage = ( gameSocketList, socket, dataRaw ) => {
break;
case "selectBoardEntry":
if( socket.locals.isHost ){
gameController.findGameAndSetAccepting( socket.locals.game, true )
.then( ( game ) => {
return playerController.setAllPlayersAcceptAnswers( game.players.map( playerEntry => playerEntry._id ), true )
})
.then( () => {
let message = `BoardEntry ${payload.boardEntryIndex} selected in Category ${payload.categoryIndex}`;
let sendingData = { categoryIndex: payload.categoryIndex, boardEntryIndex: payload.boardEntryIndex };
sendAllPlayers( socket, gameSocketList, "boardEntrySelected", message, sendingData );
resolve();
})
.catch( ( err ) => {
reject( err );
});
resolve();
} else {
reject( new Error("Message not sent by host") );
}
@ -235,27 +245,27 @@ exports.handleMessage = ( gameSocketList, socket, dataRaw ) => {
break;
case "selectBoard":
if( socket.locals.isHost ){
gameController.findGameAndSetAccepting( socket.locals.game, false )
.then( ( game ) => {
return playerController.setAllPlayersAcceptAnswers( game.players.map( playerEntry => playerEntry._id ), false )
})
.then( () => {
let message = "Board selected";
sendAllPlayers( socket, gameSocketList, "boardSelected", message, {});
resolve();
})
.catch( ( err ) => {
reject( err );
});
} else {
reject( new Error("Message not sent by host") );
}
break;
case "showQuestion":
if( socket.locals.isHost ){
gameController.findGameAndSetAccepting( socket.locals.game, true )
.then( ( game ) => {
return playerController.setAllPlayersAcceptAnswers( game.players.map( playerEntry => playerEntry._id ), true )
})
.then( () => {
let message = "Question revealed";
sendAllPlayers( socket, gameSocketList, "questionRevealed", message, {});
resolve();
})
.catch( ( err ) => {
reject( err );
});
} else {
reject( new Error("Message not sent by host") );
}
@ -280,15 +290,9 @@ exports.handleMessage = ( gameSocketList, socket, dataRaw ) => {
break;
case "hideQuestion":
if( socket.locals.isHost ){
gameController.findGameAndSetAccepting( socket.locals.game, false )
.then( ( _game ) => {
let message = "Question hidden";
sendAllPlayers( socket, gameSocketList, "questionHidden", message, {});
resolve();
})
.catch( ( err ) => {
reject( err );
});
} else {
reject( new Error("Message not sent by host") );
}

4
src/webapp/components/blocks/ChangeProfilePicture.vue
View File

@ -81,8 +81,8 @@ function handleModalButtonClick( buttonIndex ){
<div class="col-auto border-start">
<div class="h-100 d-flex flex-column justify-content-evenly">
<div>
<label class="form-label fs-5" for="question-image">Upload new profile picture</label>
<input ref="imageInput" class="form-control bg-dark-blue" type="file" name="question-image" id="question-image" @change="newImageUploaded" accept="image/*">
<label class="form-label fs-5" for="question-image">Upload new profile picture <span style="font-size: 0.6em;">(max. 2MB)</span></label>
<input ref="imageInput" class="form-control bg-dark-blue" type="file" name="question-image" id="question-image" @change="newImageUploaded" accept="image/jpeg, image/jpg, image/png, image/gif, image/webp, image/avif">
</div>
<div>
<button class="btn btn-pink-accent-primary me-3" :disabled="uploadedFileObj === null" @click="saveProfilePicture">

10
src/webapp/components/pages/Game.vue
View File

@ -68,17 +68,21 @@ function boardSelected(){
selectedObject.value = gameStore.board;
categoryIndex.value = -1;
boardEntryIndex.value = -1;
gameStore.acceptAnswers = false;
for(const playerIdx in gameStore.players ){
gameStore.players[playerIdx].isAnswering = false;
}
}
function selectBoardEntryWithCategory( cIndex, entryIndex ){
categoryIndex.value = cIndex;
boardEntryIndex.value = entryIndex;
questionIndex.value = 0;
selectedObject.value = gameStore.board.categories[cIndex].boardEntries[entryIndex];
gameStore.acceptAnswers = true;
}
function setUpListeners(){
gameStore.addSocketListener("boardEntrySelected", ( data ) => {
gameStore.acceptAnswers = false;
showingAnswer.value = false;
showingQuestion.value = false;
selectBoardEntryWithCategory( data.payload.categoryIndex, data.payload.boardEntryIndex );
@ -134,11 +138,9 @@ function setUpListeners(){
}
});
gameStore.addSocketListener("questionRevealed", ( _data ) => {
gameStore.acceptAnswers = true;
showingQuestion.value = true;
});
gameStore.addSocketListener("questionHidden", ( _data ) => {
gameStore.acceptAnswers = false;
showingQuestion.value = false;
});
gameStore.addSocketListener("answerRevealed", ( _data ) => {
@ -314,7 +316,7 @@ function questionAnsweredRevert( cIndex, bEIndex ){
function manualPointsAdjustment( playerId, playerName, points ){
let payload = {
reopenQuestion: false,
reopenQuestion: gameStore.acceptAnswers,
playerId: playerId,
playerName: playerName,
pointsAdjustment: points,

5
src/webapp/components/pages/Lobby.vue
View File

@ -116,9 +116,8 @@ onBeforeRouteLeave((to, from) => {
Start Game
</span>
<font-awesome-layers class="ms-1" fixed-width>
<font-awesome-icon icon="fa-solid fa-square" size="xl" />
<font-awesome-icon class="text-pink-accent-primary" icon="fa-solid fa-play" size="sm" />
<!-- <font-awesome-icon class="align-middle border-dark rounded" icon="fa-solid fa-play" border /> -->
<font-awesome-icon icon="fa-solid fa-square" size="xl"/>
<font-awesome-icon class="text-pink-accent-primary ms-1" icon="fa-solid fa-play" />
</font-awesome-layers>
</button>
</div>

2
src/webapp/components/views/BoardEditView.vue
View File

@ -13,7 +13,7 @@ function addCategoryButtonClicked(_event){
if( newCategoryName.value === "" ){
return;
}
let category = new Category( newCategoryName.value, "New Category", [] );
let category = new Category( newCategoryName.value, "", [] );
gameCreationStore.$patch((state)=>{
state.board.categories.push( category );
})

12
src/webapp/components/views/BoardEntryEditView.vue
View File

@ -151,12 +151,12 @@ watch(
</template>
</div>
<div v-if="question.questionType === 'imageQuestion'">
<label class="form-label fs-4 mt-3" for="question-image">Question Image</label>
<input class="form-control bg-dark-blue" type="file" name="question-image" id="question-image" @change="onQuestionImageChanged( questionIndex, $event )" accept="image/jpeg, image/jpg, image/png, image/gif, audio/mpeg">
<label class="form-label fs-4 mt-3" for="question-image">Question Image <span style="font-size: 0.5em;">(max. 2MB)</span></label>
<input class="form-control bg-dark-blue" type="file" name="question-image" id="question-image" @change="onQuestionImageChanged( questionIndex, $event )" accept="image/jpeg, image/jpg, image/png, image/gif, image/webp, image/avif">
</div>
<div v-if="question.questionType === 'audioQuestion'">
<label class="form-label fs-4 mt-3" for="question-audio">Question Audio</label>
<input ref="questionImageInput" class="form-control bg-dark-blue" type="file" name="question-audio" id="question-audio" @change="onQuestionAudioChanged( questionIndex, $event )" accept="image/jpeg, image/jpg, image/png, image/gif, audio/mpeg">
<label class="form-label fs-4 mt-3" for="question-audio">Question Audio <span style="font-size: 0.5em;">(max. 2MB)</span></label>
<input ref="questionImageInput" class="form-control bg-dark-blue" type="file" name="question-audio" id="question-audio" @change="onQuestionAudioChanged( questionIndex, $event )" accept="audio/mpeg">
</div>
<div class="row mt-3">
<div class="col-xxl-4 col-12 mb-1 px-1">
@ -194,8 +194,8 @@ watch(
<input v-model="gameCreationStore.board.categories[props.categoryIndex].boardEntries[props.boardEntryIndex].answer.answerText" class="form-control bg-dark-blue" type="text">
</div>
<div v-if="gameCreationStore.board.categories[props.categoryIndex].boardEntries[props.boardEntryIndex].answer.answerType === 'imageAnswer'">
<label class="form-label fs-4 mt-3" for="answer-image">Answer Image</label>
<input ref="answerImageInput" class="form-control bg-dark-blue" type="file" name="answer-image" id="answer-image" @change="onAnswerImageChanged" accept="image/jpeg, image/jpg, image/png, image/gif, audio/mpeg">
<label class="form-label fs-4 mt-3" for="answer-image">Answer Image <span style="font-size: 0.5em;">(max. 2MB)</span></label>
<input ref="answerImageInput" class="form-control bg-dark-blue" type="file" name="answer-image" id="answer-image" @change="onAnswerImageChanged" accept="image/jpeg, image/jpg, image/png, image/gif, image/webp, image/avif">
</div>
</div>
</div>

3
src/webapp/components/views/BoardEntryView.vue
View File

@ -77,7 +77,7 @@ function stopAudio(){
<template>
<div class="container-fluid h-100 d-flex justify-content-center align-items-center">
<div v-show="showingQuestion" class="w-100 h-100">
<div v-show="showingQuestion || props.isHost" class="w-100 h-100">
<QuestionView
:cIndex="props.cIndex"
:bEIndex="props.bEIndex"
@ -85,6 +85,7 @@ function stopAudio(){
:questions="boardEntry.questions"
:board="props.board"
:isHost="props.isHost"
:isBeingShown="showingQuestion"
@specificQuestionLayerSelected="specificQuestionLayerSelected"
@playAudio="playAudio"
@stopAudio="stopAudio"

5
src/webapp/components/views/QuestionView.vue
View File

@ -12,7 +12,8 @@ const props = defineProps({
isHost: {
type: Boolean,
default: false,
}
},
isBeingShown: Boolean,
});
let emit = defineEmits(["specificQuestionLayerSelected", "playAudio", "stopAudio"])
@ -69,7 +70,7 @@ watch(
<template>
<template v-for="(question, questionIndex) in props.questions" :key="questionIndex">
<div v-if="props.questionIndex === questionIndex" class="d-flex flex-column justify-content-center align-items-center h-100 w-100">
<div v-if="props.questionIndex === questionIndex" class="d-flex flex-column justify-content-center align-items-center h-100 w-100" :class="[{'opacity-50': props.isHost && !props.isBeingShown}]">
<h1 class="text-center" :class="[{ 'white-space-show-nl': question.questionType === 'multilineQuestion'}]">
{{ question.questionText }}
</h1>