✨feature: Add cooldown/navigation timers, move credits display to header
This commit is contained in:
65
index.php
65
index.php
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user