Assorted Bluespace Drive fixes, qol tweaks and additions (#21184)

Touches up the Bluespace Drive control console UI to be more properly
set up, fixes the knob element popup clipping outside the window, and
adds a list showing the current amount of fuel moles in the drive and
the distance to be jumped in tiles.
Also adds a navigation console to the BSD chamber so the engineers
roughly can see where they're jumping to and from.

This is my first major contribution to Aurora unless I forgot something,
so do tell me if I did anything improperly!

New UI:
<img width="373" height="260" alt="image"
src="https://github.com/user-attachments/assets/7e33e3aa-caba-4cbc-b2d3-91c8defa8072"
/>

code/game/machinery/bluespace_drive.dm

@@ -524,6 +524,8 @@
 	data["charge"] = (linked_bluespace_drive.internal_gas.total_moles || linked_bluespace_drive.fuel_gas.total_moles) ? TRUE : FALSE
 	data["rotation"] = linked_bluespace_drive.rotation
 	data["jumping"] = linked_bluespace_drive.initiate_jump_timer_id ? TRUE : FALSE
+	data["jump_power"] = linked_bluespace_drive.power_from_gas / (10 KILO)
+	data["fuel_gas"] = linked_bluespace_drive.fuel_gas.total_moles
 
 	return data
 

html/changelogs/Snowy1237-BSDadditions.yml

@@ -0,0 +1,59 @@
+################################
+# Example Changelog File
+#
+# Note: This file, and files beginning with ".", and files that don't end in ".yml" will not be read. If you change this file, you will look really dumb.
+#
+# Your changelog will be merged with a master changelog. (New stuff added only, and only on the date entry for the day it was merged.)
+# When it is, any changes listed below will disappear.
+#
+# Valid Prefixes:
+#   bugfix
+#     - (fixes bugs)
+#   wip
+#     - (work in progress)
+#   qol
+#     - (quality of life)
+#   soundadd
+#     - (adds a sound)
+#   sounddel
+#     - (removes a sound)
+#   rscadd
+#     - (adds a feature)
+#   rscdel
+#     - (removes a feature)
+#   imageadd
+#     - (adds an image or sprite)
+#   imagedel
+#     - (removes an image or sprite)
+#   spellcheck
+#     - (fixes spelling or grammar)
+#   experiment
+#     - (experimental change)
+#   balance
+#     - (balance changes)
+#   code_imp
+#     - (misc internal code change)
+#   refactor
+#     - (refactors code)
+#   config
+#     - (makes a change to the config files)
+#   admin
+#     - (makes changes to administrator tools)
+#   server
+#     - (miscellaneous changes to server)
+#################################
+
+# Your name.
+author: Snowy1237
+
+# Optional: Remove this file after generating master changelog.  Useful for PR changelogs that won't get used again.
+delete-after: True
+
+# Any changes you've made.  See valid prefix list above.
+# INDENT WITH TWO SPACES.  NOT TABS.  SPACES.
+# SCREW THIS UP AND IT WON'T WORK.
+# Also, this gets changed to [] after reading.  Just remove the brackets when you add new shit.
+# Please surround your changes in  double quotes ("). It works without them, but if you use certain characters it screws up compiling. The quotes will not show up in the changelog.
+changes:
+  - qol: "Overhauled the Bluespace Drive control UI to be generally nicer."
+  - rscadd: "Added a navigation console to the Bluespace Drive chamber and added more information to be displayed on the Bluespace Drive control UI."

maps/sccv_horizon/sccv_horizon.dmm

@@ -94730,6 +94730,9 @@
 	dir = 8
 	},
 /obj/structure/lattice/catwalk/indoor,
+/obj/machinery/computer/ship/navigation{
+	dir = 4
+	},
 /turf/simulated/floor/plating,
 /area/horizon/engineering/bluespace_drive)
 "nxG" = (

tgui/packages/tgui/interfaces/BluespaceDrive.tsx

@@ -1,5 +1,5 @@
 import { useBackend } from '../backend';
-import { Button, Knob, LabeledControls } from '../components';
+import { Button, Knob, LabeledControls, Section, LabeledList } from '../components';
 import { Window } from '../layouts';
 import { BooleanLike } from '../../common/react';
 
@@ -8,53 +8,69 @@ export type BluespaceDriveData = {
   charge: BooleanLike;
   rotation: number;
   jumping: BooleanLike;
+  jump_power: number;
+  fuel_gas: number;
 };
 
 export const BluespaceDrive = (props, context) => {
   const { act, data } = useBackend<BluespaceDriveData>(context);
   return (
-    <Window>
+    <Window width="382" height="277" theme="hephaestus">
       <Window.Content>
-        <LabeledControls>
-          <LabeledControls.Item>
-            <Button
-              name="Energize"
-              content={data.energized ? 'Energized' : 'Energize'}
-              color={data.energized ? 'green' : 'red'}
-              onClick={() => act('toggle_energized')}
-            />
-          </LabeledControls.Item>
-          <LabeledControls.Item>
-            <Button
-              name="Purge Charge"
-              content="Purge Charge"
-              color="red"
-              disabled={!data.charge || data.jumping}
-              onClick={() => act('purge_charge')}
-            />
-          </LabeledControls.Item>
-          <LabeledControls.Item>
-            <Knob
-              name="Rotation"
-              animated
-              value={data.rotation}
-              unit="°"
-              minValue={0}
-              maxValue={359}
-              disabled={!data.charge}
-              onChange={(e, value) => act('set_rotation', { rotation: value })}
-            />
-          </LabeledControls.Item>
-          <LabeledControls.Item>
-            <Button
-              name="Jump"
-              content="Jump"
-              color="green"
-              disabled={!data.charge || data.jumping}
-              onClick={() => act('jump')}
-            />
-          </LabeledControls.Item>
-        </LabeledControls>
+        <Section title="Drive Configuration">
+          <LabeledControls>
+            <LabeledControls.Item>
+              <Button
+                name="Energize"
+                content={data.energized ? 'Energized' : 'Energize'}
+                color={data.energized ? 'green' : 'red'}
+                onClick={() => act('toggle_energized')}
+              />
+            </LabeledControls.Item>
+            <LabeledControls.Item>
+              <Button
+                name="Purge Charge"
+                content="Purge Charge"
+                color="red"
+                disabled={!data.charge || data.jumping}
+                onClick={() => act('purge_charge')}
+              />
+            </LabeledControls.Item>
+            <LabeledControls.Item>
+              <Knob
+                name="Rotation"
+                animated
+                value={data.rotation}
+                unit="°"
+                minValue={0}
+                maxValue={359}
+                disabled={!data.charge}
+                onChange={(e, value) =>
+                  act('set_rotation', { rotation: value })
+                }
+              />
+            </LabeledControls.Item>
+            <LabeledControls.Item>
+              <Button
+                name="Jump"
+                content="Jump"
+                color="green"
+                disabled={!data.charge || data.jumping}
+                onClick={() => act('jump')}
+              />
+            </LabeledControls.Item>
+          </LabeledControls>
+        </Section>
+        <Section title="Drive Status">
+          <LabeledList>
+            <LabeledList.Item label="Jump Distance">
+              {data.jump_power}
+            </LabeledList.Item>
+            <LabeledList.Item label="Phoron Amount">
+              {data.fuel_gas} mol / 1000
+            </LabeledList.Item>
+          </LabeledList>
+        </Section>
       </Window.Content>
     </Window>
   );