{{/*
This file is part of SystemTestPortal.
Copyright (C) 2017  Institute of Software Technology, University of Stuttgart

SystemTestPortal is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

SystemTestPortal is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with SystemTestPortal.  If not, see <http://www.gnu.org/licenses/>.
*/}}
{{define "comments"}}
    <div class="form-group">
        {{if .SignedIn }}
            <label><strong>New Comment</strong></label>
            <div class="form-group row p-3">
                <textarea class="form-control" style="resize: none" id="inputCommentField"
                          placeholder="Leave a comment" type="text" rows="3" maxlength="250"
                          aria-describedby="commentAreaDescriptor"></textarea>
                <div class="col-md-10 p-2">
                    <small id="commentAreaDescriptor" class="form-text text-muted">
                    </small>
                </div>
                <div class="col-lg p-2">
                    <button id="submitComment" type="button" data-toggle="tooltip" title=""
                            class="btn btn-primary">Comment</button>
                </div>
            </div>
            <label><strong>Comments</strong></label>
        {{else}}
        <label><strong>Comments</strong></label>
        <p class="text-muted">
            <a data-toggle="modal" data-target="#signin-modal" href="">Sign in</a> to comment.
        </p>
        {{end}}
    </div>
    {{if .Comments}}
        <ul class="list-group" id="commentListGroup" data-children=".li">
            {{range $index, $element := .Comments}}
                <li class="list-group-item comment" id="comment{{$index}}">
                    <div class="form-group">
                        <div class="form-group row">
                            <div class="col-sm-2 d-none d-sm-block">
                                <label for="commentText" id="commentLabel">{{$element.Author.DisplayName}}</label>
                            </div>
                            <div class="col-md-10">
                                <p class="form-control-static" id="commentText">{{$element.Text}}</p>
                            </div>
                        </div>
                    </div>
                </li>
            {{end}}
        </ul>
    {{else}}
    <p id="commentsEmptyLine" class="text-muted">There are no comments yet.</p>
    <ul class="list-group" id="commentListGroup" data-children=".li"></ul>
    {{end}}
    <div class="invisible disabled" id="emptyComment">
        <div class="list-group-item comment" id="comment">
            <div class="form-group">
                <div class="form-group row">
                    <div class="col-md d-none d-sm-block">
                        <label for="commentText" id="commentLabel">
                        </label>
                    </div>
                    <div class="col-md-10">
                        <p class="form-control-static" id="commentText"></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="/static/js/project/comments.js"></script>
    <script>
        initializeCommentsClickListener();
    </script>
{{end}}