73 lines
No EOL
1.3 KiB
Vue
73 lines
No EOL
1.3 KiB
Vue
<template>
|
|
<div id="game_type_choice">
|
|
<h1>
|
|
Secret Hitler Online
|
|
</h1>
|
|
<div>
|
|
<button
|
|
@click.stop="join_game()"
|
|
>Join a Game</button>
|
|
<button
|
|
@click.stop="host_game()"
|
|
>Host a Game</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'JoinHost',
|
|
components: {},
|
|
data() {return {}},
|
|
methods: {
|
|
host_game() {
|
|
let username = ``;
|
|
do {
|
|
username = prompt(`Enter a username:`, ``);
|
|
if (!username) {
|
|
return
|
|
}
|
|
} while (username.length == 0);
|
|
|
|
sessionStorage.setItem(`user-name`, username);
|
|
this.$socket.emit(`HostGame`, {
|
|
username: username
|
|
});
|
|
},
|
|
join_game() {
|
|
sessionStorage.setItem(`is-host`, false)
|
|
this.$emit(`go-to`, `game-code`)
|
|
},
|
|
},
|
|
sockets: {
|
|
HostInformation(data) {
|
|
if (data.success) {
|
|
localStorage.setItem(`user-id`, data.uuid)
|
|
sessionStorage.setItem(`game-code`, data.game_code);
|
|
sessionStorage.setItem(`is-host`, true);
|
|
this.$emit(`go-to`, `lobby`);
|
|
} else {
|
|
console.error(data.message);
|
|
this.$emit(`alert`, {
|
|
message: data.message,
|
|
classes: [`error`]
|
|
});
|
|
};
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
@import "../css/colours.css";
|
|
|
|
#game_type_choice {
|
|
text-align: center;
|
|
width: 50vw;
|
|
}
|
|
|
|
button {
|
|
width: 100%;
|
|
margin: 5px;
|
|
}
|
|
</style> |