X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftracker%2FMap%2FOverworld.js;h=66433e5e50770010bca2eeda03442c302b6584dd;hb=cce28e8619fe87d4be33f82df9a5ec16b2ad9cf6;hp=609dc34cd7c92fd282f566580a9f3a2cc99dc4c3;hpb=6702d0ef2ec2a796a9aa6afdf58604800c4915a0;p=alttp.git

diff --git a/resources/js/components/tracker/Map/Overworld.js b/resources/js/components/tracker/Map/Overworld.js
index 609dc34..66433e5 100644
--- a/resources/js/components/tracker/Map/Overworld.js
+++ b/resources/js/components/tracker/Map/Overworld.js
@@ -22,17 +22,12 @@ import {
 } from '../../../helpers/tracker';
 import { useTracker } from '../../../hooks/tracker';
 
-const LW_DUNGEONS = [
+const GENERIC_LW_DUNGEONS = [
 	{
 		id: 'hc',
 		x: 0.5,
 		y: 0.5,
 	},
-	{
-		id: 'ct',
-		x: 0.5,
-		y: 0.4,
-	},
 	{
 		id: 'ep',
 		x: 0.95,
@@ -50,7 +45,25 @@ const LW_DUNGEONS = [
 	},
 ];
 
-const LW_LOCATIONS = [
+const LW_DUNGEONS = [
+	...GENERIC_LW_DUNGEONS,
+	{
+		id: 'ct',
+		x: 0.5,
+		y: 0.4,
+	},
+];
+
+const INVERTED_LW_DUNGEONS = [
+	...GENERIC_LW_DUNGEONS,
+	{
+		id: 'gt',
+		x: 0.5,
+		y: 0.4,
+	},
+];
+
+const GENERIC_LW_LOCATIONS = [
 	{
 		id: 'aginah',
 		checks: [
@@ -220,14 +233,6 @@ const LW_LOCATIONS = [
 		x: 0.15,
 		y: 0.65,
 	},
-	{
-		id: 'links-house',
-		checks: [
-			'links-house',
-		],
-		x: 0.55,
-		y: 0.6875,
-	},
 	{
 		id: 'lost-woods-hideout',
 		checks: [
@@ -420,7 +425,21 @@ const LW_LOCATIONS = [
 	},
 ];
 
-const DW_DUNGEONS = [
+const LW_LOCATIONS = [
+	...GENERIC_LW_LOCATIONS,
+	{
+		id: 'links-house',
+		checks: [
+			'links-house',
+		],
+		x: 0.55,
+		y: 0.6875,
+	},
+];
+
+const INVERTED_LW_LOCATIONS = GENERIC_LW_LOCATIONS;
+
+const GENERIC_DW_DUNGEONS = [
 	{
 		id: 'pd',
 		x: 0.95,
@@ -456,6 +475,10 @@ const DW_DUNGEONS = [
 		x: 0.94,
 		y: 0.06,
 	},
+];
+
+const DW_DUNGEONS = [
+	...GENERIC_DW_DUNGEONS,
 	{
 		id: 'gt',
 		x: 0.56,
@@ -463,7 +486,16 @@ const DW_DUNGEONS = [
 	},
 ];
 
-const DW_LOCATIONS = [
+const INVERTED_DW_DUNGEONS = [
+	...GENERIC_DW_DUNGEONS,
+	{
+		id: 'ct',
+		x: 0.56,
+		y: 0.05,
+	},
+];
+
+const GENERIC_DW_LOCATIONS = [
 	{
 		id: 'blacksmith',
 		checks: [
@@ -619,6 +651,20 @@ const DW_LOCATIONS = [
 	},
 ];
 
+const DW_LOCATIONS = GENERIC_DW_LOCATIONS;
+
+const INVERTED_DW_LOCATIONS = [
+	...GENERIC_DW_LOCATIONS,
+	{
+		id: 'links-house',
+		checks: [
+			'links-house',
+		],
+		x: 0.55,
+		y: 0.6875,
+	},
+];
+
 const Location = ({ number, l, size }) => {
 	const { t } = useTranslation();
 
@@ -687,7 +733,7 @@ const makeBackground = (src, level) => {
 };
 
 const Overworld = () => {
-	const { dungeons, logic, setManualState, state } = useTracker();
+	const { config, dungeons, logic, setManualState, state } = useTracker();
 
 	const mapDungeon = React.useCallback(dungeon => {
 		const definition = dungeons.find(d => d.id === dungeon.id);
@@ -769,24 +815,56 @@ const Overworld = () => {
 		};
 	}, [logic, setManualState, state]);
 
-	const lwDungeons = React.useMemo(() => LW_DUNGEONS.map(mapDungeon), [mapDungeon]);
-	const lwLocations = React.useMemo(() => LW_LOCATIONS.map(mapLocation), [mapLocation]);
+	const lwDungeons = React.useMemo(() =>
+		(config.worldState === 'inverted' ? INVERTED_LW_DUNGEONS : LW_DUNGEONS)
+		.map(mapDungeon)
+	, [mapDungeon]);
+	const lwLocations = React.useMemo(() =>
+		(config.worldState === 'inverted' ? INVERTED_LW_LOCATIONS : LW_LOCATIONS)
+		.map(mapLocation)
+	, [mapLocation]);
 
-	const dwDungeons = React.useMemo(() => DW_DUNGEONS.map(mapDungeon), [mapDungeon]);
-	const dwLocations = React.useMemo(() => DW_LOCATIONS.map(mapLocation), [mapLocation]);
+	const dwDungeons = React.useMemo(() =>
+		(config.worldState === 'inverted' ? INVERTED_DW_DUNGEONS : DW_DUNGEONS)
+		.map(mapDungeon)
+	, [mapDungeon]);
+	const dwLocations = React.useMemo(() =>
+		(config.worldState === 'inverted' ? INVERTED_DW_LOCATIONS : DW_LOCATIONS)
+		.map(mapLocation)
+	, [mapLocation]);
+
+	const layout = React.useMemo(() => {
+		if (config.mapLayout === 'vertical') {
+			return {
+				width: 1,
+				height: 2,
+				viewBox: '0 0 1 2',
+				lwTransform: '',
+				dwTransform: 'translate(0 1)',
+			};
+		} else {
+			return {
+				width: 2,
+				height: 1,
+				viewBox: '0 0 2 1',
+				lwTransform: '',
+				dwTransform: 'translate(1 0)',
+			};
+		}
+	}, [config]);
 
 	return <svg
 		xmlns="http://www.w3.org/2000/svg"
 		className="canvas"
-		width="2"
-		height="1"
-		viewBox="0 0 2 1"
+		width={layout.width}
+		height={layout.height}
+		viewBox={layout.viewBox}
 		onContextMenu={(e) => {
 			e.preventDefault();
 			e.stopPropagation();
 		}}
 	>
-		<g className="light-world">
+		<g className="light-world" transform={layout.lwTransform}>
 			<g className="background">
 				{makeBackground('lw_files', 10)}
 			</g>
@@ -799,7 +877,7 @@ const Overworld = () => {
 				)}
 			</g>
 		</g>
-		<g className="dark-world" transform="translate(1 0)">
+		<g className="dark-world" transform={layout.dwTransform}>
 			<g className="background">
 				{makeBackground('dw_files', 10)}
 			</g>