index.html


<!DOCTYPE html>
<html lang="nl">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
        <title>Calendar Viewer</title>
        <link type="text/css" rel="stylesheet" href="css/styles.css" />
        <link type="text/css" rel="stylesheet" href="css/calendar.css" />
    </head>
    <body>

        <div class="calendar" id="demo-calendar"></div>
        
        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.23.0/moment.min.js"></script>
        <script type="text/javascript" src="js/calendar.js"></script>
        <script type="text/javascript">
            var calendar = new SimpleCalendar({
                id: 'demo-calendar',
                url: 'https://www.timvervoort.com/api/agenda/',
                todayName: 'vandaag',
                tomorrowName: 'morgen',
                weekdayNames: ['zondag', 'maandag', 'dinsdag', 'woensdag', 'donderdag', 'vrijdag', 'zaterdag'],
                loadingText: 'Kalender laden, even geduld...'
            });
        </script>

    </body>
</html>