{% extends 'skillfarm/base.html' %}
{% load i18n %}
{% load humanize %}
{% load static %}
{% load sri %}

{% block title %}{{ page_title }} - {{ block.super }}{% endblock title %}

{% block page_topic %}<h1 class="page-header text-center">{{ page_title }}</h1>{% endblock page_topic %}

{% block skillfarm_block %}
    <!-- Active Characters -->
    <div class="card">
        <div class="card-header bg-primary rounded-top">
            <h3>{% translate "Active Characters" %} </h3>
        </div>
        <div class="card-body tab-content rounded-bottom">
            <i class="fa-solid fa-exclamation-triangle text-warning"></i>
            <span class="text-muted font-weight-bold">{% trans "Data will only update on change trought the client" %}</span>
            <p class="mt-2"><img src="{% static 'skillfarm/images/skillExtractor.png' %}" class="rounded-circle" style="width: 32px">{% translate "Extraction Ready:" %} <span id="skillExtractorLabel"></span></p>
            <div class="tab-content mt-2">
                {% include 'skillfarm/partials/table/active-character.html' %}
            </div>
        </div>
    </div>
    <!-- Inactive Characters -->
    <div class="pt-4">
        <div class="card">
            <div class="card-header bg-primary rounded-top">
                <h3>{% translate "Inactive Characters" %} </h3>
            </div>
            <div class="card-body tab-content rounded-bottom">
                <div class="tab-content">
                    {% include 'skillfarm/partials/table/inactive-character.html' %}
                </div>
            </div>
        </div>
    </div>
    <!-- Modal for viewing requests -->
    {% include 'skillfarm/partials/modals/accept-switch-notification.html' %}
    {% include 'skillfarm/partials/modals/accept-delete-character.html' %}
    {% include 'skillfarm/partials/modals/view-skillqueue.html' %}
    {% include 'skillfarm/partials/modals/edit-skillsetup.html' %}

{% endblock %}

{% block extra_css %}
    {% include 'skillfarm/bundles/datatables-2-css.html' with extColumnControl=True %}
    {% include 'skillfarm/bundles/aa-skillfarm-css.html' %}
{% endblock %}

{% block extra_javascript %}
    <script>
        /**
         * Override settings for aaSkillfarm
         */
        const aaSkillfarmSettingsOverride = {
            // URLs
            url: {
                Skillfarm: '{% url "skillfarm:api:get_details" character_id=12345 %}',
                SkillSet: '{% url "skillfarm:api:get_skillsetup" character_id=12345 %}',
                SkillInfo: '{% url "skillfarm:api:get_skillqueue" character_id=12345 %}',
            },
        };
    </script>
    {% include 'skillfarm/bundles/aa-skillfarm-js.html' %}
    {% include 'skillfarm/bundles/datatables-2-js.html' with extColumnControl=True %}
    {% include 'skillfarm/bundles/view-skillfarm-js.html' %}
{% endblock %}