[no ci] release 1.2.2

Reviewed-on: #35

README.md

@@ -16,6 +16,7 @@
 <p align="center">
   <img src=".github/media/preview.gif" />
 </p>
+
 ---
 
 ## Key Features
@@ -27,6 +28,7 @@
 * Watch roll results (also available as Browser Source in OBS)
 
 ---
+
 ## Start Container
 
 You can start dice-tower with docker compose

pom.xml

@@ -4,7 +4,7 @@
     <modelVersion>4.0.0</modelVersion>
     <groupId>de.arindy</groupId>
     <artifactId>dice-tower</artifactId>
-    <version>1.2.0-SNAPSHOT</version>
+    <version>1.2.2</version>
 
     <properties>
         <compiler-plugin.version>3.13.0</compiler-plugin.version>

src/main/resources/META-INF/resources/manifest.json

@@ -0,0 +1,18 @@
+{
+  "name": "Dice-Tower",
+  "icons": [
+    {
+      "src": "192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": "/",
+  "display_override": ["window-controls-overlay", "minimal-ui"],
+  "display": "standalone"
+}

src/main/resources/META-INF/resources/style.css

@@ -32,6 +32,22 @@ button:active {
     background: #222222;
 }
 
+#install {
+    padding: 10px;
+    border: #666666 3px solid;
+    border-radius: 10px;
+    background: #666666;
+    color: #fff
+}
+
+#install:hover {
+    background: #444444;
+}
+
+#install:active {
+    background: #222222;
+}
+
 input {
     margin: 10px;
 }

src/main/resources/templates/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8">
     <title>Dice-Tower</title>
     <meta name="version" content="{version}">
-
+    <link rel="manifest" href="manifest.json" />
     <link rel="stylesheet" href="/vendor/w3css/4/w3.css">
     <link rel="stylesheet" href="/vendor/font-awesome/css/fontawesome.css">
     <link rel="stylesheet" href="/vendor/font-awesome/css/all.css">
@@ -33,6 +33,17 @@
     if (!localStorage.getItem("userId")) {
         localStorage.setItem("userId", self.crypto.randomUUID());
     }
+    addEventListener("beforeinstallprompt", (event) => {
+        event.preventDefault()
+        let install = document.createElement('button');
+        install.id = 'install'
+        install.style.position = 'absolute'
+        install.style.top = '25px'
+        install.style.right = '25px'
+        install.innerHTML = 'Install Dice-Tower'
+        install.onclick = () => event.prompt()
+        document.body.appendChild(install)
+    });
 </script>
 <div class="w3-container w3-content"
      style="height: 95vh; display: flex; flex-direction: column; justify-content: space-between;  padding: 25px">
@@ -78,6 +89,7 @@
             <button style="border: transparent; border-radius: 100%; font-size: large; font-weight: bold; height: 50px; width: 50px"
                     onclick="addDice()">+
             </button>
+            <button style="font-size: large; font-weight: bold;" onclick="rollEasy('d2')">D2</button>
             <button style="font-size: large; font-weight: bold;" onclick="rollEasy('d4')">D4</button>
             <button style="font-size: large; font-weight: bold;" onclick="rollEasy('d6')">D6</button>
             <button style="font-size: large; font-weight: bold;" onclick="rollEasy('d8')">D8</button>
@@ -138,10 +150,10 @@
         </div>
         <div style="display: flex; flex-direction: row; justify-content: space-between; align-items: baseline">
             <div style="flex-grow: 1; padding: 0 10px">
-                <color-picker id="faceColor" name="Face"></color-picker>
+                <color-picker id="faceColor" name="Face" value="#8d8981"></color-picker>
             </div>
             <div style="flex-grow: 1; padding: 10px 0">
-                <color-picker id="numberColor" name="Numbers"></color-picker>
+                <color-picker id="numberColor" name="Numbers" value="black"></color-picker>
             </div>
         </div>
         <div id="dice-box">