{% extends 'base.jinja' %}

{% block content %}
  <h2>Add a new message:</h2>
  <form method="post" action="{{ url('messages') }}">
    {% if form_errors %}
    <div class="error">
      {{ form_errors }}
    </div>
    {% endif %}
    <p>
      <label for="username">Your name:</label>
      <input type="text" name="username" id="username" placeholder="Fred Bloggs" value="{{ username }}">
      <label for="message">Message:</label>
      <input type="text" name="message" id="message" placeholder="hello there">
      <button type="submit">Post Message</button>
    </p>
  </form>

  <h2>Messages:</h2>
  <div id="messages" data-url="{{ url('message-data') }}">
    <span class="error">messages not loading, it's possible <code>message_display.js</code> is not being served.</span>
  </div>
  <script src="{{ static('message_display.js') }}"></script>
{% endblock %}