feat: enable morph on player to retain player state

MonstraG · MonstraG · commit db23e621ca6d · 2025-10-20T21:40:09.000+02:00
diff --git a/pages/base.gohtml b/pages/base.gohtml
@@ -9,9 +9,10 @@
 	<link rel="stylesheet" href="/public/reset.css">
 	<link rel="stylesheet" href="/public/styles.css">
 	<script src="/public/htmx/htmx2.0.7.min.js" defer></script>
+	<script src="/public/htmx/idiomorph-ext0.7.4.min.js" defer></script>
 	{{block "head".}}{{end}}
 </head>
-<body>
+<body hx-ext="morph">
 {{block "nav".}}{{end}}
 <main>
 	{{template "content".}}
diff --git a/pages/index/index.gohtml b/pages/index/index.gohtml
@@ -122,7 +122,7 @@
 
 		<article>
 			<h2>Player</h2>
-			<div hx-get="/player" hx-swap="innerHTML" hx-trigger="load, playerReloadEvent" id="player"></div>
+			<div hx-get="/player" hx-swap="morph:innerHTML" hx-trigger="load, playerReloadEvent" id="player"></div>
 		</article>
 	</div>
 {{end}}
diff --git a/pages/player/playerPartial.gohtml b/pages/player/playerPartial.gohtml
@@ -12,14 +12,14 @@
 			{{range .Items}}
 				<tr>
 					<td class="min-width">
-						{{.CreatedAt.Format "15:04:05"}} -
+						{{.CreatedAt.Format "15:04:05"}}
 					</td>
 					<td class="align-start">
 						{{.Path}}
 					</td>
 					<td class="align-end short">
 						<button class="icon-button" hx-delete="/removeSong/{{.ID}}" hx-target="#player-partial"
-								hx-swap="outerHTML">
+								hx-swap="morph:outerHTML">
 							<img src="/public/icons/delete.svg" width="20" height="20" alt="Delete"/>
 						</button>
 					</td>
diff --git a/public/htmx/idiomorph-ext0.7.4.min.js b/public/htmx/idiomorph-ext0.7.4.min.js
