{{/* One image field of a form (the design page, a post's featured image).
     The select lists the recent images so it works without the script; a
     chosen image older than those gets its own option (named through .names,
     or "Current image" once the file is gone), so the select always carries
     the choice and a save keeps it. With the script the select is hidden and
     "Choose from library…" opens the form's imagelib panel, which fetches the
     library page by page and marks the pickers with .js. */}}
{{define "imagepick"}}{{$cur := .current}}{{$listed := false}}{{range .images}}{{if eq .ID.String $cur}}{{$listed = true}}{{end}}{{end}}<div class="imagepick" data-name="{{.name}}">
  <label>{{.label}}</label>
  {{if .hint}}<p class="muted small">{{.hint}}</p>{{end}}
  <div class="pickrow">
    <span class="preview">{{if $cur}}<img src="/b/{{.sub}}/media/{{$cur}}" alt="">{{else}}<span class="swatch">&times;</span>{{end}}</span>
    <span class="pickctl">
      <select name="{{.name}}" class="ip-nojs">
        <option value="none"{{if not $cur}} selected{{end}}>{{t "None"}}</option>
        {{range .images}}<option value="{{.ID}}"{{if eq .ID.String $cur}} selected{{end}}>{{.Filename}}</option>{{end}}
        {{if and $cur (not $listed)}}<option value="{{$cur}}" selected>{{with index .names $cur}}{{.}}{{else}}{{t "Current image"}}{{end}}</option>{{end}}
      </select>
      <span class="ip-jsonly"><button type="button" class="secondary small" data-pick="open">{{t "Choose from library…"}}</button> <button type="button" class="secondary small" data-pick="clear">{{t "None"}}</button></span>
      <label class="upload">{{t "…or upload a new one"}}<br><input type="file" name="{{.name}}_file" accept="{{if .accept}}{{.accept}}{{else}}image/*{{end}}"></label>
    </span>
  </div>
</div>{{end}}