admin: photo preview fixed size (inline styles); preview mode ?preview=1 (banner, no scan functionality) with Preview buttons in admin row action + owner edit link

This commit is contained in:
2026-08-10 16:36:22 +10:00
parent eb3e4f45ad
commit ae0290b343
3 changed files with 13 additions and 2 deletions

View File

@@ -12,6 +12,7 @@ import (
type publicData struct {
UpdatedAt pgtype.Timestamptz
Preview bool
ID int64
TagCode string
Status string
@@ -48,6 +49,7 @@ func (a *App) PublicTag(w http.ResponseWriter, r *http.Request) {
}
pd := publicData{
Preview: r.URL.Query().Get("preview") == "1",
UpdatedAt: tag.UpdatedAt,
ID: tag.ID,
TagCode: tag.TagCode,

View File

@@ -31,7 +31,7 @@
<div>
<input type="file" name="photo" accept="image/*" class="text-sm" onchange="var f=this.files[0]; if(f){ var p=document.getElementById('photo-preview'); p.classList.remove('hidden'); var r=new FileReader(); r.onload=function(e){ p.src=e.target.result; }; r.readAsDataURL(f); }">
<p class="mt-1 text-xs text-stone-500">Choose a photo and press Save. If you choose nothing, the current photo is kept.</p>
<p class="mt-2"><a href="/t/{{.Data.TagCode}}" target="_blank" rel="noopener" class="text-xs text-amber-600 hover:underline">👁 View the live tag page</a></p>
<p class="mt-2"><a href="/t/{{.Data.TagCode}}?preview=1" target="_blank" rel="noopener" class="text-xs text-amber-600 hover:underline">👁 Preview the tag page (no scan)</a></p>
</div>
</div>
</div>

View File

@@ -29,7 +29,10 @@
</div>
{{else}}
<div class="overflow-hidden rounded-xl border border-stone-200 bg-white shadow-sm">
<div class="bg-stone-900 px-6 py-5 text-white">
{{if .Data.Preview}}
<div class="bg-amber-400 px-6 py-2 text-center text-xs font-bold text-stone-900">👁 PREVIEW — this is how the page looks to a finder (scan functionality disabled)</div>
{{end}}
<div class="bg-stone-900 px-6 py-5 text-white">
<h1 class="text-2xl font-bold">
{{if .Data.ItemType.Valid}}{{.Data.ItemType.String | title}}{{else}}Item{{end}} — found!
</h1>
@@ -71,12 +74,15 @@
{{end}}
</dl>
{{if not .Data.Preview}}
<div class="mt-4 rounded border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-800">
<p><strong>Help the owner find it:</strong> sharing your location sends them a map link. No location? No problem — the page still works.</p>
<button id="recheck-btn" type="button" class="mt-2 rounded bg-amber-500 px-3 py-1.5 text-xs font-semibold text-stone-900 hover:bg-amber-400">📍 Re-check my location</button>
<p id="location-shared" class="hidden mt-2 text-xs font-medium text-green-700">✓ Location shared — the owner has been sent a map link.</p>
</div>
{{end}}
{{if not .Data.Preview}}
<div id="contact-area" class="mt-4" x-data="{ phone: '', get valid() { return /^[0-9+ ]{8,16}$/.test(this.phone.trim()); } }">
<form hx-post="/t/{{.Data.TagCode}}/contact" hx-target="#contact-area" hx-swap="innerHTML" class="flex gap-2" @submit.prevent="if(!valid) return; $el.requestSubmit()">
<input type="hidden" name="fingerprint" value="">
@@ -86,6 +92,7 @@
</form>
<p x-show="phone && !valid" class="mt-1 text-xs text-red-600">Enter a valid phone number (816 digits, e.g. 0423 274 487).</p>
</div>
{{end}}
{{if .Data.IsOwner}}
<p class="mt-4 text-center text-sm"><a href="/account/tags/{{.Data.ID}}/edit" class="text-amber-600 hover:underline">✏️ Edit this tag's details</a></p>
@@ -93,6 +100,7 @@
</div>
</div>
{{if not .Data.Preview}}
<script>
(function () {
var code = {{.Data.TagCode | printf "%q"}};
@@ -137,6 +145,7 @@
tryLocation();
})();
</script>
{{end}}
{{end}}
</div>
{{end}}