{% extends '_layout.html' %}

{% block main %}

	<header class="flex-row" style="margin-bottom: 2em;">
		<h2 class="flex-extend">Stories</h2>

	</header>

	<div class="flex-row filters-bar">
		<label>Etat: </label>
		<select data-filter="state">
			<option value="" selected="selected">Tous</option>
			<option value="open">Ouvert</option>
			<option value="closed">Clôturé</option>
		</select>
	
		<label>Sprint: </label>
		<select data-filter="sprint">
			<option value="" selected="selected">Tous</option>
			{% for sprint in sprints %}
				<option value="{{ sprint.id }}">{{ sprint }}</option>
			{% endfor %}
		</select>
	
		<label>Auteur: </label>
		<select data-filter="author">
			<option value="" selected="selected">Tous</option>
			{% for user in users %}
				<option value="{{ user.id }}">{{ user.first_name }} {{ user.last_name }}</option>
			{% endfor %}
		</select>
	
		<label>Assignées: </label>
		<select data-filter="assignee">
			<option value="" selected="selected">Tous</option>
			{% for user in users %}
				<option value="{{ user.id }}">{{ user.first_name }} {{ user.last_name }}</option>
			{% endfor %}
		</select>
	</div>

	{% if stories %}
	    <ul class="alt issues-list">
	    {% for story in stories %}
	    
		    <li id="story_{{ story_id }}" class="issue" data-id="{{ story_id }}">
		    	<div class="issue-frame flex-row">
		    		<div class="issue-frame-left flex-extend">
		    			<div class="issue-title">
		    				{% if story.closed %}
		        				<a class="story-closed" href="{% url 'story_details' story_id=story.id %}">{{ story.name }}</a>
		        			{% else %}
		        				<a href="{% url 'story_details' story_id=story.id %}">{{ story.name }}</a>
		        			{% endif %}
		        		</div>
		        		<div class="issue-infos">
		        			
		        			<span class="annotation">Créée le {{ story.created }}, par {{ story.author.username }}. Dernière mise à jour le {{ story.updated }}.</span>
		        		</div>
		        	</div>
		        	<div class="issue-frame-right">
		        		<div class="flex-row controls">
							<a href="#" class="disabled annotation"><i class="fa fa-comment"></i> 0</a>
		        		</div>
		        		{% if story.epic_id %}
		        		<div class="annotation issue-last-update">		        			
		        				<a href="{% url 'epic_details' epic_id=story.epic_id %}">{{ story.epic.name }}</a>
	        			</div>
	        			{% endif %}
		        	</div>
		        </div>
		    </li>
	    
	    {% endfor %}
	    </ul>
	 {% else %}
	 	<span class="annotation">(Rien à afficher)</span>
	 {% endif %}
	 
{% endblock %}