better dungeon cleared check

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

diff --git a/resources/js/components/tracker/Map.js b/resources/js/components/tracker/Map.js
index 520ad938ab2faaafb61fd3774626af442104aa5b..b2685f873d6776814e00db66ff2cc6c225d51b03 100644 (file)
--- a/resources/js/components/tracker/Map.js
+++ b/resources/js/components/tracker/Map.js
@@ -7,6 +7,7 @@ import {
        decrement,
        hasDungeonBoss,
        increment,
+       isDungeonCleared,
        toggleBoolean,
        unclearAll,
 } from '../../helpers/tracker';
@@ -657,6 +658,25 @@ Location.propTypes = {
        size: PropTypes.string,
 };
 
+const makeBackground = (src, level) => {
+       const amount = Math.pow(2, Math.max(0, level - 8));
+       const size = 1 / amount;
+       const tiles = [];
+       for (let y = 0; y < amount; ++y) {
+               for (let x = 0; x < amount; ++x) {
+                       tiles.push(<image
+                               key={`${x}-${y}`}
+                               x={x * size}
+                               y={y * size}
+                               width={size * 1.002}
+                               height={size * 1.002}
+                               href={`/media/alttp/map/${src}/${level}/${x}_${y}.png`}
+                       />);
+               }
+       }
+       return tiles;
+};
+
 const Map = () => {
        const { dungeons, setState, state } = useTracker();
 
@@ -665,14 +685,8 @@ const Map = () => {
                const cleared = state[`${dungeon.id}-checks`] || 0;
                const total = definition.items;
                let status = 'available';
-               if (cleared === total) {
-                       if (['ct', 'gt'].includes(dungeon.id)) {
-                               if (hasDungeonBoss(state, dungeon)) {
-                                       status = 'cleared';
-                               }
-                       } else {
-                               status = 'cleared';
-                       }
+               if (isDungeonCleared(state, definition)) {
+                       status = 'cleared';
                }
                return {
                        ...dungeon,
@@ -764,34 +778,7 @@ const Map = () => {
                >
                        <g className="light-world">
                                <g className="background">
-                                       <image
-                                               x="0"
-                                               y="0"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/lw_files/9/0_0.png"
-                                       />
-                                       <image
-                                               x="0.5"
-                                               y="0"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/lw_files/9/1_0.png"
-                                       />
-                                       <image
-                                               x="0"
-                                               y="0.5"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/lw_files/9/0_1.png"
-                                       />
-                                       <image
-                                               x="0.5"
-                                               y="0.5"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/lw_files/9/1_1.png"
-                                       />
+                                       {makeBackground('lw_files', 10)}
                                </g>
                                <g className="locations">
                                        {lwLocations.map(l =>
@@ -804,34 +791,7 @@ const Map = () => {
                        </g>
                        <g className="dark-world" transform="translate(1 0)">
                                <g className="background">
-                                       <image
-                                               x="0"
-                                               y="0"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/dw_files/9/0_0.png"
-                                       />
-                                       <image
-                                               x="0.5"
-                                               y="0"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/dw_files/9/1_0.png"
-                                       />
-                                       <image
-                                               x="0"
-                                               y="0.5"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/dw_files/9/0_1.png"
-                                       />
-                                       <image
-                                               x="0.5"
-                                               y="0.5"
-                                               width="0.5"
-                                               height="0.5"
-                                               href="/media/alttp/map/dw_files/9/1_1.png"
-                                       />
+                                       {makeBackground('dw_files', 10)}
                                </g>
                                <g className="locations">
                                        {dwLocations.map(l =>