{% extends 'base.html' %} {% load bootstrap_tags %} {% block head %} <script> $(function () { {% if form.errors %} $('#create-post-modal').modal(show = true); {% endif %} $('#my-posts').popover({ title: 'My Posts', placement: 'bottom', html: true, content: '<ul class="list-group">{% if myPosts.count == 0 %}None{% endif %}{% for post in myPosts %}<a href="{% url 'post' post.id %}" class="list-group-item list-group-item-action">{{ post.title }}</a>{% endfor %}</ul>' }); $('#createPostButton').click(function () { $('#createPost').submit(); }); }); </script> {% endblock %} {% block body %} <div class="container-fluid bg-dark-primary"> <div class="container py-3"> <div class="row"> <div class="col-12"> <div class="float-right"> {% if request.user.is_authenticated %} <i id="my-posts" class="curs-pointer text-white fa fa-comments fa-2x mr-2"></i> {% endif %} {% if perms.forum.add_post %} <i id="create-post" class="curs-pointer text-white fa fa-plus fa-2x" data-toggle="modal" data-target="#create-post-modal"></i> {% endif %} </div> </div> </div> {% if threads %} <div class="row mb-3"> <div class="col-12"> <h3 class="text-white">Threads</h3> <ul class="list-group"> {% for thread in threads %} <a href="{% url 'forum' thread.id %}" class="list-group-item list-group-item-action">{{ thread.topic }}</a> {% endfor %} </ul> </div> </div> {% endif %} {% if posts %} <div class="row"> <div class="col-12"> <h3 class="text-white d-inline">{% if thread %}"{{ thread }}" {% endif %}Posts</h3> <ul class="list-group"> {% for post in posts %} <a href="{% url 'post' post.id %}" class="list-group-item list-group-item-action"> {% if post.resolved %}<span class="badge badge-danger">Closed</span> {% endif %} {{ post.title }} <span class="float-right text-muted">{{ post.creator }}, {{ post.created | date }}</span> </a> {% endfor %} </ul> </div> </div> {% endif %} </div> </div> <div id="create-post-modal" class="modal fade" tabindex="-1" role="dialog"> <div class="modal-dialog modal-lg" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Create New Post</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <form id="createPost" method="post"> {% csrf_token %} {{ form | as_bootstrap }} </form> </div> <div class="modal-footer"> <button id="createPostButton" type="button" class="btn btn-primary">Create</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> </div> </div> </div> </div> {% endblock %}