mcg/mlpcardgame
2
0
Fork 0
Code Issues 23 Pull requests 1 Releases Wiki Activity

Compare commits

base: mcg:3ea031caa32729a0629cf4c7e29f913db42f1b06
Branches Tags
mcg:master
mcg:feature/ready
mcg:feature/board
mcg:feature/dronebuilds
mcg:old-godot
mcg:v1
mcg:v0.1.0
..
compare: mcg:c19a1d2df2594704de4baf1a36aca044a117a74f
Branches Tags
mcg:feature/ready
mcg:master
mcg:feature/board
mcg:feature/dronebuilds
mcg:old-godot
mcg:v1
mcg:v0.1.0

No commits in common. "3ea031caa32729a0629cf4c7e29f913db42f1b06" and "c19a1d2df2594704de4baf1a36aca044a117a74f" have entirely different histories.
3ea031caa3 ... c19a1d2df2

6 changed files with 65 additions and 62 deletions
Show stats Expand all files Collapse all files

34
public/index.html
View file

@ -1,22 +1,18 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<head> <meta charset="utf-8">
<meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="stylesheet" href="//cdn.materialdesignicons.com/2.0.46/css/materialdesignicons.min.css">
<link rel="stylesheet" href="//cdn.materialdesignicons.com/2.0.46/css/materialdesignicons.min.css"> <title>mcgvue</title>
<title>MLPCARDGAME</title> </head>
</head> <body>
<noscript>
<body> <strong>We're sorry but mcgvue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
<noscript> </noscript>
<strong>We're sorry but mcgvue doesn't work properly without JavaScript enabled. Please enable it to <div id="app"></div>
continue.</strong> <!-- built files will be auto injected -->
</noscript> </body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html> </html>

5
src/router.ts
View file

@ -45,6 +45,11 @@ export default new Router({
topnav: "Lobby" topnav: "Lobby"
} }
}, },
{
path: "/room",
name: "room",
component: RoomView
},
{ {
path: "/settings", path: "/settings",
name: "settings", name: "settings",

10
src/store/network/getters.ts
View file

@ -15,16 +15,6 @@ const getters: GetterTree<NetworkState, AppState> = {
connectionType(state): "client" | "server" | "none" { connectionType(state): "client" | "server" | "none" {
return state.peerType; return state.peerType;
},
inRoom(state): boolean {
if (state.peerType == "client") {
return state.connectionStatus == "connected";
}
if (state.peerType == "server") {
return true;
}
return false;
} }
}; };

18
src/store/network/mutations.ts
View file

@ -4,15 +4,21 @@ import { LocalClient, PeerServer, PeerClient } from "@/network";
const mutations: MutationTree<NetworkState> = { const mutations: MutationTree<NetworkState> = {
becomeServer(state, payload: { local: LocalClient; server: PeerServer }) { becomeServer(state, payload: { local: LocalClient; server: PeerServer }) {
state.peerType = "server"; state = {
(state as ServerNetworkState).local = payload.local; ...state,
(state as ServerNetworkState).server = payload.server; peerType: "server",
local: payload.local,
server: payload.server
};
}, },
becomeClient(state, payload: { peer: PeerClient }) { becomeClient(state, payload: { peer: PeerClient }) {
state.peerType = "client"; state = {
(state as ClientNetworkState).connectionStatus = "connecting"; ...state,
(state as ClientNetworkState).peer = payload.peer; connectionStatus: "connecting",
peerType: "client",
peer: payload.peer
};
}, },
connected(state) { connected(state) {

44
src/views/Lobby.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<section class="lobby"> <section class="lobby">
<TopNav /> <TopNav />
<section v-if="!inRoom" class="body"> <section class="body">
<section id="info"> <section id="info">
<b-field label="Your name"> <b-field label="Your name">
<b-input :disabled="busy" v-model="playerName"></b-input> <b-input :disabled="busy" v-model="playerName"></b-input>
@ -24,24 +24,22 @@
Join Join
</b-button> </b-button>
</div> </div>
<div class="only-mobile"> <b-field class="only-mobile full">
<b-field class="full"> <b-input
<b-input :disabled="busy"
:disabled="busy" placeholder="Session ID"
placeholder="Session ID" v-model="joinSessionID"
v-model="joinSessionID" ></b-input>
></b-input> <p class="control">
<p class="control"> <b-button
<b-button type="is-primary"
type="is-primary" @click="join"
@click="join" :disabled="busy || !canJoin"
:disabled="busy || !canJoin" >
> Join
Join </b-button>
</b-button> </p>
</p> </b-field>
</b-field>
</div>
</section> </section>
<section id="host"> <section id="host">
<header> <header>
@ -78,9 +76,6 @@
</div> </div>
</section> </section>
</section> </section>
<section class="room" v-else>
<section class="info"></section>
</section>
</section> </section>
</template> </template>
@ -186,7 +181,7 @@
import { Component, Vue } from "vue-property-decorator"; import { Component, Vue } from "vue-property-decorator";
import TopNav from "@/components/Navigation/TopNav.vue"; import TopNav from "@/components/Navigation/TopNav.vue";
import { StartServerOptions, ConnectOptions } from "@/store/network/types"; import { StartServerOptions, ConnectOptions } from "@/store/network/types";
import { Action, Getter } from "vuex-class"; import { Action } from "vuex-class";
@Component({ @Component({
components: { components: {
@ -206,9 +201,6 @@ export default class Lobby extends Vue {
@Action("connect", { namespace: "network" }) @Action("connect", { namespace: "network" })
private connect!: (options: ConnectOptions) => void; private connect!: (options: ConnectOptions) => void;
@Getter("inRoom", { namespace: "network" })
private inRoom!: boolean;
private data() { private data() {
return { return {
playerName: playerName:

14
src/views/Room.vue Normal file
View file

@ -0,0 +1,14 @@
<template>
<section class="room"></section>
</template>
<style lang="scss" scoped></style>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
@Component({
components: {}
})
export default class RoomView extends Vue {}
</script>