Skip to content

Commit

Permalink
feat(game): changed game options are displayed while starting game (#814
Browse files Browse the repository at this point in the history
)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit


- **New Features**
- Introduced a new composable for managing localized game option texts,
enhancing user experience with clearer descriptions.
- Added a new computed property for accessing structured game options
during game creation.

- **Improvements**
- Refactored game option management in the lobby, simplifying the
handling of voting and composition options.
- Expanded localization files to include detailed descriptions for
various game roles and mechanics.

- **Bug Fixes**
- Enhanced type safety in string conversion functions, ensuring clearer
intent and usage.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
  • Loading branch information
antoinezanardi authored Sep 5, 2024
1 parent 41b08ae commit b49225b
Show file tree
Hide file tree
Showing 121 changed files with 94,177 additions and 67,696 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -21,29 +21,23 @@ import { storeToRefs } from "pinia";
import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeToggleButton/AffirmativeToggleButton.vue";
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const isCompositionHiddenValue = computed<boolean>({
get: () => createGameDto.value.options.composition.isHidden,
get: () => createGameOptionsDto.value.composition.isHidden,
set: value => {
const localCreateGameDto = CreateGameDto.create(createGameDto.value);
localCreateGameDto.options.composition.isHidden = value;
setCreateGameDto(localCreateGameDto);
},
});
const isCompositionHiddenDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(isCompositionHiddenValue.value);
return t(`components.GameLobbyOptionsHubCompositionTab.options.isHidden.descriptions.${booleanAsAffirmative}`);
});
const isCompositionHiddenDescription = computed<string>(() => getGameOptionText("composition.isHidden"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,16 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const isActorPowerlessOnWerewolvesSideValue = computed<boolean>({
get: () => createGameDto.value.options.roles.actor.isPowerlessOnWerewolvesSide,
Expand All @@ -49,9 +47,5 @@ const isActorPowerlessOnWerewolvesSideValue = computed<boolean>({
},
});
const isActorPowerlessOnWerewolvesSideDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(isActorPowerlessOnWerewolvesSideValue.value);
return t(`components.GameLobbyOptionsHubRolesTabActor.options.isPowerlessOnWerewolvesSide.descriptions.${booleanAsAffirmative}`);
});
const isActorPowerlessOnWerewolvesSideDescription = computed<string>(() => getGameOptionText("roles.actor.isPowerlessOnWerewolvesSide"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,16 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const doesBearTamerGrowlOnWerewolvesSideValue = computed<boolean>({
get: () => createGameDto.value.options.roles.bearTamer.doesGrowlOnWerewolvesSide,
Expand All @@ -49,9 +47,5 @@ const doesBearTamerGrowlOnWerewolvesSideValue = computed<boolean>({
},
});
const doesBearTamerGrowlOnWerewolvesSideDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(doesBearTamerGrowlOnWerewolvesSideValue.value);
return t(`components.GameLobbyOptionsHubRolesTabBearTamer.options.doesGrowlOnWerewolvesSide.descriptions.${booleanAsAffirmative}`);
});
const doesBearTamerGrowlOnWerewolvesSideDescription = computed<string>(() => getGameOptionText("roles.bearTamer.doesGrowlOnWerewolvesSide"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,16 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const isBigBadWolfPowerlessIfWerewolfDiesValue = computed<boolean>({
get: () => createGameDto.value.options.roles.bigBadWolf.isPowerlessIfWerewolfDies,
Expand All @@ -49,9 +47,5 @@ const isBigBadWolfPowerlessIfWerewolfDiesValue = computed<boolean>({
},
});
const isBigBadWolfPowerlessIfWerewolfDiesDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(isBigBadWolfPowerlessIfWerewolfDiesValue.value);
return t(`components.GameLobbyOptionsHubRolesTabBigBadWolf.options.isPowerlessIfWerewolfDies.descriptions.${booleanAsAffirmative}`);
});
const isBigBadWolfPowerlessIfWerewolfDiesDescription = computed<string>(() => getGameOptionText("roles.bigBadWolf.isPowerlessIfWerewolfDies"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -44,15 +44,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const mustCupidWinWithLoversValue = computed<boolean>({
get: () => createGameDto.value.options.roles.cupid.mustWinWithLovers,
Expand All @@ -72,15 +71,7 @@ const doLoversRevealRoleToEachOtherValue = computed<boolean>({
},
});
const mustCupidWinWithLoversDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(mustCupidWinWithLoversValue.value);
const mustCupidWinWithLoversDescription = computed<string>(() => getGameOptionText("roles.cupid.mustWinWithLovers"));
return t(`components.GameLobbyOptionsHubRolesTabCupid.options.mustWinWithLovers.descriptions.${booleanAsAffirmative}`);
});
const doLoversRevealRoleToEachOtherDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(doLoversRevealRoleToEachOtherValue.value);
return t(`components.GameLobbyOptionsHubRolesTabCupid.options.lovers.doRevealRoleToEachOther.descriptions.${booleanAsAffirmative}`);
});
const doLoversRevealRoleToEachOtherDescription = computed<string>(() => getGameOptionText("roles.cupid.lovers.doRevealRoleToEachOther"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const canDefenderProtectTwiceValue = computed<boolean>({
get: () => createGameDto.value.options.roles.defender.canProtectTwice,
Expand All @@ -48,9 +47,5 @@ const canDefenderProtectTwiceValue = computed<boolean>({
},
});
const canDefenderProtectTwiceDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(canDefenderProtectTwiceValue.value);
return t(`components.GameLobbyOptionsHubRolesTabDefender.options.canProtectTwice.descriptions.${booleanAsAffirmative}`);
});
const canDefenderProtectTwiceDescription = computed<string>(() => getGameOptionText("roles.defender.canProtectTwice"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -64,15 +64,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const elderLivesCountAgainstWerewolvesValue = computed<number>({
get: () => createGameDto.value.options.roles.elder.livesCountAgainstWerewolves,
Expand All @@ -95,15 +94,7 @@ const doesElderTakeHisRevengeValue = computed<boolean>({
},
});
const elderLivesCountAgainstWerewolvesDescription = computed<string>(() => {
const tKey = "components.GameLobbyOptionsHubRolesTabElder.options.livesCountAgainstWerewolves.description";
const elderLivesCountAgainstWerewolvesDescription = computed<string>(() => getGameOptionText("roles.elder.livesCountAgainstWerewolves"));
return t(tKey, { livesCount: elderLivesCountAgainstWerewolvesValue.value }, elderLivesCountAgainstWerewolvesValue.value);
});
const doesElderTakeHisRevengeDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(doesElderTakeHisRevengeValue.value);
return t(`components.GameLobbyOptionsHubRolesTabElder.options.doesTakeHisRevenge.descriptions.${booleanAsAffirmative}`);
});
const doesElderTakeHisRevengeDescription = computed<string>(() => getGameOptionText("roles.elder.doesTakeHisRevenge"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const isFoxPowerlessIfMissesWerewolfValue = computed<boolean>({
get: () => createGameDto.value.options.roles.fox.isPowerlessIfMissesWerewolf,
Expand All @@ -48,9 +47,5 @@ const isFoxPowerlessIfMissesWerewolfValue = computed<boolean>({
},
});
const isFoxPowerlessIfMissesWerewolfDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(isFoxPowerlessIfMissesWerewolfValue.value);
return t(`components.GameLobbyOptionsHubRolesTabFox.options.isPowerlessIfMissesWerewolf.descriptions.${booleanAsAffirmative}`);
});
const isFoxPowerlessIfMissesWerewolfDescription = computed<string>(() => getGameOptionText("roles.fox.isPowerlessIfMissesWerewolf"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -50,16 +50,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import RoleImage from "~/components/shared/role/RoleImage/RoleImage.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const doSkipCallIfNoTargetValue = computed<boolean>({
get: () => createGameDto.value.options.roles.doSkipCallIfNoTarget,
Expand All @@ -79,15 +77,7 @@ const areRevealedOnDeathValue = computed<boolean>({
},
});
const doSkipCallIfNoTargetDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(doSkipCallIfNoTargetValue.value);
return t(`components.GameLobbyOptionsHubRolesTabGeneral.options.doSkipCallIfNoTarget.descriptions.${booleanAsAffirmative}`);
});
const doSkipCallIfNoTargetDescription = computed<string>(() => getGameOptionText("roles.doSkipCallIfNoTarget"));
const areRevealedOnDeathDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(areRevealedOnDeathValue.value);
return t(`components.GameLobbyOptionsHubRolesTabGeneral.options.areRevealedOnDeath.descriptions.${booleanAsAffirmative}`);
});
const areRevealedOnDeathDescription = computed<string>(() => getGameOptionText("roles.areRevealedOnDeath"));
</script>
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,14 @@ import AffirmativeToggleButton from "~/components/shared/buttons/AffirmativeTogg
import GameOptionInputGroup from "~/components/shared/game/game-options/GameOptionInputGroup/GameOptionInputGroup.vue";
import GameOptionRoleLegend from "~/components/shared/game/game-options/GameOptionRoleLegend/GameOptionRoleLegend.vue";
import { CreateGameDto } from "~/composables/api/game/dto/create-game/create-game.dto";
import { useStrings } from "~/composables/misc/useStrings";
import { useGameOptionsTexts } from "~/composables/api/game/game-options/useGameOptionsTexts";
import { useCreateGameDtoStore } from "~/stores/game/create-game-dto/useCreateGameDtoStore";
const createGameDtoStore = useCreateGameDtoStore();
const { setCreateGameDto } = createGameDtoStore;
const { createGameDto } = storeToRefs(createGameDtoStore);
const { createGameDto, createGameOptionsDto } = storeToRefs(createGameDtoStore);
const { t } = useI18n();
const { convertBooleanAsAffirmativeString } = useStrings();
const { getGameOptionText } = useGameOptionsTexts(createGameOptionsDto);
const doesIdiotDieOnElderDeathValue = computed<boolean>({
get: () => createGameDto.value.options.roles.idiot.doesDieOnElderDeath,
Expand All @@ -48,9 +47,5 @@ const doesIdiotDieOnElderDeathValue = computed<boolean>({
},
});
const doesIdiotDieOnElderDeathDescription = computed<string>(() => {
const booleanAsAffirmative = convertBooleanAsAffirmativeString(doesIdiotDieOnElderDeathValue.value);
return t(`components.GameLobbyOptionsHubRolesTabIdiot.options.doesDieOnElderDeath.descriptions.${booleanAsAffirmative}`);
});
const doesIdiotDieOnElderDeathDescription = computed<string>(() => getGameOptionText("roles.idiot.doesDieOnElderDeath"));
</script>
Loading

0 comments on commit b49225b

Please sign in to comment.