/* KC Calendar — FullCalendar 6 integration */
(function () {
    'use strict';

    document.addEventListener('DOMContentLoaded', function () {
        var el = document.getElementById('kc-calendar');
        if (!el) return;

        /* ── Type metadata ───────────────────── */
        var typeInfo = {
            auto_open: { label: 'เปิดทำการปกติ',   color: '#0ea5e9' },
            open:      { label: 'เปิดพิเศษ',        color: '#10b981' },
            closed:    { label: 'ปิดทำการ',          color: '#f43f5e' },
            special:   { label: 'กิจกรรม/แคมเปญ',   color: '#8b5cf6' },
            holiday:   { label: 'วันหยุดพิเศษ',     color: '#f97316' },
        };

        /* ── Helpers ─────────────────────────── */
        function formatTime(iso) {
            if (!iso) return '';
            var d = new Date(iso);
            return d.toLocaleTimeString('th-TH', { hour: '2-digit', minute: '2-digit' });
        }
        function formatDate(iso) {
            if (!iso) return '';
            var d = new Date(iso);
            return d.toLocaleDateString('th-TH', { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' });
        }

        /* ── FullCalendar ────────────────────── */
        var calendar = new FullCalendar.Calendar(el, {
            locale:          'th',
            initialView:     window.innerWidth < 640 ? 'listMonth' : 'dayGridMonth',
            headerToolbar: {
                left:   'prev,next today',
                center: 'title',
                right:  'dayGridMonth,timeGridWeek,listMonth',
            },
            buttonText: {
                today:        'วันนี้',
                month:        'เดือน',
                week:         'สัปดาห์',
                list:         'รายการ',
            },
            height:          'auto',
            dayMaxEvents:    3,
            nowIndicator:    true,
            weekends:        true,

            /* Load events from REST API */
            events: function (fetchInfo, successCb, failureCb) {
                var url = kcCalConfig.apiUrl
                    + '?start=' + fetchInfo.startStr.slice(0, 10)
                    + '&end='   + fetchInfo.endStr.slice(0, 10);

                fetch(url, {
                    headers: { 'X-WP-Nonce': kcCalConfig.nonce }
                })
                .then(function (r) { return r.json(); })
                .then(successCb)
                .catch(failureCb);
            },

            /* Style events */
            eventDidMount: function (info) {
                info.el.title = info.event.title;
            },

            /* Click → popup */
            eventClick: function (info) {
                info.jsEvent.preventDefault();
                showPopup(info.event);
            },

            /* Highlight today's date cell */
            dayCellDidMount: function (info) {
                var today = new Date();
                if (
                    info.date.getFullYear() === today.getFullYear() &&
                    info.date.getMonth()    === today.getMonth()    &&
                    info.date.getDate()     === today.getDate()
                ) {
                    info.el.classList.add('fc-day-today-custom');
                }
            },
        });

        calendar.render();

        /* ── Popup ───────────────────────────── */
        var popup     = document.getElementById('kc-popup');
        var popupBody = document.getElementById('kc-popup-content');
        var closeBtn  = document.getElementById('kc-popup-close');

        function showPopup(event) {
            var type    = (event.extendedProps && event.extendedProps.type) || 'auto_open';
            var note    = (event.extendedProps && event.extendedProps.note) || '';
            var info    = typeInfo[type] || typeInfo['auto_open'];
            var hasTime = event.start && event.start.getHours() !== 0;

            var html = '';

            /* Type badge */
            html += '<div class="kc-popup-type-badge" style="background:' + info.color + '1a;color:' + info.color + ';">'
                  + info.label + '</div>';

            /* Title */
            html += '<div class="kc-popup-title">' + event.title + '</div>';

            /* Date row */
            html += '<div class="kc-popup-row">'
                  + '<svg class="kc-popup-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/></svg>'
                  + '<span>' + formatDate(event.startStr || event.start) + '</span>'
                  + '</div>';

            /* Time row */
            if (hasTime) {
                var timeStr = formatTime(event.start);
                if (event.end) timeStr += ' – ' + formatTime(event.end);
                html += '<div class="kc-popup-row">'
                      + '<svg class="kc-popup-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>'
                      + '<span>' + timeStr + '</span>'
                      + '</div>';
            }

            /* Note row */
            if (note) {
                html += '<div class="kc-popup-row">'
                      + '<svg class="kc-popup-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>'
                      + '<span>' + note + '</span>'
                      + '</div>';
            }

            /* CTA button */
            if (type !== 'closed' && type !== 'holiday') {
                html += '<a href="#contact" class="kc-popup-btn" onclick="document.getElementById(\'kc-popup\').style.display=\'none\';">📅 นัดหมายแพทย์</a>';
            }

            popupBody.innerHTML = html;
            popup.style.display = 'flex';
            document.body.style.overflow = 'hidden';
        }

        function closePopup() {
            popup.style.display = 'none';
            document.body.style.overflow = '';
        }

        closeBtn.addEventListener('click', closePopup);
        popup.addEventListener('click', function (e) {
            if (e.target === popup) closePopup();
        });
        document.addEventListener('keydown', function (e) {
            if (e.key === 'Escape') closePopup();
        });
    });
})();