{% extends "minecraft_manager/dashboard.html" %}
{% load csrf_html %}
{% block title %}Player {{ player.username }}{% endblock %}
{% block section %}
<div id="content">
  <h2 class="sub-header">Player Info ({{ player.username }})</h2>
  <div class="row">
      <div class="col-xs-9 col-md-6">
          <p>UUID: <code>{{ player.uuid }}</code> <button data-copy="{{ player.uuid }}" class="btn btn-xs btn-primary"><i class="glyphicon glyphicon-copy"></i></button></p>
          {% if player.auth_user %}
              <p>Connected User: {{ player.auth_user.username }}</p>
          {% endif %}
          {% if player.application %}
              <p>Application: <a href="{% url "application" %}{{ player.application.id }}">{{ player.application.username }}</a></p>
          {% endif %}
          <p>Donor Status: {{ player.donor_status }}</p>
          <p>First Seen: {{ player.first_seen }}</p>
          <p>Last Seen: {{ player.last_seen }}</p>
          <p>Banned: {% if player.is_banned %}<span class="label label-danger">Yes</span>{% else %}<span class="label label-success">No</span>{% endif %}</p>
      </div>
      <div class="col-xs-9 col-md-6">
          <h4>Tickets</h4>
          <table class="table table-striped table-hover link-table">
              <thead>
              <tr>
                  <td>ID</td>
                  <td>Message</td>
                  <td>Resolved</td>
                  <td>Attachments</td>
              </tr>
              </thead>
              <tbody>
              {% if form.tickets %}
                  {% for ticket in form.tickets %}
                      <tr data-id="{{ ticket.id }}" data-url="{% url "ticket" %}">
                          <td>{{ ticket.id }}</td>
                          <td>{{ ticket.snippet }}</td>
                          <td>
                              {% if ticket.resolved is True %}
                                  <span><i class="glyphicon glyphicon-ok-circle text-success"></i></span>
                              {% else %}
                                  <span><i class="glyphicon glyphicon-remove-circle text-danger"></i></span>
                              {% endif %}
                          </td>
                          <td>
                              {% for note in ticket.notes %}
                                  {% for attachment in note.attachments %}
                                      <a href="{% url 'attachment' attachment.id %}">{{ attachment.file_name }}</a> ({{ note.author.username }})<br/>
                                  {% endfor %}
                              {% endfor %}
                          </td>
                      </tr>
                  {% endfor %}
              {% else %}
                  <tr><td colspan="3">No Tickets Found</td></tr>
              {% endif %}
              </tbody>
          </table>
          <br/>
          <h4>Notes</h4>
          <table class="table table-striped table-hover link-table">
              <thead>
              <tr>
                  <td>Message</td>
                  <td>Importance</td>
                  <td>Attachments</td>
              </tr>
              </thead>
              <tbody>
              {% if form.notes %}
                  {% for note in form.notes %}
                      <tr data-id="{{ note.id }}" data-url="{% url "note" %}">
                          <!-- {{ note.id }} -->
                          <td>{{ note.snippet }}</td>
                          <td>
                              <span class="label label-{% if note.importance == 'L' %}info{% elif note.importance == 'M' %}warning{% elif note.importance == 'H' %}danger{% endif %}">
                                  {{ note.importance_display }}
                              </span>
                          </td>
                          <td>
                              {% for attachment in note.attachments %}
                                  <a href="{% url 'attachment' attachment.id %}">{{ attachment.file_name }}</a>
                                  {% if note.staff %}({{ note.staff.username }}){% endif %}
                                  <br/>
                              {% endfor %}
                          </td>
                      </tr>
                  {% endfor %}
              {% else %}
                  <tr><td colspan="3">No Notes Found</td></tr>
              {% endif %}
              </tbody>
          </table>
          <a class="btn btn-primary" href="{% url 'note_add' %}?player={{ player.id }}">Add Note</a>
          <br/><br/>
          <h4>IPs</h4>
          <table class="table table-striped table-hover link-table">
              <thead>
              <tr>
                  <th>IP</th>
                  <th>Last Used</th>
                  <th>Associated Users</th>
              </tr>
              </thead>
              <tbody>
              {% if form.ips %}
                  {% for ip in form.ips %}
                      <tr class="default" data-id="" data-url="{% url 'ip' ip.id %}">
                          <!-- {{ ip.id }} -->
                          <td>{{ ip.ip }}</td>
                          <td>{{ ip.last_used_formatted }}</td>
                          {% if ip.associated %}
                              <td>
                              {% for assoc in ip.associated %}
                                  <a href="{% url "player" %}{{ assoc.id }}">{{ assoc.username }}</a>{% if assoc.is_banned %} <span class="label label-danger">Banned</span>{% endif %}<br/>
                              {% endfor %}
                              </td>
                          {% else %}
                              <td>None</td>
                          {% endif %}
                      </tr>
                  {% endfor %}
              {% else %}
                  <tr><td colspan="3">No IPs Found</td></tr>
              {% endif %}
              </tbody>
          </table>
      </div>
  </div>
</div>

<script>
document.querySelectorAll('[data-copy]').forEach((elem) => {
    elem.addEventListener('click', () => {
        const text = document.createElement('textarea');
        text.value = elem.dataset.copy;
        text.style.top = "0";
        text.style.left = "0";
        text.style.position = "fixed";
        document.body.appendChild(text);
        text.focus();
        text.select();
        document.execCommand('copy');
        text.remove();
    });
});
</script>
{% endblock section %}
