2 Commits

3 changed files with 39 additions and 36 deletions

View File

@@ -21,6 +21,7 @@ interface MapNodeProps {
showJumps?: boolean; showJumps?: boolean;
showKills?: boolean; showKills?: boolean;
viewBoxWidth?: number; // Add viewBox width for scaling calculations viewBoxWidth?: number; // Add viewBox width for scaling calculations
labelScale?: number;
} }
export const MapNode: React.FC<MapNodeProps> = ({ export const MapNode: React.FC<MapNodeProps> = ({
@@ -43,6 +44,7 @@ export const MapNode: React.FC<MapNodeProps> = ({
showJumps = false, showJumps = false,
showKills = false, showKills = false,
viewBoxWidth = 1200, viewBoxWidth = 1200,
labelScale = 1,
}) => { }) => {
const [isHovered, setIsHovered] = useState(false); const [isHovered, setIsHovered] = useState(false);
const [isDragging, setIsDragging] = useState(false); const [isDragging, setIsDragging] = useState(false);
@@ -201,8 +203,7 @@ export const MapNode: React.FC<MapNodeProps> = ({
textShadow: '2px 2px 4px rgba(0,0,0,0.8)', textShadow: '2px 2px 4px rgba(0,0,0,0.8)',
vectorEffect: 'non-scaling-stroke' vectorEffect: 'non-scaling-stroke'
}} }}
transform={`scale(${1 / (1200 / viewBoxWidth)})`} transform={`scale(${(1 / (1200 / viewBoxWidth)) * labelScale})`}
transformOrigin="0 0"
> >
{name} {security !== undefined && ( {name} {security !== undefined && (
<tspan fill={getSecurityColor(security)}>{security.toFixed(1)}</tspan> <tspan fill={getSecurityColor(security)}>{security.toFixed(1)}</tspan>
@@ -229,8 +230,7 @@ export const MapNode: React.FC<MapNodeProps> = ({
textShadow: '1px 1px 2px rgba(0,0,0,0.8)', textShadow: '1px 1px 2px rgba(0,0,0,0.8)',
vectorEffect: 'non-scaling-stroke' vectorEffect: 'non-scaling-stroke'
}} }}
transform={`scale(${1 / (1200 / viewBoxWidth)})`} transform={`scale(${(1 / (1200 / viewBoxWidth)) * labelScale})`}
transformOrigin="0 0"
> >
📡 {signatures} 📡 {signatures}
</text> </text>
@@ -253,8 +253,7 @@ export const MapNode: React.FC<MapNodeProps> = ({
textShadow: '1px 1px 2px rgba(0,0,0,0.8)', textShadow: '1px 1px 2px rgba(0,0,0,0.8)',
vectorEffect: 'non-scaling-stroke' vectorEffect: 'non-scaling-stroke'
}} }}
transform={`scale(${1 / (1200 / viewBoxWidth)})`} transform={`scale(${(1 / (1200 / viewBoxWidth)) * labelScale})`}
transformOrigin="0 0"
> >
🚀 {jumps} 🚀 {jumps}
</text> </text>
@@ -277,8 +276,7 @@ export const MapNode: React.FC<MapNodeProps> = ({
textShadow: '1px 1px 2px rgba(0,0,0,0.8)', textShadow: '1px 1px 2px rgba(0,0,0,0.8)',
vectorEffect: 'non-scaling-stroke' vectorEffect: 'non-scaling-stroke'
}} }}
transform={`scale(${1 / (1200 / viewBoxWidth)})`} transform={`scale(${(1 / (1200 / viewBoxWidth)) * labelScale})`}
transformOrigin="0 0"
> >
{kills} {kills}
</text> </text>

View File

@@ -33,6 +33,7 @@ interface RegionMapProps {
focusSystem?: string; focusSystem?: string;
isCompact?: boolean; isCompact?: boolean;
isWormholeRegion?: boolean; isWormholeRegion?: boolean;
header?: boolean;
} }
interface ContextMenuState { interface ContextMenuState {
@@ -93,7 +94,7 @@ const ensureUniversePositions = async () => {
} }
}; };
export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormholeRegion = false }: RegionMapProps) => { export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormholeRegion = false, header = true }: RegionMapProps) => {
const navigate = useNavigate(); const navigate = useNavigate();
const [viewBox, setViewBox] = useState({ x: 0, y: 0, width: 1200, height: 800 }); const [viewBox, setViewBox] = useState({ x: 0, y: 0, width: 1200, height: 800 });
const [isPanning, setIsPanning] = useState(false); const [isPanning, setIsPanning] = useState(false);
@@ -1021,13 +1022,15 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
return ( return (
<div className="w-full h-full bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 relative"> <div className="w-full h-full bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 relative">
<Header {header && (
title={`Region: ${regionName}`} <Header
breadcrumbs={[ title={`Region: ${regionName}`}
{ label: "Universe", path: "/" }, breadcrumbs={[
{ label: regionName } { label: "Universe", path: "/" },
]} { label: regionName }
/> ]}
/>
)}
<svg <svg
ref={svgRef} ref={svgRef}
width="100%" width="100%"
@@ -1111,6 +1114,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
showJumps={showJumps} showJumps={showJumps}
showKills={showKills} showKills={showKills}
viewBoxWidth={viewBox.width} viewBoxWidth={viewBox.width}
labelScale={isCompact ? 2.0 : 1}
/> />
))} ))}

View File

@@ -281,6 +281,7 @@ export const SystemView = () => {
regionName={region} regionName={region}
focusSystem={system} focusSystem={system}
isCompact={true} isCompact={true}
header={false}
/> />
</div> </div>
</div> </div>