From ee141544aa2d04f1a1069c0076843978d2c35490 Mon Sep 17 00:00:00 2001
From: ed <s@ocv.me>
Date: Mon, 28 Nov 2022 20:10:10 +0000
Subject: [PATCH] option for compact mediaplayer

---
 copyparty/web/browser.css | 35 ++++++++++++++++++++++++++++++++++-
 copyparty/web/browser.js  | 10 ++++++++++
 2 files changed, 44 insertions(+), 1 deletion(-)

diff --git a/copyparty/web/browser.css b/copyparty/web/browser.css
index df7e2202..cd4496c2 100644
--- a/copyparty/web/browser.css
+++ b/copyparty/web/browser.css
@@ -1101,7 +1101,6 @@ html.y #widget.open {
 #wtoggle {
 	position: absolute;
 	white-space: nowrap;
-	font-size: .8em;
 	top: -1em;
 	right: 0;
 	height: 1em;
@@ -1227,6 +1226,40 @@ html.y #widget.open {
 	width: calc(100% - 10.5em);
 	background: rgba(0,0,0,0.2);
 }
+#widget.cmp {
+	height: 1.6em;
+	bottom: -1.6em;
+}
+#widget.cmp.open {
+	bottom: 0;
+}
+#widget.cmp #wtoggle {
+	font-size: 1.2em;
+}
+#widget.cmp #wtgrid {
+	display: none;
+}
+#widget.cmp #pctl {
+	top: 0;
+	left: 0;
+	font-size: .75em;
+}
+#widget.cmp #pctl a {
+	margin: 0;
+}
+#widget.cmp #barpos,
+#widget.cmp #barbuf {
+	width: calc(100% - 11em);
+	border-radius: 0;
+	left: 5em;
+	top: 0;
+}
+#widget.cmp #pvol {
+	top: 0;
+	right: 0;
+	max-width: 6em;
+	border-radius: 0;
+}
 .opview {
 	display: none;
 }
diff --git a/copyparty/web/browser.js b/copyparty/web/browser.js
index 1f830177..46752f4f 100644
--- a/copyparty/web/browser.js
+++ b/copyparty/web/browser.js
@@ -228,6 +228,7 @@ var Ls = {
 		"mt_octl": "os integration (media hotkeys / osd)\">os-ctl",
 		"mt_oseek": "allow seeking through os integration\">seek",
 		"mt_oscv": "show album cover in osd\">art",
+		"mt_compact": "compact controls\">⟎",
 		"mt_mloop": "loop the open folder\">🔁 loop",
 		"mt_mnext": "load the next folder and continue\">📂 next",
 		"mt_cflac": "convert flac / wav to opus\">flac",
@@ -666,6 +667,7 @@ var Ls = {
 		"mt_octl": "integrering med operativsystemet (fjernkontroll, info-skjerm)\">os-ctl",
 		"mt_oseek": "tillat spoling med fjernkontroll\">spoling",
 		"mt_oscv": "vis album-cover på infoskjermen\">bilde",
+		"mt_compact": "tettpakket avspillerpanel\">⟎",
 		"mt_mloop": "repeter hele mappen\">🔁 gjenta",
 		"mt_mnext": "hopp til neste mappe og fortsett\">📂 neste",
 		"mt_cflac": "konverter flac / wav-filer til opus\">flac",
@@ -1239,6 +1241,7 @@ var mpl = (function () {
 		'<a href="#" class="tgl btn" id="au_os_ctl" tt="' + L.mt_octl + '</a>' +
 		'<a href="#" class="tgl btn" id="au_os_seek" tt="' + L.mt_oseek + '</a>' +
 		'<a href="#" class="tgl btn" id="au_osd_cv" tt="' + L.mt_oscv + '</a>' +
+		'<a href="#" class="tgl btn" id="au_compact" tt="' + L.mt_compact + '</a>' +
 		'</div></div>' +
 
 		'<div><h3>' + L.ml_pmode + '</h3><div id="pb_mode">' +
@@ -2852,6 +2855,13 @@ function eval_hash() {
 	}
 	bcfg_bind(props, 'sbars', 'sbars', true, setsb);
 	setsb();
+
+	// compact media player
+	function setacmp() {
+		clmod(ebi('widget'), 'cmp', props.mcmp);
+	}
+	bcfg_bind(props, 'mcmp', 'au_compact', false, setacmp);
+	setacmp();
 })();