{% extends '_layout.html' %}

{% block title %}
	Rapport: Sprints
{% endblock %}

{% block breadcrumb %}
	<li><a href="{% url 'index' %}">Accueil</a></li>
	<li><a href="{% url 'reports' %}">Rapports</a></li>
	<li><a>Les Sprints</a></li>
{% endblock %}

{% block main %}
{% load martortags %}

<section id="backlog">
	<header>
		<div class="flex-row">
			<h2 class="flex-extend">Les Sprints</h2>
		</div>
	</header>
	
	<canvas id="chart-velocity" width="400" height="120"></canvas>
	
	<ul class="sprints-list">
	{% for sprint in sprints %}
		<li class="sprint-li">
			<div class="flex-col">
			
				<div class="flex-row">
					<h4>Sprint #{{ sprint.id }} : {{ sprint.date_start|date:"d M. Y" }} au {{ sprint.date_end|date:"d M. Y" }}</h4>
					{% if sprint.running %}<span class="running" style="margin-left: 14px;">En cours</span>{% endif %}
				</div>
				
				<div class="flex-row flex-space-around" style="margin-bottom: 20px;">
					<b>Stories programmées: <a href="{% url 'story_index' %}?sprint={{ sprint.id }}">{{ sprint.nb_stories }}</a> </b>
					<b>Vélocité prévue: {{ sprint.planned_velocity }} </b>
					<b>Vélocité réelle: {{ sprint.real_velocity }} </b>
				</div>
				
				{% if sprint.retro %}
				<div style="padding: 0 20px;">
					{{ sprint.retro|safe_markdown }}
				</div>
				{% endif %}
			</div>
		</li>
	{% endfor %}
	</ul>
	
</section>

<script>
var ctx = document.getElementById("chart-velocity").getContext('2d');
var myChart = new Chart(ctx, {
	type: 'line',
    data: {
        labels: [{% for sprint in sprints|dictsort:"id" %}{% if not forloop.last %}"Sprint #{{ sprint.id }}",{% endif %}{% endfor %}],
        datasets: [{
            label: 'Vélocité réelle',
            data: [{% for sprint in sprints|dictsort:"id" %}{% if not forloop.last %}{{ sprint.real_velocity }},{% endif %}{% endfor %}],
            backgroundColor: [
            	'rgba(255, 255, 255, 0.2)'
            ],
            borderColor: [
                'rgba(0,150,0,1)',
            ],
            borderWidth: 1
        },
        {
            label: 'Vélocité prévue',
            data: [{% for sprint in sprints|dictsort:"id" %}{% if not forloop.last %}{{ sprint.planned_velocity }},{% endif %}{% endfor %}],
            backgroundColor: [
                'rgba(255, 255, 255, 0.2)'
            ],
            borderColor: [
            	'rgba(0,0,150,1)',
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});
</script>

{% endblock %}