{{template "header.html" .S}}

<form action="/submission/moderate/">
  <div class="row justify-content-center">
	<input type="search" class="col-sm-8" name="q" {{if .Search}}value="{{.Search}}"{{else}}placeholder="Search"{{end}} />
  </div>
</form>
<br />

{{if .Books}}
<div class="btn-group">
	<a href="/store/{{range .Books}}{{.B.ID}}/{{end}}" class="btn btn-lg btn-success">
	  <svg class="bi" width="1.5em" height="1.5em" fill="currentColor">
	    <use xlink:href="/img/bootstrap-icons.svg#check-all"/>
	  </svg>
	  Save All
	</a>
	<a href="/delete/{{range .Books}}{{.B.ID}}/{{end}}" class="btn btn-lg btn-danger">
	  <svg class="bi" width="1.5em" height="1.5em" fill="currentColor">
	    <use xlink:href="/img/bootstrap-icons.svg#trash-fill"/>
	  </svg>
	  Delete All
	</a>
</div>
{{end}}

<p class="text-center">Found {{.Found}} books.<br /></p>
<nav class="d-flex justify-content-center" arial-label="Book moderate page navigation">
  <ul class="pagination">
    <li class="page-item {{if not .Prev}}disabled{{end}}">
  	  <a class="page-link" href="{{.Prev}}">&larr; Prev</a>
    </li>
    <li class="page-item disabled">
  	  <a class="page-link" href="#">Page {{.Page}}</a>
    </li>
    <li class="page-item {{if not .Next}}disabled{{end}}">
  	  <a class="page-link" href="{{.Next}}">Next &rarr;</a>
    </li>
  </ul>
</nav>

{{range .Books}}
	{{$titleFound  := .TitleFound}}
	{{$authorFound := .AuthorFound}}
	{{with .B}}
	<div class="card mb-3">
	  <div class="row g-0">
		<div class="col-md-1 d-flex align-items-center justify-content-center">
		  <a href="/book/{{.ID}}" title="{{.Description}}">
			{{if .Cover}}<img class="rounded" src="/cover/{{.ID}}/small/{{.Title}}.jpg" alt="{{.Title}}" />{{end}}
		  </a>
		</div>
		<div class="col-md-11">
		  <div class="card-body">
			<p class="card-title">
			  <a href="/search/?q=title:{{.Title}}"><strong>{{.Title}}</strong></a> <!--<small>({{$titleFound}})</small>-->
			</p>
			<div class="card-text row">
			  <p class="col-md-8">
	            {{if .Authors}}<strong>Authors:</strong>

				  {{range $i, $author := .Authors}}
				    {{if $i}}&amp;{{end}}
				    <a href="/search/?q=author:{{$author}}">{{$author}}</a>
				  {{end}}
				<!--<small>({{$authorFound}})</small>--><br />{{end}}
	            {{if .Publisher}}<strong>Publisher:</strong> <a href="/search/?q=publisher:{{.Publisher}}">{{.Publisher}}</a><br />{{end}}
	            {{if .Tags}}<strong>Tags:</strong>
			      {{range $i, $tag := .Tags}}
			        {{if $i}},{{end}}
			        <a href="/search/?q=tag:{{$tag}}">{{$tag}}</a>
			      {{end}}
				<br />{{end}}
	            {{if .Isbn}}<strong>ISBN:</strong> {{.Isbn}}<br />{{end}}
	            {{if .Date}}<strong>Date:</strong> {{.Date}}<br />{{end}}
	            {{if .Lang}}<strong>Lang:</strong> <a href="/search/?q=lang:{{.Lang}}">{{.Lang}}</a> <br />{{end}}
		      </p>
			  <div class="col-md-4">
	            <div class="btn-group d-flex justify-content-end">
	            	<a href="/store/{{.ID}}/" class="btn btn-success">
	      	          <svg class="bi" width="1em" height="1em" fill="currentColor">
	      	            <use xlink:href="/img/bootstrap-icons.svg#check"/>
	      	          </svg>
	      	          save
					</a>
	            	<a href="/edit/{{.ID}}" class="btn btn-primary">
	      	          <svg class="bi" width="1em" height="1em" fill="currentColor">
	      	            <use xlink:href="/img/bootstrap-icons.svg#pencil"/>
	      	          </svg>
	                  edit
					</a>
	            	<a href="/delete/{{.ID}}/" class="btn btn-danger">
	      	          <svg class="bi" width="1em" height="1em" fill="currentColor">
	      	            <use xlink:href="/img/bootstrap-icons.svg#trash"/>
	      	          </svg>
	      	          delete
					</a>
	            </div>
				<div class="btn-group d-flex justify-content-end">
				  <a href="{{download_url .}}" class="btn btn-dark btn-sm">
					<svg class="bi" width="1em" height="1em" fill="currentColor">
					  <use xlink:href="/img/bootstrap-icons.svg#file-earmark-arrow-down"/>
					</svg>
					download
				  </a>
				  <a href="/read/{{.ID}}" class="btn btn-warning btn-sm">
					<svg class="bi" width="1em" height="1em" fill="currentColor">
					  <use xlink:href="/img/bootstrap-icons.svg#eyeglasses"/>
					</svg>
					read it!
				  </a>
				</div>
			  </div>
			</div>
			<p>{{.Description}}</p>
		  </div>
		</div>
	  </div>
	</div>
	{{end}}
	{{if .Comment}}
	<div class="row">
		<div class="col-md-1">
			<b>Comment:</b>
		</div>
		<div class="col-md-11">
			<p>{{.Comment}}</p>
		</div>
	</div>
	<br />
	{{end}}
{{end}}

<nav class="d-flex justify-content-center" arial-label="Book moderate page navigation">
  <ul class="pagination">
    <li class="page-item {{if not .Prev}}disabled{{end}}">
  	  <a class="page-link" href="{{.Prev}}">&larr; Prev</a>
    </li>
    <li class="page-item disabled">
  	  <a class="page-link" href="#">Page {{.Page}}</a>
    </li>
    <li class="page-item {{if not .Next}}disabled{{end}}">
  	  <a class="page-link" href="{{.Next}}">Next &rarr;</a>
    </li>
  </ul>
</nav>

{{if .Books}}
<div class="btn-group">
	<a href="/store/{{range .Books}}{{.B.ID}}/{{end}}" class="btn btn-lg btn-success">
	  <svg class="bi" width="1.5em" height="1.5em" fill="currentColor">
	    <use xlink:href="/img/bootstrap-icons.svg#check-all"/>
	  </svg>
	  Save All
	</a>
	<a href="/delete/{{range .Books}}{{.B.ID}}/{{end}}" class="btn btn-lg btn-danger">
	  <svg class="bi" width="1.5em" height="1.5em" fill="currentColor">
	    <use xlink:href="/img/bootstrap-icons.svg#trash-fill"/>
	  </svg>
	  Delete All
	</a>
</div>
{{end}}

{{template "footer.html" .S}}