// ui.js (DOM слой)
export let DOM = {};

export function initDOM() {
    DOM.status = document.getElementById("status");
    DOM.meta = document.getElementById("meta");
    DOM.latest = document.getElementById("latest");
    DOM.lastByte = document.getElementById("last-byte");
    DOM.history = document.getElementById("history");
    DOM.canvas = document.getElementById("signalChart");
    DOM.bars = document.querySelectorAll(".sig-bar");
    DOM.barFill = document.getElementById("bar1");

    // Аккордеон
    DOM.historyHeader = document.getElementById("history-header");
    DOM.historyBody = document.getElementById("history-body");
}

export function setStatus(v, isError = false) {
    if (!DOM.status) return;

    DOM.status.textContent = v;

    // Стили для статуса
    DOM.status.classList.remove("status-ok", "status-error", "status-lost");

    if (isError) {
        if (v === "Нет связи") {
            DOM.status.classList.add("status-lost");
        } else {
            DOM.status.classList.add("status-error");
        }
    } else {
        DOM.status.classList.add("status-ok");
    }
}

export function setMeta(v) {
    if (DOM.meta) DOM.meta.textContent = v;
}

export function setBars(p, noConnection = false) {
    const el = DOM.barFill;
    if (!el) return;

    if (noConnection) {
        // При потере связи - сбрасываем и делаем серым
        el.style.width = "0%";
        el.classList.add("no-connection");
    } else {
        el.classList.remove("no-connection");
        el.style.width = Math.max(0, Math.min(100, p)) + "%";
    }
}

export function setSignal(level, noConnection = false) {
    const bars = DOM.bars;
    if (!bars || bars.length < 3) return;

    // Сброс
    bars.forEach(b => {
        b.classList.remove("active-1", "active-2", "active-3", "dim", "no-connection");

        if (noConnection) {
            b.classList.add("no-connection");
        } else {
            b.classList.add("dim");
        }
    });

    if (noConnection) return;

    // Уровни сигнала
    if (level >= 1) {
        bars[0].classList.add("active-1");
        bars[0].classList.remove("dim");
    }
    if (level >= 2) {
        bars[1].classList.add("active-2");
        bars[1].classList.remove("dim");
    }
    if (level >= 3) {
        bars[2].classList.add("active-3");
        bars[2].classList.remove("dim");
    }
}