{% extends "site_base.html" %}


{% load i18n staticfiles %}

{% block head_title %}{% trans "Fullcalendar" %}{% endblock %}

{% block tab_id %}id="home_tab"{% endblock %}

{% block extra_head %}
<link rel='stylesheet' type='text/css' href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.css" />
<script type='text/javascript' src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/1.6.4/fullcalendar.min.js"></script>
{% endblock %}

{% block body %}
<div id="calendar"></div>
<script type='text/javascript'>
$(document).ready(function() {

    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({
        // put your options and callbacks here
      events: '/schedule/api/occurrences?calendar_slug=example'
    })

});
</script>

{% endblock %}
