https://iteam.de/wp-content/themes/iteam/assets/js/btf/veranstaltungskalender.js?ver=1791111075&ver=1.1.0

1// to list all events by month 
2
3function iteamRestNonceHeaders() {
4    if (window.synRestNonceHeaders) {
5        return window.synRestNonceHeaders();
6    }
7
8    if (window.WP_VARS && WP_VARS.nonce) {
9        return { 'X-WP-Nonce': WP_VARS.nonce };
10    }
11
12    return {};
13}
14
15function iteamWithFreshRestNonce(callback) {
16    if (window.synGetRestNonce) {
17        window.synGetRestNonce().then(callback).catch(callback);
18        return;
19    }
20
21    callback();
22}
23
24jQuery(document).ready(function ($) {
25    iteamWithFreshRestNonce(function () {
26        $.ajax({
27            url: WP_URLS.rest_url + 'iteam/v1/veranstaltungen?per_page=100',
28            method: 'GET',
29            headers: iteamRestNonceHeaders(),
30            success: function (response) {
31                try {
32                    // order by start_date
33                    response.sort((a, b) => {
34                        const dateA = new Date(a.acf.start_date.split('.').reverse().join('-'));
35                        const dateB = new Date(b.acf.start_date.split('.').reverse().join('-'));
36                        return dateA - dateB;
37                    });
38                    // console.log(response[0]); // Log the response to inspect it
39
40
41                    let kalenderhtml = "";
42
43                    // Group events by month
44                    const eventsByMonth = {};
45                    const currentYear = new Date().getFullYear();
46
47                    // Parse date in format dd.mm.yyyy
48                    response.forEach(event => {
49                        if (event.acf.calendar !== true) return;
50                        const dateParts = event.acf.start_date ? event.acf.start_date.split('.') : [null, null, null];
51                        const [day, month, year] = dateParts;
52                        if (day && month && year) {
53                            const start = new Date(year, month - 1, day);
54
55                            const monthKey = `${month}-${year}`;
56
57                            if (!eventsByMonth[monthKey]) {
58                                eventsByMonth[monthKey] = [];
59                            }
60                            eventsByMonth[monthKey].push(event);
61                        }
62                    });
63
64                    kalenderhtml += `<table id="veranstaltungskalender">
65                                        <tbody>
66                                        <tr>
67                                            <th>Datum</th>
68                                            <th class="hidden-xs" >Titel</th>
69                                            <th class="hidden-xs" colspan="2">Ort</th>
70                                        </tr>
71                                    `;
72
73                    // Loop through each month in chronological order
74                    Object.keys(eventsByMonth)
75                        .sort((a, b) => new Date(`01-${a}`) - new Date(`01-${b}`))
76                        .forEach(monthKey => {
77                            const eventsInMonth = eventsByMonth[monthKey];
78
79                            // Sort events earliest to latest
80                            eventsInMonth.sort((a, b) => {
81                                const dateA = new Date(a.acf.start_date.split('.').reverse().join('-'));
82                                const dateB = new Date(b.acf.start_date.split('.').reverse().join('-'));
83                                return dateA - dateB;
84                            });
85
86                            // Display the month header row
87                            const monthDate = new Date(eventsInMonth[0].acf.start_date.split('.').reverse().join('-'));
88                            let headerText = monthDate.toLocaleString('default', {month: 'long'});
89                            if (monthDate.getFullYear() !== currentYear) {
90                                headerText += ` ${monthDate.getFullYear()}`;
91                            }
92                            kalenderhtml += `<tr class="month"><td colspan="4">${headerText}</td></tr>`;
93
94                            // Add events for the month
95                            eventsInMonth.forEach(event => {
96                                const start = event.acf.start_date || '';
97                                const event_title = (event.title && event.title.rendered) || '';
98                                const ort = event.acf.address || '';
99                                const url = event.acf.url || '';
100
101                                kalenderhtml += `
102                            <tr class="kalender-event" onclick="window.open('${url}', '_blank')">
103                                <td class="date">${start}</td>
104                                <td class="flex">${event_title}</td>
105                                <td class="hidden-xs">${ort}</td>
106                                <td class="hidden-xs"><span data-url-anmeldung="${url}" data-url="${url}" class="material-symbols-rounded hidden-small">chevron_right</span></td>
107                            </tr>`;
108                            });
109                        });
110
111                    kalenderhtml += '</tbody></table>';
112
113                    $("#kalender").html(kalenderhtml);
114
115                } catch (error) {
116                    console.error('Error parsing JSON response:', error.message);
117                }
118            },
119            error: function (xhr, status, error) {
120                console.error('Error fetching veranstaltungen:', error, xhr.status, xhr.responseText);
121            }
122        });
123    });
124});