{{/*
  The review-thread markup, defined once and parsed into every page set.

  The diff renderer (web/diff.go) executes "blockthreads" into the HTML it
  builds for one block, and the proposal page renders "thread" directly for the
  comments whose anchor no longer names a block. Both go through html/template
  rather than string building because a comment body is prose someone else
  wrote: contextual auto-escaping is what keeps it text.
*/}}

{{define "thread"}}
<article class="ph-thread{{if .Resolved}} ph-thread-resolved{{end}}" id="thread-{{.ID}}">
  <header class="ph-thread-head">
    <span class="ph-author">{{.Author}}</span>
    {{if .Agent}}<span class="badge badge-secondary">agent</span>{{end}}
    <span class="ph-when">{{.When}}</span>
    {{if .Resolved}}<span class="badge badge-success">resolved</span>{{end}}
    {{if .Note}}<span class="badge badge-warning" title="{{.NoteWhy}}">{{.Note}}</span>{{end}}
    {{if .DocPath}}<code class="ph-when">{{.DocPath}}</code>{{end}}
    {{/*
      What this thread is attached to, spelled out. The reviewer selected lines;
      the comment stores a block under a heading path, and by the time anyone
      reads the thread the heading is usually off screen.

      It comes last and behind a separator because the badge in front of it is a
      warning about fit while this is a locator. Run together they read as one
      sentence, and "block edited since Storage › Goals" is a phrase the reader
      has to un-parse before noticing it is two unrelated facts.
    */}}
    {{if .AnchorPath}}<span class="ph-when">·</span>
    <code class="ph-anchor-path" title="the block this comment anchors to">{{.AnchorPath}} ¶{{.AnchorIndex}}</code>{{end}}
  </header>
  <div class="ph-comment-body">{{.Body}}</div>

  {{range .Replies}}
  <div class="ph-reply">
    <header class="ph-thread-head">
      <span class="ph-author">{{.Author}}</span>
      {{if .Agent}}<span class="badge badge-secondary">agent</span>{{end}}
      <span class="ph-when">{{.When}}</span>
    </header>
    <div class="ph-comment-body">{{.Body}}</div>
  </div>
  {{end}}

  <div class="ph-thread-actions">
    {{if .CanReply}}
    <details class="ph-form">
      <summary>Reply</summary>
      <form method="POST" action="{{.ActionBase}}/reply">
        <input type="hidden" name="thread" value="{{.ID}}">
        <textarea class="form-control" name="body" rows="3" required
                  placeholder="Answer the critique"></textarea>
        <button type="submit" class="btn btn-sm btn-primary">Reply</button>
      </form>
    </details>
    {{end}}
    {{if .CanResolve}}
    <form method="POST" action="{{.ActionBase}}/resolve" class="ph-form">
      <input type="hidden" name="thread" value="{{.ID}}">
      <input type="hidden" name="resolved" value="{{if .Resolved}}0{{else}}1{{end}}">
      <button type="submit" class="btn btn-sm btn-outline-secondary">
        {{if .Resolved}}Reopen{{else}}Resolve{{end}}
      </button>
    </form>
    {{end}}
  </div>
</article>
{{end}}

{{define "blockthreads"}}
{{if .Threads}}
<div class="ph-threads">
  {{range .Threads}}{{template "thread" .}}{{end}}
</div>
{{end}}
{{if .Compose}}
<details class="ph-form ph-compose">
  <summary>Comment on this block</summary>
  {{/*
    Selection is by line, anchoring is by block, so the composer states which
    block it will anchor to before anything is typed. It is rendered here, on the
    server, rather than filled in by the selection script: with JavaScript off
    there is no selection and this sentence is the whole truth about where the
    comment lands. The script prefixes the selected line range onto it as its own
    element and removes that element again on Escape, so there is nothing here to
    repeat as a plain-text copy for restoring: writing such a copy back would
    have to go through textContent, which would flatten the code element below.
  */}}
  <p class="ph-anchor-note">Anchors to <code>{{.Compose.AnchorPath}}</code> ¶{{.Compose.AnchorIndex}}</p>
  <form method="POST" action="{{.Compose.ActionBase}}/comment">
    <input type="hidden" name="doc" value="{{.Compose.DocPath}}">
    <input type="hidden" name="block" value="{{.Compose.Ordinal}}">
    <input type="hidden" name="side" value="{{.Compose.Side}}">
    <input type="hidden" name="hash" value="{{.Compose.Hash}}">
    <textarea class="form-control" name="body" rows="3" required
              placeholder="What is wrong with this block?"></textarea>
    <button type="submit" class="btn btn-sm btn-primary">Comment</button>
  </form>
</details>
{{end}}
{{end}}