<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<spring:url value="/resources/static/css/statistics.css" var="statisticsCss" />
<link href="${statisticsCss}" rel="stylesheet" />

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js"></script>

<div class="container">
    <div class="select-spring">
        <select class="selectpicker" data-width="500px" title="Select a sprint">
            <c:forEach var="sprint" items="${sprints}" varStatus="counter">
                <option value="${sprint}" ${counter.first ? 'selected' : ''}>
                        <span class="sprint-label">Sprint </span>
                        <span class="sprint-id">${sprint}</span>
                </option>
            </c:forEach>
        </select>
    </div>

    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

    <div class="spring-info">
        <div class="panel panel-info">
            <div class="panel-heading">Spring 1 results</div>

            <table class="table sprint-info-table">
                <tr class="duration">
                    <td class="concept">Duration</td>
                    <td class="text"></td>
                </tr>

                <tr class="capacity">
                    <td class="concept">Capacity</td>
                    <td class="text"></td>
                </tr>

                <tr class="members">
                    <td class="concept">Resources</td>
                    <td class="text"></td>
                </tr>

                <tr class="planned">
                    <td class="concept">Planned</td>
                    <td class="text"></td>
                </tr>

                <tr class="burned">
                    <td class="concept">Burned</td>
                    <td class="text"></td>
                </tr>

                <tr class="remaining">
                    <td class="concept">Remaining</td>
                    <td class="text"></td>
                </tr>

                <tr class="ideal-velocity">
                    <td class="concept">Ideal velocity / member</td>
                    <td class="text"></td>
                </tr>

                <tr class="real-velocity">
                    <td class="concept">Real velocity / member</td>
                    <td class="text"></td>
                </tr>
            </table>
        </div>
    </div>
</div>

<script src="http://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<spring:url value="/resources/static/js/statistics.js" var="statisticsJs" />
<script src="${statisticsJs}"></script>