{% load tags %}
{% load staticfiles %}

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
        <link type="text/css" rel="stylesheet" href="{% static 'styles/projector.css' %}">
        <link rel="shortcut icon" href="{% static 'images/favicon.png' %}" type="image/png" />
        <script type="text/javascript" src="{% static 'javascript/jquery.js' %}"></script>
        <script type="text/javascript" src="{% static 'javascript/projector.js' %}"></script>
        <title>{% block title %} {% get_config 'event_name' %} {% endblock %}</title>
        {% block header %}
        {% endblock %}
    </head>
    <body>
        <div id="config" style="display:none;">
            <div id="ajax">{{ ajax }}</div>
        </div>
        <div id="ajaxswitcher"></div>

        <div id="header">
            <div id="logo"><img src="{% static 'images/logo-projector.png' %}"></div>
            <div class="event_name">{% get_config 'event_name' %}</div>
            <div class="event_description">{% get_config 'event_description' %}</div>
        </div>

        <div id="currentTime">
            {% now "H:i" %}
        </div>

        <div id="overlays">
            {% for overlay in overlays %}
                {% if overlay.0 != "Countdown" %}
                    <span id="overlay_transparent"></span>
                {% endif %}
                <div id="overlay_{{ overlay.0 }}">{{ overlay.1|safe }}</div>
            {% endfor %}
        </div>

        <div id="contentwrapper">
            <div id="content">
            {% block content %}
            {% endblock %}
            </div>
            <div id="scrollcontentcontainer">
                <div id="scrollcontent">
                {% block scrollcontent %}
                {% endblock %}
                </div>
            </div>
        </div>
    </body>
</html>
