{% extends "base_generic.html" %}
{% load static %}
{% load tz %}
{% block meta %}
<meta id="_token" content="{{ csrf_token }}">
{% endblock %}

{% get_current_timezone as TIME_ZONE %}
{% block headbar %}
{{ request.user.shown_name }} (<a href="/user/{{ request.user.username}}">My timeline</a>) - <a href="/account/config">Configs</a> - <a href="/account/logout">Log out</a>
{% endblock %}

{% block content %}
<form method="POST" id="posting-form">
    {% csrf_token %}
    <div class="posting-form-group">

      <textarea id="post_text" name="post_text" placeholder="What do you want to post?"
      maxlength="500" style="resize: none;"  oninput="auto_expand(this)"></textarea>
    </div>

    {% csrf_token %} 

    <label for="privilege">Privileges:</label>

    <select name="privilege" id="privil_choosing">
      <option value="public" selected>Public Timeline</option>
      <option value="unpublic">Not in Public Timeline</option>
      <option value="private">Private</option>
    </select> 

    <button id="submit_post"  type="button" class="btn">Kóng!</button>
  </form>

  <div id="public_timeline">
    <div id="new_post_notifier" value=""></div>
    <div id="latest_time" style="display: block;">{{latest_received_time|date:"Y-m-d H:i:s.u"}}+0000</div>

    {% for public_post in public_timeline_info %}

  <div id="post-{{public_post.0.id}}" class="post">
    <img class="timeline-avatar-img" src="{{public_post.0.poster.avatar.url}}">
    <div class="post-content">
    <a href="/user/{{public_post.0.poster}}">{{public_post.0.poster.shown_name}}</a>
    at <a href="/post/{{public_post.0.id}}" class="post-time">{{public_post.0.post_time|date:"Y-m-d H:i:s.u"}}+0000</a><br/>
    {{public_post.0.text|linebreaksbr}}<br/>
    <span id="reply-{{public_post.0.id}}" data-value="{{public_post.0.id}}" class="reply">↩️</span>
    - <span id="repost-{{public_post.0.id}}" data-value="{{public_post.0.id}}" class=" {%if public_post.1 == 0 %} unchecked{% endif %} repost">🔁</span> 
    - <span id="fav-{{public_post.0.id}}" data-value="{{public_post.0.id}}" class=" {%if public_post.2 == 0 %} unchecked{% endif %} fav">⭐</span>
    </div>
</div>
  {% endfor %}
  <div id="previous_post_loader">More posts</div>
  <div id="oldest_time" style="display: block;">{{oldest_received_time|date:"Y-m-d H:i:s.u"}}+0000</div>

  </div>


  <script type="text/javascript" src="{% static 'timeline.js' %}?{% now 'U' %}">



</script>
{% endblock %}