@page
@model Snootalogue.Pages.IndexModel
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

@{
	ViewData["Title"] = "Home";
}

@* <h1>Documents</h1> *@
<div class="documents">
	@foreach (var item in Model.Documents.Take(25)) {
	<div class="document">
		<div class="document-column left" style="background-image:url('/img/placeholder.png');"></div>
		<div class="document-column centre">
				<div class="title"><a asp-page="./Documents/View" asp-route-id="@item.ID">@Html.DisplayFor(modelItem => item.Title)</a></div>
				<div class="authors">By @Html.DisplayFor(modelItem => item.Authors)</div>
				<div class="category">Category: @Html.DisplayFor(modelItem => item.Category)</div>
				<div class="tags">@Html.DisplayFor(modelItem => item.Tags)</div>
				@{string hash = item.Hash.Substring(0, 8);}
				<div class="metadata">
					@Html.DisplayFor(modelItem => item.Filename) |
					<span title="@item.Size bytes">@Html.DisplayFor(modelItem => item.Size)</span> |
					<span title="SHA256 digest: @Html.DisplayFor(modelItem => item.Hash)">@hash...</span>
				</div>
		</div> @* end of document-column centre *@
		<div class="document-column right">
			@* TODO: replace these with font awesome or something *@
			<div class="vertical-buttons">
				<a asp-page="./Documents/Details" asp-route-id="@item.ID" class="button simple">Details</a>
				<a asp-page="./Documents/Edit" asp-route-id="@item.ID" class="button simple">Edit</a>
				<a href="#" class="button simple">Delete</a>
			</div>
		</div>

	</div>
	}

	<div class="centred subtle">Displaying @Model.Documents.Take(25).Count() of @Model.Documents.Count() results</div>
</div>