document.addEventListener('DOMContentLoaded', async function () {
    const  DateTime = luxon.DateTime;
    const filename = 'data/data.json'
    let curdate = ''

    const dt = DateTime.now()
    const dt1 = dt.plus({month:1})
    curdate = `${dt.toFormat('LLLL')}/${dt1.toFormat('LLLL y')}`
    document.querySelector('#curmon').innerHTML = curdate

    let ret = await getData(filename)
    fillSchema(ret.data)

    document.querySelector('#sptab').addEventListener('click',  markField);	  

    function markField (e) { 
        let field = e.target;
        field.setAttribute('aria-label','x'); 
        field.setAttribute('disabled','disabled');
        let lastDate = parseInt(field.innerHTML)
        let month = curdate.split('/')[0]
        let data = {curdate: curdate.slice(0, -5), last: lastDate}
        let setArray = []
        let fields = document.querySelectorAll('#sptab button')
        for (i = 0; i < fields.length; i++) {
            setArray[i] = 0
            if (fields[i].hasAttribute('disabled')) {
                setArray[i] = 1
            }
        }
        data.data = setArray
        storeData(data)
    }

    function fillSchema(data) {
        const setArray = data.data
        let lastday = DateTime.now().endOf('month').day
        let first = lastday === data.last ? 1 : data.last+1
        for(let i = 1, k = first; i <= 35; i++, k++) {
            if(k > lastday) {
                k = 1
            }
            if (i === 18) {
                i++
            }
            let sel = '#bt'+i
            document.querySelector(sel).innerHTML = k
            if(setArray[i-1] === 1) {
                document.querySelector(sel).setAttribute('aria-label', 'x')
            }
        }
    }

    async function getData() {
        let erg = await fetch('data')
        return erg.json()
    }

    async function storeData(data) {
        const response = await fetch('/data', {
            method: "POST",
            body: JSON.stringify(data),
            headers: {
                'Content-Type':"application/json"
            }
        })
        return response.json()
    }

});