From 48468c188d8d67c9f813c976c60a399c5b7d0b93 Mon Sep 17 00:00:00 2001 From: antoinezanardi Date: Tue, 16 Feb 2021 19:44:40 +0100 Subject: [PATCH] feat(GameOptions): Options for game repartition. Closes #123 --- CHANGELOG.md | 4 +- package-lock.json | 124 +++++++++--------- src/App.vue | 4 +- src/classes/UserPreferences.js | 5 +- src/components/GameLobby/GameLobby.vue | 43 +++++- .../GameOptionsModal/GameOptionsModal.vue | 6 +- .../GameRepartitionOptions.vue | 30 ++++- .../GameOptionsModal/GameRolesOptions.vue | 37 ++---- src/components/NavBar/NavBar.vue | 4 +- src/helpers/functions/Player.js | 10 +- src/plugins/vue-i18n/fr.json | 12 +- src/plugins/vue-toasted/index.js | 2 +- src/store/modules/User.js | 7 + 13 files changed, 178 insertions(+), 110 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 3bf8750..9456ac4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,6 +5,7 @@ ### 🚀 New features * [#121](https://github.com/antoinezanardi/werewolves-assistant-web/issues/121) - Add option for raven mark penalty. +* [#123](https://github.com/antoinezanardi/werewolves-assistant-web/issues/123) - Options for game repartition. * [#124](https://github.com/antoinezanardi/werewolves-assistant-web/issues/124) - Add guard protection on little girl option. * [#125](https://github.com/antoinezanardi/werewolves-assistant-web/issues/125) - Add idiot dies on ancient death option. @@ -31,7 +32,8 @@ * `@vue/test-utils` updated to version `1.1.3`. * `chai` updated to version `4.3.0`. * `eslint` updated to version `7.20.0`. -* `sweetalert2` updated to version `10.14.1`. +* `eslint-plugin-vue` updated to version `7.6.0`. +* `sweetalert2` updated to version `10.15.0`. * `vue-gtag` updated to version `1.11.0`. --- diff --git a/package-lock.json b/package-lock.json index ea3f7e1..e00c9fe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -622,9 +622,9 @@ "dev": true }, "node_modules/@types/node": { - "version": "14.14.27", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.27.tgz", - "integrity": "sha512-Ecfmo4YDQPwuqTCl1yBxLV5ihKfRlkBmzUEDcfIRvDxOTGQEeikr317Ln7Gcv0tjA8dVgKI3rniqW2G1OyKDng==", + "version": "14.14.28", + "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.28.tgz", + "integrity": "sha512-lg55ArB+ZiHHbBBttLpzD07akz0QPrZgUODNakeC09i62dnrywr9mFErHuaPlB6I7z+sEbK+IYmplahvplCj2g==", "dev": true }, "node_modules/@types/normalize-package-data": { @@ -4691,9 +4691,9 @@ } }, "node_modules/electron-to-chromium": { - "version": "1.3.664", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.664.tgz", - "integrity": "sha512-yb8LrTQXQnh9yhnaIHLk6CYugF/An50T20+X0h++hjjhVfgSp1DGoMSYycF8/aD5eiqS4QwaNhiduFvK8rifRg==", + "version": "1.3.665", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.665.tgz", + "integrity": "sha512-LIjx1JheOz7LM8DMEQ2tPnbBzJ4nVG1MKutsbEMLnJfwfVdPIsyagqfLp56bOWhdBrYGXWHaTayYkllIU2TauA==", "dev": true }, "node_modules/elegant-spinner": { @@ -5239,15 +5239,15 @@ "dev": true }, "node_modules/eslint-plugin-vue": { - "version": "7.5.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.5.0.tgz", - "integrity": "sha512-QnMMTcyV8PLxBz7QQNAwISSEs6LYk2LJvGlxalXvpCtfKnqo7qcY0aZTIxPe8QOnHd7WCwiMZLOJzg6A03T0Gw==", + "version": "7.6.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.6.0.tgz", + "integrity": "sha512-qYpKwAvpcQXyUXVcG8Zd+fxHDx9iSgTQuO7dql7Ug/2BCvNNDr6s3I9p8MoUo23JJdO7ZAjW3vSwY/EBf4uBcw==", "dev": true, "dependencies": { "eslint-utils": "^2.1.0", "natural-compare": "^1.4.0", "semver": "^7.3.2", - "vue-eslint-parser": "^7.4.1" + "vue-eslint-parser": "^7.5.0" }, "engines": { "node": ">=8.10" @@ -11346,15 +11346,6 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.1.0.tgz", "integrity": "sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==" }, - "node_modules/particles.vue/node_modules/vue-property-decorator": { - "version": "9.1.2", - "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-9.1.2.tgz", - "integrity": "sha512-xYA8MkZynPBGd/w5QFJ2d/NM0z/YeegMqYTphy7NJQXbZcuU6FC6AOdUAcy4SXP+YnkerC6AfH+ldg7PDk9ESQ==", - "peerDependencies": { - "vue": "*", - "vue-class-component": "*" - } - }, "node_modules/pascalcase": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/pascalcase/-/pascalcase-0.1.1.tgz", @@ -14663,9 +14654,9 @@ } }, "node_modules/sweetalert2": { - "version": "10.14.1", - "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-10.14.1.tgz", - "integrity": "sha512-DI0XsgWSvcMxf58m5FoME9UCPiI5MV+ms819+d5Xly6Z1HvQaQ4sASrcA915g+ow1lsYUnfQLtByqIiosEGd/Q==", + "version": "10.15.0", + "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-10.15.0.tgz", + "integrity": "sha512-zh/4URSGH1b2RrJuPHI9nzcKsg1qMuRCNkmgVILJ+sQavXQn5jRx+ocCUN15vdGi05oavwdbMaXg2qjgr9Lplw==", "funding": { "url": "https://sweetalert2.github.io/#donations" } @@ -15693,16 +15684,16 @@ } }, "node_modules/vue-eslint-parser": { - "version": "7.4.1", - "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.4.1.tgz", - "integrity": "sha512-AFvhdxpFvliYq1xt/biNBslTHE/zbEvSnr1qfHA/KxRIpErmEDrQZlQnvEexednRHmLfDNOMuDYwZL5xkLzIXQ==", + "version": "7.5.0", + "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.5.0.tgz", + "integrity": "sha512-6EHzl00hIpy4yWZo3qSbtvtVw1A1cTKOv1w95QSuAqGgk4113XtRjvNIiEGo49r0YWOPYsrmI4Dl64axL5Agrw==", "dev": true, "dependencies": { "debug": "^4.1.1", "eslint-scope": "^5.0.0", "eslint-visitor-keys": "^1.1.0", "espree": "^6.2.1", - "esquery": "^1.0.1", + "esquery": "^1.4.0", "lodash": "^4.17.15" }, "engines": { @@ -15956,14 +15947,12 @@ "dev": true }, "node_modules/vue-property-decorator": { - "version": "8.5.1", - "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-8.5.1.tgz", - "integrity": "sha512-O6OUN2OMsYTGPvgFtXeBU3jPnX5ffQ9V4I1WfxFQ6dqz6cOUbR3Usou7kgFpfiXDvV7dJQSFcJ5yUPgOtPPm1Q==", - "dependencies": { - "vue-class-component": "^7.1.0" - }, + "version": "9.1.2", + "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-9.1.2.tgz", + "integrity": "sha512-xYA8MkZynPBGd/w5QFJ2d/NM0z/YeegMqYTphy7NJQXbZcuU6FC6AOdUAcy4SXP+YnkerC6AfH+ldg7PDk9ESQ==", "peerDependencies": { - "vue": "*" + "vue": "*", + "vue-class-component": "*" } }, "node_modules/vue-resize": { @@ -15995,6 +15984,17 @@ "url": "https://opencollective.com/core-js" } }, + "node_modules/vue-roller/node_modules/vue-property-decorator": { + "version": "8.5.1", + "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-8.5.1.tgz", + "integrity": "sha512-O6OUN2OMsYTGPvgFtXeBU3jPnX5ffQ9V4I1WfxFQ6dqz6cOUbR3Usou7kgFpfiXDvV7dJQSFcJ5yUPgOtPPm1Q==", + "dependencies": { + "vue-class-component": "^7.1.0" + }, + "peerDependencies": { + "vue": "*" + } + }, "node_modules/vue-router": { "version": "3.5.1", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.1.tgz", @@ -17974,9 +17974,9 @@ "dev": true }, "@types/node": { - "version": "14.14.27", - "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.27.tgz", - "integrity": "sha512-Ecfmo4YDQPwuqTCl1yBxLV5ihKfRlkBmzUEDcfIRvDxOTGQEeikr317Ln7Gcv0tjA8dVgKI3rniqW2G1OyKDng==", + "version": "14.14.28", + "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.28.tgz", + "integrity": "sha512-lg55ArB+ZiHHbBBttLpzD07akz0QPrZgUODNakeC09i62dnrywr9mFErHuaPlB6I7z+sEbK+IYmplahvplCj2g==", "dev": true }, "@types/normalize-package-data": { @@ -21328,9 +21328,9 @@ "dev": true }, "electron-to-chromium": { - "version": "1.3.664", - "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.664.tgz", - "integrity": "sha512-yb8LrTQXQnh9yhnaIHLk6CYugF/An50T20+X0h++hjjhVfgSp1DGoMSYycF8/aD5eiqS4QwaNhiduFvK8rifRg==", + "version": "1.3.665", + "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.665.tgz", + "integrity": "sha512-LIjx1JheOz7LM8DMEQ2tPnbBzJ4nVG1MKutsbEMLnJfwfVdPIsyagqfLp56bOWhdBrYGXWHaTayYkllIU2TauA==", "dev": true }, "elegant-spinner": { @@ -21894,15 +21894,15 @@ } }, "eslint-plugin-vue": { - "version": "7.5.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.5.0.tgz", - "integrity": "sha512-QnMMTcyV8PLxBz7QQNAwISSEs6LYk2LJvGlxalXvpCtfKnqo7qcY0aZTIxPe8QOnHd7WCwiMZLOJzg6A03T0Gw==", + "version": "7.6.0", + "resolved": "https://registry.npmjs.org/eslint-plugin-vue/-/eslint-plugin-vue-7.6.0.tgz", + "integrity": "sha512-qYpKwAvpcQXyUXVcG8Zd+fxHDx9iSgTQuO7dql7Ug/2BCvNNDr6s3I9p8MoUo23JJdO7ZAjW3vSwY/EBf4uBcw==", "dev": true, "requires": { "eslint-utils": "^2.1.0", "natural-compare": "^1.4.0", "semver": "^7.3.2", - "vue-eslint-parser": "^7.4.1" + "vue-eslint-parser": "^7.5.0" }, "dependencies": { "lru-cache": { @@ -26600,12 +26600,6 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.1.0.tgz", "integrity": "sha512-hcVC3wYEziELGGmEEXue7D75zbwIIVUMWAVbHItGPx0ziyXxrOMQx4rQEVEV45Ut/1IotuEvwqPopzIOkDMf0A==" - }, - "vue-property-decorator": { - "version": "9.1.2", - "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-9.1.2.tgz", - "integrity": "sha512-xYA8MkZynPBGd/w5QFJ2d/NM0z/YeegMqYTphy7NJQXbZcuU6FC6AOdUAcy4SXP+YnkerC6AfH+ldg7PDk9ESQ==", - "requires": {} } } }, @@ -29300,9 +29294,9 @@ } }, "sweetalert2": { - "version": "10.14.1", - "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-10.14.1.tgz", - "integrity": "sha512-DI0XsgWSvcMxf58m5FoME9UCPiI5MV+ms819+d5Xly6Z1HvQaQ4sASrcA915g+ow1lsYUnfQLtByqIiosEGd/Q==" + "version": "10.15.0", + "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-10.15.0.tgz", + "integrity": "sha512-zh/4URSGH1b2RrJuPHI9nzcKsg1qMuRCNkmgVILJ+sQavXQn5jRx+ocCUN15vdGi05oavwdbMaXg2qjgr9Lplw==" }, "symbol-observable": { "version": "1.0.1", @@ -30134,16 +30128,16 @@ "requires": {} }, "vue-eslint-parser": { - "version": "7.4.1", - "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.4.1.tgz", - "integrity": "sha512-AFvhdxpFvliYq1xt/biNBslTHE/zbEvSnr1qfHA/KxRIpErmEDrQZlQnvEexednRHmLfDNOMuDYwZL5xkLzIXQ==", + "version": "7.5.0", + "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.5.0.tgz", + "integrity": "sha512-6EHzl00hIpy4yWZo3qSbtvtVw1A1cTKOv1w95QSuAqGgk4113XtRjvNIiEGo49r0YWOPYsrmI4Dl64axL5Agrw==", "dev": true, "requires": { "debug": "^4.1.1", "eslint-scope": "^5.0.0", "eslint-visitor-keys": "^1.1.0", "espree": "^6.2.1", - "esquery": "^1.0.1", + "esquery": "^1.4.0", "lodash": "^4.17.15" }, "dependencies": { @@ -30337,12 +30331,10 @@ } }, "vue-property-decorator": { - "version": "8.5.1", - "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-8.5.1.tgz", - "integrity": "sha512-O6OUN2OMsYTGPvgFtXeBU3jPnX5ffQ9V4I1WfxFQ6dqz6cOUbR3Usou7kgFpfiXDvV7dJQSFcJ5yUPgOtPPm1Q==", - "requires": { - "vue-class-component": "^7.1.0" - } + "version": "9.1.2", + "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-9.1.2.tgz", + "integrity": "sha512-xYA8MkZynPBGd/w5QFJ2d/NM0z/YeegMqYTphy7NJQXbZcuU6FC6AOdUAcy4SXP+YnkerC6AfH+ldg7PDk9ESQ==", + "requires": {} }, "vue-resize": { "version": "1.0.0", @@ -30365,6 +30357,14 @@ "version": "3.8.3", "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.8.3.tgz", "integrity": "sha512-KPYXeVZYemC2TkNEkX/01I+7yd+nX3KddKwZ1Ww7SKWdI2wQprSgLmrTddT8nw92AjEklTsPBoSdQBhbI1bQ6Q==" + }, + "vue-property-decorator": { + "version": "8.5.1", + "resolved": "https://registry.npmjs.org/vue-property-decorator/-/vue-property-decorator-8.5.1.tgz", + "integrity": "sha512-O6OUN2OMsYTGPvgFtXeBU3jPnX5ffQ9V4I1WfxFQ6dqz6cOUbR3Usou7kgFpfiXDvV7dJQSFcJ5yUPgOtPPm1Q==", + "requires": { + "vue-class-component": "^7.1.0" + } } } }, diff --git a/src/App.vue b/src/App.vue index 1a4ef2c..6e06ad9 100644 --- a/src/App.vue +++ b/src/App.vue @@ -51,9 +51,9 @@ export default { this.$error.display(err); } }, - showGameOptionsModal() { + showGameOptionsModal(options) { if (this.$refs.navBar) { - this.$refs.navBar.showGameOptionsModal(); + this.$refs.navBar.showGameOptionsModal(options); } }, }, diff --git a/src/classes/UserPreferences.js b/src/classes/UserPreferences.js index eb93454..e0783a8 100644 --- a/src/classes/UserPreferences.js +++ b/src/classes/UserPreferences.js @@ -2,13 +2,14 @@ import { getProp } from "@/helpers/functions/Class"; class UserPreferences { constructor() { - const localUserPreferences = localStorage.getItem("userPreferences"); + const localUserPreferences = JSON.parse(localStorage.getItem("userPreferences")); this.game = { repartition: { - forbiddenRoles: getProp(localUserPreferences, "game.repartition.forbidden-roles", []), + forbiddenRoles: getProp(localUserPreferences, "game.repartition.forbiddenRoles", []), areRecommendedMinPlayersRespected: getProp(localUserPreferences, "game.repartition.areRecommendedMinPlayersRespected", true), arePowerfulVillagerRolesPrioritized: getProp(localUserPreferences, "game.repartition.arePowerfulVillagerRolesPrioritized", true), arePowerfulWerewolfRolesPrioritized: getProp(localUserPreferences, "game.repartition.arePowerfulWerewolfRolesPrioritized", false), + isProTipShown: getProp(localUserPreferences, "game.repartition.isProTipShown", true), }, }; } diff --git a/src/components/GameLobby/GameLobby.vue b/src/components/GameLobby/GameLobby.vue index 673c0a5..94ebd37 100644 --- a/src/components/GameLobby/GameLobby.vue +++ b/src/components/GameLobby/GameLobby.vue @@ -41,7 +41,9 @@
- @@ -159,6 +161,8 @@ export default { createGame: false, getGameRepartition: false, }, + gameRepartitionRequestCount: 0, + gameOptionsModalButton: { isHighlighted: false }, playerName: "", }; }, @@ -187,6 +191,25 @@ export default { }; }, }, + watch: { + gameRepartitionRequestCount(value) { + if (value === 3 && this.userPreferences.game.repartition.isProTipShown) { + const options = { + icon: "exclamation-circle", duration: 7000, + action: [ + { + text: this.$t("GameLobby.seeOptions"), + onClick: this.highlightAndSeeGameRepartitionOptions, + }, { + text: this.$t("GameLobby.dontShowMeAgain"), + onClick: this.hideGameRepartitionProTipForever, + }, + ], + }; + this.$toasted.info(this.$t("GameLobby.youCanChangeGameRepartitionOptions"), options); + } + }, + }, async created() { try { await this.setGame(new Game()); @@ -206,7 +229,10 @@ export default { } }, methods: { - ...mapActions("user", { checkUserAuthentication: "checkUserAuthentication" }), + ...mapActions("user", { + checkUserAuthentication: "checkUserAuthentication", + setPreferenceGameRepartitionIsProTipShown: "setPreferenceGameRepartitionIsProTipShown", + }), ...mapActions("game", { setGame: "setGame", setGamePlayers: "setGamePlayers", @@ -242,6 +268,7 @@ export default { } catch (e) { this.$error.display(e); } finally { + this.gameRepartitionRequestCount++; this.loading.getGameRepartition = false; } }, @@ -285,6 +312,18 @@ export default { showRolePickerModal(player) { this.$refs.gameLobbyRolePickerModal.show(player); }, + highlightAndSeeGameRepartitionOptions(e, toastObject) { + toastObject.goAway(0); + this.gameOptionsModalButton.isHighlighted = true; + setTimeout(() => { + this.gameOptionsModalButton.isHighlighted = false; + this.$emit("show-game-options-modal", { panel: "game-repartition-options" }); + }, 1000); + }, + hideGameRepartitionProTipForever(e, toastObject) { + toastObject.goAway(0); + this.setPreferenceGameRepartitionIsProTipShown(false); + }, }, }; diff --git a/src/components/NavBar/GameOptionsModal/GameOptionsModal.vue b/src/components/NavBar/GameOptionsModal/GameOptionsModal.vue index 093dad3..9f50dd9 100644 --- a/src/components/NavBar/GameOptionsModal/GameOptionsModal.vue +++ b/src/components/NavBar/GameOptionsModal/GameOptionsModal.vue @@ -56,7 +56,7 @@ export default { data() { return { optionsUpdated: false, - panel: "game-roles-options", + panel: "c", }; }, watch: { @@ -67,7 +67,9 @@ export default { }, }, methods: { - show() { + show(options = {}) { + const { panel = "game-roles-options" } = options; + this.panel = panel; $("#game-options-modal").modal("show"); }, openGameRolesOptions() { diff --git a/src/components/NavBar/GameOptionsModal/GameRepartitionOptions/GameRepartitionOptions.vue b/src/components/NavBar/GameOptionsModal/GameRepartitionOptions/GameRepartitionOptions.vue index fbfb4a0..e787d32 100644 --- a/src/components/NavBar/GameOptionsModal/GameRepartitionOptions/GameRepartitionOptions.vue +++ b/src/components/NavBar/GameOptionsModal/GameRepartitionOptions/GameRepartitionOptions.vue @@ -13,8 +13,8 @@ v-html="$t('GameRepartitionOptions.forbiddenRoles.label')"/>
- + @@ -97,6 +97,7 @@ import { mapActions, mapGetters } from "vuex"; import RoleImage from "@/components/shared/Game/Role/RoleImage"; import ListInvolvedRoles from "@/components/NavBar/GameOptionsModal/GameRepartitionOptions/ListInvolvedRoles"; import { fuseSearch } from "@/helpers/functions/VSelect"; +import i18n from "../../../../plugins/vue-i18n"; export default { name: "GameRepartitionOptions", @@ -106,15 +107,19 @@ export default { ...mapGetters("user", { userPreferences: "userPreferences" }), forbiddenRoles: { get() { - let { forbiddenRoles } = this.userPreferences.game.repartition; - forbiddenRoles = this.roles.filter(({ name }) => name !== "villager" && name !== "werewolf" && !forbiddenRoles.includes(name)); - return forbiddenRoles.map(role => ({ ...role, displayedName: this.$t(`Role.the.${role.name}`) })); + const { forbiddenRoles } = this.userPreferences.game.repartition; + return forbiddenRoles.map(roleName => this.roles.find(({ name }) => name === roleName)); }, set(forbiddenRoles) { this.setPreferenceGameRepartitionForbiddenRoles(forbiddenRoles); this.$emit("options-updated"); }, }, + forbiddenRolesOptions() { + let { forbiddenRoles } = this.userPreferences.game.repartition; + forbiddenRoles = this.roles.filter(({ name }) => name !== "villager" && name !== "werewolf" && !forbiddenRoles.includes(name)); + return forbiddenRoles.map(role => ({ ...role, displayedName: this.$t(`Role.the.${role.name}`) })); + }, areRecommendedMinPlayersRespected: { get() { return this.userPreferences.game.repartition.areRecommendedMinPlayersRespected; @@ -154,6 +159,21 @@ export default { const description = this.arePowerfulVillagerRolesPrioritized ? "powerfulVillagerRolesPrioritized" : "powerfulVillagerRolesNotPrioritized"; return this.$t(`GameRepartitionOptions.arePowerfulVillagerRolesPrioritized.description.${description}`); }, + forbiddenRolesText() { + if (!this.forbiddenRoles.length) { + return this.$t("GameRepartitionOptions.noForbiddenRoles"); + } + let forbiddenRolesText = ""; + for (let i = 0; i < this.forbiddenRoles.length; i++) { + forbiddenRolesText += this.$t(`Role.the.${this.forbiddenRoles[i].name}`); + if (i + 2 < this.forbiddenRoles.length) { + forbiddenRolesText += ", "; + } else if (i + 2 === this.forbiddenRoles.length) { + forbiddenRolesText += ` ${i18n.t("GameRepartitionOptions.and")} `; + } + } + return this.$t("GameRepartitionOptions.forbiddenRolesAre", { forbiddenRolesText }); + }, }, methods: { ...mapActions("user", { diff --git a/src/components/NavBar/GameOptionsModal/GameRolesOptions.vue b/src/components/NavBar/GameOptionsModal/GameRolesOptions.vue index f9299de..ede8cf6 100644 --- a/src/components/NavBar/GameOptionsModal/GameRolesOptions.vue +++ b/src/components/NavBar/GameOptionsModal/GameRolesOptions.vue @@ -42,7 +42,7 @@
- Seer +
@@ -61,7 +61,7 @@
- Little Girl +
@@ -80,7 +80,7 @@
- Idiot +
@@ -99,7 +99,7 @@
- Two Sisters +
@@ -120,7 +120,7 @@
- Three Brothers +
@@ -141,7 +141,7 @@
- Raven +
@@ -165,28 +165,14 @@