enhance(reversi): 開始時に対局をシェアできるように
This commit is contained in:
parent
547be1973d
commit
645f5e8633
4 changed files with 42 additions and 16 deletions
8
locales/index.d.ts
vendored
8
locales/index.d.ts
vendored
|
@ -9583,6 +9583,14 @@ export interface Locale extends ILocale {
|
|||
* 対局がキャンセルされました
|
||||
*/
|
||||
"gameCanceled": string;
|
||||
/**
|
||||
* 開始時に対局をタイムラインに投稿
|
||||
*/
|
||||
"shareToTlTheGameWhenStart": string;
|
||||
/**
|
||||
* 対局を開始しました! #MisskeyReversi
|
||||
*/
|
||||
"iStartedAGame": string;
|
||||
};
|
||||
"_offlineScreen": {
|
||||
/**
|
||||
|
|
|
@ -2553,6 +2553,8 @@ _reversi:
|
|||
freeMatch: "フリーマッチ"
|
||||
lookingForPlayer: "対戦相手を探しています"
|
||||
gameCanceled: "対局がキャンセルされました"
|
||||
shareToTlTheGameWhenStart: "開始時に対局をタイムラインに投稿"
|
||||
iStartedAGame: "対局を開始しました! #MisskeyReversi"
|
||||
|
||||
_offlineScreen:
|
||||
title: "オフライン - サーバーに接続できません"
|
||||
|
|
|
@ -81,7 +81,8 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<template #footer>
|
||||
<div :class="$style.footer">
|
||||
<MkSpacer :contentMax="700" :marginMin="16" :marginMax="16">
|
||||
<div style="text-align: center; margin-bottom: 10px;">
|
||||
<div style="text-align: center;" class="_gaps_s">
|
||||
<div>
|
||||
<template v-if="isReady && isOpReady">{{ i18n.ts._reversi.thisGameIsStartedSoon }}<MkEllipsis/></template>
|
||||
<template v-if="isReady && !isOpReady">{{ i18n.ts._reversi.waitingForOther }}<MkEllipsis/></template>
|
||||
<template v-if="!isReady && isOpReady">{{ i18n.ts._reversi.waitingForMe }}</template>
|
||||
|
@ -92,6 +93,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
<MkButton v-if="!isReady" rounded primary @click="ready">{{ i18n.ts._reversi.ready }}</MkButton>
|
||||
<MkButton v-if="isReady" rounded @click="unready">{{ i18n.ts._reversi.cancelReady }}</MkButton>
|
||||
</div>
|
||||
<div>
|
||||
<MkSwitch v-model="shareWhenStart">{{ i18n.ts._reversi.shareToTlTheGameWhenStart }}</MkSwitch>
|
||||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -124,6 +129,8 @@ const props = defineProps<{
|
|||
connection: Misskey.ChannelConnection;
|
||||
}>();
|
||||
|
||||
const shareWhenStart = defineModel<boolean>('shareWhenStart', { default: false });
|
||||
|
||||
const game = ref<Misskey.entities.ReversiGameDetailed>(deepClone(props.game));
|
||||
|
||||
const mapName = computed(() => {
|
||||
|
|
|
@ -5,7 +5,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<template>
|
||||
<div v-if="game == null || (!game.isEnded && connection == null)"><MkLoading/></div>
|
||||
<GameSetting v-else-if="!game.isStarted" :game="game" :connection="connection!"/>
|
||||
<GameSetting v-else-if="!game.isStarted" v-model:shareWhenStart="shareWhenStart" :game="game" :connection="connection!"/>
|
||||
<GameBoard v-else :game="game" :connection="connection"/>
|
||||
</template>
|
||||
|
||||
|
@ -32,17 +32,30 @@ const props = defineProps<{
|
|||
|
||||
const game = shallowRef<Misskey.entities.ReversiGameDetailed | null>(null);
|
||||
const connection = shallowRef<Misskey.ChannelConnection | null>(null);
|
||||
const shareWhenStart = ref(false);
|
||||
|
||||
watch(() => props.gameId, () => {
|
||||
fetchGame();
|
||||
});
|
||||
|
||||
function start(_game: Misskey.entities.ReversiGameDetailed) {
|
||||
if (shareWhenStart.value) {
|
||||
misskeyApi('notes/create', {
|
||||
text: i18n.ts._reversi.iStartedAGame + '\n' + location.href,
|
||||
visibility: 'home',
|
||||
});
|
||||
}
|
||||
|
||||
game.value = _game;
|
||||
}
|
||||
|
||||
async function fetchGame() {
|
||||
const _game = await misskeyApi('reversi/show-game', {
|
||||
gameId: props.gameId,
|
||||
});
|
||||
|
||||
game.value = _game;
|
||||
shareWhenStart.value = false;
|
||||
|
||||
if (connection.value) {
|
||||
connection.value.dispose();
|
||||
|
@ -52,7 +65,7 @@ async function fetchGame() {
|
|||
gameId: game.value.id,
|
||||
});
|
||||
connection.value.on('started', x => {
|
||||
game.value = x.game;
|
||||
start(x.game);
|
||||
});
|
||||
connection.value.on('canceled', x => {
|
||||
connection.value?.dispose();
|
||||
|
@ -78,10 +91,6 @@ onUnmounted(() => {
|
|||
}
|
||||
});
|
||||
|
||||
const headerActions = computed(() => []);
|
||||
|
||||
const headerTabs = computed(() => []);
|
||||
|
||||
definePageMetadata(computed(() => ({
|
||||
title: 'Reversi',
|
||||
icon: 'ti ti-device-gamepad',
|
||||
|
|
Loading…
Reference in a new issue