{% extends "base.html" %}
{% load projecttags %}
{% load project_url_tag %}
{% load objects_to_dictionaries_filter %}
{% load humanize %}
{% block pagecontent %}
  <!-- breadcrumbs -->
  <div class="section">
    <ul class="breadcrumb" id="breadcrumb">
      <li><a href="{% project_url build.project %}">{{build.project.name}}</a></li>
      {% if not build.project.is_default %}
        <li><a href="{% url 'projectbuilds' build.project.id %}">Builds</a></li>
      {% endif %}
      <li>
        {% block parentbreadcrumb %}
          <a href="{%url 'builddashboard' build.pk%}">
            {{build.get_sorted_target_list.0.target}} {% if build.target_set.all.count > 1 %}(+{{build.target_set.all.count|add:"-1"}}){% endif %} {{build.machine}} ({{build.completed_on|date:"d/m/y H:i"}})
          </a>
        {% endblock %}
      </li>
      {% block localbreadcrumb %}{% endblock %}
    </ul>
    <script>
      $( function () {
        $('#breadcrumb > li').append('<span class="divider">&rarr;</span>');
        $('#breadcrumb > li:last').addClass("active");
        $('#breadcrumb > li:last > span').remove();
      });
    </script>
  </div>

  <div class="row-fluid">
    <!-- begin left sidebar container -->
    <div id="nav" class="span2">
      <ul class="nav nav-list well">
        <li
          {% if request.resolver_match.url_name == 'builddashboard'  %}
            class="active"
          {% endif %} >
          <a class="nav-parent" href="{% url 'builddashboard' build.pk %}">Build summary</a>
        </li>
        {% if build.target_set.all.0.is_image and build.outcome == 0 %}
          <li class="nav-header">Images</li>
          {% block nav-target %}
            {% for t in build.get_sorted_target_list %}
              <li><a href="{% url 'target' build.pk t.pk %}">{{t.target}}</a><li>
            {% endfor %}
          {% endblock %}
        {% endif %}
        <li class="nav-header">Build</li>
        {% block nav-configuration %}
          <li><a href="{% url 'configuration' build.pk %}">Configuration</a></li>
        {% endblock %}
        {% block nav-tasks %}
          <li><a href="{% url 'tasks' build.pk %}">Tasks</a></li>
        {% endblock %}
        {% block nav-recipes %}
          <li><a href="{% url 'recipes' build.pk %}">Recipes</a></li>
        {% endblock %}
        {% block nav-packages %}
          <li><a href="{% url 'packages' build.pk %}">Packages</a></li>
        {% endblock %}
          <li class="nav-header">Performance</li>
        {% block nav-buildtime %}
          <li><a href="{% url 'buildtime' build.pk %}">Time</a></li>
        {% endblock %}
        {% block nav-cputime %}
          <li><a href="{% url 'cputime' build.pk %}">CPU usage</a></li>
        {% endblock %}
        {% block nav-diskio %}
          <li><a href="{% url 'diskio' build.pk %}">Disk I/O</a></li>
        {% endblock %}

        <li class="divider"></li>

        <li>
          <p class="navbar-btn">
            <a class="btn btn-block" href="{% url 'build_artifact' build.id 'cookerlog' build.id %}">
              Download build log
            </a>
          </p>
        </li>

        {% with build.get_custom_image_recipes as custom_image_recipes %}
          {% if custom_image_recipes.count > 0 %}
            <!-- edit custom image built during this build -->
            <li>
              <p class="navbar-btn" data-role="edit-custom-image-trigger">
                <button class="btn btn-block">Edit custom image</button>
                {% include 'editcustomimage_modal.html' %}
                <script>
                  var editableCustomImageRecipes = {{ custom_image_recipes | objects_to_dictionaries:"id,name" | json }};

                  $(document).ready(function () {
                    var editCustomImageTrigger = $('[data-role="edit-custom-image-trigger"]');
                    var editCustomImageModal = $('#edit-custom-image-modal');

                    // edit custom image which was built during this build
                    editCustomImageTrigger.click(function () {
                      // single editable custom image: redirect to the edit page
                      // for that image
                      if (editableCustomImageRecipes.length === 1) {
                        var url = '{% url "customrecipe" build.project.id custom_image_recipes.first.id %}';
                        document.location.href = url;
                      }
                      // multiple editable custom images: show modal to select
                      // one of them for editing
                      else {
                        editCustomImageModal.modal('show');
                      }
                    });
                  });
                </script>
              </p>
            </li>
          {% endif %}
        {% endwith %}

        <li>
          <!-- new custom image from image recipe in this build -->
          <p class="navbar-btn" data-role="new-custom-image-trigger">
            <button class="btn btn-block">New custom image</button>
          </p>
          {% include 'newcustomimage_modal.html' %}
          <script>
            // imageRecipes includes both custom image recipes and built-in
            // image recipes, any of which can be used as the basis for a
            // new custom image
            var imageRecipes = {{ build.get_image_recipes | objects_to_dictionaries:"id,name" | json }};

            $(document).ready(function () {
              var newCustomImageModal = $('#new-custom-image-modal');
              var newCustomImageTrigger = $('[data-role="new-custom-image-trigger"]');

              // show create new custom image modal to select an image built
              // during this build as the basis for the custom recipe
              newCustomImageTrigger.click(function () {
                if (!imageRecipes.length) {
                  return;
                }

                newCustomImageModalSetRecipes(imageRecipes);
                newCustomImageModal.modal('show');
              });
            });
          </script>
        </li>
      </ul>

    </div>
    <!-- end left sidebar container -->

    <!-- begin right container -->
    {% block buildinfomain %}{% endblock %}
    <!-- end right container -->
  </div>
{% endblock %}