import { ChangeDetectionStrategy, Component, computed, input, output } from '@angular/core';
import { BodyDetailViewModel } from '../body-detail/body-detail.model';
import { bodyReadouts } from '../body-detail/body-readouts';
/**
* The card shown for a body picked in the system view, without leaving it.
*
* Selecting a planet used to navigate straight to `/body/:id`, which tore down the system scene
* and the camera position with it โ so comparing two planets meant flying back in twice. This
* shows the same numbers over the live view, and keeps the route as the deliberate step for the
* full 3D inspection.
*
* The rows themselves come from `bodyReadouts`, shared with the detail page. Presentational only.
*/
@Component({
selector: 'app-system-object-card',
changeDetection: ChangeDetectionStrategy.OnPush,
// Positioned and full-bleed like the HUD's own host, so the panel inside it resolves against
// the scene rather than against whatever box the inline default would have left it in โ which
// put the card off the bottom-left corner of the viewport entirely.
host: { class: 'pointer-events-none absolute inset-0 block' },
template: `
@for (row of readouts().measured; track row.label) {
{{ row.label }}
{{ row.value }}
}
}
Derived
@for (row of readouts().derived; track row.label) {
{{ row.label }}
{{ row.value }}
}
{{ readouts().provenance }}
`
})
export class SystemObjectCardComponent {
readonly body = input.required();
/** The close control, and anything else that should dismiss the card. */
readonly dismissed = output();
/** Request for the full `/body/:id` route. */
readonly openRequested = output();
readonly readouts = computed(() => bodyReadouts(this.body()));
}