let showSeconds = true;
let showAmPm = true;

function showTime() {
    const date = new Date();
    let h = date.getHours(); // 0 - 23
    let m = date.getMinutes(); // 0 - 59
    let s = date.getSeconds(); // 0 - 59
    let session = "AM";

    if (h == 0) {
        h = 12;
    }

    if (h > 12) {
        h = h - 12;
        session = "PM";
    }

    h = (h < 10) ? "0" + h : h;
    m = (m < 10) ? "0" + m : m;
    s = (s < 10) ? "0" + s : s;

    let time = h + ":" + m;
    if (showSeconds) {
        time += ":" + s;
    }
    if (showAmPm) {
        time += " " + session;
    }

    const clockDisplay = document.getElementById("MyClockDisplay");
    clockDisplay.innerText = time;
    clockDisplay.textContent = time;

    adjustFontSize(clockDisplay);

    setTimeout(showTime, 1000);
}

function adjustFontSize(element) {
    if (showSeconds && showAmPm) {
        element.style.fontSize = "180px";
    } else if (showSeconds || showAmPm) {
        element.style.fontSize = "200px";
    } else {
        element.style.fontSize = "240px";
    }
}

function toggleMenu() {
    const menu = document.getElementById('menu');
    if (menu.style.display === 'none' || menu.style.display === '') {
        menu.style.display = 'flex';
    } else {
        menu.style.display = 'none';
    }
}

function changeColor(color) {
    document.querySelector('.clock').style.color = color;
}

function changeFont(font) {
    document.querySelector('.clock').style.fontFamily = font;
}

function toggleSeconds() {
    showSeconds = !showSeconds;
}

function toggleAmPm() {
    showAmPm = !showAmPm;
}

showTime();;