provisional oot map

diff --git a/resources/js/components/zootr/MixedPoolsTracker.js b/resources/js/components/zootr/MixedPoolsTracker.js
index 0f08ee6572748d79bf5899ad81c00a17a33308e9..8e3a7e1501ca23e6b3c423d9da09c94d2a0e4040 100644 (file)
--- a/resources/js/components/zootr/MixedPoolsTracker.js
+++ b/resources/js/components/zootr/MixedPoolsTracker.js
@@ -9,14 +9,24 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Kokiri Forest',
                short: 'KF',
+               map: {
+                       pos: { x: 210, y: 240 },
+                       size: { x: 150, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/kf.png',
+                               off: { x: 0, y: 0 },
+                               scale: 1.3,
+                       },
+               },
                entrances: [
                        {
                                id: 'bro',
                                bgColor: '#b6d7a8',
                                fgColor: '#000000',
-                               name: 'Brothers\' House',
+                               name: 'Know-It-All Brothers\' House',
                                short: 'Bros',
                                type: 'Interior',
+                               pos: { x: 13, y: 57 },
                        },
                        {
                                id: 'link',
@@ -25,6 +35,7 @@ const AREAS = [
                                name: 'Link\'s House',
                                short: 'Links',
                                type: 'SpecialInterior',
+                               pos: { x: 36, y: 74 },
                        },
                        {
                                id: 'sariah',
@@ -33,30 +44,34 @@ const AREAS = [
                                name: 'Sariah\'s House',
                                short: 'Sariahs',
                                type: 'Interior',
+                               pos: { x: 47, y: 66 },
                        },
                        {
                                id: 'twin',
                                bgColor: '#b6d7a8',
                                fgColor: '#000000',
-                               name: 'Twins\' House',
+                               name: 'House of Twins',
                                short: 'Twins',
                                type: 'Interior',
+                               pos: { x: 58, y: 64 },
                        },
                        {
                                id: 'shop',
                                bgColor: '#b6d7a8',
                                fgColor: '#000000',
-                               name: 'Shop',
+                               name: 'Kokiri Shop',
                                short: 'Shop',
                                type: 'Interior',
+                               pos: { x: 53, y: 42 },
                        },
                        {
                                id: 'mido',
                                bgColor: '#b6d7a8',
                                fgColor: '#000000',
-                               name: 'Mido\'s House',
+                               name: 'Great Mido\'s House',
                                short: 'Mido',
                                type: 'Interior',
+                               pos: { x: 28, y: 38 },
                        },
                        {
                                id: 'deku',
@@ -66,6 +81,7 @@ const AREAS = [
                                short: 'Deku',
                                spacer: true,
                                type: 'Dungeon',
+                               pos: { x: 114, y: 26 },
                        },
                        {
                                id: 'storms',
@@ -74,6 +90,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 25, y: 25 },
                        },
                        {
                                id: 'hf',
@@ -82,6 +99,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 4, y: 45 },
                        },
                        {
                                id: 'lw',
@@ -90,6 +108,7 @@ const AREAS = [
                                name: 'Lost Woods',
                                short: 'LW',
                                type: 'Overworld',
+                               pos: { x: 31, y: 21 },
                        },
                ],
        },
@@ -99,14 +118,24 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Lost Woods',
                short: 'LW',
+               map: {
+                       pos: { x: 370, y: 220 },
+                       size: { x: 75, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/lw.png',
+                               off: { x: 0, y: 0 },
+                               scale: 1.3,
+                       },
+               },
                entrances: [
                        {
                                id: 'gcg',
                                bgColor: '#b7b7b7',
                                fgColor: '#000000',
-                               name: 'GC Grotto',
+                               name: 'Goron City Grotto',
                                short: 'GC Grotto',
                                type: 'Grotto',
+                               pos: { x: 45, y: 40 },
                        },
                        {
                                id: 'tg',
@@ -115,6 +144,7 @@ const AREAS = [
                                name: 'Theater Grotto',
                                short: 'Theater Grotto',
                                type: 'Grotto',
+                               pos: { x: 32, y: 25 },
                        },
                        {
                                id: 'sfmg',
@@ -123,6 +153,7 @@ const AREAS = [
                                name: 'SFM Grotto',
                                short: 'SFM Grotto',
                                type: 'Grotto',
+                               pos: { x: 40, y: 12 },
                        },
                        {
                                id: 'kf',
@@ -132,6 +163,7 @@ const AREAS = [
                                short: 'KF',
                                spacer: true,
                                type: 'Overworld',
+                               pos: { x: 31, y: 60 },
                        },
                        {
                                id: 'gc',
@@ -140,6 +172,7 @@ const AREAS = [
                                name: 'Goron City',
                                short: 'GC',
                                type: 'Overworld',
+                               pos: { x: 44, y: 33 },
                        },
                        {
                                id: 'zr',
@@ -148,6 +181,7 @@ const AREAS = [
                                name: 'Zora\'s River',
                                short: 'ZR',
                                type: 'Overworld',
+                               pos: { x: 68, y: 38 },
                        },
                        {
                                id: 'sfm',
@@ -156,6 +190,7 @@ const AREAS = [
                                name: 'Sacred Forest Maedows',
                                short: 'SFM',
                                type: 'Overworld',
+                               pos: { x: 45, y: 6 },
                        },
                ],
        },
@@ -165,6 +200,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Sacred Forest Maedows',
                short: 'SFM',
+               map: {
+                       pos: { x: 460, y: 220 },
+                       size: { x: 35, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/sfm.png',
+                               off: { x: -20, y: 0 },
+                               scale: 4.3,
+                       },
+               },
                entrances: [
                        {
                                id: 'forest',
@@ -173,6 +217,7 @@ const AREAS = [
                                name: 'Forest Temple',
                                short: 'Forest Temple',
                                type: 'Dungeon',
+                               pos: { x: 18, y: 5 },
                        },
                        {
                                id: 'wolf',
@@ -181,6 +226,7 @@ const AREAS = [
                                name: 'Wolf Grotto',
                                short: 'Wolf Grotto',
                                type: 'Grotto',
+                               pos: { x: 14, y: 87 },
                        },
                        {
                                id: 'fairy',
@@ -189,6 +235,7 @@ const AREAS = [
                                name: 'Fairy Grotto',
                                short: 'Fairy Grotto',
                                type: 'Grotto',
+                               pos: { x: 18, y: 60 },
                        },
                        {
                                id: 'storms',
@@ -197,6 +244,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 25, y: 18 },
                        },
                        {
                                id: 'lw',
@@ -205,6 +253,7 @@ const AREAS = [
                                name: 'Lost Woods',
                                short: 'LW',
                                type: 'Overworld',
+                               pos: { x: 14, y: 95 },
                        },
                ],
        },
@@ -214,6 +263,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Graveyard',
                short: 'Grave',
+               map: {
+                       pos: { x: 310, y: 170 },
+                       size: { x: 100, y: 35, },
+                       bg: {
+                               src: '/media/oot/minimap/gy.png',
+                               off: { x: 0, y: -5 },
+                               scale: 1.5,
+                       },
+               },
                entrances: [
                        {
                                id: 'dh',
@@ -222,6 +280,7 @@ const AREAS = [
                                name: 'Dampe Hut',
                                short: 'Dampe Hut',
                                type: 'Interior',
+                               pos: { x: 22, y: 26 },
                        },
                        {
                                id: 'shadow',
@@ -230,6 +289,7 @@ const AREAS = [
                                name: 'Shadow Temple',
                                short: 'Shadow',
                                type: 'Dungeon',
+                               pos: { x: 90, y: 16 },
                        },
                        {
                                id: 'shield',
@@ -238,6 +298,7 @@ const AREAS = [
                                name: 'Shield Grave',
                                short: 'Shield Grave',
                                type: 'Grave',
+                               pos: { x: 30, y: 19 },
                        },
                        {
                                id: 'race',
@@ -246,6 +307,7 @@ const AREAS = [
                                name: 'Dampe Race',
                                short: 'Dampe Race',
                                type: 'Grave',
+                               pos: { x: 25, y: 7 },
                        },
                        {
                                id: 'sun',
@@ -254,6 +316,7 @@ const AREAS = [
                                name: 'Sun Song Grave',
                                short: 'Sun Song Gr',
                                type: 'Grave',
+                               pos: { x: 41, y: 21 },
                        },
                        {
                                id: 'family',
@@ -262,6 +325,7 @@ const AREAS = [
                                name: 'Family Tomb',
                                short: 'Family Tomb',
                                type: 'Grave',
+                               pos: { x: 52, y: 15 },
                        },
                        {
                                id: 'kak',
@@ -270,6 +334,7 @@ const AREAS = [
                                name: 'Kakariko',
                                short: 'Kak',
                                type: 'Overworld',
+                               pos: { x: 5, y: 20 },
                        },
                ],
        },
@@ -279,14 +344,24 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Kakariko Village',
                short: 'Kak',
+               map: {
+                       pos: { x: 190, y: 140 },
+                       size: { x: 125, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/kak.png',
+                               off: { x: -7, y: 0 },
+                               scale: 1.7,
+                       },
+               },
                entrances: [
                        {
                                id: 'talon',
                                bgColor: '#f9cb9c',
                                fgColor: '#000000',
-                               name: 'Talon\'s House',
+                               name: 'Carpenter Boss House',
                                short: 'Talons',
                                type: 'Interior',
+                               pos: { x: 66, y: 51 },
                        },
                        {
                                id: 'skull',
@@ -295,6 +370,7 @@ const AREAS = [
                                name: 'Skulltula House',
                                short: 'Skulltula',
                                type: 'Interior',
+                               pos: { x: 58, y: 73 },
                        },
                        {
                                id: 'impaf',
@@ -303,6 +379,7 @@ const AREAS = [
                                name: 'Impa Front',
                                short: 'Impa Front',
                                type: 'Interior',
+                               pos: { x: 58, y: 92 },
                        },
                        {
                                id: 'impab',
@@ -311,14 +388,16 @@ const AREAS = [
                                name: 'Impa Back',
                                short: 'Impa Back',
                                type: 'Interior',
+                               pos: { x: 71, y: 91 },
                        },
                        {
                                id: 'shield',
                                bgColor: '#f9cb9c',
                                fgColor: '#000000',
-                               name: 'Shield Shop',
+                               name: 'Shield Shop (Bazaar)',
                                short: 'Shield Shop',
                                type: 'Interior',
+                               pos: { x: 60, y: 28 },
                        },
                        {
                                id: 'potion',
@@ -327,6 +406,7 @@ const AREAS = [
                                name: 'Potion Shop',
                                short: 'Potion Shop',
                                type: 'SpecialInterior',
+                               pos: { x: 70, y: 28 },
                        },
                        {
                                id: 'back',
@@ -335,6 +415,7 @@ const AREAS = [
                                name: 'Shop Back',
                                short: 'Shop Back',
                                type: 'SpecialInterior',
+                               pos: { x: 80, y: 28 },
                        },
                        {
                                id: 'witch',
@@ -343,6 +424,7 @@ const AREAS = [
                                name: 'Witch',
                                short: 'Witch',
                                type: 'Interior',
+                               pos: { x: 84, y: 46 },
                        },
                        {
                                id: 'arch',
@@ -351,6 +433,7 @@ const AREAS = [
                                name: 'Archery',
                                short: 'Archery',
                                type: 'Interior',
+                               pos: { x: 72, y: 67 },
                        },
                        {
                                id: 'mill',
@@ -359,6 +442,7 @@ const AREAS = [
                                name: 'Windmill',
                                short: 'Windmill',
                                type: 'SpecialInterior',
+                               pos: { x: 96, y: 59 },
                        },
                        {
                                id: 'botw',
@@ -368,6 +452,7 @@ const AREAS = [
                                short: 'Bottom Well',
                                spacer: true,
                                type: 'Dungeon',
+                               pos: { x: 84, y: 59 },
                        },
                        {
                                id: 'open',
@@ -376,6 +461,7 @@ const AREAS = [
                                name: 'Open Grotto',
                                short: 'Open Grotto',
                                type: 'Grotto',
+                               pos: { x: 86, y: 37 },
                        },
                        {
                                id: 'redead',
@@ -384,6 +470,7 @@ const AREAS = [
                                name: 'Redead Grotto',
                                short: 'Redead Grotto',
                                type: 'Grotto',
+                               pos: { x: 58, y: 57 },
                        },
                        {
                                id: 'hf',
@@ -392,6 +479,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 10, y: 74 },
                        },
                        {
                                id: 'dmt',
@@ -400,6 +488,7 @@ const AREAS = [
                                name: 'Death Mountain Trail',
                                short: 'DMT',
                                type: 'Overworld',
+                               pos: { x: 67, y: 8 },
                        },
                        {
                                id: 'gy',
@@ -408,6 +497,7 @@ const AREAS = [
                                name: 'Graveyard',
                                short: 'Grave',
                                type: 'Overworld',
+                               pos: { x: 112, y: 83 },
                        },
                ],
        },
@@ -417,6 +507,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Market 1',
                short: 'M1',
+               map: {
+                       pos: { x: 100, y: 80 },
+                       size: { x: 100, y: 60, },
+                       bg: {
+                               src: '/media/oot/minimap/m1.png',
+                               off: { x: 0, y: -6 },
+                               scale: 1.0,
+                       },
+               },
                entrances: [
                        {
                                id: 'shield',
@@ -425,6 +524,7 @@ const AREAS = [
                                name: 'Shield Shop',
                                short: 'Shield Shop',
                                type: 'Interior',
+                               pos: { x: 81, y: 36 },
                        },
                        {
                                id: 'potion',
@@ -433,6 +533,7 @@ const AREAS = [
                                name: 'Potion Shop',
                                short: 'Potion Shop',
                                type: 'Interior',
+                               pos: { x: 81, y: 27 },
                        },
                        {
                                id: 'mask',
@@ -441,14 +542,16 @@ const AREAS = [
                                name: 'Mask Shop',
                                short: 'Mask Shop',
                                type: 'Interior',
+                               pos: { x: 75, y: 14 },
                        },
                        {
                                id: 'sling',
                                bgColor: '#b4a7d6',
                                fgColor: '#000000',
-                               name: 'Slingshot/Arrow Game',
+                               name: 'Slingshot Game',
                                short: 'Sling Game',
                                type: 'Interior',
+                               pos: { x: 60, y: 14 },
                        },
                        {
                                id: 'chuu',
@@ -457,6 +560,7 @@ const AREAS = [
                                name: 'Bombchu Bowling',
                                short: 'Bombchu',
                                type: 'Interior',
+                               pos: { x: 54, y: 30 },
                        },
                        {
                                id: 'tcg',
@@ -465,6 +569,7 @@ const AREAS = [
                                name: 'Treasure Chest Game',
                                short: 'TCG',
                                type: 'Interior',
+                               pos: { x: 52, y: 48 },
                        },
                        {
                                id: 'alleyl',
@@ -473,6 +578,7 @@ const AREAS = [
                                name: 'Backalley Left',
                                short: 'Alley L',
                                type: 'Overworld',
+                               pos: { x: 26, y: 48 },
                        },
                        {
                                id: 'alleyr',
@@ -481,6 +587,7 @@ const AREAS = [
                                name: 'Backalley Right',
                                short: 'Alley R',
                                type: 'Overworld',
+                               pos: { x: 18, y: 10 },
                        },
                        {
                                id: 'tot',
@@ -489,6 +596,7 @@ const AREAS = [
                                name: 'Temple of Time',
                                short: 'ToT',
                                type: 'Overworld',
+                               pos: { x: 92, y: 15 },
                        },
                        {
                                id: 'hc',
@@ -497,6 +605,7 @@ const AREAS = [
                                name: 'Hyrule Castle',
                                short: 'HC',
                                type: 'Overworld',
+                               pos: { x: 67, y: 7 },
                        },
                        {
                                id: 'm2',
@@ -505,6 +614,7 @@ const AREAS = [
                                name: 'Market 2',
                                short: 'M2',
                                type: 'Overworld',
+                               pos: { x: 66, y: 50 },
                        },
                ],
        },
@@ -514,6 +624,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Market 2',
                short: 'M2',
+               map: {
+                       pos: { x: 205, y: 85 },
+                       size: { x: 18, y: 50, },
+                       bg: {
+                               src: '/media/oot/minimap/m2.png',
+                               off: { x: -3, y: -3 },
+                               scale: 3.6,
+                       },
+               },
                entrances: [
                        {
                                id: 'bp',
@@ -522,6 +641,7 @@ const AREAS = [
                                name: 'Big Poe',
                                short: 'Big Poe',
                                type: 'Interior',
+                               pos: { x: 15.5, y: 32 },
                        },
                        {
                                id: 'hf',
@@ -530,6 +650,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 8.5, y: 47.5 },
                        },
                        {
                                id: 'm1',
@@ -538,6 +659,7 @@ const AREAS = [
                                name: 'Market 1',
                                short: 'M1',
                                type: 'Overworld',
+                               pos: { x: 8.5, y: 3 },
                        },
                ],
        },
@@ -547,6 +669,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Hyrule Castle',
                short: 'HC',
+               map: {
+                       pos: { x: 100, y: 0 },
+                       size: { x: 120, y: 70, },
+                       bg: {
+                               src: '/media/oot/minimap/hc-gc.png',
+                               off: { x: 0, y: 0 },
+                               scale: 1.2,
+                       },
+               },
                entrances: [
                        {
                                id: 'hcfairy',
@@ -555,6 +686,7 @@ const AREAS = [
                                name: 'Hyrule Castle Fairy',
                                short: 'HC Fairy',
                                type: 'Interior',
+                               pos: { x: 61, y: 23 },
                        },
                        {
                                id: 'gfairy',
@@ -563,6 +695,7 @@ const AREAS = [
                                name: 'Ganon\'s Castle Fairy',
                                short: 'Ganon Fairy',
                                type: 'Interior',
+                               pos: { x: 116, y: 51 },
                        },
                        {
                                id: 'igc',
@@ -571,6 +704,7 @@ const AREAS = [
                                name: 'Inside Ganon\'s Castle',
                                short: 'IGC',
                                type: 'DungeonSpecial',
+                               pos: { x: 83, y: 30 },
                        },
                        {
                                id: 'storms',
@@ -579,6 +713,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 30, y: 29 },
                        },
                        {
                                id: 'm1',
@@ -587,6 +722,7 @@ const AREAS = [
                                name: 'Market 1',
                                short: 'M1',
                                type: 'Overworld',
+                               pos: { x: 60, y: 66 },
                        },
                ],
        },
@@ -596,6 +732,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Hyrule Field',
                short: 'HF',
+               map: {
+                       pos: { x: 90, y: 150 },
+                       size: { x: 100, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/hf.png',
+                               off: { x: -16, y: 0 },
+                               scale: 1.8,
+                       },
+               },
                entrances: [
                        {
                                id: 'destiny',
@@ -604,6 +749,7 @@ const AREAS = [
                                name: 'Destiny Grotto',
                                short: 'Destiny Grotto',
                                type: 'Grotto',
+                               pos: { x: 33, y: 7 },
                        },
                        {
                                id: 'tektite',
@@ -612,14 +758,16 @@ const AREAS = [
                                name: 'Tektite Grotto',
                                short: 'Tektite',
                                type: 'Grotto',
+                               pos: { x: 30, y: 23 },
                        },
                        {
                                id: 'nw',
                                bgColor: '#b7b7b7',
                                fgColor: '#000000',
-                               name: 'Northwest Grotto',
+                               name: 'Northwest Grotto (near Market)',
                                short: 'NW Grotto',
                                type: 'Grotto',
+                               pos: { x: 48, y: 13 },
                        },
                        {
                                id: 'nk',
@@ -628,6 +776,7 @@ const AREAS = [
                                name: 'Grotto near Kakariko',
                                short: 'near Kak Gro',
                                type: 'Grotto',
+                               pos: { x: 68, y: 8 },
                        },
                        {
                                id: 'se',
@@ -636,6 +785,7 @@ const AREAS = [
                                name: 'Southeast Grotto',
                                short: 'SE Grotto',
                                type: 'Grotto',
+                               pos: { x: 55, y: 78 },
                        },
                        {
                                id: 'open',
@@ -644,6 +794,7 @@ const AREAS = [
                                name: 'Open Grotto',
                                short: 'Open Grotto',
                                type: 'Grotto',
+                               pos: { x: 35, y: 86 },
                        },
                        {
                                id: 'sg',
@@ -652,6 +803,7 @@ const AREAS = [
                                name: 'South Grotto',
                                short: 'South Grotto',
                                type: 'Grotto',
+                               pos: { x: 28, y: 87 },
                        },
                        {
                                id: 'cow',
@@ -660,6 +812,7 @@ const AREAS = [
                                name: 'Cow Grotto',
                                short: 'Cow Grotto',
                                type: 'Grotto',
+                               pos: { x: 13, y: 47 },
                        },
                        {
                                id: 'town',
@@ -669,6 +822,7 @@ const AREAS = [
                                short: 'Town',
                                spacer: true,
                                type: 'Overworld',
+                               pos: { x: 57, y: 10 },
                        },
                        {
                                id: 'llr',
@@ -677,6 +831,7 @@ const AREAS = [
                                name: 'Lon Lon Ranch',
                                short: 'LLR',
                                type: 'Overworld',
+                               pos: { x: 45, y: 44 },
                        },
                        {
                                id: 'kak',
@@ -685,6 +840,7 @@ const AREAS = [
                                name: 'Kakariko',
                                short: 'Kak',
                                type: 'Overworld',
+                               pos: { x: 80, y: 10 },
                        },
                        {
                                id: 'zr',
@@ -693,6 +849,7 @@ const AREAS = [
                                name: 'Zora\'s River',
                                short: 'ZR',
                                type: 'Overworld',
+                               pos: { x: 94, y: 30 },
                        },
                        {
                                id: 'kf',
@@ -701,6 +858,7 @@ const AREAS = [
                                name: 'Kokiri Forest',
                                short: 'KF',
                                type: 'Overworld',
+                               pos: { x: 87, y: 57 },
                        },
                        {
                                id: 'lh',
@@ -709,6 +867,7 @@ const AREAS = [
                                name: 'Lake Hylia',
                                short: 'LH',
                                type: 'Overworld',
+                               pos: { x: 25, y: 95 },
                        },
                        {
                                id: 'gv',
@@ -717,6 +876,7 @@ const AREAS = [
                                name: 'Gerudo Valley',
                                short: 'GV',
                                type: 'Overworld',
+                               pos: { x: 6, y: 51 },
                        },
                ],
        },
@@ -726,6 +886,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Zora\'s River',
                short: 'ZR',
+               map: {
+                       pos: { x: 330, y: 100 },
+                       size: { x: 100, y: 60, },
+                       bg: {
+                               src: '/media/oot/minimap/zr.png',
+                               off: { x: 0, y: 0 },
+                               scale: 1.3,
+                       },
+               },
                entrances: [
                        {
                                id: 'storms',
@@ -734,6 +903,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 8, y: 28 },
                        },
                        {
                                id: 'open',
@@ -742,6 +912,7 @@ const AREAS = [
                                name: 'Open Grotto',
                                short: 'Open Grotto',
                                type: 'Grotto',
+                               pos: { x: 36, y: 32 },
                        },
                        {
                                id: 'boulder',
@@ -750,6 +921,7 @@ const AREAS = [
                                name: 'Boulder Grotto',
                                short: 'Boulder Grotto',
                                type: 'Grotto',
+                               pos: { x: 40, y: 24 },
                        },
                        {
                                id: 'hf',
@@ -759,6 +931,7 @@ const AREAS = [
                                short: 'HF',
                                spacer: true,
                                type: 'Overworld',
+                               pos: { x: 10, y: 52 },
                        },
                        {
                                id: 'lw',
@@ -767,6 +940,7 @@ const AREAS = [
                                name: 'Lost Woods',
                                short: 'LW',
                                type: 'Overworld',
+                               pos: { x: 90.5, y: 18 },
                        },
                        {
                                id: 'zd',
@@ -775,6 +949,7 @@ const AREAS = [
                                name: 'Zora\'s Domain',
                                short: 'ZD',
                                type: 'Overworld',
+                               pos: { x: 96, y: 9 },
                        },
                ],
        },
@@ -784,6 +959,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Zora\'s Domain',
                short: 'ZD',
+               map: {
+                       pos: { x: 410, y: 100 },
+                       size: { x: 80, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/zd.png',
+                               off: { x: -15, y: -5 },
+                               scale: 2.3,
+                       },
+               },
                entrances: [
                        {
                                id: 'shop',
@@ -792,6 +976,7 @@ const AREAS = [
                                name: 'Shop',
                                short: 'Shop',
                                type: 'Interior',
+                               pos: { x: 55, y: 85 },
                        },
                        {
                                id: 'storms',
@@ -800,6 +985,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 16, y: 64 },
                        },
                        {
                                id: 'zr',
@@ -808,6 +994,7 @@ const AREAS = [
                                name: 'Zora\'s River',
                                short: 'ZR',
                                type: 'Overworld',
+                               pos: { x: 6, y: 73 },
                        },
                        {
                                id: 'lh',
@@ -816,6 +1003,7 @@ const AREAS = [
                                name: 'Lake Hylia',
                                short: 'LH',
                                type: 'Overworld',
+                               pos: { x: 35, y: 72 },
                        },
                        {
                                id: 'zf',
@@ -824,6 +1012,7 @@ const AREAS = [
                                name: 'Zora\'s Fountain',
                                short: 'ZF',
                                type: 'Overworld',
+                               pos: { x: 58, y: 15 },
                        },
                ],
        },
@@ -833,6 +1022,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Zora\'s Fountain',
                short: 'ZF',
+               map: {
+                       pos: { x: 410, y: 0 },
+                       size: { x: 90, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/zf.png',
+                               off: { x: -5, y: 0 },
+                               scale: 2.1,
+                       },
+               },
                entrances: [
                        {
                                id: 'wall',
@@ -841,6 +1039,7 @@ const AREAS = [
                                name: 'Fairy Wall',
                                short: 'Fairy Wall',
                                type: 'Interior',
+                               pos: { x: 61, y: 90 },
                        },
                        {
                                id: 'jabu',
@@ -849,6 +1048,7 @@ const AREAS = [
                                name: 'Jabu Jabu\'s Belly',
                                short: 'Jabu',
                                type: 'Dungeon',
+                               pos: { x: 34, y: 38 },
                        },
                        {
                                id: 'ice',
@@ -857,6 +1057,7 @@ const AREAS = [
                                name: 'Ice Cavern',
                                short: 'Ice Cavern',
                                type: 'Dungeon',
+                               pos: { x: 52, y: 10 },
                        },
                        {
                                id: 'zd',
@@ -865,6 +1066,7 @@ const AREAS = [
                                name: 'Zora\'s Domain',
                                short: 'ZD',
                                type: 'Overworld',
+                               pos: { x: 12, y: 55 },
                        },
                ],
        },
@@ -874,6 +1076,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Lake Hylia',
                short: 'LH',
+               map: {
+                       pos: { x: 0, y: 265 },
+                       size: { x: 90, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/lh.png',
+                               off: { x: -15, y: -5 },
+                               scale: 1.9,
+                       },
+               },
                entrances: [
                        {
                                id: 'dive',
@@ -882,6 +1093,7 @@ const AREAS = [
                                name: 'Lab Diving',
                                short: 'Lab Dive',
                                type: 'Interior',
+                               pos: { x: 30, y: 43 },
                        },
                        {
                                id: 'fishing',
@@ -890,6 +1102,7 @@ const AREAS = [
                                name: 'Fishing Game',
                                short: 'Fishing',
                                type: 'Interior',
+                               pos: { x: 68, y: 43 },
                        },
                        {
                                id: 'water',
@@ -898,6 +1111,7 @@ const AREAS = [
                                name: 'Water Temple',
                                short: 'Water Temple',
                                type: 'Dungeon',
+                               pos: { x: 45, y: 65 },
                        },
                        {
                                id: 'owl',
@@ -906,6 +1120,7 @@ const AREAS = [
                                name: 'Owl Grotto',
                                short: 'Owl Grotto',
                                type: 'Grotto',
+                               pos: { x: 24, y: 65 },
                        },
                        {
                                id: 'hf',
@@ -914,6 +1129,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 35, y: 5 },
                        },
                        {
                                id: 'zd',
@@ -922,6 +1138,7 @@ const AREAS = [
                                name: 'Zora\'s Domain',
                                short: 'ZD',
                                type: 'Overworld',
+                               pos: { x: 45, y: 40 },
                        },
                ],
        },
@@ -931,6 +1148,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Lon Lon Ranch',
                short: 'LLR',
+               map: {
+                       pos: { x: 100, y: 260 },
+                       size: { x: 80, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/llr.png',
+                               off: { x: -22, y: -6 },
+                               scale: 2.6,
+                       },
+               },
                entrances: [
                        {
                                id: 'chicken',
@@ -939,6 +1165,7 @@ const AREAS = [
                                name: 'Chicken Game',
                                short: 'Chicken',
                                type: 'Interior',
+                               pos: { x: 54, y: 13 },
                        },
                        {
                                id: 'stable',
@@ -947,6 +1174,7 @@ const AREAS = [
                                name: 'Stable',
                                short: 'Stable',
                                type: 'Interior',
+                               pos: { x: 50, y: 19 },
                        },
                        {
                                id: 'tower',
@@ -955,6 +1183,7 @@ const AREAS = [
                                name: 'Tower',
                                short: 'Tower',
                                type: 'Interior',
+                               pos: { x: 17, y: 82 },
                        },
                        {
                                id: 'grotto',
@@ -963,6 +1192,7 @@ const AREAS = [
                                name: 'Grotto',
                                short: 'Grotto',
                                type: 'Grotto',
+                               pos: { x: 60, y: 85 },
                        },
                        {
                                id: 'hf',
@@ -971,6 +1201,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 60, y: 5 },
                        },
                ],
        },
@@ -980,6 +1211,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Gerudo Valley',
                short: 'GV',
+               map: {
+                       pos: { x: 0, y: 190 },
+                       size: { x: 100, y: 75, },
+                       bg: {
+                               src: '/media/oot/minimap/gv.png',
+                               off: { x: -17, y: -5 },
+                               scale: 1.9,
+                       },
+               },
                entrances: [
                        {
                                id: 'tent',
@@ -988,6 +1228,7 @@ const AREAS = [
                                name: 'Tent',
                                short: 'Tent',
                                type: 'Interior',
+                               pos: { x: 44, y: 33 },
                        },
                        {
                                id: 'str2',
@@ -996,6 +1237,7 @@ const AREAS = [
                                name: 'Strength 2 Grotto',
                                short: 'Str2 Grotto',
                                type: 'Grotto',
+                               pos: { x: 60, y: 60 },
                        },
                        {
                                id: 'storms',
@@ -1004,6 +1246,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 39, y: 27 },
                        },
                        {
                                id: 'hf',
@@ -1012,6 +1255,7 @@ const AREAS = [
                                name: 'Hyrule Field',
                                short: 'HF',
                                type: 'Overworld',
+                               pos: { x: 93, y: 45 },
                        },
                        {
                                id: 'gf',
@@ -1020,6 +1264,7 @@ const AREAS = [
                                name: 'Gerudo Fortress',
                                short: 'GF',
                                type: 'Overworld',
+                               pos: { x: 6, y: 22 },
                        },
                        {
                                id: 'wf',
@@ -1029,6 +1274,7 @@ const AREAS = [
                                short: 'Waterfall',
                                oneway: true,
                                type: 'OverworldOneWay',
+                               pos: { x: 58, y: 69 },
                        },
                ],
        },
@@ -1038,6 +1284,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Gerudo Fortress',
                short: 'GF',
+               map: {
+                       pos: { x: 0, y: 90 },
+                       size: { x: 90, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/gf.png',
+                               off: { x: -5, y: -35 },
+                               scale: 2.5,
+                       },
+               },
                entrances: [
                        {
                                id: 'gtg',
@@ -1046,6 +1301,7 @@ const AREAS = [
                                name: 'Gerudo Training Grounds',
                                short: 'GTG',
                                type: 'Dungeon',
+                               pos: { x: 48, y: 60 },
                        },
                        {
                                id: 'storms',
@@ -1054,6 +1310,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 52, y: 47 },
                        },
                        {
                                id: 'gv',
@@ -1062,6 +1319,7 @@ const AREAS = [
                                name: 'Gerudo Valley',
                                short: 'GV',
                                type: 'Overworld',
+                               pos: { x: 43, y: 93 },
                        },
                        {
                                id: 'hw',
@@ -1070,6 +1328,7 @@ const AREAS = [
                                name: 'Haunted Wasteland',
                                short: 'Waste',
                                type: 'Overworld',
+                               pos: { x: 7, y: 13 },
                        },
                ],
        },
@@ -1079,6 +1338,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Desert Colossus',
                short: 'DCol',
+               map: {
+                       pos: { x: 0, y: 0 },
+                       size: { x: 100, y: 90, },
+                       bg: {
+                               src: '/media/oot/minimap/dcol.png',
+                               off: { x: 0, y: -2 },
+                               scale: 2.0,
+                       },
+               },
                entrances: [
                        {
                                id: 'spirit',
@@ -1087,6 +1355,7 @@ const AREAS = [
                                name: 'Spirit Temple',
                                short: 'Spirit',
                                type: 'Dungeon',
+                               pos: { x: 10, y: 43.5 },
                        },
                        {
                                id: 'fairy',
@@ -1095,6 +1364,7 @@ const AREAS = [
                                name: 'Fairy',
                                short: 'Fairy',
                                type: 'Interior',
+                               pos: { x: 62, y: 21 },
                        },
                        {
                                id: 'str2',
@@ -1103,6 +1373,7 @@ const AREAS = [
                                name: 'Strength 2 Grotto',
                                short: 'Str2 Grotto',
                                type: 'Grotto',
+                               pos: { x: 32, y: 28 },
                        },
                        {
                                id: 'hw',
@@ -1111,6 +1382,7 @@ const AREAS = [
                                name: 'Haunted Wasteland',
                                short: 'Waste',
                                type: 'Overworld',
+                               pos: { x: 85, y: 40 },
                        },
                ],
        },
@@ -1145,6 +1417,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Death Mountain Crater',
                short: 'DMC',
+               map: {
+                       pos: { x: 320, y: 0 },
+                       size: { x: 90, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/dmc.png',
+                               off: { x: -15, y: -3 },
+                               scale: 1.9,
+                       },
+               },
                entrances: [
                        {
                                id: 'fairy',
@@ -1153,6 +1434,7 @@ const AREAS = [
                                name: 'Fairy',
                                short: 'Fairy',
                                type: 'Interior',
+                               pos: { x: 17, y: 68 },
                        },
                        {
                                id: 'fire',
@@ -1161,6 +1443,7 @@ const AREAS = [
                                name: 'Fire Temple',
                                short: 'Fire',
                                type: 'Dungeon',
+                               pos: { x: 48, y: 6 },
                        },
                        {
                                id: 'boulder',
@@ -1169,6 +1452,7 @@ const AREAS = [
                                name: 'Boulder Grotto',
                                short: 'Boulder Gro',
                                type: 'Grotto',
+                               pos: { x: 49, y: 86 },
                        },
                        {
                                id: 'hammer',
@@ -1177,6 +1461,7 @@ const AREAS = [
                                name: 'Hammer Grotto',
                                short: 'Hammer Gro',
                                type: 'Grotto',
+                               pos: { x: 12, y: 35 },
                        },
                        {
                                id: 'gc',
@@ -1185,6 +1470,7 @@ const AREAS = [
                                name: 'Goron City',
                                short: 'GC',
                                type: 'Overworld',
+                               pos: { x: 7, y: 46 },
                        },
                        {
                                id: 'dmt',
@@ -1193,6 +1479,7 @@ const AREAS = [
                                name: 'Death Mountain Trail',
                                short: 'DMT',
                                type: 'Overworld',
+                               pos: { x: 25, y: 90 },
                        },
                ],
        },
@@ -1202,6 +1489,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Death Mountain Trail',
                short: 'DMT',
+               map: {
+                       pos: { x: 280, y: 70 },
+                       size: { x: 40, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/dmt.png',
+                               off: { x: -12, y: 0 },
+                               scale: 3.8,
+                       },
+               },
                entrances: [
                        {
                                id: 'dc',
@@ -1210,6 +1506,7 @@ const AREAS = [
                                name: 'Dodongo\'s Cavern',
                                short: 'DC',
                                type: 'Dungeon',
+                               pos: { x: 8, y: 53 },
                        },
                        {
                                id: 'fairy',
@@ -1218,6 +1515,7 @@ const AREAS = [
                                name: 'Fairy',
                                short: 'Fairy',
                                type: 'Interior',
+                               pos: { x: 22, y: 10 },
                        },
                        {
                                id: 'storms',
@@ -1226,6 +1524,7 @@ const AREAS = [
                                name: 'Storms Grotto',
                                short: 'Storms Grotto',
                                type: 'Grotto',
+                               pos: { x: 23, y: 48 },
                        },
                        {
                                id: 'cow',
@@ -1234,6 +1533,7 @@ const AREAS = [
                                name: 'Cow Grotto',
                                short: 'Cow Grotto',
                                type: 'Grotto',
+                               pos: { x: 20, y: 57 },
                        },
                        {
                                id: 'kak',
@@ -1243,6 +1543,7 @@ const AREAS = [
                                short: 'Kak',
                                spacer: true,
                                type: 'Overworld',
+                               pos: { x: 15, y: 94 },
                        },
                        {
                                id: 'gc',
@@ -1251,6 +1552,7 @@ const AREAS = [
                                name: 'Goron City',
                                short: 'GC',
                                type: 'Overworld',
+                               pos: { x: 24, y: 40 },
                        },
                        {
                                id: 'dmc',
@@ -1259,6 +1561,7 @@ const AREAS = [
                                name: 'Death Mountain Crater',
                                short: 'DMC',
                                type: 'Overworld',
+                               pos: { x: 29, y: 5 },
                        },
                ],
        },
@@ -1268,6 +1571,15 @@ const AREAS = [
                fgColor: '#000000',
                name: 'Goron City',
                short: 'GC',
+               map: {
+                       pos: { x: 220, y: 0 },
+                       size: { x: 90, y: 100, },
+                       bg: {
+                               src: '/media/oot/minimap/gc.png',
+                               off: { x: -2, y: 0 },
+                               scale: 2.0,
+                       },
+               },
                entrances: [
                        {
                                id: 'shop',
@@ -1276,6 +1588,7 @@ const AREAS = [
                                name: 'Shop',
                                short: 'Shop',
                                type: 'Interior',
+                               pos: { x: 42, y: 50 },
                        },
                        {
                                id: 'times',
@@ -1284,6 +1597,7 @@ const AREAS = [
                                name: 'Times Grotto',
                                short: 'Times Grotto',
                                type: 'Grotto',
+                               pos: { x: 80, y: 17 },
                        },
                        {
                                id: 'dmt',
@@ -1292,6 +1606,7 @@ const AREAS = [
                                name: 'Death Mountain Trail',
                                short: 'DMT',
                                type: 'Overworld',
+                               pos: { x: 50.5, y: 95 },
                        },
                        {
                                id: 'lw',
@@ -1300,6 +1615,7 @@ const AREAS = [
                                name: 'Lost Woods',
                                short: 'LW',
                                type: 'Overworld',
+                               pos: { x: 64, y: 93 },
                        },
                        {
                                id: 'dmc',
@@ -1308,6 +1624,7 @@ const AREAS = [
                                name: 'Death Mountain Crater',
                                short: 'DMC',
                                type: 'Overworld',
+                               pos: { x: 51.5, y: 5 },
                        },
                ],
        },
@@ -2090,6 +2407,10 @@ const entranceStyle = (entrance) => {
        };
 };
 
+const vecAdd = (a, b) => ({ x: a.x + b.x, y: a.y + b.y });
+
+const vecMul = (v, f) => ({ x: v.x * f, y: v.y * f });
+
 const SelectBox = ({ id, name, onChange, options, value }) => {
        const [open, setOpen] = React.useState(false);
        const [search, setSearch] = React.useState('');
@@ -2258,6 +2579,40 @@ EntranceRow.propTypes = {
        entranceId: PropTypes.string,
 };
 
+const MapEntrance = ({ entrance }) => {
+       const { connections, setConnection } = useTracker();
+
+       return <circle
+               cx={entrance.pos.x}
+               cy={entrance.pos.y}
+               r="3"
+               className={`entrance${connections[entrance.id] === 'trash' ? ' is-trash' : ''}`}
+               fill={entrance.color}
+               stroke="#000000"
+               onClick={() => {
+                       if (connections[entrance.id] === 'trash') {
+                               setConnection(entrance.id, null);
+                       } else {
+                               setConnection(entrance.id, 'trash');
+                       }
+               }}
+       >
+               <title>{entrance.name}</title>
+       </circle>;
+};
+
+MapEntrance.propTypes = {
+       entrance: PropTypes.shape({
+               color: PropTypes.string,
+               id: PropTypes.string,
+               name: PropTypes.string,
+               pos: PropTypes.shape({
+                       x: PropTypes.number,
+                       y: PropTypes.number,
+               })
+       })
+};
+
 const MixedPoolsTracker = () => {
        const [connections, setConnections] = React.useState({});
 
@@ -2346,8 +2701,52 @@ const MixedPoolsTracker = () => {
                return sg;
        }, [connections]);
 
+       const maps = React.useMemo(() => {
+               return AREAS
+                       .filter((area) => !!area.map)
+                       .map((area) => ({
+                               id: area.id,
+                               pos: area.map.pos,
+                               size: area.map.size,
+                               bg: {
+                                       src: area.map.bg.src,
+                                       pos: vecAdd(area.map.pos, area.map.bg.off),
+                                       size: vecMul(area.map.size, area.map.bg.scale),
+                               },
+                               entrances: area.entrances
+                                       .filter((entrance) => entrance.pos)
+                                       .map((entrance) => ({
+                                               id: `${area.id}.${entrance.id}`,
+                                               name: entranceFull({ ...entrance, area }),
+                                               pos: vecAdd(area.map.pos, entrance.pos),
+                                               color: entrance.bgColor,
+                                       })),
+                       }));
+       }, []);
+
+       const connectors = React.useMemo(() => {
+               return [connections, maps];
+       }, []);
+
        return <CONTEXT.Provider value={context}>
                <div className="mixed-pools-tracker">
+                       <div className="map">
+                               <svg viewBox="0 0 500 370">
+                                       {maps.map((map) =>
+                                               <g key={map.id} title={map.name}>
+                                                       <image
+                                                               href={map.bg.src}
+                                                               pointerEvents="none"
+                                                               x={map.bg.pos.x} y={map.bg.pos.y}
+                                                               width={map.bg.size.x}
+                                                       />
+                                                       {map.entrances.map((entrance) =>
+                                                               <MapEntrance key={entrance.id} entrance={entrance} />
+                                                       )}
+                                               </g>
+                                       )}
+                               </svg>
+                       </div>
                        <div className="columns">
                                {superGroups.map((sg) =>
                                        <div className="column" key={sg.key}>

diff --git a/resources/sass/zootr.scss b/resources/sass/zootr.scss
index e8486d467b5565ce0660b830fc391a063a9f07a9..2ccd13820fe3810a16b1d2b4ca0dc8109042cca0 100644 (file)
--- a/resources/sass/zootr.scss
+++ b/resources/sass/zootr.scss
@@ -93,4 +93,17 @@
                border: thin solid grey;
                cursor: pointer;
        }
+       .map {
+               .entrance {
+                       &.is-trash {
+                               fill: #000000;
+                               opacity: 0.1;
+                       }
+                       &:hover, &:focus, &:active {
+                               opacity: 1;
+                               stroke: #ffffff;
+                               filter: drop-shadow(0 0 1px #000000) drop-shadow(0 0 2px #000000);
+                       }
+               }
+       }
 }