{% extends '_layout.html' %}

{% block title %}
	{{ story.name }}
{% endblock %}

{% block breadcrumb %}
	<li><a href="{% url 'index' %}">Accueil</a></li>
	{% if story.epic %}
	<li><a href="{% url 'epic_details' epic_id=story.epic.id %}">Epic #{{ story.epic.id }}</a></li>
	{% else %}
	<li><a href="{% url 'story_index' %}">Toutes les Stories</a></li>
	{% endif %}
	<li><a>Story #{{ story.id }}</a></li>
{% endblock %}

{% block main %}
	{% load martortags %}
	
	<header>
		<div class="flex-row">
		    {% if story.epic %}
			<span class="annotation flex-extend">
				Epic: <a href="{% url 'epic_details' epic_id=story.epic.id %}">{{ story.epic.name }}</a>
			</span>
			{% endif %}
			<blockquote class="annotation">Créée par {{ story.author.get_full_name }}, le {{ story.created }}</blockquote>
		</div>
		<div class="flex-row title-bar">
			{% if story.weight %}
			<span style="margin-right: 10px;">{% include 'weight_svg.html' with weight=story.weight h=36 %}</span>
			{% endif %}
			
			{% if story.closed %}
				<h2 class="flex-extend" style="color: grey;">[Terminée] {{ story.name }}</h2>
			{% else %}
				<h2 class="flex-extend">{{ story.name }}</h2>
			{% endif %}
			
			<ul class="actions small">
				{% if story.closed %}
					<li><a class="button alt icon fa-folder-open tool-btn" href="{% url 'story_reopen' story_id=story.id %}" title="Ré-ouvrir">Ré-ouvrir</a></li>
				{% else %}
					<li><a class="button special icon fa-check tool-btn" href="{% url 'story_close' story_id=story.id %}" title="Marquer comme terminée">Cloturer</a></li>
				{% endif %}
				<li><a class="button special icon fa-edit tool-btn" href="{% url 'story_edit' story_id=story.id %}" title="Modifier"></a></li>
				<!-- <li><a class="button icon fa-trash tool-btn" href="{% url 'story_delete' story_id=story.id %}" title="Supprimer"></a></li> -->
			</ul>
		</div>
	</header>
	
	<hr>
	
	<div class="description">
		{% if story.description %}
			{{ story.description|safe_markdown }}
		{% else %}
			<i style="color:grey;">(Pas de description)</i>
		{% endif %}
	</div>

	<hr>
	
	<div class="flex-row">
		<h5>Assignée à</h5>
		<ul class="tags-list">
		{% for user in story.assignees.all %}
			<li>{{ user.get_full_name }}</li>
		{% empty %}
			<li>(Aucun)</li>
		{% endfor %}
		</ul>
	</div>
	<div class="flex-row">
		<h5>Sprints</h5>
		<ul class="tags-list">
		{% for sprint in story.sprints.all %}
			<li>{{ sprint }}</li>
		{% empty %}
			<li>(Aucun)</li>
		{% endfor %}
		</ul>
	</div>
	
	<hr>
	
	<div class="comment-section">
		<ul class="alt">
		{% for comment in story.comments.all %}
			<li class="flex-col">
				<div><h5><i class="fa fa-comment"></i> {{ comment.author }}, le {{ comment.created }}:</h5></b></div>
				<div class="comment-display">
					{{ comment.content|safe_markdown }}
				</div>
			</li>
		{% endfor %}
		</ul>
		
		<form action="{% url 'story_comment' story_id=story.id %}" method="post" accept-charset="utf-8">
			{% csrf_token %}
			{{ comment_form.as_p }}
			
	    	<div class="flex-row flex-end" style="margin-top: 10px;">
	    		<input type="submit">
	    	</div>
	    </form>
    </div>
	
{% endblock %}