import {parseRatio, parseDiagonal, calculateTvSize, formatTvSize} from "./tv-size.js";

document.addEventListener("DOMContentLoaded", () => {
    updateTvParameter();
    document.getElementById("aspect-ratio")
        .addEventListener("change", updateTvParameter);
    document.getElementById("diagonal")
        .addEventListener("input", updateTvParameter);

});


function updateTvParameter() {
    try {
        const ratioInput = document.getElementById("aspect-ratio");
        const ratio = parseRatio(ratioInput.value);
        console.log(ratio);
        const diagonalInput = document.getElementById("diagonal");
        const diagonal = parseDiagonal(diagonalInput.value);
        const size = calculateTvSize(ratio, diagonal);
        showTvSize(...size);
        turnOffErrorDisplay();
    }catch (e) {
        showInputErrorMessage(e);
    }
}

function showTvSize(width, height) {
    const [widthText, heightText] = formatTvSize(width, height);
    document.getElementById("tv-height").innerText = heightText;
    document.getElementById("tv-width").innerText = widthText;
}


function showInputErrorMessage(e) {
    const errorMsg = e.message;
    const errorOutputElement = document.getElementById("error-msg");
    errorOutputElement.innerText = errorMsg;
    errorOutputElement.classList.remove("no-error");
    errorOutputElement.classList.add("error");
}

function turnOffErrorDisplay() {
    const errorOutputElement = document.getElementById("error-msg");
    errorOutputElement.classList.remove("error");
    errorOutputElement.classList.add("no-error");
}


const dayCount = (month, year) => {
    if (month !== 2) {
        return ( ((month-1)%7)%2 ) ? 30 : 31;
    }
    var isLeap = !(year % 4);
    if(isLeap) {isLeap = !!(year%100) }
    if(!isLeap) {isLeap = !(year%400) }
    return isLeap ? 29:28;
}