{% extends 'base.html' %}
{% load ui_extras %}

{% block content %}
<ol class="breadcrumb">
  <li class="breadcrumb-item"><a href="/">Home</a></li>
  {% for url, anchor_text in breadcrumbs %}
  {% if url %}
  <li class="breadcrumb-item"><a href="{{ url }}">{{ anchor_text }}</a>
  {% else %}
  <li class="breadcrumb-item active">{{ anchor_text }}</li>
  {% endif %}
  {% endfor %}
</ol>

<div class="d-flex justify-content-between mb-3">
    <h2 class="mb-0">{{ title }}</h2>
</div>

<div class="d-flex flex-wrap align-items-center mb-1">
    <form method="GET" class="search-form">
        
        {{ search_form }}

        <button type="submit" name="action" value="search" class="btn btn-link mb-2">
            <i class="bi bi-search"></i>
        </button>
        <button type="button" class="btn btn-link dropdown-toggle mb-2"
                data-bs-toggle="dropdown" aria-expanded="false" aria-haspopup="true">
            <i class="bi bi-download"></i>
        </button>
        <ul class="dropdown-menu" aria-labelledby="downloadTargets">
            <li><a class="dropdown-item task" href="{% url 'inventory_api:android_apps_export' %}" data-format="csv" class="task">CSV</a></li>
            <li><a class="dropdown-item task" href="{% url 'inventory_api:android_apps_export' %}" data-format="xlsx" class="task">XLSX</a></li>
        </ul>
    </form>
</div>

    
    {% if object_list %}
        <h3>Result{{ total_objects|pluralize }} ({{ total_objects }})</h3>

        {% pagination next_url previous_url %}

        <table class="table table-striped align-middle table-hover">
            <thead>
            {% for header, link in table_headers %}
            <th>
                {% if link %}
                <a href="{{ link }}" style="white-space:nowrap;">{{ header }}</a>
                {% else %}
                {{ header }}
                {% endif %}
            </th>
            {% endfor %}
            </thead>
            <tbody>
            {% for android_app in object_list %}
            <tr>
            <td colspan="2">
                <a href="{{ android_app.link }}">{{ android_app.display_name|default:"-" }}</a>
            </td>
            <td>
                {{ android_app.ms_count }}
            </td>
            </tr>
            {% for version in android_app.versions %}
            <tr>
            <td style="border-top:1px dotted #ddd"><a href="{{ version.link }}">{{ version.version_name|default:"-" }} / {{ version.version_code|default:"-" }}</a></td>
            <td style="border-top:1px dotted #ddd">{{ version.source_name }}</td>
            <td style="border-top:1px dotted #ddd">{{ version.ms_count }}</td>
            </tr>
            {% endfor %}
            {% endfor %}
            </tbody>
        </table>

        {% pagination next_url previous_url %}
    {% elif search_form.is_bound %}
        {% url 'inventory:android_apps' as empty_results_url %}
        {% empty_results empty_results_url %}
    {% endif %}

{% endblock %}

    {% block extrajs %}
    <script nonce="{{ request.csp_nonce }}">
    var WAIT_FOR_TASK_TIMEOUT_ID;

    function waitForTask(url) {
        $.ajax({
        dataType: "json",
        url: url,
        success: function (data) {
            console.log(data);
            if (data.unready) {
            WAIT_FOR_TASK_TIMEOUT_ID = window.setTimeout(waitForTask, 1000, url);
            } else if (data.status === "SUCCESS") {
            window.location = data.download_url;
            }
        }
        });
    }

    function launchTask($link) {
        var url = $link.attr("href");
        var postData = {"export_format": $link.data("format")};
        var formData = $link.parents("form").serializeArray();
        $.map(formData, function(n, i) {
        if (n['value']) {
            postData[n['name']] = n['value'];
        }
        });
        $.ajax({
        dataType: "json",
        contentType: "application/json",
        url: url,
        data: JSON.stringify(postData),
        method: "post",
        success: function (data) {
            WAIT_FOR_TASK_TIMEOUT_ID = window.setTimeout(waitForTask, 300, data.task_result_url);
        }
        });
    }

    $(document).ready(function () {
        $(".task").click(function (event) {
        event.preventDefault();
        launchTask($(this));
        });
    });
    </script>
{% endblock %}