{{ $t := .Thread }}
{{ $a := .Authors }}

<p>
{{- if eq (len $t.Comments) 1 -}}
    There is 1 comment on this page.
{{- else -}}
    There are {{ len $t.Comments }} comments on this page.
{{- end -}}
<a href="#add-comment">Add your comment.</a>
</p>

{{ range $t.Comments }}
    {{ template "comment" . }}
{{ end }}

<h3 id="add-comment">Add a Comment</h3>

<form action="/comments" method="POST">
    <input type="hidden" name="_csrf" value="{{ .CSRF }}">
    <input type="hidden" name="thread" value="{{ .Thread.ID }}">
    <input type="hidden" name="subject" value="{{ .Subject }}">
    <input type="hidden" name="origin" value="{{ .OriginURL }}">

    {{ if not .IsAuthenticated }}
    <div class="form-group row">
        <label for="name" class="col-2 col-form-label">Your name:</label>
        <div class="col-10">
            <input type="text"
                id="name"
                name="name"
                class="form-control"
                value="{{ .Name }}"
                placeholder="Anonymous">
        </div>
    </div>

    <div class="form-group row">
        <label for="email" class="col-2 col-form-label">Your email:</label>
        <div class="col-10">
            <input type="email"
                id="email"
                name="email"
                class="form-control"
                aria-describedby="emailHelp"
                value="{{ .Email }}"
                placeholder="(optional)">
            <small id="emailHelp" class="form-text text-muted">
                Used for your <a href="https://en.gravatar.com/" target="_blank">Gravatar</a>
                and optional thread subscription. <a href="/privacy">Privacy policy.</a>
            </small>

            <label class="form-check-label pl-0">
                <input type="checkbox" name="subscribe" value="true">
                <small>Notify me of future comments on this page.</small>
            </label>
        </div>
    </div>
    {{ end }}

    <div class="form-group">
        <label for="body">Message:</label>
        <textarea
            name="body"
            id="body"
            cols="40" rows="10"
            aria-describedby="bodyHelp"
            class="form-control"></textarea>
        <small id="bodyHelp" class="form-text text-muted">
            You may format your message using
            <a href="https://daringfireball.net/projects/markdown/syntax">Markdown</a>
            syntax.
        </small>
    </div>

    <div class="form-group" style="display: none">
        <div class="card">
            <div class="card-header">Sanity Check</div>
            <div class="card-body">
                If you happen to be able to see these fields, do not change
                their values.

                <input type="text" name="url" value="http://" class="form-control" placeholder="Website">
                <textarea name="comment" cols="80" rows="10" class="form-control" placeholder="Comment"></textarea>
            </div>
        </div>
    </div>

    <button type="submit"
        name="submit"
        value="preview"
        class="btn btn-primary">Preview</button>
    <button type="submit"
        name="submit"
        value="post"
        class="btn btn-danger">Post</button>
</form>