display-map-options: add option to toggle portals

macabeus · Jun 22, 2019 · 1fd64bb · 1fd64bb
1 parent 904c6c2
commit 1fd64bb
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/brush/src/components/Map/index.js b/brush/src/components/Map/index.js
@@ -15,6 +15,7 @@ const Map = ({
   highlightCoordinates,
   optShowGrid,
   optShowOAM,
+  optShowPortals,
   toolState,
 }) => {
   const { updateTilemapPoint, vision } = useContext(VisionContext) // workaround because a limitation in react-konva (https://github.com/konvajs/react-konva/issues/349)
@@ -52,7 +53,7 @@ const Map = ({
           totalStages={totalStages}
           vision={vision}
         />}
-        <PortalsLayer vision={vision} />
+        {optShowPortals && <PortalsLayer vision={vision} />}
         <Layer>
           <HighlightCoordinates
             coordinates={highlightCoordinates}
@@ -74,6 +75,7 @@ Map.propTypes = {
   highlightCoordinates: PropTypes.arrayOf(PropTypes.number),
   optShowGrid: PropTypes.bool,
   optShowOAM: PropTypes.bool,
+  optShowPortals: PropTypes.bool,
   toolState: PropTypes.shape({
     name: PropTypes.string.isRequired,
     value: PropTypes.any,
@@ -84,6 +86,7 @@ Map.defaultProps = {
   highlightCoordinates: [-1, -1],
   optShowGrid: false,
   optShowOAM: true,
+  optShowPortals: true,
 }
 
 export default Map
diff --git a/brush/src/pages/Main/LoadedRom.js b/brush/src/pages/Main/LoadedRom.js
@@ -25,6 +25,7 @@ const LoadedRom = () => {
   const [highlightCoordinates, setHighlightCoordinates] = useState([-1, -1])
   const [optShowGrid, setOptShowGrid] = useState(false)
   const [optShowOAM, setOptShowOAM] = useState(true)
+  const [optShowPortals, setOptShowPortals] = useState(true)
   const [toolState, setToolState] = useTool()
 
   useWhenVisionChanges(() => {
@@ -61,6 +62,13 @@ const LoadedRom = () => {
                       checked={optShowOAM}
                       onChange={() => { setOptShowOAM(!optShowOAM) }}
                     />
+                    <Checkbox
+                      label="Show Portals"
+                      name="optShowPortals"
+                      value={`${optShowPortals}`}
+                      checked={optShowPortals}
+                      onChange={() => { setOptShowPortals(!optShowPortals) }}
+                    />
                   </Fragment>
                 </PopoverContent>
               }
@@ -77,6 +85,7 @@ const LoadedRom = () => {
                 highlightCoordinates={highlightCoordinates}
                 optShowGrid={optShowGrid}
                 optShowOAM={optShowOAM}
+                optShowPortals={optShowPortals}
                 toolState={toolState}
               /> :
               <MapEmptyState />