Add different modes and a more compact design

Add widescreen side by side mode
Add borderless mode
Add noheader mode
Make layout more compact
Add autorefresh in seconds

1 files changed, 62 insertions, 0 deletions

diff --git a/bwlpMonitor_template.html b/bwlpMonitor_template.html
index 6a41d66..19a804b 100644
--- a/bwlpMonitor_template.html
+++ b/bwlpMonitor_template.html
@@ -38,3 +38,65 @@
   </body>
 
 </html>
+
+<script>
+	const urlParams = new URLSearchParams(window.location.search)
+	const noheader = urlParams.get('noheader')
+	if (noheader != null) {
+		document.getElementById('header').style.visibility = 'hidden'
+		document.getElementById('body').style.marginTop = '0px'
+	}
+	const borderless = urlParams.get('borderless')
+	if (borderless != null) {
+		const body = document.getElementById('body')
+		body.style.padding = '0px'
+		body.style.width = '100%'
+		body.style.height = '100%'
+
+		const logWrapper = document.getElementById('log_wrapper')
+		logWrapper.style.maxHeight = 'unset'
+		logWrapper.style.maxWidth = 'unset'
+		logWrapper.style.display = 'unset'
+		logWrapper.style.height = '100%'
+		logWrapper.style.boxShadow = 'unset'
+		logWrapper.style.margin = 'unset'
+
+		const log = document.getElementById('log')
+		log.style.height = 'unset'
+		log.style.setProperty('--wrap', 'normal')
+
+		const content = document.getElementById('content')
+		content.style.height = '100%'
+		content.style.boxShadow = 'unset'
+		content.style.maxWidth = 'unset'
+
+		var media = window.matchMedia("(min-width: 1500px)")
+		borderlessMedia(media, logWrapper, content)
+		media.addListener(borderlessMedia)
+	}
+
+	function borderlessMedia(media) {
+		const logWrapper = document.getElementById('log_wrapper')
+		const content = document.getElementById('content')
+
+		if (media.matches) {
+			logWrapper.style.borderTop = 'unset'
+			logWrapper.style.borderLeft = '3px solid #8a8a8a'
+			content.style.flexWrap = 'nowrap'
+		} else {
+			logWrapper.style.borderLeft = 'unset'
+			logWrapper.style.borderTop = '3px solid #8a8a8a'
+			content.style.flexWrap = 'wrap'
+		}
+	}
+
+	var autorefresh = urlParams.get('autorefresh')
+	var autorefresh = parseInt(autorefresh)
+	console.log(Number.isInteger(autorefresh))
+	if (Number.isInteger(autorefresh)) {
+		console.log(autorefresh)
+		setTimeout(function() {
+			location.reload();
+		}, autorefresh * 1000);
+	}
+</script>
\ No newline at end of file