diff --git a/static/bauchbinde/assets/script.js b/static/bauchbinde/assets/script.js index ca688a6..2f7ec7c 100644 --- a/static/bauchbinde/assets/script.js +++ b/static/bauchbinde/assets/script.js @@ -8,6 +8,7 @@ let holdDuration = 4000; let room = null; let time = null; + let startDelay = 1000; async function getCurrentTalkByRoomName(roomName) { let now = Date.now(); @@ -40,6 +41,7 @@ } async function init() { + const root = document.querySelector('html'); textEl = document.querySelector('.text'); textEl.innerHTML = ''; @@ -62,12 +64,6 @@ holdDuration = parseInt(value, 10); } if (key === 'theme') { - const root = document.querySelector('html'); - root.className = ''; - root.classList.add(`theme-${value}`) - } - if (key === 'theme') { - const root = document.querySelector('html'); root.className = ''; root.classList.add(`theme-${value}`) } @@ -77,6 +73,18 @@ if (key === 'time') { time = value; } + if (key === 'startdelay') { + startDelay = parseInt(value, 10); + } + if (key === 'left') { + root.style.setProperty('--left', value); + } + if (key === 'bottom') { + root.style.setProperty('--bottom', value); + } + if (key === 'width') { + root.style.setProperty('--width', value); + } } } @@ -92,7 +100,7 @@ } } } - + if (speaker) { headline += ','; } @@ -249,7 +257,7 @@ window.addEventListener('load', async () => { await init(); - await new Promise(r => setTimeout(r, 1000)); + await new Promise(r => setTimeout(r, startDelay)); await animate(); }); })(); diff --git a/static/bauchbinde/assets/style.css b/static/bauchbinde/assets/style.css index dc2f383..f45b9ab 100644 --- a/static/bauchbinde/assets/style.css +++ b/static/bauchbinde/assets/style.css @@ -8,6 +8,9 @@ --medium-tile-color: #fff900; --small-tile-color: #0bcb60; --text-color: #252826; + --bottom: 9vw; + --left: 12.5vw; + --width: 67.5vw; } :root.theme-main { @@ -39,9 +42,9 @@ body { .container { position: fixed; - bottom: 9vw; - left: 12.5vw; - right: 20vw; + bottom: var(--bottom); + left: var(--left); + width: var(--width); } .background {