From d64ac097d9c79c52dc5ad5751f23d0c1a4e1e3f3 Mon Sep 17 00:00:00 2001
From: cat <cat@plan9.rocks>
Date: Tue, 15 Apr 2025 05:29:29 +0000
Subject: [PATCH] Fix skin-canvas visibility

skin-canvas is being hidden due to being part of noscript-hidden class.
Added JS to remove skin-canvas from noscript-hidden class, because if
SkinURL is set the skin-canvas will be drawn. When JS is disabled,
this will not be executed and the canvas will remain hidden.
---
 view/player.tmpl | 39 ++++++++++++++++++++++-----------------
 1 file changed, 22 insertions(+), 17 deletions(-)

diff --git a/view/player.tmpl b/view/player.tmpl
index 7c1922f..fa0739e 100644
--- a/view/player.tmpl
+++ b/view/player.tmpl
@@ -177,23 +177,28 @@
   {{ end }}
 
   {{ if .SkinURL }}
-<script type="module">
-	import { skinview3d } from "{{.App.PublicURL}}/bundle.js"
-	const skinCanvas = document.getElementById("skin-canvas");
-	const skinViewer = new skinview3d.SkinViewer({
-		canvas: skinCanvas,
-		width: 200,
-		height: skinCanvas.parentElement.clientHeight,
-	});
-	skinViewer.controls.enableZoom = false;
-	skinViewer.loadSkin({{.SkinURL}}, {
-		model: "{{.Player.SkinModel}}",
-	});
-	{{if .CapeURL}}
-		skinViewer.loadCape({{.CapeURL}});
-	{{end}}
-	skinViewer.render();
-</script>
+    <script type="module">
+        import { skinview3d } from "{{.App.PublicURL}}/bundle.js"
+        const skinCanvas = document.getElementById("skin-canvas");
+        const skinViewer = new skinview3d.SkinViewer({
+            canvas: skinCanvas,
+            width: 200,
+            height: skinCanvas.parentElement.clientHeight,
+        });
+        skinViewer.controls.enableZoom = false;
+        skinViewer.loadSkin({{.SkinURL}}, {
+            model: "{{.Player.SkinModel}}",
+        });
+        {{if .CapeURL}}
+        skinViewer.loadCape({{.CapeURL}});
+        {{end}}
+        skinViewer.render();
+
+        var elements = document.getElementsByClassName('noscript-hidden');
+        for (var i = 0; i < elements.length; i++) {
+            elements[i].classList.remove('noscript-hidden');
+        }
+    </script>
   {{ end }}
 
   {{ template "footer" . }}