aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorMark Powers <markppowers0@gmail.com>2020-04-19 17:23:01 -0500
committerMark Powers <markppowers0@gmail.com>2020-04-19 17:23:01 -0500
commitacf13b3af04791124d0d8cb31292505c5edf131a (patch)
tree7a087b0b2f0bb22c94d704fa16a253851fe0d388 /src
parentd4878655be6ae6b88bdffc1afe2ff953119b7916 (diff)
Add improvements to quiz bunny
Diffstat (limited to 'src')
-rw-r--r--src/quiz-bunny/index.html22
-rw-r--r--src/quiz-bunny/prompts.js2
-rw-r--r--src/quiz-bunny/server.js42
-rw-r--r--src/quiz-bunny/static/styles.css10
4 files changed, 52 insertions, 24 deletions
diff --git a/src/quiz-bunny/index.html b/src/quiz-bunny/index.html
index 127db65..9b0a6db 100644
--- a/src/quiz-bunny/index.html
+++ b/src/quiz-bunny/index.html
@@ -20,14 +20,14 @@
</h1>
<div>
<div>
- <input style="width: 340px;" type="text" placeholder="username" v-model="username">
+ <input style="width: 390px;" type="text" placeholder="username" v-model="username">
</div>
<div>
<input style="width: 100%;" type="button" value="Host game" v-on:click="hostGame"
:disabled="username.length == 0">
</div>
<div>
- <input type="text" placeholder="game code" v-model="gameCode" style="width: 250px;"
+ <input type="text" placeholder="game code" v-model="gameCode" style="width: 300px;"
v-on:keyup.enter="joinGame">
<input type="button" value="Join game" v-on:click="joinGame"
:disabled="username.length == 0 || gameCode.length == 0">
@@ -47,6 +47,7 @@
</div>
</div>
<div v-else>
+ <h1>{{game.round+1}}/{{game.maxRound}}</h1>
<div v-if="game.state == STATES.TYPING" class="typing">
<h1>Answer:</h1>
<h2>{{game.prompt}}</h2>
@@ -82,9 +83,20 @@
<div v-if="game.state == STATES.WAITING" class="waiting">
<h1>Results:</h1>
<h2>{{game.prompt}}</h2>
- <div v-for="(answer, i) in game.answers">
- <span>{{answer.text}}</span><span>{{answer.voteCount}} votes</span>
- </div>
+ <table>
+ <tr>
+ <th>Answer</th>
+ <th>Author</th>
+ <th>Votes</th>
+ <th>Endorsements</th>
+ </tr>
+ <tr v-for="(answer, i) in game.answers">
+ <td>{{answer.text}}</td>
+ <td>{{answer.name}}</td>
+ <td>{{answer.voteCount}}</td>
+ <td><p v-for="name in answer.voteNames">{{name}}</p></td>
+ </tr>
+ </table>
<input type="button" value="Ready" v-on:click="ready" :disabled="game.ready">
<div class="readyList">
<h4>Waiting:</h4>
diff --git a/src/quiz-bunny/prompts.js b/src/quiz-bunny/prompts.js
index c6326cd..6531ead 100644
--- a/src/quiz-bunny/prompts.js
+++ b/src/quiz-bunny/prompts.js
@@ -30,7 +30,7 @@ var prompts = [
"What is @'s favorite TV show?",
"If @ was the host of a reality TV show, what would it be about?",
"What is the last song @ listened to?",
- "What is @'s go to restaurant owner?",
+ "What is @'s go to restaurant order?",
"What would @ cook for a dinner party?",
"What is the coolest thing @ has done?",
"What is at the top of @'s grocery list?",
diff --git a/src/quiz-bunny/server.js b/src/quiz-bunny/server.js
index 80c50c3..47aa6c2 100644
--- a/src/quiz-bunny/server.js
+++ b/src/quiz-bunny/server.js
@@ -34,7 +34,8 @@ function setUpRoutes(server, models, jwtFunctions, database) {
return {
host: hostCookie,
players: [{ cookie: hostCookie, name: hostName }],
- gameCode: gameCode
+ gameCode: gameCode,
+ maxRound: 8
}
}
// adds a player to a game object
@@ -54,8 +55,8 @@ function setUpRoutes(server, models, jwtFunctions, database) {
}
function getPlayerNames(players) {
// return players.map(player => player.name)
- return players.map(player => {
- return {name: player.name, ready: player.ready}
+ return players.map(player => {
+ return { name: player.name, ready: player.ready }
})
}
// Turn the game into a public game object (no cookies, etc.)
@@ -74,7 +75,9 @@ function setUpRoutes(server, models, jwtFunctions, database) {
name: username,
gameCode: game.gameCode,
gameStarted: game.gameStarted,
- state: game.state
+ state: game.state,
+ round: game.round,
+ maxRound: game.maxRound
}
if (game.state == STATES.TYPING) {
newGame.submitted = game.answers.some(answer => answer.cookie == cookie)
@@ -83,7 +86,7 @@ function setUpRoutes(server, models, jwtFunctions, database) {
var playerWithCookie = game.players.find(p => {
return p.name == player.name
})
- if(game.answers.some(answer => answer.cookie == playerWithCookie.cookie)){
+ if (game.answers.some(answer => answer.cookie == playerWithCookie.cookie)) {
player.ready = true
} else {
player.ready = false
@@ -103,7 +106,12 @@ function setUpRoutes(server, models, jwtFunctions, database) {
})
} else if (game.state == STATES.WAITING) {
newGame.answers = game.answers.map(answer => {
- return { text: answer.text, voteCount: answer.votes.length }
+ return {
+ text: answer.text,
+ voteCount: answer.votes.length,
+ voteNames: answer.votes.map(vote => vote.name),
+ name: findPlayerByCookie(game, answer.cookie).name
+ }
})
newGame.prompt = game.prompts[game.round]
var game = findGameByCookie(cookie)
@@ -114,7 +122,7 @@ function setUpRoutes(server, models, jwtFunctions, database) {
return { name: player.name, score: player.score }
})
// sort
- scores.sort((a,b) => b.score - a.score);
+ scores.sort((a, b) => b.score - a.score);
newGame.scores = scores
}
@@ -131,9 +139,9 @@ function setUpRoutes(server, models, jwtFunctions, database) {
}
return a;
}
- function getRandomPlayer(stack, playersList){
- if(stack.length == 0){
- for(var i = 0; i < playersList.length; i++){
+ function getRandomPlayer(stack, playersList) {
+ if (stack.length == 0) {
+ for (var i = 0; i < playersList.length; i++) {
stack.push(playersList[i])
}
shuffle(stack)
@@ -144,13 +152,15 @@ function setUpRoutes(server, models, jwtFunctions, database) {
function getPrompts(playerNames, size) {
var gamePrompts = []
var stack = []
- for(var i = 0; i < size; i++){
+ while (gamePrompts.length < size) {
var randomIndex = Math.floor(Math.random() * prompts.length)
- var prompt = prompts[randomIndex]
- while(prompt.includes("@")){
+ var prompt = prompts[randomIndex]
+ while (prompt.includes("@")) {
prompt = prompt.replace("@", getRandomPlayer(stack, playerNames))
}
- gamePrompts.push(prompt)
+ if (gamePrompts.indexOf(prompt) == -1) {
+ gamePrompts.push(prompt)
+ }
}
return gamePrompts
}
@@ -160,7 +170,7 @@ function setUpRoutes(server, models, jwtFunctions, database) {
if (game && game.players.length >= 2) {
game.gameStarted = true
var playerNames = game.players.map(player => player.name)
- game.prompts = getPrompts(playerNames, 8)
+ game.prompts = getPrompts(playerNames, game.maxRound)
game.round = 0;
game.players.forEach(player => {
player.score = 0
@@ -346,7 +356,7 @@ function setUpRoutes(server, models, jwtFunctions, database) {
} else {
var game = findGameByCookie(cookie)
game.players = game.players.filter(player => player.cookie != cookie)
- if(game.players.length == 0){
+ if (game.players.length == 0) {
games = games.filter(g => g != game)
}
res.status(200).send()
diff --git a/src/quiz-bunny/static/styles.css b/src/quiz-bunny/static/styles.css
index 45da568..327011f 100644
--- a/src/quiz-bunny/static/styles.css
+++ b/src/quiz-bunny/static/styles.css
@@ -1,6 +1,6 @@
body {
background-image: url("/quiz-bunny/bunny.jpg");
- background-position: center;
+ background-position: center top;
background-repeat: no-repeat;
}
h1, h2, h3, h4, li, span {
@@ -8,9 +8,15 @@ h1, h2, h3, h4, li, span {
color: white;
}
+td, th{
+ text-align: left;
+ background-color: white;
+ color: black;
+}
+
.center{
margin: auto;
- width: 350px;
+ width: 400px;
padding: 10px;
}
input {