From e25b07e5987bd7a2b70b57e21b0eed6607f1b2d9 Mon Sep 17 00:00:00 2001
From: Přemysl Eric Janouch <p@janouch.name>
Date: Sat, 23 Dec 2023 23:03:31 +0100
Subject: Implement orphans

---
 public/gallery.js | 36 +++++++++++++++++++++++++++++++++---
 public/style.css  |  7 ++++---
 2 files changed, 37 insertions(+), 6 deletions(-)

(limited to 'public')

diff --git a/public/gallery.js b/public/gallery.js
index 222bde5..96f0216 100644
--- a/public/gallery.js
+++ b/public/gallery.js
@@ -371,15 +371,45 @@ let OrphansModel = {
 	},
 }
 
+let OrphansReplacement = {
+	view(node) {
+		const info = vnode.attrs.info
+		if (!info)
+			return []
+
+		return [
+			` → `,
+			m(m.route.Link, {href: `/view/${info.sha1}`},
+				m('img.thumbnail', {src: `/thumb/${info.sha1}`,
+					width: info.thumbW, height: info.thumbH, loading})),
+			`${info.tags} tags`,
+		]
+	},
+}
+
+let OrphansRow = {
+	view(node) {
+		const info = vnode.attrs.info
+		return m('.row', [
+			m('img.thumbnail', {src: `/thumb/${info.sha1}`,
+				width: info.thumbW, height: info.thumbH, loading}),
+			`${info.tags} tags`,
+			m(OrphansReplacement, {info: info.replacement}),
+		])
+	},
+}
+
 let OrphansList = {
 	// See BrowseView.
 	oncreate(vnode) { vnode.dom.focus() },
 
 	view(vnode) {
-		let children = (DuplicatesModel.entries.length == 0)
+		let children = (OrphansModel.entries.length == 0)
 			? "No orphans"
-			: OrphansModel.entries.map(group =>
-				m('.row', "TODO"))
+			: OrphansModel.entries.map(info => [
+				m("h3", info.lastPath),
+				m(OrphansRow, {info}),
+			])
 		return m('.orphans[tabindex=0]', {}, children)
 	},
 }
diff --git a/public/style.css b/public/style.css
index 978e01b..0276e43 100644
--- a/public/style.css
+++ b/public/style.css
@@ -59,6 +59,7 @@ img.thumbnail { display: block; box-shadow: 0 0 3px rgba(0, 0, 0, 0.75);
 .similar .row { display: flex; margin: .5rem 0; }
 .similar .row ul { margin: 0; padding: 0 0 0 1.25em; list-style-type: "- "; }
 
-.duplicates { padding: .5rem; flex-grow: 1; overflow: auto; }
-.duplicates .row { display: flex; margin: .5rem 0;
-	align-items: center; gap: 3px; }
+.duplicates,
+.orphans { padding: .5rem; flex-grow: 1; overflow: auto; }
+.duplicates .row,
+.orphans .row { display: flex; margin: .5rem 0; align-items: center; gap: 3px; }
-- 
cgit v1.2.3-70-g09d2