{% extends "squad/base.jinja2" %}

{% block content %}
  <h1>{{ _('Compare builds') }}</h1>
  {% if comparison %}
    {% with items=comparison.results %}
      {% include "squad/_pagination.jinja2" %}
    {% endwith %}

    {% include "squad/_results_table.jinja2" %}

    {% with items=comparison.results %}
      {% include "squad/_pagination.jinja2" %}
    {% endwith %}
    <button onclick='window.location="{{ request.path }}"' class="btn btn-default" />{{ _('Start over') }}</button>
  {% else %}
    <h2>{{ _('Project') }}</h2>
    <div class="row">
      <div class="col-md-6 col-sm-6" ng-app="BuildCompare" ng-controller="BuildCompareController" ng-init="init({{ project.id if project else 0 }})">
        <form>
          <div class="form-group">
            <select name="project" id="project-select" placeholder="{{ _('Enter project name') }}" onchange="this.form.submit()" class="form-control" {%if project %}disabled{% endif %}>
            {% if project %}<option>{{ project.full_name }}</option>{% endif %}
            </select>
          </div>
          {% if project %}
          <div class="form-group">
            <label for="baseline_build">{{ _('Compare build') }}</label>
            <div class="input-group col-md-12">
              <select id="baseline-select" name="baseline" placeholder="{{ _('Enter baseline version') }}" class="form-control"></select>
            </div>
          </div>
          <div class="form-group">
            <label for="target_build">{{ _('against build') }} </label>
            <div class="input-group col-md-12">
              <select id="target-select" name="target" placeholder="{{ _('Enter target version') }}" class="form-control"></select>
            </div>
          </div>
          <div class="form-group">
            <label>{{ _('Comparison type') }}</label>
            <div>
              <input id="test-comparison" name="comparison_type" type="radio" value="test" checked="checked"/>
              <label for="test-comparison">{{ _('compare by tests') }}</label>
              <br />
              <input id="metric-comparison" name="comparison_type" type="radio" value="metric" />
              <label for="metric-comparison">{{ _('compare by metrics') }}</label>
            </div>
          </div>
          <div class="form-group">
            <input type="hidden" name="project" value="{{ project.full_name }}" />
            <input onclick="this.form.submit()" value="{{ _('Compare') }}" type="button" class="btn btn-default" />
            <input onclick='window.location="{{ request.path }}"' value="{{ _('Start over') }}" type="button" class="btn btn-default" />
          </div>
          {% endif %}
        </form>
      </div>
    </div>
  {% endif %}
{% endblock %}

{% block javascript %}
  <script type="text/javascript" src='{{static("squad/table.js")}}'></script>
  <script type="text/javascript" src='{{static("select2.js/select2.min.js")}}'></script>
  <script type="module" src='{{static("squad/build_compare.js")}}'></script>
{% endblock %}

{% block styles %}
<link href='{{static("select2.js/select2.css")}}' rel="stylesheet" />
{% endblock %}
