diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index e7bba8506..dc93c9ddd 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -90,6 +90,7 @@ common: my-token-regenerated: "あなたのトークンが更新されたのでサインアウトします。" i-like-sushi: "私は(プリンよりむしろ)寿司が好き" show-reversi-board-labels: "リバーシのボードの行と列のラベルを表示" + use-contrast-reversi-stones: "リバーシのアイコンにコントラストを付ける" verified-user: "公式アカウント" disable-animated-mfm: "投稿内の動きのあるテキストを無効にする" diff --git a/package.json b/package.json index 293b1e5d8..6eda2d581 100644 --- a/package.json +++ b/package.json @@ -157,6 +157,7 @@ "monk": "6.0.6", "ms": "2.1.1", "nan": "2.10.0", + "nested-property": "0.0.7", "node-sass": "4.9.3", "node-sass-json-importer": "3.3.1", "nprogress": "0.2.0", diff --git a/src/client/app/common/views/components/games/reversi/reversi.game.vue b/src/client/app/common/views/components/games/reversi/reversi.game.vue index d8e07c744..b432a2308 100644 --- a/src/client/app/common/views/components/games/reversi/reversi.game.vue +++ b/src/client/app/common/views/components/games/reversi/reversi.game.vue @@ -18,11 +18,11 @@
-
+
{{ String.fromCharCode(64 + i) }}
-
+
{{ i }}
@@ -30,15 +30,15 @@ :class="{ empty: stone == null, none: o.map[i] == 'null', isEnded: game.isEnded, myTurn: !game.isEnded && isMyTurn, can: turnUser ? o.canPut(turnUser.id == blackUser.id, i) : null, prev: o.prevPos == i }" @click="set(i)" :title="`${String.fromCharCode(65 + o.transformPosToXy(i)[0])}${o.transformPosToXy(i)[1] + 1}`"> - black - white + black + white
-
+
{{ i }}
-
+
{{ String.fromCharCode(64 + i) }}
@@ -421,11 +421,12 @@ root(isDark) width 100% height 100% - &[alt="black"] - filter brightness(.5) + &.contrast + &[alt="black"] + filter brightness(.5) - &[alt="white"] - filter brightness(2) + &[alt="white"] + filter brightness(2) > .graph display grid diff --git a/src/client/app/desktop/views/components/settings.vue b/src/client/app/desktop/views/components/settings.vue index 759463981..df131a1a6 100644 --- a/src/client/app/desktop/views/components/settings.vue +++ b/src/client/app/desktop/views/components/settings.vue @@ -56,8 +56,9 @@ %i18n:@show-maps-desc% - + +
@@ -376,7 +377,13 @@ export default Vue.extend({ }, onChangeReversiBoardLabels(v) { this.$store.dispatch('settings/set', { - key: 'reversiBoardLabels', + key: 'games.reversi.showBoardLabels', + value: v + }); + }, + onChangeUseContrastReversiStones(v) { + this.$store.dispatch('settings/set', { + key: 'games.reversi.useContrastStones', value: v }); }, diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue index 7636a0370..6b82be099 100644 --- a/src/client/app/mobile/views/pages/settings.vue +++ b/src/client/app/mobile/views/pages/settings.vue @@ -13,8 +13,9 @@ %i18n:@dark-mode% %i18n:@circle-icons% %i18n:common.i-like-sushi% - %i18n:common.show-reversi-board-labels% %i18n:common.disable-animated-mfm% + %i18n:common.show-reversi-board-labels% + %i18n:common.use-contrast-reversi-stones%
%i18n:@timeline%
@@ -189,7 +190,14 @@ export default Vue.extend({ onChangeReversiBoardLabels(v) { this.$store.dispatch('settings/set', { - key: 'reversiBoardLabels', + key: 'games.reversi.showBoardLabels', + value: v + }); + }, + + onChangeUseContrastReversiStones(v) { + this.$store.dispatch('settings/set', { + key: 'games.reversi.useContrastStones', value: v }); }, diff --git a/src/client/app/store.ts b/src/client/app/store.ts index 7e2cc3976..ba91a11f2 100644 --- a/src/client/app/store.ts +++ b/src/client/app/store.ts @@ -1,5 +1,6 @@ import Vuex from 'vuex'; import createPersistedState from 'vuex-persistedstate'; +import * as nestedProperty from 'nested-property'; import MiOS from './mios'; import { hostname } from './config'; @@ -22,7 +23,12 @@ const defaultSettings = { disableViaMobile: false, memo: null, iLikeSushi: false, - reversiBoardLabels: false + games: { + reversi: { + showBoardLabels: false, + useContrastStones: false + } + } }; const defaultDeviceSettings = { @@ -125,7 +131,7 @@ export default (os: MiOS) => new Vuex.Store({ mutations: { set(state, x: { key: string; value: any }) { - state[x.key] = x.value; + nestedProperty.set(state, x.key, x.value); }, setHome(state, data) {