Atlas48/grungnet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Moved fog add toggle to two separate icons

Browse Source
This commit is contained in:
Mitchell McCaffrey 2020-06-21 13:18:03 +10:00
parent 3ba7c8809c
commit a300e6bd79
2 changed files with 16 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/map/controls/FogSubtractToggle.js
View File

@ -1,19 +0,0 @@
import React from "react";
import { IconButton } from "theme-ui";
import FogAddIcon from "../../../icons/FogAddIcon";
import FogSubtractIcon from "../../../icons/FogSubtractIcon";
function FogSubtractToggle({ useFogSubtract, onFogSubtractChange }) {
return (
<IconButton
aria-label={useFogSubtract ? "Add Fog" : "Subtract Fog"}
title={useFogSubtract ? "Add Fog" : "Subtract Fog"}
onClick={() => onFogSubtractChange(!useFogSubtract)}
>
{useFogSubtract ? <FogSubtractIcon /> : <FogAddIcon />}
</IconButton>
);
}
export default FogSubtractToggle;

23
src/components/map/controls/FogToolSettings.js
View File

@ -3,12 +3,13 @@ import { Flex } from "theme-ui";
import EdgeSnappingToggle from "./EdgeSnappingToggle";
import RadioIconButton from "./RadioIconButton";
import FogSubtractToggle from "./FogSubtractToggle";
import FogBrushIcon from "../../../icons/FogBrushIcon";
import FogPolygonIcon from "../../../icons/FogPolygonIcon";
import FogRemoveIcon from "../../../icons/FogRemoveIcon";
import FogToggleIcon from "../../../icons/FogToggleIcon";
import FogAddIcon from "../../../icons/FogAddIcon";
import FogSubtractIcon from "../../../icons/FogSubtractIcon";
import UndoButton from "./UndoButton";
import RedoButton from "./RedoButton";
@ -38,12 +39,20 @@ function BrushToolSettings({
<FogBrushIcon />
</RadioIconButton>
<Divider vertical />
<FogSubtractToggle
useFogSubtract={settings.useFogSubtract}
onFogSubtractChange={(useFogSubtract) =>
onSettingChange({ useFogSubtract })
}
/>
<RadioIconButton
title="Add Fog"
onClick={() => onSettingChange({ useFogSubtract: false })}
isSelected={!settings.useFogSubtract}
>
<FogAddIcon />
</RadioIconButton>
<RadioIconButton
title="Subtract Fog"
onClick={() => onSettingChange({ useFogSubtract: true })}
isSelected={settings.useFogSubtract}
>
<FogSubtractIcon />
</RadioIconButton>
{/* TODO: Re-enable edge snapping when holes are fixed */}
{/* <EdgeSnappingToggle
useEdgeSnapping={settings.useEdgeSnapping}