{% extends 'allianceauth/base.html' %}

{% load i18n %}
{% load bootstrap %}
{% load static %}

{% block page_title %}{% trans 'Fleet Activity' %}{% endblock %}

{% block content %}
        <div class="col-lg-12">
            <br>
            {% include "afat/menu.html" %}

            {% if msg_code == 200 %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Success!" %}</h4>

                    <p>&#9642; {% trans "FAT Link Created!" %}</p>
                    <p>&#9642; {% trans "FATs have been queued, they may take a few mins to show up." %}</p>
                </div>
            {% elif msg_code == 403 %}
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Not Fleet Boss!" %}</h4>

                    <p>&#9642; {% trans "FAT Link created. Please upload a flatlist using the flatlist tab to generate FATs for fleet members." %}</p>
                </div>
            {% elif msg_code == 404 %}
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Not in Fleet!" %}</h4>

                    <p>&#9642; {% trans "FAT Link created. The character used to create this FAT Link is not in a fleet. In order to generate FATs for fleet members, please upload a flatlist using the flatlist tab." %}</p>
                </div>
            {% elif msg_code == 0 %}
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Oh No!" %}</h4>

                    <p>{% trans "Something went wrong!" %}</p>
                </div>
            {% elif msg_code == 202 %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Success!" %}</h4>

                    <p>&#9642; {% trans "Clickable FAT Link Created!" %}</p>
                    <p>&#9642; {% trans "Make sure to give your fleet members the following link to click so that they get credit for this fleet." %}</p>
                    <p>&#9642;
                        Link:
                        <i>
                            {{ request.scheme }}://{{ request.get_host }}{% url 'afat:link_click' link.hash %}
                            <a id="copy-link" href="{% url 'afat:link_click' link.hash %}" class="label label-success"></a>
                        </i>

                        <button class="copy-btn btn btn-success btn-sm" data-toggle="tooltip" data-html="true" title="Copied!" data-clipboard-text="{{ request.scheme }}://{{ request.get_host }}{% url 'afat:link_click' link.hash %}">
                            Copy me!
                        </button>
                    </p>
                </div>
            {% elif msg_code == 1 %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Success!" %}</h4>

                    <p>{% trans "Fleet name successfully changed." %}</p>
                </div>
            {% elif msg_code == 2 %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Success!" %}</h4>

                    <p>&#9642; {% trans "FATs successfully queued from flatlist." %}</p>
                    <p>&#9642; {% trans "FATs may take a few mins to show up." %}</p>
                </div>
            {% elif msg_code == 3 %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Success!" %}</h4>

                    <p>{% trans "Manual FAT processed." %}</p>
                </div>
            {% elif msg_code == 4 %}
                <div class="alert alert-danger alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <h4>{% trans "Oh No!" %}</h4>

                    <p>{% trans "Manual FAT processing failed! The character name you entered was not found." %}</p>
                </div>
            {% elif msg_code == 999 %}
                <div class="alert alert-{{ message.0 }} alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>
                    <h4>
                        {% if msg.0 == 'danger' %}
                            {% trans "Oh No!" %}
                        {% elif msg.0 == 'success' %}
                            {% trans "Success!" %}
                        {% endif %}
                    </h4>
                    <p>{{ message.1 }}</p>
                </div>
            {% endif %}

            {% if debug %}
                <div class="alert alert-success alert-dismissible" role="alert">
                    <button type="button" class="close" data-dismiss="alert" aria-label="close">
                        <span aria-hidden="true">&times</span>
                    </button>

                    <p>{{ debug }}</p>
                </div>
            {% endif %}

            <h2>{% trans "Edit FAT Link" %}</h2>
            <div class="col-md-12">
                <div class="row">
                    <form class="form" role="form" action="" method="POST">
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder='{% trans "Fleet Name" %}' name="fleet" id="fleet" {% if link.fleet %}value="{{ link.fleet }}" {% endif %}>

                                    <span class="input-group-btn">
                                        <button class="btn btn-primary" type="submit" name="set_name">{% trans "Set Name" %}</button>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </form>

                    <div class="col-md-2">{% trans "Creator:" %} {{ link.creator.profile.main_character.character_name }}</div>
                    <div class="col-md-2 col-md-offset-8">{% trans "Time:" %} {{ link.afattime }}</div>

                    <div class="col-md-10">
                        <p>Link:
                            <i>
                                {{ request.scheme }}://{{ request.get_host }}{% url 'afat:link_click' link.hash %}
                                <a id="copy-link" href="{% url 'afat:link_click' link.hash %}" class="label label-success"></a>
                            </i>

                            <button class="copy-btn btn btn-success btn-sm" data-toggle="tooltip" data-html="true" title='{% trans "Copied!" %}' data-clipboard-text="{{ request.scheme }}://{{ request.get_host }}{% url 'afat:link_click' link.hash %}">
                                {% trans "Copy me!" %}
                            </button>
                        </p>
                    </div>
                </div>
            </div>

            <ul class="nav nav-tabs">
                <li class="active"><a data-toggle="tab" class="tab" href="#FATs">{% trans "FATs" %}</a></li>
                <li>{% if perms.afat.add_afat %}<a data-toggle="tab" class="tab" href="#manualfat">{% trans "Manual FAT" %}</a>{% endif %}</li>
                <li><a data-toggle="tab" class="tab" href="#flatlist">{% trans "Raw Data" %}</a></li>
            </ul>

            <div class="tab-content">
                <div id="FATs" class="tab-pane fade in active panel-default">
                    <div class="panel-body">
                         <h4>{% trans "FATs for this FAT Link" %}</h4>

                         <table class="table" id="fat-chars">
                             <thead>
                                <th>{% trans "Character" %}</th>
                                <th>{% trans "Location" %}</th>
                                <th>{% trans "Ship Type" %}</th>
                                <th>{% trans "Utilities" %}</th>
                             </thead>

                             <tbody>
                                {% for fat in fats %}
                                    <tr>
                                        <td>{{ fat.character.character_name }}</td>
                                        <td>{{ fat.system }}</td>
                                        <td>{{ fat.shiptype }}</td>
                                        <td>
                                            {% if perms.afat.delete_fat %}
                                            <a class="btn btn-danger"
                                                data-toggle="modal" data-target="#deleteModal"
                                                data-url="{{ request.scheme }}://{{ request.get_host }}{% url 'afat:fat_delete' link.hash fat.id %}"
                                                data-name="{% if fat.character.character_name %}{{ fat.character.character_name }}{% else %}this pilot{% endif %}">
                                                <span class="glyphicon glyphicon-trash"></span>
                                            </a>
                                            {% endif %}
                                        </td>
                                    </tr>
                                {% endfor %}
                             </tbody>
                         </table>
                    </div>
                </div>

                <div id="flatlist" class="tab-pane fade in panel-default">
                    <div class="panel-body">
                        <h4>{% trans "FAT Link Raw Data" %}</h4>
                        <div class="form-group">
                            <textarea class="form-control" name="flatlist" rows="10" id="flatlist" readonly>{% if flatlist %}{{ flatlist }}{% endif %}</textarea>
                        </div>
                    </div>
                </div>

                <div id="manualfat" class="tab-pane fade in panel-default">
                    <div class="panel-body">
                        <h4>{% trans "Manual FAT" %}</h4>

                        <p>
                            {% trans "Is someone missing from the list of FATs? Use this form to add them." %}
                            <br />
                            <strong>{% trans "Note:" %}</strong> {% trans "This action is logged!" %}
                        </p>

                        <form class="form" role="form" action="" method="POST">
                            {% csrf_token %}
                            <div class="form-group">
                                <div class="row">
                                    <div class="col-md-12">
                                        <input type="text" class="form-control" id="character_name" name="character" placeholder='{% trans "Character Name" %}' required>
                                    </div>
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="row">
                                    <div class="col-md-6">
                                        <input type="text" class="form-control" id="location" name="system" placeholder='{% trans "System" %}'>
                                    </div>

                                    <div class="col-md-6">
                                        <input type="text" class="form-control" id="shiptype" name="shiptype" placeholder='{% trans "Ship Type" %}'>
                                    </div>
                                </div>
                            </div>

                            <button class="btn btn-primary btn-block" type="submit" name="manual_fat">{% trans "Add Manual FAT" %}</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Delete FAT Modal -->
    <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalLongTitle">{% trans "Delete FAT" %}</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>

                <div class="modal-body"></div>

                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">{% trans "Cancel" %}</button>

                    <a id="fat-link" class="btn btn-danger" role="button" href="">{% trans "Delete" %}</a>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block extra_javascript %}
    {% include 'bundles/datatables-js.html' %}

    <script type="text/javascript" src="{% static 'afat/javascript/clipboard-js/clipboard.min.js' %}"></script>
{% endblock %}

{% block extra_css %}
    {% include 'bundles/datatables-css.html' %}
{% endblock %}

{% block extra_script %}
    $(document).ready(function(){
        $('#fat-chars').DataTable();

        var clipboard = new ClipboardJS('.copy-btn');

        clipboard.on('success', function(e) {
            $('.copy-btn').tooltip('show');
        });

        $('#deleteModal').on('show.bs.modal', function (event) {
            var button = $(event.relatedTarget) // Button that triggered the modal
            var url = button.data('url') // Extract info from data-* attributes
            var name = button.data('name');

            var modal = $(this)
            modal.find('#fat-link').attr("href", url)
            modal.find('.modal-body').text('{% trans "Are you sure you want to delete" %} ' + name + '?');
        });
    });
{% endblock %}
