{% extends 'base.html.twig' %}

{% block breadcrumb %}
<li class="breadcrumb-item"><a href="{{ path('app_project') }}">Projets</a></li>
<li class="breadcrumb-item"><a href="{{ path('app_project_show', {'projectSlug': project.slug}) }}">Projet {{ project.name }}</a></li>
<li class="breadcrumb-item"><a href="{{ path('app_task_show', {'projectSlug': project.slug, 'taskSlug': task.slug}) }}">Tâche {{ task.name }}</a></li>
{% endblock %}

{% block page_title %}
    {{ task.name }}
    <span class="badge {{ 'text-bg-' ~ workflow_metadata(task, 'color', task.status) }} ms-2">{{ workflow_metadata(task, 'title', task.status) }}</span>
{% endblock %}

{% block page_content %}
<div class="row">
    <div class="col mb-3">
        <a href="{{ path('app_project_show', {'projectSlug': project.slug}) }}" class="btn btn-primary">Revenir au projet</a>
        <a href="{{ path('app_task_update', {'projectSlug': project.slug, 'taskSlug': task.slug}) }}" class="btn btn-primary">Modifier la tâche</a>
        <a href="{{ path('app_task_remove', {'projectSlug': project.slug, 'taskSlug': task.slug}) }}" target="_blank" class="btn btn-primary">Supprimer la tâche</a>
        <a href="{{ path('app_task_geojson', {'slug': task.slug}) }}" target="_blank" class="btn btn-primary">Télécharger GeoJSON</a>
        {% for transition in workflow_transitions(task) %}
        <a href="{{ path(workflow_metadata(task, 'route', transition), {'projectSlug': project.slug, 'taskSlug': task.slug}) }}" class="btn btn-primary">{{ workflow_metadata(task, 'title', transition) }}</a>
        {% endfor %}
        <button class="btn btn-primary" type="button" data-controller="josm" data-action="click->josm#remoteControl" data-josm-importurl-value="{{ url('app_task_osm', {'slug': task.slug}) }}" data-josm-layername-value="{{ task.name }}">Télécommande JOSM</button>
    </div>
</div>

{% if task.description is not empty %}
<h2 class="mb-3">Description</h2>
<div class="row">
    <div class="col mb-3 lead">{{ task.description|markdown_to_html }}</div>
</div>
{% endif %}

<h2 class="mb-3">Carte</h2>
<div class="row">
    <div class="col mb-3">
        <div id="map" class="img-fluid img-thumbnail min-vh-50" data-controller="map" data-map-geojson-value="{{ geoJsonManager.generateGeoJson(task)|json_encode }}"></div>
    </div>
</div>


<h2 class="mb-3">Commentaires</h2>
{% if task.comments is not empty %}
<div class="row">
    <div class="col mb-3">
        {% for comment in task.comments %}
        <blockquote class="blockquote">
            {{ comment.content|markdown_to_html }}
        </blockquote>
        {% endfor %}
    </div>
</div>
{% endif %}
<div class="row">
    <div class="col mb-3">
        {{ form(commentForm) }}
    </div>
</div>
{% endblock %}