diff --git a/code/controllers/subsystems/lobby_monitor.dm b/code/controllers/subsystems/lobby_monitor.dm
index d63077299a8..0a18f89f390 100644
--- a/code/controllers/subsystems/lobby_monitor.dm
+++ b/code/controllers/subsystems/lobby_monitor.dm
@@ -21,7 +21,7 @@ SUBSYSTEM_DEF(lobby_monitor)
continue
log_tgui(player, "Reinitialized [player.client.ckey]'s lobby window: [ui ? "ui" : "no ui"], status: [player.lobby_window?.status].", "lobby_monitor/Fire")
- INVOKE_ASYNC(player, TYPE_PROC_REF(/mob/new_player, initialize_lobby_screen))
+ addtimer(CALLBACK(src, PROC_REF(do_reinit), player), 0.5 SECONDS)
var/initialize_queue = list()
for(var/mob/new_player/player as anything in new_players)
@@ -39,6 +39,12 @@ SUBSYSTEM_DEF(lobby_monitor)
to_reinitialize = initialize_queue
+/datum/controller/subsystem/lobby_monitor/proc/do_reinit(var/mob/new_player/player)
+ var/datum/tgui/ui = SStgui.get_open_ui(player, player)
+ if(ui && player.lobby_window && player.lobby_window.status > TGUI_WINDOW_CLOSED)
+ return
+ player.initialize_lobby_screen()
+
/datum/controller/subsystem/lobby_monitor/Shutdown()
var/datum/asset/our_asset = get_asset_datum(/datum/asset/simple/restart_animation)
var/to_send = "
"
diff --git a/code/modules/tgui/modules/atmos_control.dm b/code/modules/tgui/modules/atmos_control.dm
index 1750509c030..b93013aab59 100644
--- a/code/modules/tgui/modules/atmos_control.dm
+++ b/code/modules/tgui/modules/atmos_control.dm
@@ -67,7 +67,6 @@
"y" = alarm.y,
"z" = alarm.z)
.["alarms"] = alarms
- .["zoomScale"] = world.maxx + world.maxy
/datum/tgui_module/atmos_control/tgui_data(mob/user)
var/list/data = list()
diff --git a/code/modules/tgui/modules/crew_monitor.dm b/code/modules/tgui/modules/crew_monitor.dm
index dfcb5e4cfef..317ab60c31f 100644
--- a/code/modules/tgui/modules/crew_monitor.dm
+++ b/code/modules/tgui/modules/crew_monitor.dm
@@ -47,10 +47,6 @@
ui.autoupdate = TRUE
ui.open()
-/datum/tgui_module/crew_monitor/tgui_static_data(mob/user)
- . = ..()
- .["zoomScale"] = world.maxx + world.maxy
-
/datum/tgui_module/crew_monitor/tgui_data(mob/user)
var/data[0]
diff --git a/code/modules/tgui/tgui.dm b/code/modules/tgui/tgui.dm
index e965b4f69b6..84b44a9daa9 100644
--- a/code/modules/tgui/tgui.dm
+++ b/code/modules/tgui/tgui.dm
@@ -286,6 +286,10 @@
//"refreshing" = refreshing,
"refreshing" = FALSE,
"mapZLevel" = map_z_level,
+ "mapInfo" = list(
+ "maxx" = world.maxx,
+ "maxy" = world.maxy,
+ ),
"window" = list(
"key" = window_key,
"size" = window_size,
diff --git a/tgui/packages/tgui/backend.ts b/tgui/packages/tgui/backend.ts
index a18bbe4156a..33e6ae9dfcf 100644
--- a/tgui/packages/tgui/backend.ts
+++ b/tgui/packages/tgui/backend.ts
@@ -244,6 +244,10 @@ type BackendState
= {
refreshing: boolean;
map: string; // Vorestation Add
mapZLevel: number; // Vorestation Add
+ mapInfo: {
+ maxx: number; // Vorestation Add
+ maxy: number; // Vorestation Add
+ }; // Vorestation Add
window: {
key: string;
size: [number, number];
diff --git a/tgui/packages/tgui/components/NanoMap.tsx b/tgui/packages/tgui/components/NanoMap.tsx
index d0fa314281c..aab4a1ed91a 100644
--- a/tgui/packages/tgui/components/NanoMap.tsx
+++ b/tgui/packages/tgui/components/NanoMap.tsx
@@ -13,8 +13,6 @@ import {
import type { KeyEvent } from 'tgui-core/events';
import { KEY } from 'tgui-core/keys';
-import { logger } from '../logging';
-
const pauseEvent = (e) => {
if (e.stopPropagation) {
e.stopPropagation();
@@ -28,7 +26,6 @@ const pauseEvent = (e) => {
};
type Props = PropsWithChildren<{
- zoomScale: number;
onZoom?: (zoom: number) => void;
}>;
@@ -61,16 +58,25 @@ export class NanoMap extends Component {
document.removeEventListener('wheel', this.handleWheel);
}
- setZoom(zoom: number) {
+ getWxH = (zoom: number) => {
+ const { config } = useBackend();
+ return [config.mapInfo.maxx * 2 * zoom, config.mapInfo.maxy * 2 * zoom];
+ };
+
+ setZoom(zoom: number, mouseX: number, mouseY: number) {
const newZoom = Math.min(Math.max(zoom, 1), 8);
this.setState((state) => {
- const zoomDifference = -(state.zoom - newZoom);
+ const oldWxH = this.getWxH(state.zoom);
+ const newWxH = this.getWxH(newZoom);
- const newOffsetX =
- state.offsetX - (this.props.zoomScale / 2) * zoomDifference;
+ const scaleX = newWxH[0] / oldWxH[0];
+ const scaleY = newWxH[1] / oldWxH[1];
- const newOffsetY =
- state.offsetY - (this.props.zoomScale / 2) * zoomDifference;
+ const viewMouseX = mouseX - state.offsetX;
+ const viewMouseY = mouseY - state.offsetY;
+
+ const newOffsetX = mouseX - viewMouseX * scaleX;
+ const newOffsetY = mouseY - viewMouseY * scaleY;
return {
...state,
@@ -145,30 +151,34 @@ export class NanoMap extends Component {
this.handleWheel = (e: WheelEvent) => {
if (e.deltaY > 0) {
- this.setZoom(this.state.zoom + 1);
+ this.setZoom(this.state.zoom - 1, e.clientX, e.clientY);
} else if (e.deltaY < 0) {
- this.setZoom(this.state.zoom - 1);
+ this.setZoom(this.state.zoom + 1, e.clientX, e.clientY);
}
};
this.handleZoom = (_e: Event, value: number) => {
- this.setZoom(value);
+ this.setZoom(value, window.innerWidth / 2, window.innerHeight / 2);
};
this.handleKey = (e: KeyEvent) => {
switch (e.event.key) {
case KEY.Up:
case KEY.W: {
- this.setZoom(this.state.zoom + 1);
+ this.setZoom(
+ this.state.zoom + 1,
+ window.innerWidth / 2,
+ window.innerHeight / 2,
+ );
break;
}
case KEY.Down:
case KEY.S: {
- this.setZoom(this.state.zoom - 1);
- break;
- }
- case KEY.E: {
- logger.log(this.state.offsetX, this.state.offsetY);
+ this.setZoom(
+ this.state.zoom - 1,
+ window.innerWidth / 2,
+ window.innerHeight / 2,
+ );
break;
}
}
@@ -180,12 +190,12 @@ export class NanoMap extends Component {
const { dragging, offsetX, offsetY, zoom = 1 } = this.state;
const { children } = this.props;
+ const WxH = this.getWxH(zoom);
+
const mapUrl = resolveAsset('minimap_' + config.mapZLevel + '.png');
- // (x * zoom), x Needs to be double the turf- map size. (for virgo, 140x140)
- const mapSize = this.props.zoomScale * zoom + 'px';
const newStyle: {} = {
- width: mapSize,
- height: mapSize,
+ width: WxH[0] + 'px',
+ height: WxH[1] + 'px',
'margin-top': offsetY + 'px',
'margin-left': offsetX + 'px',
overflow: 'hidden',
@@ -234,8 +244,8 @@ const NanoMapMarker = (props: NanoMapMarkerProps) => {
}
};
- const rx = x * 2 * zoom - zoom - 3;
- const ry = y * 2 * zoom - zoom - 3;
+ const rx = x * 2 * zoom - zoom;
+ const ry = y * 2 * zoom - zoom;
return (
{
@@ -59,7 +58,7 @@ export const AtmosControlContent = (props) => {
// and change the @for scss to match.
tab[1] = (
- setZoom(v)}>
+ setZoom(v)}>
{alarms
.filter((x) => ~~x.z === ~~config.mapZLevel)
.map((cm) => (
diff --git a/tgui/packages/tgui/interfaces/CrewMonitor/CrewMonitorMapView.tsx b/tgui/packages/tgui/interfaces/CrewMonitor/CrewMonitorMapView.tsx
index 89d173d47b3..9e84e496aab 100644
--- a/tgui/packages/tgui/interfaces/CrewMonitor/CrewMonitorMapView.tsx
+++ b/tgui/packages/tgui/interfaces/CrewMonitor/CrewMonitorMapView.tsx
@@ -11,11 +11,11 @@ export const CrewMonitorMapView = (props: {
}) => {
const { config, data } = useBackend();
- const { zoomScale, crewmembers } = data;
+ const { crewmembers } = data;
return (
- props.onZoom(v)}>
+ props.onZoom(v)}>
{crewmembers
.filter(
(x) => x.sensor_type === 3 && ~~x.realZ === ~~config.mapZLevel,
diff --git a/tgui/packages/tgui/interfaces/CrewMonitor/types.ts b/tgui/packages/tgui/interfaces/CrewMonitor/types.ts
index d5a3b281abc..ec9056f833d 100644
--- a/tgui/packages/tgui/interfaces/CrewMonitor/types.ts
+++ b/tgui/packages/tgui/interfaces/CrewMonitor/types.ts
@@ -1,7 +1,6 @@
import type { BooleanLike } from 'tgui-core/react';
export type Data = {
- zoomScale: number;
isAI: BooleanLike;
map_levels: number[];
crewmembers: crewmember[];
diff --git a/tgui/packages/tgui/styles/components/NanoMap.scss b/tgui/packages/tgui/styles/components/NanoMap.scss
index 964aed986d4..fa8a7787565 100644
--- a/tgui/packages/tgui/styles/components/NanoMap.scss
+++ b/tgui/packages/tgui/styles/components/NanoMap.scss
@@ -8,6 +8,9 @@
z-index: 10;
padding: 0px;
margin: 0px;
+ // this is like this because byond's coordinates are from bottom left so we want to place the
+ // dot at the bottom left corner of it's x/y
+ transform: translate(-50%, 50%);
}
.NanoMap__zoomer {