feat: functional armor type toggling

This commit is contained in:
TrèsAbhi committed 2024-07-29 19:59:07 -05:00
1 parent 0aca2dab6c
commit c4b5baf6cc
6 files changed
+52 -33

No files matched your search

@@ -70,9 +70,6 @@ export function Options({ thicknessRange }: OptionsProps) {
const wireframe = TankopediaPersistent.use(
(state) => state.model.visual.wireframe,
);
const showSpacedArmor = TankopediaPersistent.use(
(state) => state.model.visual.showSpacedArmor,
);
const opaque = TankopediaPersistent.use((state) => state.model.visual.opaque);
const fullScreenAvailable = useFullscreenAvailability();
const environment = TankopediaPersistent.use(
@@ -537,24 +534,10 @@ export function Options({ thicknessRange }: OptionsProps) {
</DropdownMenu.Trigger>
<DropdownMenu.Content>
{display !== TankopediaDisplay.Model && (
{display === TankopediaDisplay.DynamicArmor && (
<>
<DropdownMenu.Label>Armor</DropdownMenu.Label>
<DropdownMenu.CheckboxItem
checked={showSpacedArmor}
onCheckedChange={(checked) => {
mutateTankopediaPersistent((draft) => {
draft.model.visual.showSpacedArmor = checked;
});
mutateTankopediaEphemeral((draft) => {
draft.shot = undefined;
});
}}
>
Spaced armor
</DropdownMenu.CheckboxItem>
<DropdownMenu.CheckboxItem
checked={greenPenetration}
onCheckedChange={(checked) => {
@@ -1,6 +1,7 @@
import { EyeClosedIcon, EyeOpenIcon } from '@radix-ui/react-icons';
import { Box, Flex, Text } from '@radix-ui/themes';
import { ThicknessRange } from '../../../../../components/StaticArmor/components/StaticArmorScene';
import * as TankopediaEphemeral from '../../../../../stores/tankopediaEphemeral';
import * as TankopediaPersistent from '../../../../../stores/tankopediaPersistent';
interface ThicknessesProps {
@@ -18,6 +19,7 @@ export function Thicknesses({ thicknessRange }: ThicknessesProps) {
(state) => state.model.visual.showCoreArmor,
);
const mutateTankopediaPersistent = TankopediaPersistent.useMutation();
const mutateTankopediaEphemeral = TankopediaEphemeral.useMutation();
return (
<Flex
@@ -25,7 +27,7 @@ export function Thicknesses({ thicknessRange }: ThicknessesProps) {
right="0"
top="50%"
mr="4"
style={{ transform: 'translateY(-50%)' }}
style={{ transform: 'translateY(-50%)', userSelect: 'none' }}
direction="column"
gap="2"
align="end"
@@ -39,6 +41,9 @@ export function Thicknesses({ thicknessRange }: ThicknessesProps) {
draft.model.visual.showCoreArmor =
!draft.model.visual.showCoreArmor;
});
mutateTankopediaEphemeral((draft) => {
draft.highlightArmor = undefined;
});
}}
>
<Flex direction="column" align="end" justify="between">
@@ -73,6 +78,9 @@ export function Thicknesses({ thicknessRange }: ThicknessesProps) {
draft.model.visual.showSpacedArmor =
!draft.model.visual.showSpacedArmor;
});
mutateTankopediaEphemeral((draft) => {
draft.highlightArmor = undefined;
});
}}
>
<Flex direction="column" align="end" justify="between">
@@ -106,6 +114,9 @@ export function Thicknesses({ thicknessRange }: ThicknessesProps) {
draft.model.visual.showExternalModules =
!draft.model.visual.showExternalModules;
});
mutateTankopediaEphemeral((draft) => {
draft.highlightArmor = undefined;
});
}}
>
<Flex direction="column" align="end" justify="between">