{% extends "base.html" %}

{% block head %}
  <link rel="stylesheet" href="/static/css/messages.css">
  <script>let url = "/api/user/{{ username }}/?resp";</script>
{% endblock %}

{% block body %}
  <h1>{{ username }}'s Messages</h1>
  <p><a href="/m/{{ username }}">Message {{ username }}</a></p>

  <hr>
  <p><button id="refresh" onclick="fetchMessages(true);">Refresh</button></p>
  <p id="switch">
    <a data-url="/api/user/{{ username }}/?all" data-id="all"  class="not-bold" href="javascript:(() => { updateURL('all');  })()">All messages</a> -
    <b data-url="/api/user/{{ username }}/"     data-id="resp"                  href="javascript:(() => { updateURL('resp'); })()">With response</b>
  </p>
  <div id="messages"><i class="delete-if-more-messages">Loading...</i></div>
  <p><button hidden id="more-button" onclick="fetchMessages(false);">Load more</button><p>

  <hr>

  {% if self_username %}
    <p>Logged in as <a href="/u/{{ self_username }}/">{{ self_username }}</a></p>
    <p><a href="/messages/">View your messages</a></p>
  {% else %}
    Not logged in.
    {% if config.new_users %}<a href="{{ config.services.auth.url.pub }}/signup/">Sign up</a>{% else %}<a href="{{ config.services.auth.url.pub }}/login/">Log in</a>{% endif %}?
  {% endif %}

  <script src="{{ config.services.common.url.pub }}/static/js/base.js?v={{ config.version_str }}"></script>
  <script src="/static/js/messages.js?v={{ config.version_str }}"></script>
{% endblock %}