This commit is contained in:
syuilo 2018-08-05 13:40:26 +09:00
parent b68f74f39c
commit 128a201b9d
6 changed files with 84 additions and 23 deletions

View File

@ -1,5 +1,6 @@
<template>
<div class="xqnhankfuuilcwvhgsopeqncafzsquya">
<button class="go-index" v-if="selfNav" @click="goIndex">%fa:arrow-left%</button>
<header><b><router-link :to="blackUser | userPage">{{ blackUser | userName }}</router-link></b>(%i18n:common.reversi.black%) vs <b><router-link :to="whiteUser | userPage">{{ whiteUser | userName }}</router-link></b>(%i18n:common.reversi.white%)</header>
<div style="overflow: hidden">
@ -69,7 +70,20 @@ import Reversi, { Color } from '../../../../../../../games/reversi/core';
import { url } from '../../../../../config';
export default Vue.extend({
props: ['initGame', 'connection'],
props: {
initGame: {
type: Object,
require: true
},
connection: {
type: Object,
require: true
},
selfNav: {
type: Boolean,
require: true
}
},
data() {
return {
@ -276,6 +290,10 @@ export default Vue.extend({
(this as any).api('games/reversi/games/surrender', {
gameId: this.game.id
});
},
goIndex() {
this.$emit('go-index');
}
}
});
@ -287,6 +305,14 @@ export default Vue.extend({
root(isDark)
text-align center
> .go-index
position absolute
top 0
left 0
z-index 1
width 42px
height 42px
> header
padding 8px
border-bottom dashed 1px isDark ? #4c5761 : #c4cdd4

View File

@ -1,7 +1,7 @@
<template>
<div>
<x-room v-if="!g.isStarted" :game="g" :connection="connection"/>
<x-game v-else :init-game="g" :connection="connection"/>
<x-game v-else :init-game="g" :connection="connection" :self-nav="selfNav" @go-index="goIndex"/>
</div>
</template>
@ -16,7 +16,16 @@ export default Vue.extend({
XGame,
XRoom
},
props: ['game'],
props: {
game: {
type: Object,
required: true
},
selfNav: {
type: Boolean,
require: true
}
},
data() {
return {
connection: null,
@ -36,6 +45,9 @@ export default Vue.extend({
onStarted(game) {
Object.assign(this.g, game);
this.$forceUpdate();
},
goIndex() {
this.$emit('go-index');
}
}
});

View File

@ -96,11 +96,7 @@ export default Vue.extend({
methods: {
go(game) {
(this as any).api('games/reversi/games/show', {
gameId: game.id
}).then(game => {
this.$emit('go', game);
});
},
match() {

View File

@ -1,7 +1,7 @@
<template>
<div class="vchtoekanapleubgzioubdtmlkribzfd">
<div v-if="game">
<x-gameroom :game="game"/>
<x-gameroom :game="game" :self-nav="selfNav" @go-index="goIndex"/>
</div>
<div class="matching" v-else-if="matching">
<h1>{{ '%i18n:@matching.waiting-for%'.split('{}')[0] }}<b>{{ matching | userName }}</b>{{ '%i18n:@matching.waiting-for%'.split('{}')[1] }}<mk-ellipsis/></h1>
@ -34,6 +34,11 @@ export default Vue.extend({
gameId: {
type: String,
required: false
},
selfNav: {
type: Boolean,
require: false,
default: true
}
},
@ -95,18 +100,24 @@ export default Vue.extend({
(this as any).api('games/reversi/games/show', {
gameId: this.gameId
}).then(game => {
this.nav(game, true);
this.game = game;
Progress.done();
});
}
},
nav(game, silent) {
this.matching = null;
this.game = game;
async nav(game, actualNav = true) {
if (this.selfNav) {
//
if (game != null && (game.settings == null || game.settings.map == null)) {
game = await (this as any).api('games/reversi/games/show', {
gameId: game.id
});
}
if (!silent) {
this.$emit('nav', this.game);
this.game = game;
} else {
this.$emit('nav', game, actualNav);
}
},
@ -125,7 +136,8 @@ export default Vue.extend({
}).then(game => {
if (game) {
this.matching = null;
this.game = game;
this.nav(game);
}
});
},
@ -133,6 +145,11 @@ export default Vue.extend({
onMatched(game) {
this.matching = null;
this.game = game;
this.nav(game, false);
},
goIndex() {
this.nav(null);
}
}
});

View File

@ -1,6 +1,6 @@
<template>
<component :is="ui ? 'mk-ui' : 'div'">
<mk-reversi :game-id="$route.params.game" @nav="nav"/>
<mk-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/>
</component>
</template>
@ -14,9 +14,14 @@ export default Vue.extend({
}
},
methods: {
nav(game) {
history.pushState(null, null, '/reversi/' + game.id);
},
nav(game, actualNav) {
if (actualNav) {
this.$router.push('/reversi/' + game.id);
} else {
// TODO: https://github.com/vuejs/vue-router/issues/703
this.$router.push('/reversi/' + game.id);
}
}
}
});
</script>

View File

@ -1,7 +1,7 @@
<template>
<mk-ui>
<span slot="header">%fa:gamepad%%i18n:@reversi%</span>
<mk-reversi :game-id="$route.params.game" @nav="nav"/>
<mk-reversi :game-id="$route.params.game" @nav="nav" :self-nav="false"/>
</mk-ui>
</template>
@ -14,8 +14,13 @@ export default Vue.extend({
document.documentElement.style.background = '#fff';
},
methods: {
nav(game) {
history.pushState(null, null, '/reversi/' + game.id);
nav(game, actualNav) {
if (actualNav) {
this.$router.push('/reversi/' + game.id);
} else {
// TODO: https://github.com/vuejs/vue-router/issues/703
this.$router.push('/reversi/' + game.id);
}
}
}
});