vertical map layout

[alttp.git] / resources / js / components / tracker / ToggleIcon.js

diff --git a/resources/js/components/tracker/ToggleIcon.js b/resources/js/components/tracker/ToggleIcon.js
index f7cc0744b81f22619634fecfc047cf66451b098a..c1a193c209f9540457cc7d223a6c9f54f7734430 100644 (file)
--- a/resources/js/components/tracker/ToggleIcon.js
+++ b/resources/js/components/tracker/ToggleIcon.js
@@ -19,7 +19,7 @@ import {
 import { useTracker } from '../../hooks/tracker';
 
 const ToggleIcon = ({ controller, className, icons }) => {
-       const { state, setState } = useTracker();
+       const { setManualState, state } = useTracker();
        const activeController = controller || ToggleIcon.nullController;
        const active = activeController.getActive(state, icons);
        const defaultIcon = activeController.getDefault(state, icons);
@@ -35,12 +35,12 @@ const ToggleIcon = ({ controller, className, icons }) => {
        return <span
                className={classNames.join(' ')}
                onClick={(e) => {
-                       activeController.handlePrimary(state, setState, icons);
+                       activeController.handlePrimary(state, setManualState, icons);
                        e.preventDefault();
                        e.stopPropagation();
                }}
                onContextMenu={(e) => {
-                       activeController.handleSecondary(state, setState, icons);
+                       activeController.handleSecondary(state, setManualState, icons);
                        e.preventDefault();
                        e.stopPropagation();
                }}
@@ -97,6 +97,27 @@ const previousString = property => (state, setState, icons) => {
        setState(s => ({ ...s, [property]: previous }));
 };
 
+ToggleIcon.bottleController = ctrl => ({
+       getActive: (state, icons) => state[ctrl] ? icons[state[ctrl] - 1] : null,
+       getDefault: () => 'bottle',
+       handlePrimary: (state, setState, icons) => {
+               if (state[ctrl] === 0) {
+                       // skip over mushroom
+                       setState(s => ({ ...s, [ctrl]: 2 }));
+               } else {
+                       setState(increment(ctrl, icons.length));
+               }
+       },
+       handleSecondary: (state, setState, icons) => {
+               if (state[ctrl] === 2) {
+                       // skip over mushroom
+                       setState(s => ({ ...s, [ctrl]: 0 }));
+               } else {
+                       setState(decrement(ctrl, icons.length));
+               }
+       },
+});
+
 ToggleIcon.countController = max => ({
        getActive: highestActive,
        getDefault: firstIcon,
@@ -205,10 +226,10 @@ ToggleIcon.modulusController = ctrl => ({
        getActive: (state, icons) => icons[(state[ctrl] || 0) % icons.length],
        getDefault: firstIcon,
        handlePrimary: (state, setState, icons) => {
-               setState(increment(icons[0], icons.length));
+               setState(increment(ctrl, icons.length));
        },
        handleSecondary: (state, setState, icons) => {
-               setState(decrement(icons[0], icons.length));
+               setState(decrement(ctrl, icons.length));
        },
 });