x

function solve() {
    const $lectureInput = document.querySelector('body > main > section.admin-view.section-view > div > div > form > div:nth-child(1) > input[type=text]');
    const $dateInput = document.querySelector('body > main > section.admin-view.section-view > div > div > form > div:nth-child(2) > input[type=datetime-local]');
    const $moduleInput = document.querySelector('body > main > section.admin-view.section-view > div > div > form > div:nth-child(3) > select');
    const $addButton = document.querySelector('body > main > section.admin-view.section-view > div > div > form > div:nth-child(4) > button');
    const $moduleDiv = document.querySelector('body > main > section.user-view.section-view > div'); //append the result here


    $addButton.addEventListener('click', e => {
        e.preventDefault();

        if ($moduleInput.value === 'Select module' || !$dateInput.value || !$lectureInput.value) {
            return;
        };

        let date = $dateInput.value;

        date = date.replace('-', '/');
        date = date.replace('T', ' - ');
        date = date.replace('-', '/');

        const $delButton = document.createElement('button');
        $delButton.textContent = 'Del';
        $delButton.className = 'red';

        const $h3 = document.createElement('h3');
        $h3.textContent = `${$moduleInput.value.toUpperCase()}-MODULE`;


        const $divResult = document.createElement('div'); //append h3 here
        $divResult.className = 'module';

        const $ul = document.createElement('ul');

        const $li = document.createElement('li'); //append h4 here
        $li.className = 'flex';

        const $h4 = document.createElement('h4');
        $h4.textContent = `${$lectureInput.value} - ${date}`;


        let x = Array.from(document.querySelectorAll('h3'));

        if (x.find(e => e.textContent == $h3.textContent)) {
            let node = x.find(e => e.textContent == $h3.textContent)
            let prnt = node.parentElement.querySelector('ul');
            prnt.appendChild($li);
            $li.appendChild($h4);
            $li.appendChild($delButton);


            sortList($ul)
        } else {
            $li.appendChild($h4);
            $li.appendChild($delButton);

            $ul.appendChild($li)

            $divResult.appendChild($h3);
            $divResult.appendChild($ul);

            $moduleDiv.appendChild($divResult);
        }




        $delButton.addEventListener('click', (e) => {
            let lis = Array.from(document.getElementsByTagName('li'))

            if (lis.length === 1) {
                e.target.parentElement.parentElement.parentElement.remove();
            } else {
                $li.remove();
            }
        })
    })


    function sortList(ul) {
        var ux = document.getElementsByTagName('ul')[0];

        Array.from(ux.getElementsByTagName("li"))
            .sort((a, b) => a.textContent.localeCompare(b.textContent))
            .forEach(li => ul.appendChild(li));
    }
}