{% extends 'standingssync/base.html' %}
{% load i18n %}
{% load humanize %}

{% block details %}

    <div class="card">
        <div class="card-body">
            <h5 class="card-title">{% translate 'Alliance for Sync' %}</h5>
            {% if alliance %}
                <img class="ra-avatar img-circle" src="{{ alliance.logo_url }}">
                &nbsp;&nbsp;
                {{ alliance.alliance_name }}
                &nbsp;
                (
                {% if alliance_contacts_count != None %}
                    {{ alliance_contacts_count }} contacts
                    {% if alliance_war_targets_count != None %}
                        ,
                    {% endif %}
                {% endif %}
                {% if alliance_war_targets_count != None %}
                    {{ alliance_war_targets_count }} war targets
                {% endif %}
                )
                {% if overflow %}
                <span class="text-danger"><i class="fas fa-exclamation-triangle"></i>
                    <strong>Sync offline: Too many contacts</strong>
                </span>
                {% endif %}

            {% else %}
                <p class="text-muted">Not configured</p>
            {% endif %}
        </div>
    </div>
    <br>

    <div class="card">
        <div class="card-body">
            <h5 class="card-title">{% translate 'Your Synced Characters' %}</h5>
            {% if has_synced_chars %}
                <table class="table table-striped" id="tab_standingssync">
                    <thead>
                        <tr>
                            <th>Name</th>
                            <th>Organization</th>
                            <th>Status</th>
                            <th>Disable</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for character in synced_characters|dictsort:"name" %}
                            {% if character.errors %}
                                <tr class="danger">
                            {% else %}
                                <tr>
                            {% endif %}
                                    <td>
                                        <img src="{{ character.portrait_url }}" class="ra-avatar img-circle">
                                        &nbsp;
                                        {{ character.name }}
                                    </td>
                                    <td>{{ character.organization }}</td>
                                    <td>
                                        {% if character.errors %}
                                            {% for error in character.errors %}
                                                <span class="text-warning">
                                                    <i class="fas fa-info-circle"></i>
                                                    {{ error }}
                                                </span><br>
                                            {% endfor %}
                                        {% else %}
                                            <i class="fas fa-check text-success"></i>
                                        {% endif %}
                                    </td>
                                    <td>
                                        <a  class="btn btn-danger"
                                            href="{% url 'standingssync:remove_character' character.pk %}"
                                            role="button">
                                            <i class="far fa-trash-alt"></i>
                                        </a>
                                    </td>
                                </tr>
                        {% endfor %}
                    </tbody>
                </table>
            {% else %}
                <p class="text-muted">None</p>
            {% endif %}
        </div>
    </div>
    <br>
    {% if alliance %}
        <a  id="standingssyncBtnAddSyncChar"
            class="btn btn-primary"
            href="{% url 'standingssync:add_character' %}">
            Add Character to Sync
        </a>
    {% else %}
        <button class="btn btn-primary" disabled="disabled">
            Add Character to Sync
        </button>
    {% endif %}

    <div class="bs-callout bs-callout-warning">
        <h3>Read Me First</h3>
        <p>Once activated this app will automatically update the personal contacts of your synced characters. Note that you can only sync out-of-alliance alts.</p>
        {% if alliance_contacts_count != None %}
            <h4>Alliance Contacts</h4>
            <p>
                All personal contacts will be replaced with alliance contacts allowing you to see alliance standings on your synced characters.
            </p>
            <p>
                <i class="fas fa-exclamation-triangle"></i> You will loose all personal contacts on your synced characters.
            </p>
        {% endif %}
        {% if alliance_war_targets_count != None %}
            <h4>War Targets</h4>
            <p>Adds current alliance war targets as personal contacts with -10 standing a personal contact to your synced characters. If the contact already exists it will be overwritten. War targets can be distinguished by having the war targets contact label.</p>
            <p><i class="fas fa-info-circle"></i>
                Please make sure to create a contact label with the name "{{ war_targets_label_name }}" on all your synced characters.
            </p>
        {% endif %}
    </div>

{% endblock %}
