{% extends 'base_fullwidth_leaflet.html' %}
{% load leaflet_tags %}
{% leaflet_js plugins="ALL" %}
{% load geojson_tags %}
{% load i18n %}
{% load render_table from django_tables2 %}
{% block content %}
    <h1 xmlns="http://www.w3.org/1999/html"><i class="{{ icon | safe }}"></i> {{ title }}</h1>
    <p>
        <small>Localité créée par <b>{{ object.created_by }}</b> le <b>{{ object.timestamp_create }}</b> et mise
            à jour le <b>{{ object.timestamp_update }}</b></small>
    </p>
    <div class="row">
        <div class="col-md-12 col-lg-5">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <div class="pull-right btn-group">
                        <a href="{% url 'sights:place_update' pk=object.id_place %}" class="btn btn-default btn-xs"><i
                                class="fa fa-fw fa-pencil-square-o"></i><span class="hidden-xs"> Modifier</span></a>
                        <a href="{% url 'sights:place_delete' pk=object.id_place %}" class="btn btn-danger btn-xs"><i
                                class="fa fa-fw fa-trash"></i><span class="hidden-xs"> Supprimer</span></a>
                    </div>
                    <h4 class="panel-title"><i class="fi-info"></i> Informations sur la localité</h4>
                </div>
                <div role="tabpanel">
                    <ul id="myTab" class="nav nav-tabs">
                        <li role="navigation" class="active"><a class="tab" href="#mainInfo"
                                                                aria-controls="maininfo"
                                                                role="tab" data-toggle="tab">Informations
                            principales</a>
                        </li>
                        <li role="navigation"><a href="#otherInfo" aria-controls="otherinfo" role="tab"
                                                 data-toggle="tab">Autres
                            infos</a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        {#                <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel"#}
                        {#                     aria-labelledby="headingOne">#}
                        <div role="tabpanel" class="tab-pane active" id="mainInfo">
                            <div class="container-fluid">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <fieldset>
                                            <legend>Caractéristiques principales</legend>
                                            <table>
                                                {% for field in object.fields %}
                                                    <div class="col-xs-12 col-md-6 col-lg-3">
                                                        <label>{{ field.name }}</label>
                                                        <div class="well well-sm">{{ field.value }}</div>
                                                    </div>
                                                {% endfor %}
                                            </table>


                                            <div class="row">
                                                <div class="col-xs-12 col-md-6 col-lg-3">
                                                    <label>Nom de la localité</label>
                                                    <div class="well well-sm">{{ object.name }}</div>
                                                </div>
                                                <div class="col-xs-12 col-md-6 col-lg-3">
                                                    <label>Précision</label>
                                                    <div class="well well-sm">{{ object.precision.descr }}</div>
                                                </div>
                                                <div class="col-xs-12 col-md-6 col-lg-3">
                                                    <label>Altitude</label>
                                                    <div class="well well-sm">
                                                        {% if object.altitude %}{{ object.altitude }}{% else %}
                                                            -{% endif %}</div>
                                                </div>
                                                <div class="col-xs-12 col-md-6 col-lg-3">
                                                    <label>Domaine</label>
                                                    <div class="well well-sm">
                                                        {% if object.domain %}
                                                            {{ object.domain.descr }}
                                                        {% else %}
                                                            -
                                                        {% endif %}
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                        {% if object.is_hidden %}
                                            <fieldset>
                                                <legend>Sensibilité du site</legend>
                                                <div class="row">
                                                    <div class="col-xs-12 col-md-5 col-lg-3">
                                                        <label>Site sensible</label>
                                                        <div class="well well-sm"><span class="label label-warning"><i
                                                                class="fi-alert"></i></span> Site sensible
                                                            caché</b>
                                                        </div>
                                                    </div>
                                                    <div class="col-xs-12 col-md-7 col-lg-9">
                                                        <label>Personnes autorisées</label>
                                                        <div class="well well-sm">
                                                            {% if object.authorized_user %}
                                                                {% for o in object.authorized_user.all %}
                                                                    <b>{{ o.get_full_name }}</b> ({{ o.username }})
                                                                    <br/>
                                                                {% endfor %}
                                                            {% else %}
                                                                Aucune
                                                            {% endif %}
                                                        </div>
                                                    </div>
                                                </div>
                                            </fieldset>
                                        {% endif %}
                                        <fieldset>
                                            <legend>Type de site</legend>
                                            <div class="row">
                                                <div class="col-sm-6">
                                                    <label>Gîte</label>
                                                    <div class="well well-sm">
                                                        {% if object.is_gite %}
                                                            <span class="label label-success"><i
                                                                    class="fi-check"></i></span>
                                                            {{ object.type.descr }}
                                                        {% else %}
                                                            Non
                                                        {% endif %}
                                                    </div>
                                                </div>
                                                <div class="col-sm-6">
                                                    <label>Site géré</label>
                                                    <div class="well well-sm">
                                                        {% if object.is_managed %}
                                                            <span class="label label-success"><i
                                                                    class="fi-check"></i></span> Site géré
                                                        {% else %}
                                                            Non
                                                        {% endif %}
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                        <fieldset>
                                            <legend>Localisation géographique</legend>
                                            <div class="row">
                                                <div class="col-xs-6">
                                                    <label>Territoire</label>
                                                    <div class="well well-sm">{{ object.territory|safe }}</div>
                                                </div>
                                                <div class="col-xs-6">
                                                    <label>Commune</label>
                                                    <div class="well well-sm">{{ object.municipality|safe }}</div>
                                                </div>
                                                <div class="col-lg-12">
                                                    <label>Coordonnées GPS</label>
                                                    <div class="well well-sm">{{ object.x|safe }}
                                                        ; {{ object.y|safe }}</div>
                                                </div>
                                                <div class="col-lg-12">
                                                    <label>Carte</label>
                                                    {% leaflet_map "map" callback="window.map_init_basic" %}
                                                    <script type="text/javascript">
                                                        var marker = {{ object.geom | geojsonfeature | safe }};

                                                        function map_init_basic(map, options) {
                                                            // Géolocalisation de l'utilisateur

                                                            var locateOptions = {
                                                                flyTo: true,
                                                                title: 'Ma position',
                                                                icon: 'fa fa-location-arrow',
                                                            };

                                                            L.control.locate(locateOptions).addTo(map);

                                                            // Fonction plein écran
                                                            map.addControl(new L.Control.Fullscreen());

                                                            // Ajout du marker de la localité
                                                            L.geoJson(marker).addTo(map);
                                                            map.fitBounds(L.geoJson(marker).getBounds());
                                                            map.setZoom(13);
                                                        };
                                                    </script>
                                                </div>
                                            </div>
                                        </fieldset>

                                    </div>
                                </div>
                            </div>
                        </div>
                        <div role="tabpanel" class="tab-pane" id="otherInfo">
                            <div class="container-fluid">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <fieldset>
                                            <legend>Gîte et refuge</legend>
                                            <div class="row">
                                                <div class="col-xs-12 col-md-6">
                                                    <label>Nom du propriétaire</label>
                                                    <div class="well well-sm">{{ object.proprietary }}</div>
                                                </div>

                                                <div class="col-xs-12 col-md-6">
                                                    <label>Convention refuge</label>
                                                    <div class="well well-sm">
                                                        {% if object.convention %}
                                                            <span class="label label-success"><i
                                                                    class="fi-check"></i></span>
                                                            Oui
                                                            {% if object.convention_file %}
                                                                <a href="{{ object.convention_file.url }}"
                                                                   class="btn btn-primary btn-xs pull-right"
                                                                   title="Télécharger la convention"><i
                                                                        class="fi-download"></i></a>
                                                            {% endif %}
                                                        {% else %}
                                                            Non
                                                        {% endif %}
                                                    </div>
                                                </div>
                                            </div>
                                        </fieldset>
                                        {% if object.photo_file %}
                                        <fieldset>
                                            <legend>Photo</legend>
                                            <img src="{{ object.photo_file.url }}" alt="Photo du gîte" width="500"/>
                                        </fieldset>
                                        {% endif %}
                                        {% if object.map_file %}
                                        <fieldset>
                                            <div class="col-xs-12 col-md-12">
                                                <legend>Carte, plan</legend>
                                                    <div class="well well-sm col-md-6">
                                                        <span class="label label-success"><i class="fi-check"></i></span>
                                                        Carte ou plan disponible
                                                        <a href="{{ object.map_file.url }}" class="btn btn-primary btn-xs pull-right" title="Télécharger la fichier"><i class="fi-download"></i></a>
                                                    </div>
                                                </div>
                                        </fieldset>
                                        {% endif %}
                                        {% if object.bdsource %}
                                            <fieldset>
                                                <legend>BD Source</legend>
                                                <div class="row">
                                                    <div class="col-md-6 col-xs-12">
                                                        <label>Source de la localité</label>
                                                        <div class="well well-sm">{{ object.bdsource }}</div>
                                                    </div>
                                                    <div class="col-md-6 col-xs-12">
                                                        <label>Identifiant de la localité dans la base de donnée
                                                            source</label>
                                                        <div class="well well-sm">{{ object.id_bdsource }}</div>
                                                    </div>
                                                </div>
                                            </fieldset>
                                        {% endif %}
                                        {% if object.comment %}
                                            </fieldset>
                                            <legend>Commentaire</legend>
                                            <div class="row">
                                                <div class="col-lg-12">
                                                    <div class="well well-sm">{{ object.comment|safe }}</div>
                                                </div>
                                            </div>
                                            <fieldset>
                                        {% endif %}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {% comment %}


            DONNEES ATTRIBUEES A LA LOCALITE


        {% endcomment %}
        <div class="col-md-12 col-lg-7">
            <div id="accordion" class="panel-group">
                {% comment %}

                    BLOC1: Sessions d'inventaires

                {% endcomment %}
                <div class="panel panel-default panel-info panel-table">
                    <!-- Default panel contents -->
                    <div class="panel-heading">
                        <div class="pull-right btn-group btn-group-xs">
                            {% if sessioncount > 0 %}
                                <a class="btn btn-default" data-toggle="collapse" data-parent="#accordion"
                                   href="#collapseSession" title="voir/cacher la liste"><span
                                        class="caret"></span></a>
                            {% endif %}
                            <a href="{% url 'sights:session_create' pk=object.id_place %}"
                               class="pull-right btn btn-primary btn-xs"><i
                                    class="fi-plus"></i> Nouvelle session</a>
                        </div>
                        <h4><i
                                class="{{ sessionicon }}"></i> Sessions d'inventaires</a>
                            <span class="badge">{{ sessioncount }}</span>
                        </h4>
                    </div>

                    <!-- Table -->
                    {% if sessioncount > 0 %}
                        <div id="collapseSession" class="panel-body">
                            {% render_table sessiontable %}
                        </div>
                    {% endif %}
                </div>
                {% comment %}Etats des lieux{% endcomment %}
                {% if placedetail %}
                    <div class="panel panel-default panel-info panel-table">
                        <!-- Default panel contents -->
                        <div class="panel-heading">
                            <div class="pull-right btn-group btn-group-xs">
                                {% if placedetailcount > 0 %}
                                    <a class="btn btn-default" data-toggle="collapse" data-parent="#accordion"
                                       href="#collapseState" title="voir/cacher la liste"><span
                                            class="caret"></span></a>
                                {% endif %}
                                <a href="{% if object.type.category == 'tree' %}
                                {% url 'sights:tree_create' pk=object.pk %}
                                {% elif object.type.category == 'building' %}
                                {% url 'sights:build_create' pk=object.pk %}
                                {% elif object.type.category == 'bridge' %}
                                {% url 'sights:bridge_create' pk=object.pk %}
                                {% elif object.type.category == 'cave' %}
                                {% url 'sights:cave_create' pk=object.pk %}
                                {% endif %}"
                                   class="btn btn-primary btn-xs pull-right"
                                   title="nouvel état des lieux"><i
                                        class="fi-plus"></i> nouvelle visite</a>
                            </div>
                            <h4><i class="{{ placedetailicon | safe }}"></i> {{ placedetailtitle }}
                                <span class="badge">{{ placedetailcount }}</span>
                            </h4>
                        </div>
                        {% if placedetailcount > 0 %}
                            <div id="collapseState" class="panel-body">
                                {% render_table placedetailtable %}
                            </div>
                        {% endif %}
                    </div>
                {% endif %}

                {% comment %}Gestion de site{% endcomment %}
                {% if object.is_managed %}
                    <div class="panel panel-default panel-info panel-table">
                        <!-- Default panel contents -->
                        <div class="panel-heading">
                            <div class="pull-right btn-group btn-group-xs">
                                {% if placemanagementcount > 0 %}
                                    <a class="btn btn-default" data-toggle="collapse" data-parent="#accordion"
                                       href="#collapseMgmt" title="voir/cacher la liste"><span
                                            class="caret"></span></a>
                                {% endif %}
                                <a href="{% url 'sights:management_create' pk=object.pk %}"
                                   class="btn btn-primary"><i
                                        class="fi-plus"></i> Nouvelle action</a>
                            </div>
                            <h4><i
                                    class="{{ placemanagementicon }}"></i> {{ placemanagementtitle }} </a>
                                <span class="badge">{{ placemanagementcount }}</span>
                            </h4>
                        </div>

                        <!-- Table -->
                        {% if placemanagementcount > 0 %}
                            <div id="collapseMgmt" class="panel-body">
                                {% render_table placemanagementtable %}
                            </div>
                        {% endif %}
                    </div>
                {% endif %}
            </div>
        </div>
    </div>

    <br/> {% endblock %}