Files
pictest/cmd/pictest/templates/photo_detail.gohtml
T
2026-05-03 10:17:59 +01:00

75 lines
3.2 KiB
Go Template

{{define "photo_detail"}}
<article class="modal-card">
<button type="button" class="close-button" data-modal-close>Close</button>
<div class="modal-image-wrap">
<img src="/uploads/{{.Photo.StoredFilename}}" alt="{{.Photo.OriginalFilename}}" class="modal-image">
</div>
<div class="modal-info">
<div class="detail-header">
<div>
<h2>{{.Photo.OriginalFilename}}</h2>
<p>Uploaded by {{.Photo.Username}} on {{.Photo.CreatedAt.Format "02 Jan 2006 15:04"}}</p>
</div>
{{if .CanDelete}}
<form method="post" action="/photos/{{.Photo.ID}}/delete">
<button type="submit" class="danger">Delete photo</button>
</form>
{{end}}
</div>
<dl class="metadata">
<div><dt>Filename</dt><dd>{{.Photo.OriginalFilename}}</dd></div>
<div><dt>Uploader</dt><dd>{{.Photo.Username}}</dd></div>
<div><dt>Date</dt><dd>{{.Photo.CreatedAt.Format "02 Jan 2006 15:04"}}</dd></div>
</dl>
<section class="exif-card">
<div class="section-heading">
<h3>Camera metadata</h3>
<p>Extracted from the image file when available.</p>
</div>
{{if .ExifFields}}
<dl class="exif-list">
{{range .ExifFields}}
<div>
<dt>{{.Name}}</dt>
<dd>{{.Value}}</dd>
</div>
{{end}}
</dl>
{{else}}
<p class="empty-state">No EXIF metadata was embedded in this photo.</p>
{{end}}
</section>
<section class="comments-section">
<h3>Comments</h3>
<form method="post" action="/photos/{{.Photo.ID}}/comments" hx-post="/photos/{{.Photo.ID}}/comments" hx-target="#photo-modal-content" hx-swap="innerHTML" class="comment-form">
<textarea name="body" required minlength="1" maxlength="1000" placeholder="Write a comment"></textarea>
<button type="submit">Add comment</button>
</form>
<div class="comments-list">
{{if .Comments}}
{{range .Comments}}
<article class="comment-card">
<p>{{.Body}}</p>
<div class="comment-footer">
<span>by {{.Username}} on {{.CreatedAt.Format "02 Jan 2006 15:04"}}</span>
{{if .CanEdit}}
<form method="post" action="/comments/{{.ID}}" hx-post="/comments/{{.ID}}" hx-target="#photo-modal-content" hx-swap="innerHTML" class="inline-edit-form">
<textarea name="body" required maxlength="1000">{{.Body}}</textarea>
<button type="submit" class="secondary">Save</button>
</form>
{{end}}
</div>
</article>
{{end}}
{{else}}
<p class="empty-state">No comments yet.</p>
{{end}}
</div>
</section>
</div>
</article>
{{end}}