initial commit

2025-02-09 20:54:04 +01:00
parent 650f147700
commit ca538e7980
86 changed files with 55337 additions and 0 deletions
--- a/src/main/resources/templates/overlay.html
+++ b/src/main/resources/templates/overlay.html
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Overlay</title>
+    <style>
+        html,
+        body {
+            font-family: Avenir, Helvetica, Arial, sans-serif;
+            -webkit-font-smoothing: antialiased;
+            -moz-osx-font-smoothing: grayscale;
+            overflow: hidden;
+            width: 100%;
+            height: 100%;
+            margin: 0;
+            padding: 0;
+            perspective: 1000px;
+        }
+
+        #dice-box {
+            position: relative;
+            box-sizing: border-box;
+            width: 100%;
+            height: 100%;
+            background: transparent;
+            background-size: cover;
+        }
+
+        #dice-box canvas {
+            width: 100%;
+            height: 100%;
+        }
+
+    </style>
+</head>
+<body>
+<div id="dice-box"></div>
+<script type="module">
+    import DiceBox from "/vendor/dice-box/dice-box.es.js";
+    const evtSource = new EventSource(window.location.protocol + "//" + window.location.hostname + ':' + window.location.port + "/dice/{diceid??}/stream");
+
+    const diceBox = new DiceBox("#dice-box", {
+        assetPath: "/vendor/assets/",
+        theme: 'default',
+        preloadThemes: [
+            'default',
+            'blueGreenMetal',
+            'diceOfRolling',
+            'gemstone',
+            'gemstoneMarble',
+            'rock',
+            'rust',
+            'smooth',
+            'wooden'
+        ],
+        scale: 7
+    });
+
+    document.addEventListener("DOMContentLoaded", async() => {
+        await diceBox.init()
+
+        evtSource.addEventListener("message", function (event) {
+            let data = JSON.parse(event.data);
+            diceBox.onRollComplete = (rollResult) => {
+                console.log(rollResult)
+                let httpRequest = new XMLHttpRequest();
+                httpRequest.open('POST',window.location.protocol + '//' + window.location.hostname + ':' + window.location.port + '/dice/' + data.room + '/results')
+                httpRequest.setRequestHeader('Content-Type', 'application/json')
+                httpRequest.send(JSON.stringify({
+                    name: data.name,
+                    results: rollResult,
+                } ))
+            }
+            diceBox.roll(data.roll, { theme: data.theme?.length > 0 ? data.theme : 'default', themeColor: data.themeColor.length > 0 ? data.themeColor : '#4545FF' });
+
+
+        })
+    })
+</script>
+</body>
+</html>