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

<!DOCTYPE html>
<html lang="{{LANGUAGE_CODE}}">
    <head>
        <link type="text/css" rel="stylesheet" href="{% static 'styles/projector.css' %}">
        <link rel="shortcut icon" href="{% static 'img/favicon.png' %}" type="image/png" />
        <script type="text/javascript" src="{% static 'javascript/jquery.min.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 'img/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 %}
                <div id="overlay_{{ overlay.name }}">
                    {{ overlay.html|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>
