feature: Add cooldown/navigation timers, move credits display to header

This commit is contained in:
Keith Solomon
2026-02-10 14:32:02 -06:00
parent 7c3e003088
commit 0f4e59f514
5 changed files with 587 additions and 34 deletions

View File

@@ -264,8 +264,7 @@ try {
<h1 class="text-3xl font-bold mb-6 underline decoration-gray-300 w-full"><a href="index.php" class="">Spacetraders - Dashboard</a></h1>
<h2 class="text-2xl font-bold mb-2">
Agent: <?php echo htmlspecialchars( ucfirst( strtolower( $agent['symbol'] ) ) ); ?><br>
Credits: <span class="font-normal"><?php echo number_format( $agent['credits'] ); ?></span>
Agent: <?php echo htmlspecialchars( ucfirst( strtolower( $agent['symbol'] ) ) ); ?>
</h2>
<h3 class="text-xl font-bold mb-4">
@@ -448,11 +447,16 @@ try {
<th class="border border-gray-300 px-4 py-2">Role</th>
<th class="border border-gray-300 px-4 py-2">Type</th>
<th class="border border-gray-300 px-4 py-2">Status</th>
<th class="border border-gray-300 px-4 py-2">Nav Timer</th>
<th class="border border-gray-300 px-4 py-2">Flight Mode</th>
<th class="border border-gray-300 px-4 py-2">Route</th>
</tr>
<?php foreach ( $ships as $ship ) : ?>
<?php
$shipStatus = (string) ( $ship['nav']['status'] ?? '' );
$arrivalIso = (string) ( $ship['nav']['route']['arrival'] ?? '' );
?>
<tr>
<td class="border border-gray-300 px-4 py-2">
<a
@@ -464,8 +468,15 @@ try {
</td>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( ucfirst( strtolower( $ship['registration']['role'] ) ) ); ?></td>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( $ship['frame']['name'] ); ?></td>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( ucfirst( strtolower( $ship['nav']['status'] ) ) ); ?></td>
<?php if ($ship['nav']['status'] !== 'DOCKED' ) : ?>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( ucfirst( strtolower( $shipStatus ) ) ); ?></td>
<td class="border border-gray-300 px-4 py-2">
<span
class="ship-nav-timer"
data-status="<?php echo htmlspecialchars( $shipStatus ); ?>"
data-arrival="<?php echo htmlspecialchars( $arrivalIso ); ?>"
></span>
</td>
<?php if ($shipStatus !== 'DOCKED' ) : ?>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( $ship['nav']['flightMode'] ); ?></td>
<td class="border border-gray-300 px-4 py-2"><?php echo htmlspecialchars( $ship['nav']['route']['origin']['symbol'] . ' - ' . $ship['nav']['route']['destination']['symbol'] ); ?></td>
<?php else : ?>
@@ -536,6 +547,47 @@ try {
(function() {
const tabs = document.querySelectorAll('.system-tab');
const panels = document.querySelectorAll('.system-tab-panel');
const navTimerNodes = document.querySelectorAll('.ship-nav-timer');
function formatNavTimer(seconds) {
if (seconds <= 0) {
return 'Arriving';
}
const total = Math.max(0, Math.floor(seconds));
const hours = Math.floor(total / 3600);
const minutes = Math.floor((total % 3600) / 60);
const secs = total % 60;
if (hours > 0) {
return `${hours}:${String(minutes).padStart(2, '0')}:${String(secs).padStart(2, '0')}`;
}
return `${minutes}:${String(secs).padStart(2, '0')}`;
}
function renderNavTimers() {
const nowMs = Date.now();
navTimerNodes.forEach((node) => {
const status = node.dataset.status || '';
const arrival = node.dataset.arrival || '';
if (status !== 'IN_TRANSIT') {
node.textContent = 'Ready';
return;
}
const arrivalMs = Date.parse(arrival);
if (!Number.isFinite(arrivalMs)) {
node.textContent = 'In transit';
return;
}
const remainingSeconds = Math.max(0, Math.floor((arrivalMs - nowMs) / 1000));
node.textContent = formatNavTimer(remainingSeconds);
});
}
function activateTab(targetId) {
panels.forEach((panel) => {
@@ -561,6 +613,11 @@ try {
if (tabs.length > 0) {
activateTab('tab-waypoints');
}
renderNavTimers();
if (navTimerNodes.length > 0) {
window.setInterval(renderNavTimers, 1000);
}
})();
</script>
</body>