{% extends '_layout.html' %}

{% block title %}
	{% if form.instance.id %}
	[Edition] {{ form.instance.name }}
	{% else %}
	Nouvelle Story
	{% endif %}
{% endblock %}

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

{% block main %}
	
	<h2>{% if form.instance.id %}Edition de la Story{% else %}Nouvelle Story{% endif %}</h2>
	<form action="." method="post" enctype="multipart/form-data">
		{% csrf_token %}

		{{ form.non_field_errors }}
    	{{ form.author }}

		{% if not form.instance.epic %}
		<p>
		    {{ form.epic.errors }}
		    {{ form.epic.label_tag }}
		    {{ form.epic }}
		</p>
		{% else %}
			{{ form.epic.as_hidden }}
		{% endif %}
		
		<p>
		    {{ form.name.errors }}
		    {{ form.name.label_tag }}
		    {{ form.name }}
		</p>
		
		<p>
		    {{ form.weight.errors }}
		    {{ form.weight.label_tag }}
		    {{ form.weight }}
		</p>
		
		<p>
		    {{ form.description.errors }}
		    {{ form.description.label_tag }}
		    {{ form.description }}
		</p>
		
		<p>
		    {{ form.assignees.errors }}
		    <div class="flex-row">
		    	<label class="flex-extend" for="{{ form.assignees.id_for_label }}">Assignée à:</label>
		    	<a class="clickable" id="btn-assign-myself">Assigner à moi</a>
		    	<script>
		    		$('#btn-assign-myself').on('click', function() {
		    			$('#id_assignees').val([{{ request.user.id }}])
		    		});
		    	</script>
		    </div>
		    {{ form.assignees }}
		</p>
		
		<p>
		    {{ form.sprints.errors }}
		    <div class="flex-row">
			    <label class="flex-extend" for="{{ form.sprints.id_for_label }}">Sprints:</label>
			    <a class="clickable" id="btn-this-sprint">Sprint en cours</a>
		    	<script>
		    		$('#btn-this-sprint').on('click', function() {
		    			$('#id_sprints').val([{{ current_sprint_id }}])
		    		});
		    	</script>
		    </div>
		    {{ form.sprints }}
		</p>
			
		<p>
		    {{ form.story_type.errors }}
		    {{ form.story_type.label_tag }}
		    {{ form.story_type }}
		</p>
		
		<div class="flex-row flex-end" style="margin-top: 10px;">
			<span style="margin-right: 1em;">
			{% if form.instance.id %}
				<a class="button alt" href="{% url 'story_details' story_id=form.instance.id %}">Annuler</a>
			{% else %}
				<a class="button alt" href="{% url 'story_index' %}">Annuler</a>
			{% endif %}
			</span>
			
	    	<div class="flex-row flex-end">
	    		<input type="submit" value="Enregistrer">
	    	</div>
		</div>
	
	</form>
		
		
	
{% endblock %}