{% load i18n %}
<!doctype html>
<html lang="{% if lang %}{{lang}}{% else %}{{LANGUAGE_CODE}}{% endif %}">
    <head>
    {% block head %}
    	<meta charset="UTF-8" />
        <link rel="SHORTCUT ICON" href="{{STATIC_URL}}jocondelab/img/favicon.ico" />
        <title>{% block title %}JocondeLab{% endblock %}</title>
        
        {% block js_import %}
        <script type="text/javascript" src="{% url 'django.views.i18n.javascript_catalog' %}"></script>
        <script type="text/javascript" src="{{STATIC_URL}}jocondelab/lib/underscore-min.js"></script>
        <script type="text/javascript" src="{{STATIC_URL}}jocondelab/lib/jquery.min.js"></script>
        <script type="text/javascript" src="{{STATIC_URL}}jocondelab/lib/jquery-ui.min.js"></script>
        {% endblock %}
        
        {% block css_import %}
        <link rel="stylesheet" href="{{STATIC_URL}}jocondelab/css/smoothness/jquery-ui-1.10.3.custom.min.css" type="text/css"/>
        {% endblock %}
        
        {% block css_declaration %}
        <link rel="stylesheet" href="{{STATIC_URL}}jocondelab/css/front-common.css" type="text/css"/>
        {% endblock %}
        
        {% block js_declaration %}
        <script type="text/javascript" src="{{STATIC_URL}}jocondelab/js/front-common.js"></script>
        {% endblock %}
        
    {% endblock %}
    </head>
    <body>
    {% block body %}
        <div class="header-wrapper">
            <header>
                {% block header %}
                    <div class="main-title">
                        <h1><a href="{% url 'front_search' %}">Joconde<span class="title-lab">Lab</span></a></h1>
                        <h2 class="breadcrumbs">{% block breadcrumbs %}{% endblock %}</h2>
                    </div>
                    <div class="top-menus">
                        <form action="{% url 'django.views.i18n.set_language' %}" method="post" id="lang_form" class="menu-container">
                            {% csrf_token %}
                            <a class="language-current" href="#"><img src="{{STATIC_URL}}jocondelab/img/flag_{% if lang %}{{lang}}{% else %}{{LANGUAGE_CODE}}{% endif %}.png" /></a>
                            <ul class="menu-list language-list">
                            {% get_language_info_list for LANGUAGES as languages %}
                            {% for language in languages %}
                                <li class="menu-item">
                                    <label for="language" class="language-label">{{ language.name_local }}</label>
                                    <input type="submit" name="language" class="language-button" style="background-image: url({{STATIC_URL}}jocondelab/img/flag_{{ language.code }}.png)" value="{{ language.code }}" title="{{ language.name_local }}" />
                                </li>
                            {% endfor %}
                            </ul>
                        </form>
                        <div class="menu-container">
                            <a class="main-menu-title">{% trans 'Menu' %}</a>
                            <ul class="menu-list main-menu-list">
                                <li class="menu-item">
                                    <a href="{% url 'front_search' %}">{% trans 'Multilingual search' %}</a>
                                </li>
                                <li class="menu-item">
                                    <a href="{% url 'front_timeline' %}">{% trans 'Timeline' %}</a>
                                </li>
                                <li class="menu-item">
                                    <a href="{% url 'front_geo' %}">{% trans 'World map' %}</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                    {% block header_search %}
                    <form class="header-search-form" action="{% url 'front_search' %}">
                        <input class="header-search-input" type="search" name="q" placeholder="{% trans 'Search in contents' %}" />
                    </form>
                    {% endblock %}
                {% endblock %}
            </header>
        </div>
        <div class="main-wrapper">
            <section class="main">
                {% block main %}
                {% endblock %}
            </section>
            <footer>
            {% block footer %}
                <p>&copy; 2013 Institut de Recherche et d'Innovation et Ministère de la Culture et de la Communication</p>
            {% endblock %}
            </footer>
        </div>
        <div class="dbpedia-overlay clearfix">
            <img />
            <h2></h2>
            <p class="dbpedia-abstract"></p>
            <p class="dbpedia-source"><a href="#" target="_blank">{% trans 'Source: Wikipedia' %}</a></p>
        </div>
    {% endblock %}
    </body>
</html>
