A fun-for-all, real time multiplayer trivia game

Click here to see the live site

• Project using Vue.js CLI webpack template, vue-router, vuex, firebase, and Bootstrap v4

1. Choose who wants to be the trivia host, send them to the /#/admin page
2. All other participants go to the /#/play page
3. Players will be presented with a modal to create their player name
4. Trivia host will choose and 'post next question' which starts the timer countdown
5. Points are awarded automatically to the players with the correct answers when the timer runs out

Gameplay in action

1. View the current leaderboard with players and scores
2. Links to both the Player Page and Admin Page

Home page:

1. Question/Answer choices component - Q & A linked to database, presented based on admin input
2. Timer countdown component - linked to database, reflects time as seconds run out
3. Individual player stats component - database is queried for unique player data, point value/ranking returned
4. Create/change player name component - player creates name to play, can also change name (while keeping previous point value)
5. Fully functional chat component - players can (kindly) taunt each other while playing

Creating a New Player

Changing Player Name (User Score/Rank Persist)

In-Game Chat

For the trivia group leader who wants to play Go... I mean... 'Alex Trebek'

1. Post the next question component - admin chooses question number, submits question to be posted and triggers timer countdown
2. Set timer countdown seconds component - admin can change time alloted to answer trivia question
3. Overall player stats component - admin can see the current leaderboard, question, and answer (everything an admin wants to see)
4. Admin danger zone component - admin can delete all chat history, reset all players to 0 points (for a new round of trivia), and delete all players (if playing with a new group)

Admin posting a question

Admin Danger Zone (Delete Chat History, Reset Player Scores, Delete All Players)