{{-- planning/scripts.blade.php --}}
<script>
    // Configuration
    const CONFIG = {
        startDate: moment().startOf("year"),
        daysToShow: 14 * 30, // 14 months in days
        pxPerHour: {
            standard: 5.587,
            duration: 5.2228
        },
        cleaningDaysRate: {{ $cleaning_days_rate ?? 7 }},
        locale: {
            days: ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"],
            months: [
                "Janvier", "Février", "Mars", "Avril", "Mai", "Juin",
                "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"
            ]
        }
    };

    // Calculated values
    const $startDate = CONFIG.startDate;
    const $endDate = moment($startDate).add(14, "M").add(-1, "days");
    const $totalDays = moment($endDate).diff($startDate, "days");
    const $offsetDays = moment().diff(moment($startDate), "days");

    // Data
    const results = [
        @foreach($reservations as $key => $item)
                        // Check-in events
                        {
                id: 111{{$key + 1}},
                name: "Check-in",
                reservationID: "{{ $item->id }}",
                reason: "Sickness",
                startDate: "{{ $item->check_in }}",
                guestName: "{{ $item->guest_name }} {{ $item->guest_surname }}",
                guestPhone: "{{ $item->guest_phone }}",
                title: "{{ $properties->where('uid', $item->property_id)->value('name') }}",
                comment: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('comment') }}",
                arrival_time: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('arrival_time') }}",
                exit_time: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('exit_time') }}",
                userPlaned: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('userPlaned') }}",
                userPlanedName: "{{ $user->where('id', $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('userPlaned'))->value('id') }}",
                userVerif: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('userVerif') }}",
                isVerif: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('isVerif') }}",
                userVerifName: "{{$user->where('id', $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-in')->value('userVerif'))->value('name') }}",
                endDate: moment("{{ $item->check_in }}").add(1, "d")
            },
            // Check-out events
            {
                id: 222{{$key + 2}},
                name: "Check-out",
                reservationID: "{{ $item->id }}",
                reason: "Approved Holiday",
                @if ($reservationExtention->where('reservation_id', $item->id)->value('check_out'))
                    startDate: "{{ $reservationExtention->where('reservation_id', $item->id)->value('check_out') }}",
                @else
                    startDate: "{{ $item->check_out }}",
                @endif
            guestName: "{{ $item->guest_name }} {{ $item->guest_surname }}",
            guestPhone: "{{ $item->guest_phone }}",
            title: "{{ $properties->where('uid', $item->property_id)->value('name') }}",
            comment: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('comment') }}",
            arrival_time: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('arrival_time') }}",
            exit_time: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('exit_time') }}",
            userPlaned: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('userPlaned') }}",
            userPlanedName: "{{$user->where('id', $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('userPlaned'))->value('name') }}",
            userVerif: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('userVerif') }}",
            isVerif: "{{ $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('isVerif') }}",
            userVerifName: "{{$user->where('id', $plannings->where('reservation_id', '==', $item->id)->where('action', '==', 'Check-out')->value('userVerif'))->value('name') }}",
            @if ($reservationExtention->where('reservation_id', $item->id)->value('check_out'))
                endDate: moment("{{ $reservationExtention->where('reservation_id', $item->id)->value('check_out') }}").add(1, "d")
            @else
                endDate: moment("{{ $item->check_out }}").add(1, "d")
            @endif
                        },
        @endforeach

    @foreach($reservations as $key44 => $item44)
        @if ($carbon::create($item44->check_in)->diffInDays($item44->check_out) >= $cleaning_days_rate + 1)
            @for ($index = $cleaning_days_rate + 1; $index < $carbon::create($item44->check_in)->diffInDays($item44->check_out); $index += $cleaning_days_rate + 1)
                // Mid-stay cleaning events
                {
                    id: 333{{$key44 + $index - 1 }},
                        name: "Cleaning",
                            reservationID: "{{ $item44->id }}",
                                reason: "Pending Holiday",
                                    @if ($reservationExtention->where('reservation_id', $item44->id)->value('check_out'))
                                        startDate: moment("{{ $reservationExtention->where('reservation_id', $item44->id)->value('check_in') }}").add({{$index}}, "d").format("YYYY-MM-DD HH:mm:ss"),
                                    @else
                                        startDate: moment("{{ $item44->check_in }}").add({{$index}}, "d").format("YYYY-MM-DD HH:mm:ss"),
                                    @endif
                            guestName: "{{ $item44->guest_name }} {{ $item44->guest_surname }}",
                                guestPhone: "{{ $item44->guest_phone }}",
                                    title: "{{ $properties->where('uid', $item44->property_id)->value('name') }}",
                                        comment: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('comment') }}",
                                            arrival_time: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('arrival_time') }}",
                                                exit_time: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('exit_time') }}",
                                                    userPlaned: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('userPlaned') }}",
                                                        userPlanedName: "{{$user->where('id', $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('userPlaned'))->value('name') }}",
                                                            userVerif: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('userVerif') }}",
                                                                isVerif: "{{ $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('isVerif') }}",
                                                                    userVerifName: "{{$user->where('id', $plannings->where('reservation_id', '=', $item44->id)->where('action', '=', 'Cleaning')->value('userVerif'))->value('name') }}",
                                                                        @if ($reservationExtention->where('reservation_id', $item44->id)->value('check_in'))
                                                                            endDate: moment("{{ $reservationExtention->where('reservation_id', $item44->id)->value('check_in') }}").add({{($index) + 1}}, "d").format("YYYY-MM-DD HH:mm:ss")
                                                                        @else
                                                                            endDate: moment("{{ $item44->check_in }}").add({{($index) + 1}}, "d").format("YYYY-MM-DD HH:mm:ss")
                                                                        @endif
                                                        },
            @endfor
        @endif
    @endforeach
    ];

    /**
     * Build the Gantt chart calendar structure
     */
    function buildGantt() {
        let dayRow = "";
        let monthRow = "";
        const { days, months } = CONFIG.locale;
        let date = moment($startDate);

        for (let i = 0; i <= $totalDays; i++) {
            const day = date.date();
            dayRow += `<td data-day='${i}'>${days[date.day()]}<br>${day}</td>`;

            if (day === 1) { // First day of month
                const monthStart = moment(date).add(1, "M").add(-1, "d");
                const dayCount = monthStart.date();
                monthRow += `<th data-days='${dayCount}' colspan='${dayCount}'>${months[date.month()]} (${date.year()})</th>`;
            }

            date.add(1, "d");
        }

        $(".chartLayout").html(`<tr>${monthRow}</tr><tr>${dayRow}</tr>`);
        $(".chartLayout th:even").addClass("odd");
        $(".chartLayout td:contains('S')").addClass("weekend");
        $(".chartLayout td[data-day='" + $offsetDays + "']").addClass("today");
    }

    /**
     * Add event data to the Gantt chart
     */
    function addData() {
        // Sort results by startDate and then by name
        results.sort((a, b) => {
            if (a.startDate < b.startDate) return -1;
            if (a.startDate > b.startDate) return 1;
            return 0;
        });

        results.sort((a, b) => {
            if (a.name < b.name) return -1;
            if (a.name > b.name) return 1;
            return 0;
        });

        let eventBars;
        let barRows = "";
        let nameRows = "";
        const final = results.length;

        // Process and collect data for visualization
        let arraysOfRows = "<div class='barRow'>";
        const arrayOfNameRows = [];
        const arrayOfEventsBar = [];

        for (let i = 0; i < final; i++) {
            let isFirst = 1;
            let top = 0;
            let startDateSTR = results[i].startDate;

            // Add name row if not already added
            if (!arrayOfNameRows.includes(results[i].name)) {
                const absenceReason = results[i].reason.replace(/\s+/g, "-").toLowerCase();
                nameRows += `<tr><td style='height:380px;' class='${absenceReason}'>${results[i].name}</td></tr>`;
                arrayOfNameRows.push(results[i].name);
            }

            // Process events for this name
            for (let index = i; index < final; index++) {
                if (results[i].name === results[index].name) {
                    if (!arrayOfEventsBar.includes(index)) {
                        if (startDateSTR !== results[index].startDate) {
                            startDateSTR = results[index].startDate;
                            top = 0;
                        } else {
                            isFirst++;
                        }

                        const obj = results[index];
                        const absenceReason = obj.reason.replace(/\s+/g, "-").toLowerCase();
                        const startDate = moment(obj.startDate);
                        const endDate = moment(obj.endDate);
                        const numberOfDays = parseInt(moment.duration(endDate.diff(startDate)).asHours() * CONFIG.pxPerHour.duration);
                        const pxWidth = Math.max(2, numberOfDays);
                        const leftOffset = parseInt(moment.duration(startDate.diff($startDate)).asHours() * CONFIG.pxPerHour.standard);

                        // Verification indicator
                        const isVerif = obj.isVerif === "Oui"
                            ? "<div class='isVerif'></div>"
                            : "<div class='isNotVerif'></div>";

                        // Create event bar
                        if (isFirst === 1) {
                            eventBars = `<div class='bar ${absenceReason}' style='left:${leftOffset}px; width:${pxWidth}px;' id='${results[index].name}' onClick='openModal(${results[index].reservationID});'>${isVerif}${results[index].title}</div>`;
                            isFirst++;
                        } else {
                            top += 71;
                            eventBars = `<div class='bar ${absenceReason}' style='left:${leftOffset}px; margin-top:${top}px; width:${pxWidth}px;' id='${results[index].name}' onClick='openModal(${results[index].reservationID});'>${isVerif}${results[index].title}</div>`;
                        }

                        arraysOfRows += eventBars;
                        arrayOfEventsBar.push(index);
                    }

                    // Check if this is the last item
                    if (index === (final - 1)) {
                        if (arraysOfRows.length > 21) {
                            barRows += arraysOfRows + "</div>";
                            arraysOfRows = "<div class='barRow'>";
                        }
                    }
                } else {
                    if (!arrayOfEventsBar.includes(index)) {
                        if (arraysOfRows.length > 21) {
                            barRows += arraysOfRows + "</div>";
                            arraysOfRows = "<div class='barRow'>";
                        }
                        isFirst = 1;
                    }
                }
            }
        }

        // Create the markup
        $(".fixedSide").html(`<tbody><tr class='padding'><td></td></tr>${nameRows}</tbody>`);
        $(".fixedSide tr:odd").addClass("odd");
        $(".chartData").html(barRows);
        $(".barRow:even").addClass("odd");

        // Scroll into view
        $(".scrollArea").animate({
            scrollLeft: Math.max(0, $offsetDays * 135 - 255)
        }, 400);
    }

    /**
     * Open modal with reservation details
     * @param {number} reservationId - ID of the reservation
     */
    function openModal(reservationId) {
        $.ajax({
            url: "{{ route('planning.modal') }}",
            type: "GET",
            data: { reservation_id: reservationId },
            success: function (response) {
                $(".modal").html(response);
                $(".modal").modal("show");
            },
            error: function (xhr, status, error) {
                console.error("Error loading modal: ", error);
                alert("Failed to load modal content. Please try again.");
            }
        });
    }

    /**
     * Calculate and set the height of the chart
     */
    function calcHeight() {
        const height = $(".fixedSide tr").length * 274 + 60;
        $(".chartLayout td").css({ height });
    }

    /**
     * Initialize filter functionality
     */
    function filterAbsences() {
        $(".key li a").click(function () {
            const target = $(this).data("target");
            if (target === "show-all") {
                $(".barRow, .fixedSide td").show();
            } else {
                $(".barRow, .fixedSide td").hide();
                $(`.barRow:has('.bar.${target}'), .fixedSide td.${target}`).show();
            }
        });
    }

    // Initialize the Gantt chart
    $(function () {
        buildGantt();
        addData();
        calcHeight();
        filterAbsences();
    });
</script>