{% extends "base.html" %}
{% load i18n %}
{% load static %}

{% block title %}{{block.super}} > Recherche par arbre{% endblock %}

{% block css_import %}
{{block.super}}
        <link rel="stylesheet" type="text/css" href="{% static 'hdalab/css/ui-lightness/jquery-ui-1.10.4.min.css' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'hdalab/css/trees.css?refresh' %}" />
        <link rel="stylesheet" type="text/css" href="{% static 'hdalab/css/thesaurus.css?refresh' %}" />
{% endblock %}

{% block js_import %}
{{block.super}}
        <script src="{% static 'hdalab/lib/lodash.min.js' %}"></script>
        <script src="{% static 'hdalab/lib/mustache.js' %}"></script>
        <script src="{% static 'hdalab/lib/jquery-ui-1.10.4.min.js' %}"></script>
        <script type="text/javascript">
        endpoints = {
            fill_tree: "{% url 'fill_tree' %}",
            datasheet: "{% url 'notice' 'ID' %}"
        };
        </script>
        <script src="{% static 'hdalab/js/trees.js?refresh' %}"></script>
        <script src="{% static 'hdalab/js/thesaurus.js?refresh' %}"></script>
{% endblock %}

{% block thesaurus_actif %}actif{% endblock %}

{% block main_content %}
	<div class="all-title">
        	<h1>{% trans 'Recherche par arbre' %}</h1>
    </div>
    <div class="explain">
        <p>Cette interface présente deux extraits de thésaurus utilisés par le ministère de la Culture et de la Communication :</p>
        <ul>
            <li>La branche « Secteur urbain » du Thésaurus de l’architecture et de l’urbanisme (état 2010)</li>
            <li>La branche « Architecture d’habitation » du Thésaurus iconographique Garnier (état 2012)</li>
        </ul>
        <p>Les mots-clés de ces branches ont été liés avec Wikipédia. Ils deviennent ainsi sémantiquement interopérables avec les tags d’HDA-Lab. Comme le montre l’interface, ce procédé permet d’organiser et de visualiser les tags et les ressources d'HDA-Lab en utilisant des thésaurus « métiers » externes. Dans cet extrait, le mot-clé « Cité jardin » est présenté, en vis-à-vis, dans deux univers sémantiques différents</p>
    </div>

    <div class="column leftcol">
        <h3>Arborescence 1</h3>
        <div class="cattree">

        </div>
    </div>
    <div class="separator"></div>
    <div class="column rightcol">
        <h3>Arborescence 2</h3>
        <div class="cattree">

        </div>
    </div>
{% endblock %}