import React from "react";
import { CityName } from "../../Locations/data/CityNames";
import Typography from "@mui/material/Typography";
import Tooltip from "@mui/material/Tooltip";
interface ICityProps {
currentCity: CityName;
city: CityName;
onTravel: (city: CityName) => void;
}
function City(props: ICityProps): React.ReactElement {
if (props.city !== props.currentCity) {
return (
{props.city}}>
props.onTravel(props.city)}
style={{ color: "white", lineHeight: "1em", whiteSpace: "pre", cursor: "pointer" }}
>
{props.city[0]}
);
}
return {props.city[0]};
}
interface IProps {
currentCity: CityName;
onTravel: (city: CityName) => void;
}
export function WorldMap(props: IProps): React.ReactElement {
// prettier-ignore
return (
<>
,_ . ._. _. .
, _-\','|~\~ ~/ ;-'_ _-' ,;_;_, ~~-
/~~-\_/-'~'--' \~~| ', ,' / / ~|-_\_/~/~ ~~--~~~~'--_
/ ,/'-/~ '\ ,' _ , ','|~ ._/-, /~
~/-'~\_, '-,| '|. ' ~ ,\ /'~ / /_ /~
.-~ '| '',\~|\ _\~ ,_ , /,
'\ /'~ |_/~\\,-,~ \ " ,_,/ |
| / ._-~'\_ _~| \ )
\ __-\ '/ ~ |\ \_ / ~
., '\ |, ~-_ - | \\_' ~| /\ \~ ,
~-_' _; '\ '-, \,' /\/ |
'\_,~'\_ \_ _, /' ' |, /|'
/ \_ ~ | / \ ~'; -,_.
| ~\ | | , '-_, ,; ~ ~\
\, / \ / /| ,-, , -,
| ,/ | |' |/ ,- ~ \ '.
,| ,/ \ ,/ \ |
/ | ~ -~~-, / _
| ,-' ~ /
/ ,' ~
',| ~
~'
>
);
}