{% extends "layout/default.html" %}

{% block script %}

function download(appliance, md5sum) {
    if (gns3_button(function() {
        return gns3.download(appliance, md5sum)
    })) {
        gns3_notif("success", "You can see the download progress in the <a href=\"/downloads.html\">Downloads</a> section");
        return true;
    }
    return false;
}

{% endblock %}

{% block body %}
    <div class="jumbotron">
        {% if appliance["status"] == "broken" %}
            <div class="alert alert-danger" role="alert">
                <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
                <span class="sr-only">Error:</span>
                This appliance is actually not working
            </div>
        {% endif %}
        {% if appliance["status"] == "experimental" %}
            <div class="alert alert-warning" role="alert">
                <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
                <span class="sr-only">Error:</span>
                This appliance is actually experimental
            </div>
        {% endif %}
        <h1>{{ appliance["name"] }}</h1>
        Category {{ appliance["category"] }}<br />
        Product: <a href="{{ appliance["product_url"] }}">{{ appliance["product_name"] }}</a><br />
        Vendor: <a href="{{ appliance["vendor_url"] }}">{{ appliance["vendor_name"] }}</a><br />
        Documentation: <a href="{{ appliance["documentation_url"] }}">{{ appliance["documentation_url"] }}</a><br />
        Status: {{ appliance["status"] }}<br />
        Maintainer: <a href="mailto:{{ appliance["maintainer_email"] }}">{{ appliance["maintainer"] }}</a>

        <p>{{ appliance["description"] | nl2br }}</p>


    </div>

    {% if appliance["usage"] %}
        <h2>Usage</h2>
        <p>{{ appliance["usage"] | nl2br }}</p>
    {% endif %}

    {% if "qemu" in appliance %}
        <h2>Qemu settings</h2>
        {% for key in appliance["qemu"] %}
            {{ key }}: {{ appliance["qemu"][key] }}<br />
        {% endfor %}
    {% endif %}
    {% for version in appliance["versions"] | reverse %}
        <h2>{{ appliance["name"] }} {{version["name"]}}</h2>
        <button class="btn btn-primary btn-lg" type="button" onclick='gns3_button(function() { return gns3.install("{{appliance|jsonify|b64encode}}", "{{version["name"]}}") })'>Install</button>
        <h3>Require files</h3>
        {% for image in version.images.values() %}
            <h4>{{image["filename"]}}</h4>
            Slot: {{image["type"]}}<br />
            File Version: {{image["version"]}}<br />
            Size: {{ image["filesize"] | human_filesize}}<br />
            Checksum: {{image["md5sum"]}}<br />
            Download url: <a href="{{image["download_url"]}}">{{image["download_url"]}}</a><br />
            {% if "direct_download_url" in image %}
                Direct download url: <a href="{{image["direct_download_url"]}}">{{image["direct_download_url"]}}</a><br />
                <button class="btn btn-primary btn-lg" type="button" onclick='return download("{{appliance|jsonify|b64encode}}", "{{image["md5sum"]}}")'>Download</button>
            {% endif %}
            <button class="btn btn-primary btn-lg" type="button" onclick="gns3_button(function() { return gns3.importAppliance(); })">Import file</button> 
            <hr />
        {% endfor %}
    {% endfor %}
{% endblock %}