<html>
<head>
    <title>Local meetups to come in your city!</title>
    <link rel="stylesheet" href="/styles/calendar.css" />

    <script src='/webjars/fullcalendar/index.global.js'></script>
    <script>
        const city = "sitemap.xml";
    </script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const calendarDiv = document.getElementById('calendar');
            const initialDate = new URLSearchParams(window.location.search).get('initialDate')
            const calendar = new FullCalendar.Calendar(calendarDiv, {
                initialView: 'dayGridMonth',
                initialDate: initialDate,
                firstDay: 1,
                headerToolbar: {
                    left: 'today prev,next',
                    center: 'title',
                    right: 'dayGridMonth,listMonth'
                },
                buttonText: {
                    today: 'Today',
                    month: 'Grid',
                    list: 'List'
                },
                allDayText: '',
                height: 'auto'
            });
            calendar.addEventSource('/calendar?city=' + city);
            calendar.render();
        });
    </script>
</head>
<body>
<div id='calendar'></div>
<div>
    <span>
        <a href="ical?city=sitemap.xml">iCal</a>
    </span>
    <span>
        <a href="https://github.com/anthonydahanne/meetups-calendar">Fork me on Github and add your own meetup to the calendar!</a>
    </span>
</div>
</body>
</html>
