{% extends "base.html" %}
{% load bootstrap4 %}
{% load widget_tweaks %}
{% block title %}Tags Management{% endblock title %}

{% block content %}
<br><br>
<section class="page-section" id="services">
    <div class="container">
        {% include "project_navbar.html" %}
        <h2><b>{{selected_project.name}}</b> Project Tags</h2>
        <br>
            <div class="row">
                <div class="col-md-12 bg-light text-right">
                    {% if pid %}
                    <a class="btn btn-sm btn-info" href="{% url 'qmds:tags_change' %}{{ pid }}/">Add New</a>
                    <a class="btn btn-sm btn-primary" href="{% url 'qmds:tags_recreate' %}{{ pid }}/">Create All</a>
                    <a class="btn btn-sm btn-danger" href="{% url 'qmds:tags_delete' %}{{ pid }}/">Delete All</a>
                    {%endif%}
                </div>
            </div>
            <br>
            {% for section_title, tagmap_formset, tagname_map_formset in extensive_form_list %}
            <div class="row">
                <div class="col-md-9">
                    <h2>{{ section_title }}</h2>
                </div>
                <div class="col-md-1">
                    <form method="post">
                    <input class="btn btn-sm btn-primary" type="submit" value="Save">
                </div>
                <div class="col-md-1">
                    <a class="btn btn-sm btn-info" href="{% url 'qmds:tags_recreate' %}{{ pid }}/{{ section_title }}/">Create</a>
                </div>
                <div class="col-md-1">
                    <a class="btn btn-sm btn-danger" href="{% url 'qmds:tags_delete' %}{{ pid }}/{{ section_title }}/">Delete</a>
                </div>
            </div>
            <div class="row p-2 border bg-light">
                <div class="col-md-1">#
                </div>
                <div class="col-md-5">Tag
                </div>
                <div class="col-md-5">Value
                </div>
                <div class="col-md-1">Delete
                </div>
            </div>
            {% csrf_token %}
            {{ tagmap_formset.management_form }}
            {% for tag_name, tag_id, tag_form in tagname_map_formset %}
            <div class="row p-2 border bg-light">
                <div class="col-md-1">
                    <a class="btn btn-sm btn-success" href="{% url 'qmds:tags_change' %}{{ pid }}/{{ tag_id }}/">{{ forloop.counter }}</a>
                </div>
                <div class="col-md-5">
                    {% render_field tag_form.tag hidden=True %}
                    {{  tag_name }}
                </div>
                <div class="col-md-5">
                    {% render_field tag_form.value size=50  %}
                    {% if tag_form.value.errors %}
                        {% for error in tag_form.value.errors %}
                            {{ error|escape }}
                        {% endfor %}
                    {% endif %}
                </div>
                <div class="col-md-1">
                    {% render_field tag_form.project hidden=True %}
                    <a class="btn btn-sm btn-danger" href="{% url 'qmds:tags_delete' %}{{ pid }}/{{ tag_id }}/">X</a>
                </div>
            </div>
            {% endfor %}                
            </form>
            <br>
            {% endfor %}
    </div>
</section>
<script>
document.addEventListener("DOMContentLoaded", function (event) {
    var scrollpos_tags = sessionStorage.getItem('scrollpos_tags');
    if (scrollpos_tags) {
        window.scrollTo(0, scrollpos_tags);
        sessionStorage.removeItem('scrollpos_tags');
    }
});

window.addEventListener("beforeunload", function (e) {
    sessionStorage.setItem('scrollpos_tags', window.scrollY);
});
</script>
{% endblock content %}