X-Git-Url: https://git.localhorst.tv/?a=blobdiff_plain;f=resources%2Fjs%2Fcomponents%2Ftracker%2FMap.js;fp=resources%2Fjs%2Fcomponents%2Ftracker%2FMap.js;h=311263116a4c197f7af63378ecac1d793b2f6f1a;hb=6ce22c808bd3025ea252334e516451ddc3b948eb;hp=d8e76364fb864a0f09def8cd0e1423a24ad30f83;hpb=f145023c506cecad618e465a034933e1a5962637;p=alttp.git

diff --git a/resources/js/components/tracker/Map.js b/resources/js/components/tracker/Map.js
index d8e7636..3112631 100644
--- a/resources/js/components/tracker/Map.js
+++ b/resources/js/components/tracker/Map.js
@@ -314,7 +314,7 @@ const LW_LOCATIONS = [
 			'saha',
 		],
 		x: 0.815,
-		y: 0.42,
+		y: 0.465,
 	},
 	{
 		id: 'saha-hut',
@@ -324,7 +324,7 @@ const LW_LOCATIONS = [
 			'saha-right',
 		],
 		x: 0.815,
-		y: 0.465,
+		y: 0.42,
 	},
 	{
 		id: 'sick-kid',
@@ -601,7 +601,7 @@ const DW_LOCATIONS = [
 	},
 ];
 
-const Location = ({ l, size }) => {
+const Location = ({ number, l, size }) => {
 	const { t } = useTranslation();
 
 	const classNames = ['location', `status-${l.status}`];
@@ -609,12 +609,17 @@ const Location = ({ l, size }) => {
 		classNames.push(`size-${size}`);
 	}
 
-	return <rect className={classNames.join(' ')} x={l.x} y={l.y}>
+	return <g className={classNames.join(' ')} transform={`translate(${l.x} ${l.y})`}>
 		<title>{t(`tracker.location.${l.id}`)}</title>
-	</rect>;
+		<rect className="box" x="0" y="0" />
+		{number && l.cleared < l.total ?
+			<text className="text" x="0" y="0">{Math.max(0, l.total - l.cleared)}</text>
+		: null}
+	</g>;
 };
 
 Location.propTypes = {
+	number: PropTypes.bool,
 	l: PropTypes.shape({
 		id: PropTypes.string,
 		x: PropTypes.number,
@@ -716,7 +721,7 @@ const Map = () => {
 						<Location key={l.id} l={l} />
 					)}
 					{lwDungeons.map(l =>
-						<Location key={l.id} l={l} size="lg" />
+						<Location key={l.id} number l={l} size="lg" />
 					)}
 				</g>
 			</g>
@@ -756,7 +761,7 @@ const Map = () => {
 						<Location key={l.id} l={l} />
 					)}
 					{dwDungeons.map(l =>
-						<Location key={l.id} l={l} size="lg" />
+						<Location key={l.id} number l={l} size="lg" />
 					)}
 				</g>
 			</g>