src/ui/HUD.js

import { STATE, CONFIG, getMaxDimensions } from '../core/State.js';

export function updateHUD() {
    // Update Telemetry
    const idxInput = document.getElementById('telemetry-idx');
    const labelEl = document.getElementById('hud-dim-label');

    // Only update input if user is in "Flight Mode" (Pointer Locked)
    const isFlying = document.pointerLockElement === document.body;

    // Dynamically adjust telemetry dimension slider max based on active dimensions
    const maxDim = getMaxDimensions() - 1;
    if (idxInput) {
        idxInput.max = maxDim;
        if (document.activeElement !== idxInput) {
            if (STATE.currentSelectedIndex > maxDim) {
                STATE.currentSelectedIndex = maxDim;
            }
            idxInput.value = STATE.currentSelectedIndex;
        }
    }
    if (labelEl) {
        const prefix = (STATE.featureSpace || 'RAW').toLowerCase();
        const label = STATE.dimensionLabels[`${prefix}_${STATE.currentSelectedIndex}`];
        labelEl.innerText = label ? label : '';
    }

    // Sync telemetry dim select dropdown value (Phase 5)
    const telemetryDimSelect = document.getElementById('telemetry-dim-select');
    if (telemetryDimSelect && parseInt(telemetryDimSelect.value, 10) !== STATE.currentSelectedIndex) {
        if (telemetryDimSelect.querySelector(`option[value="${STATE.currentSelectedIndex}"]`)) {
            telemetryDimSelect.value = STATE.currentSelectedIndex;
        }
    }

    // Sync other selects if they exist
    const inspectSelect = document.getElementById('inspect-dim-select');
    if (inspectSelect && parseInt(inspectSelect.value, 10) !== STATE.reliefInspectDim) {
        if (inspectSelect.querySelector(`option[value="${STATE.reliefInspectDim}"]`)) {
            inspectSelect.value = STATE.reliefInspectDim;
        }
    }

    const inspectorSelect = document.getElementById('inspector-dim-select-dropdown');
    if (inspectorSelect && parseInt(inspectorSelect.value, 10) !== STATE.reliefInspectDim) {
        if (inspectorSelect.querySelector(`option[value="${STATE.reliefInspectDim}"]`)) {
            inspectorSelect.value = STATE.reliefInspectDim;
        }
    }



    // Update Interpretation Label
    const interpretLabel = document.getElementById('dim-interp-label');
    const detailsContainer = document.getElementById('dim-details-container');
    const posList = document.getElementById('dim-pos-list');
    const negList = document.getElementById('dim-neg-list');

    if (interpretLabel) {
        const analysis = STATE.currentAnalysis;
        const isCurrent = analysis && analysis.index === STATE.currentSelectedIndex;
        const cached = STATE.dimensionCache[STATE.currentSelectedIndex];

        // Determine which data to show
        const data = isCurrent ? analysis : cached;

        if (data) {
            // 1. Main Label
            interpretLabel.innerText = data.label || "Unknown";
            interpretLabel.style.color = "var(--color-semantic-success)";
            interpretLabel.removeAttribute('title'); // Remove old tooltip

            // 2. Show Details
            if (detailsContainer) detailsContainer.style.display = 'block';

            // 3. Populate Lists (Safe check)
            if (posList && Array.isArray(data.top_activators)) {
                // Handle both strings and objects (backend update compatibility)
                const items = data.top_activators.map(x => (typeof x === 'object' && x.word) ? x.word : x);
                posList.innerText = items.slice(0, 5).join(', ');
            }
            if (negList && Array.isArray(data.bottom_activators)) {
                const items = data.bottom_activators.map(x => (typeof x === 'object' && x.word) ? x.word : x);
                negList.innerText = items.slice(0, 5).join(', ');
            }

        } else {
            // Waiting State
            interpretLabel.innerText = "[Waiting...]";
            interpretLabel.style.color = "var(--color-neutral-400)";
            if (detailsContainer) detailsContainer.style.display = 'none'; // Hide details
        }
    }

    // Update Thread Values
    STATE.threads.forEach((t, index) => {
        const valEl = document.getElementById(`thread-val-${index}`);
        if (valEl) {
            const val = t.embedding[STATE.currentSelectedIndex];
            valEl.innerText = val ? val.toFixed(2) : "0.00";
            valEl.style.color = val > 0 ? 'var(--color-semantic-success)' : (val < 0 ? 'var(--color-semantic-error)' : 'var(--color-neutral-400)');
        }
    });

    // Update Engine Mode Indicator
    const engineEl = document.getElementById('hud-engine-mode');

    if (engineEl) {
        engineEl.innerText = `ENGINE: ${STATE.engineMode === 'MACRO' ? 'GPU' : 'CPU'}`;
        if (STATE.gpuError) {
            engineEl.style.color = 'var(--color-semantic-warning)';
        } else {
            engineEl.style.color = 'var(--color-neutral-400)';
        }
    }
}

export function refreshHUDMetadata() {
    const modelEl = document.getElementById('hud-model-name');
    const provEl = document.getElementById('hud-provider-info');

    if (modelEl) modelEl.innerText = 'MODEL: ' + (STATE.modelName || '--');
    if (provEl) provEl.innerText = STATE.providerType || '--';

    const engineEl = document.getElementById('hud-engine-mode');
    if (engineEl) {
        engineEl.innerText = `ENGINE: ${STATE.engineMode === 'MACRO' ? 'GPU' : 'CPU'}`;
    }
}