{% extends 'layouts/base.html' %}

{% set active_menu = 'osimages' %}
{% set page_title = 'OS Image Recipes' %}

{% block body_header %}
<h1 class="title mb-4">OS Image Recipes</h1>
{% endblock %}

{% block body %}
<div class="columns is-multiline is-mobile">
    <div class="column is-8">

    {% for recipe in recipes %}
    <nav class="panel">
        <p class="panel-heading">
            <i class="fas {{ 'fa-compact-disc' if recipe.format == ImageFormat.ISO else 'fa-sd-card' }}"></i>
            &nbsp;{{recipe.distribution}} {{recipe.suite}} {{recipe.environment}} ({{recipe.style}})
        </p>
        <div class="panel-block">
          <p>
            <b>ID:</b> {{recipe.name}}<br/>
            <b>Architectures:</b> {{' ,'.join(recipe.architectures)}}<br/>
            <b>Host Architecture:</b> {{recipe.host_architecture}}<br/>
            <b>Source:</b> {{recipe.git_url}}<br/>
          </p>
        </div>

        {% for job in last_jobs_for_recipe(session, recipe) %}
        {% if job.result == JobResult.SUCCESS %}
            {% set item_style = 'has-background-success-light' %}
        {% elif job.result == JobResult.FAILURE %}
            {% set item_style = 'has-background-danger-light' %}
        {% endif %}
        <a class="panel-block {{item_style}}" href="{{ url_for('jobs.job', uuid=job.uuid) }}">
            [{{job.architecture}}] - {{humanized_timediff(job.time_created)}}
        </a>
        {% endfor %}
    </nav>
    {% endfor %}

    </div>
</div>
{% endblock %}