feat(ui): show and hide the Cockpit surfaces from a store

The Cockpit controller publishes which surfaces are shown (the entry
button and TR-3B chip, the HUD with its exit and reset buttons and
briefing card, and the Contact card) and the views bind them. Focus moves
to the exit button, and back to the entry, after Vue renders them.

Layout scheduling counts the published presence as visible, so entry
still lays out the cards. The Display portal restores only focus its move
dropped. The Missions layer no longer hides the Contact card directly.
This commit is contained in:
Sameh Khamis committed 2026-10-31 17:44:33 -07:00
1 parent 484243fe4b
commit f279200af5
18 files changed
+422 -74

No files matched your search

+5 -2
View File
@@ -1,6 +1,8 @@
<script setup>
import { storeToRefs } from 'pinia';
import { t } from '../../i18n/index.js';
import { vClassToggle } from '../rail/classToggle.js';
import { useCockpitStore } from '../stores/cockpit.js';
import { useContextStore } from '../stores/context.js';
import AwarenessPanel from './panels/AwarenessPanel.vue';
import MissionDetail from './panels/MissionDetail.vue';
@@ -10,6 +12,7 @@ import RadioPanel from './panels/RadioPanel.vue';
// ContextControls presents the mode switch and the nearby sites search and
// publishes them; until it does, the panel shows its initial markup.
const { view: ctx } = storeToRefs(useContextStore());
const { presence: cockpit } = storeToRefs(useCockpitStore());
</script>
<template>
@@ -64,12 +67,12 @@ const { view: ctx } = storeToRefs(useContextStore());
</div>
<section id="context-flights-view" class="context-mode-view" role="tabpanel" aria-labelledby="global-context-flights-btn" :hidden="!ctx?.flightsActive">
<div class="global-context-actions" aria-label="Contact Context actions" data-i18n-aria-label>
<button id="cockpit-entry" type="button" hidden>
<button id="cockpit-entry" type="button" :hidden="!cockpit?.entryAvailable">
<span class="material-symbols-outlined" aria-hidden="true">flight</span>
<span data-i18n>COCKPIT</span>
</button>
<button id="installations-search-btn" class="panel-layer-toggle" type="button" :aria-disabled="ctx && String(ctx.installationsBusy)" :aria-busy="ctx && String(ctx.installationsBusy)" data-i18n>SEARCH NEARBY SITES</button>
<button id="tr3b-toggle" class="tr3b-toggle" type="button" aria-pressed="false" hidden aria-label="Reclassify tracked contact as TR-3B" title="Reclassify as TR-3B" data-i18n-aria-label data-i18n-title>🛸</button>
<button id="tr3b-toggle" class="tr3b-toggle" type="button" :aria-pressed="String(!!cockpit?.tr3b?.converted)" :hidden="!cockpit?.tr3b" aria-label="Reclassify tracked contact as TR-3B" :title="cockpit?.tr3b?.converted ? t('Restore real aircraft') : t('Reclassify as TR-3B')" data-i18n-aria-label>🛸</button>
</div>
<AwarenessPanel />
</section>