document.addEventListener('DOMContentLoaded', function() {
    var queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);
    var calendarEl = document.getElementById('calendar');
    var year = new Date().getFullYear();
    var month = new Date().getMonth() + 1;
    var day = new Date().getDate();
    var currentday = year + "-" + month + "-" + day;
    currentday = moment(currentday, 'YYYY-MM-DD').format('YYYY-MM-DD');
    var calendar = new FullCalendar.Calendar(calendarEl, {
        datesSet: function() {
            changeColor(darkMode);
        },
        events: {
            url: './src/PHP/load.php',
            method: 'GET',
            failure:function() {
                console.log('Es gab einen Fehler beim Laden der Ereignisse.');
            }
        },
        loading: function (isLoading) {
            var loadingTimeout = 1000; // 1 Sekunde
            if (isLoading) {
                loadingTimer = setTimeout(function() {
                    showLoader();
                }, loadingTimeout);
            }
            else {
                hideLoader();
                clearTimeout(loadingTimer);
            }
        },
        themeSystem: 'bootstrap5',
        dayHeaderFormat: {
            weekday: 'long'
        },
        firstDay: 1,
        initialDate: currentday,
        weekNumbers: true,
        headerToolbar: {
            left: "prev,next today",
            center: "title",
            right: 'dayGridMonth,timeGridWeek,timeGridDay',
        },
        locale: 'de',
        eventColor: '#3b91ed',
        eventDurationEditable: false,
        navLinks: false,
        editable:true,
        selectable:true,
        longPressDelay: 200,
        eventLongPressDelay: 200,
        selectLongPressDelay: 200,
        dateClick: function(info)
        {
            var date = moment(info.date, 'YYYY-MM-DD').format('YYYY-MM-DD');
            console.log(date);
            window.location.href = "./src/PHP/searchtable2.php?date=" + date;
        },
        eventDrop: function(info) {
            var id = info.event.id;
            var mealdate = moment(info.event.start, 'YYYY-MM-DD').format('YYYY-MM-DD');
            console.log(mealdate, id);

            // Funktion zum Schließen des Modals
            var closeModal = function() {
                jQuery('#myModal').remove(); // Entferne das Modal
            };

            // HTML-Code für das Modal
            var modalHtml = '<div id="myModal" class="modal">' +
                '<div class="modal-content">' +
                '<p style="text-align: center;">Was möchtest du mit dem Eintrag machen?</p>' +
                '<button class="custom-button move-button">Eintrag verschieben</button>' +
                '<button class="custom-button copy-button">Eintrag kopieren</button>' +
                '<button class="custom-button modalbutton">Abbrechen</button>' +
                '</div></div>';

            // Füge das Modal zum body hinzu
            jQuery('body').append(modalHtml);

            // Zeige das Modal an
            var modal = jQuery('#myModal');
            modal.show();

            // Verschiebe das Modal nach oben oder unten
            var modalContent = modal.find('.modal-content');
            var windowHeight = jQuery(window).height();
            var modalHeight = modalContent.height();
            var modalTop = (windowHeight - modalHeight) / 2;
            modalContent.css('top', modalTop);
            var modalWidth = modalContent.width();
            var newModalWidth = modalWidth * 0.3; // 60% der ursprünglichen Breite
            modalContent.css('width', newModalWidth);
            modalContent.css('margin-left', 'auto');
            modalContent.css('margin-right', 'auto');

            // Stelle sicher, dass die Buttons das richtige Styling haben
            jQuery('.custom-button').css({
                'background-color': '#4CAF50',
                'border': 'none',
                'color': 'white',
                'padding': '10px 20px',
                'text-align': 'center',
                'text-decoration': 'none',
                'display': 'inline-block',
                'font-size': '16px',
                'margin': '4px 2px',
                'cursor': 'pointer',
                'border-radius': '4px'
            });

            // Hover-Effekt für die Buttons
            jQuery('.custom-button:hover').css('background-color', '#45a049');
            jQuery('.modalbutton').css('background-color', '#f44336');
            jQuery('.modalbutton:hover').css('background-color', '#d32f2f');

            // Wenn auf "Eintrag verschieben" geklickt wird
            jQuery(document).on('click', '.move-button', function() {
                jQuery.ajax({
                    url:"./src/PHP/update2.php",
                    type:"POST",
                    data:{mealdate:mealdate, id:id},
                    success: function() {
                        closeModal();
                        calendar.refetchEvents();
                    }
                });
            });

            // Wenn auf "Eintrag kopieren" geklickt wird
            jQuery(document).on('click', '.copy-button', function() {
                jQuery.ajax({
                    url:"./src/PHP/duplicate.php",
                    type:"POST",
                    data:{mealdate:mealdate, id:id},
                    success: function() {
                        closeModal();
                        calendar.refetchEvents();
                    }
                });
            });

            // Wenn auf "Abbrechen" geklickt wird
            jQuery(document).on('click', '.modalbutton', function() {
                closeModal();
                calendar.refetchEvents();
            });
        },
        eventClick: function(info)
        {
            var date = moment(event.start, 'YYYY-MM-DD').format('YYYY-MM-DD');
            var mealname = event.title;
            var id = info.event.id;
            console.log(date, mealname, id);
            window.location.href = "./src/PHP/showeventdata2.php?id=" + id;
        },
        eventMouseEnter: function(mouseEnterInfo) {
        },
        eventMouseLeave: function(mouseLeaveInfo) {
        },
        eventDidMount: function(info) {
            if (darkMode) {
                info.el.style.backgroundColor = '#FF8C00';
                info.el.style.borderColor = '#FF8C00';
            } else {
                info.el.style.backgroundColor = 'rgb(59, 145, 237)';
                info.el.style.borderColor = 'rgb(59, 145, 237)';
            }
        }
    });
    globalThis.calendar = calendar;
    /*$('.custom-all-day').each(function() {
        var lines = $(this).text().split('<br>').length;
        $(this).height(lines * 20);
    });*/
    var calendardate = urlParams.get('calendardate');
    if (calendardate === "" || calendardate === null) {
        calendardate = currentday;
    }
    calendar.gotoDate(calendardate);
    calendar.render();
});