Create view to choose whether to host or join a game.
This commit is contained in:
parent
a4bb47fa35
commit
6b8c918310
2 changed files with 62 additions and 34 deletions
62
src/views/JoinHost.vue
Normal file
62
src/views/JoinHost.vue
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<div id="game_code_entry">
|
||||
<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 {}},
|
||||
sockets: {
|
||||
HostInformation(data) {
|
||||
console.log(data)
|
||||
if (data.success) {
|
||||
sessionStorage.setItem(`game-code`, data.game_code);
|
||||
this.$emit(`is-host`, true);
|
||||
this.$emit(`go-to`, `lobby`);
|
||||
} else {
|
||||
this.error = data.error_message
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
host_game() {
|
||||
let username = ``;
|
||||
do {
|
||||
username = prompt(`Enter a username:`, ``);
|
||||
if (!username) {
|
||||
return
|
||||
}
|
||||
} while (username.length == 0);
|
||||
|
||||
this.$socket.emit(`HostGame`, {
|
||||
username: username
|
||||
});
|
||||
},
|
||||
join_game() {
|
||||
this.$emit(`go-to`, ``)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus" scoped>
|
||||
@import "../theme.styl"
|
||||
|
||||
button {
|
||||
width: 100%
|
||||
margin: 5px
|
||||
}
|
||||
</style>
|
||||
Loading…
Add table
Add a link
Reference in a new issue