{% extends "base.html" %}

{% set active_page = "Database" %}


{% block body %}


<div class="row justify-content-center">
    <div class="col-xl-6 col-lg-8 mt-4">

        <h3 class="mb-3">Add Comment</h3>
        <h6>for {{ uid | replace_uid_with_hid_link | safe }}</h6>
        {% if error %}
            <h3 class="text-danger">Error: UID not found in database</h3>
        {% endif %}
    </div>
</div>

<div class="row justify-content-center">
    <div class="col-xl-6 col-lg-8 mt-4">
        <form class="form-horizontal" action="" method=post enctype=multipart/form-data>

            <div class="form-group row">
                <label class="control-label col-sm-2" for="comment">
                    Comment:
                </label>
                <div class="col-xs-12 col-sm-10">
                    <textarea name="comment" rows="5" style="resize: vertical; position: relative; z-index: 1;" required autofocus class="form-control" id="comment"></textarea>
                </div>
            </div>

            <div class="form-group row">
                <label class="control-label col-sm-2" for="author">
                    Author:
                </label>
                <div class="col-xs-12 col-sm-10">
                    <input type="text" name="author" class="form-control" id="author" required style="position: relative; z-index: 1;" value="anonymous">
                </div>
            </div>

            {% if current_user.is_authenticated %}
                <script type="text/javascript">
                    document.getElementById('author').value = '{{ current_user.email }}';
                    document.getElementById('author').setAttribute("readonly", true);
                </script>
            {% endif %}

            <div class="form-group row">
                <div class="col-sm-10 offset-sm-2">
                    <button type="submit" value=submit class="btn btn-primary" id="input_submit"
                    {% if error %} disabled {% endif %}>
                        <span class="fas fa-edit"></span> add comment
                    </button>
                </div>
            </div>

            <div class="form-group row">
                <div class="col-sm-10 offset-sm-2">
                    <p style="color:grey">Please note: it will take some time before the comment is saved and will show up on the page. Please try reloading the analysis page after a short while.</p>
                </div>
            </div>

        </form>

    </div>
</div>
{% endblock %}