Client app

The client app is made in VueJS

Structure

Options

When a game is running and a client joins, an active web-socket connection is made. This web-socket connection is used to receive and send data from and to the clients. Down here you see the different JSON objects the client listens to:

On join the next data is send:

Name	Description	Example
userJoined	The message a clients send to the game upon connecting	{"data":{"userJoined": {"nickname":"user nickname", id: "user id"} } }

The data a game can send to the client:

Name	Description	Example	Options
status	The text on the status screen	{"status":"A status text (HTML)"	Status HTML
userStatus	The text on the status screen for a specific user	{"userStatus":["user nickname", "Statustext"]}	Status HTML
switchScreen	Switches the screen	{"switchScreen":"status"}	Screens: status, buttons, exit
buttons	Send the buttons to show on the clients screen	{"buttons":["button1","button2"]}	An array with buttons (4 max)
header	Set the header of all clients	{"header":"Header text"}	Header string
userHeader	Set the header of one specific client	{"userHeader":["user nickname", "Header text"]}	user's nickname & header string
footer	Set the footer of all clients	{"footer":"Footer text"}	Footer string
userFooter	Set the footer of one specific client	{"userFooter":["user nickname", "Footer text"]}	user's nickname & footer string
action	The action a clients receives after pressing a button	{"action":"hold"}	action wait: The client has to wait. action again: The client can press the button over and over
answer	Send the correct button answer	{"answer":"some button"}	Correct button string
stopGame	Sends the "stop game" command	{"stopGame":true}	-

The data a clients sends to the game upon pressing a button:

Name	Description	Example
sendMessage	The message a clients send to the game upon pressing a button	{"data":{"user":"user nickname", "answer":"the button text", "id":"user id"}}

App text options

Down here you can see the places where the text that a game sends will be shown: