{% extends 'base_assets.html' %}
{% load static %}
{% load paginator from filters %}
{% load widget_tweaks %}

{% block js %}
    <script>
    $('document').ready(function(){
        $('#asset-search-form').submit(function () {
         $('#searchButton').focus().click();
         return false;
        });
        $('#searchButton').click(function (e) {
             e.preventDefault();
             var url = "{% url 'asset_audit' None %}".replace('None', $("#{{form.q.id_for_label}}").val());
             $.ajax({
                url: url,
                success: function(){
                    $link = $(this);
                    // Anti modal inception
                    if ($link.parents('#modal').length === 0) {
                        modaltarget = $link.data('target');
                        modalobject = "";
                        $('#modal').load(url, function (e) {
                            $('#modal').modal();
                        });
                    }
                },
                error:function(){
                    $("#error404").attr("hidden", false);
                }
             });
        });
    });
    function onAuditClick(assetID) {
         $('#' + assetID).remove();
    }
    $('#modal').on('hidden.bs.modal', function (e) {
      searchbar = document.getElementById('id_q');
      searchbar.value = "";
      setTimeout(searchbar.focus(), 2000);
    })
    </script>
{% endblock %}

{% block content %}
<div id="error404" class="alert alert-danger alert-dismissable" hidden=true>
	<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
	<span>Asset with that ID does not exist!</span>
</div>

<form id="asset-search-form" class="mb-3" method="GET">
  <div class="form-group form-row">
      <h3>Audit Asset:</h3>
      <div class="input-group input-group-lg">
        {% render_field form.q|add_class:'form-control' placeholder='Enter Asset ID' autofocus="true" %}
        <div class="input-group-append">
            <label for="q" class="sr-only">Asset ID:</label>
            <a id="searchButton" class="btn btn-primary" class="submit" type="submit">Search</a>
        </div>
      </div>
  </div>
</form>

<h3>Assets Requiring Audit:</h3>
{% include 'partials/asset_list_table.html' with audit="true" %}

{% if is_paginated %}
<div class="text-center">
  {% paginator %}
</div>
{% endif %}
{% endblock %}