diff --git a/src/main/resources/templates/overlay.html b/src/main/resources/templates/overlay.html index b5f34bd..a73a134 100644 --- a/src/main/resources/templates/overlay.html +++ b/src/main/resources/templates/overlay.html @@ -15,6 +15,16 @@ import DiceBox from "/vendor/dice-box/dice-box-threejs.es.js"; + function until(conditionFunction) { + + const poll = resolve => { + if(conditionFunction()) resolve(); + else setTimeout(_ => poll(resolve), 400); + } + + return new Promise(poll); + } + const evtSource = new EventSource(url() + "/dice/{diceid??}/stream"); const diceBox = new DiceBox("#dice-box", { assetPath: "/vendor/dice-box/", @@ -25,10 +35,12 @@ }); diceBox.initialize(); let timeout = 0; + let finished = true; evtSource.addEventListener("message", function (event) { clearInterval(timeout); let data = JSON.parse(event.data); diceBox.onRollComplete = () => { + finished = true; if ({clearAfter} > 0) { timeout = setTimeout(() => diceBox.clearDice(), {clearAfter} * 1000) } @@ -39,8 +51,9 @@ background: data.faceColor, foreground: data.numberColor } - }).then(() => { - diceBox.roll(data.roll.filter(it => it.split('@')[0].split('d')[1] !== "2").join('&')); + }).then(async () => { + await until(_ => finished) + diceBox.add(data.roll.filter(it => it.split('@')[0].split('d')[1] !== "2").join('&')); }) })