From 9b25a69636d750737575e36ccae0a65df7493f58 Mon Sep 17 00:00:00 2001 From: Arindy Date: Mon, 10 Feb 2025 03:24:20 +0100 Subject: [PATCH] introduces results for individual players --- .../de/arindy/dicetower/OverlayResource.kt | 4 +- .../de/arindy/dicetower/ResultsResource.kt | 18 ----- .../kotlin/de/arindy/dicetower/Templates.kt | 4 +- src/main/resources/templates/pub/index.html | 78 ++++++++++++++++++- src/main/resources/templates/results.html | 36 +++++---- 5 files changed, 97 insertions(+), 43 deletions(-) delete mode 100644 src/main/kotlin/de/arindy/dicetower/ResultsResource.kt diff --git a/src/main/kotlin/de/arindy/dicetower/OverlayResource.kt b/src/main/kotlin/de/arindy/dicetower/OverlayResource.kt index 82e65da..cfee467 100644 --- a/src/main/kotlin/de/arindy/dicetower/OverlayResource.kt +++ b/src/main/kotlin/de/arindy/dicetower/OverlayResource.kt @@ -20,7 +20,7 @@ class OverlayResource { @GET @Path("/results") @Produces(MediaType.TEXT_HTML) - fun results(@PathParam("diceid") room: String): TemplateInstance { - return Templates.results(room) + fun results(@PathParam("diceid") room: String, @QueryParam("name") name: String?, @QueryParam("user") user: String?): TemplateInstance { + return Templates.results(room, name ?: "all", user ?: "all") } } diff --git a/src/main/kotlin/de/arindy/dicetower/ResultsResource.kt b/src/main/kotlin/de/arindy/dicetower/ResultsResource.kt deleted file mode 100644 index fcc883a..0000000 --- a/src/main/kotlin/de/arindy/dicetower/ResultsResource.kt +++ /dev/null @@ -1,18 +0,0 @@ -package de.arindy.dicetower - -import io.quarkus.qute.TemplateInstance -import jakarta.ws.rs.GET -import jakarta.ws.rs.Path -import jakarta.ws.rs.PathParam -import jakarta.ws.rs.Produces -import jakarta.ws.rs.core.MediaType - -@Path("results/{room}") -class ResultsResource { - - @GET - @Produces(MediaType.TEXT_HTML) - fun get(@PathParam("room") room: String): TemplateInstance { - return Templates.results(room) - } -} diff --git a/src/main/kotlin/de/arindy/dicetower/Templates.kt b/src/main/kotlin/de/arindy/dicetower/Templates.kt index b47f94d..787f4ca 100644 --- a/src/main/kotlin/de/arindy/dicetower/Templates.kt +++ b/src/main/kotlin/de/arindy/dicetower/Templates.kt @@ -6,7 +6,7 @@ import io.quarkus.qute.TemplateInstance @CheckedTemplate object Templates { @JvmStatic - external fun overlay(diceid: String, scale: Int): TemplateInstance + external fun overlay(diceid: String, scale: Int?): TemplateInstance @JvmStatic - external fun results(room: String): TemplateInstance + external fun results(room: String, name: String?, user: String?): TemplateInstance } diff --git a/src/main/resources/templates/pub/index.html b/src/main/resources/templates/pub/index.html index 7e3c885..4264059 100644 --- a/src/main/resources/templates/pub/index.html +++ b/src/main/resources/templates/pub/index.html @@ -37,6 +37,60 @@ input { margin: 10px; } + + /* The switch - the box around the slider */ + .switch { + position: relative; + display: inline-block; + width: 60px; + height: 25px; + } + + /* Hide default HTML checkbox */ + .switch input { + opacity: 0; + width: 0; + height: 0; + } + + /* The slider */ + .slider { + position: absolute; + cursor: pointer; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: #ccc; + -webkit-transition: .4s; + transition: .4s; + } + + .slider:before { + position: absolute; + content: ""; + height: 18px; + width: 26px; + left: 4px; + bottom: 4px; + background-color: white; + -webkit-transition: .4s; + transition: .4s; + } + + input:checked + .slider { + background-color: #333333; + } + + input:focus + .slider { + box-shadow: 0 0 1px #333333; + } + + input:checked + .slider:before { + -webkit-transform: translateX(26px); + -ms-transform: translateX(26px); + transform: translateX(26px); + } @@ -50,8 +104,9 @@ @@ -91,7 +151,8 @@ if((!event || event.keyCode === 13) && document.getElementById('name').value.length > 0 && document.getElementById('room').value.length > 0) { document.getElementById('overlayId').value = url() + '/overlay/' + document.getElementById('room').value + ':' + localStorage.getItem('userId') + '?scale=7'; document.getElementById('resultsId').value = url() + '/overlay/' + document.getElementById('room').value + '/results'; - document.getElementById('resultFrame').src = url() + '/overlay/' + document.getElementById('room').value + '/results'; + document.getElementById('myResultsId').value = document.getElementById('resultsId').value + '?name=' + encodeURIComponent(document.getElementById('name').value) + '&user=' + localStorage.getItem('userId'); + document.getElementById('resultFrame').src = document.getElementById('myResultsId').value; document.getElementById('roll').hidden = false; document.getElementById('start').hidden = true; document.getElementById('dice-tower').hidden = false; @@ -139,6 +200,15 @@ } }); } + + document.getElementById('resultSwitch').addEventListener('change', function() { + if (!this.checked) { + document.getElementById('resultFrame').src = document.getElementById('myResultsId').value; + } else { + document.getElementById('resultFrame').src = document.getElementById('resultsId').value; + } + }) + document.addEventListener("DOMContentLoaded", async() => { if (!localStorage.getItem("userId")) { localStorage.setItem("userId", self.crypto.randomUUID()); diff --git a/src/main/resources/templates/results.html b/src/main/resources/templates/results.html index 049d8ff..926dd1a 100644 --- a/src/main/resources/templates/results.html +++ b/src/main/resources/templates/results.html @@ -14,25 +14,27 @@ const evtSource = new EventSource(url() + '/dice/{room}/results'); evtSource.addEventListener('message', function (event) { let data = JSON.parse(event.data); - let name = document.getElementById(data.user + '-' + data.name) ?? document.createElement('div'); - name.id = data.user + '-' + data.name; - name.replaceChildren(...[]); - let node = document.createElement('p'); - let resultText = '' - if (!data.results) { - resultText = ' rolling...' - } else { - data.results.forEach(result => { - let values = [] - result.rolls.forEach(roll => { - values.push(roll.value); + if ("{name}" === "all" && "{user}" === "all" || "{name}" === data.name && "{user}" === data.user || "{name}" === "all" && "{user}" === data.user || "{name}" === data.name && "{user}" === "all") { + let name = document.getElementById(data.user + '-' + data.name) ?? document.createElement('div'); + name.id = data.user + '-' + data.name; + name.replaceChildren(...[]); + let node = document.createElement('p'); + let resultText = '' + if (!data.results) { + resultText = ' rolling...' + } else { + data.results.forEach(result => { + let values = [] + result.rolls.forEach(roll => { + values.push(roll.value); + }) + resultText += '
  D' + result.sides + ': [' + values.map(value => value === 1 ? '' + value + '' : value === result.sides ? '' + value + '' : value).join(' + ') + (result.modifier > 0 ? ' +' + result.modifier + '' : result.modifier < 0 ? ' ' + result.modifier + '' : '') + '] = ' + result.value + ' ' }) - resultText += '
  D' + result.sides + ': [' + values.map(value => value === 1 ? '' + value + '' : value === result.sides ? '' + value + '' : value).join(' + ') + (result.modifier > 0 ? ' +' + result.modifier + '': result.modifier < 0 ? ' ' + result.modifier + '': '') + '] = ' + result.value + ' ' - }) + } + node.innerHTML = '' + data.name + ': 🎲 ' + resultText + name.appendChild(node) + document.getElementById('results').insertBefore(name, document.getElementById('results').firstChild); } - node.innerHTML = '' + data.name + ': 🎲 ' + resultText - name.appendChild(node) - document.getElementById('results').insertBefore(name, document.getElementById('results').firstChild); })