Added print button to printables page

zenengeo · Jan 1, 2025 · 44989ed · 44989ed
1 parent 599f85a
commit 44989ed
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 1 deletion.
diff --git a/src/main/resources/static/css/printables.css b/src/main/resources/static/css/printables.css
@@ -35,4 +35,8 @@ body {
     .controls {
         display: none;
     }
+}
+
+#printBtn {
+    margin-right: 1em;
 }
diff --git a/src/main/resources/templates/printables/whitecards.html b/src/main/resources/templates/printables/whitecards.html
@@ -13,11 +13,21 @@
 </div>
 <div class="controls">
     <form method="get">
+        <button id="printBtn">Print</button>
         <input type="hidden" name="offset" th:value="${offset + count}">
-        <input type="submit" value="Next">
+        <input type="submit" value="Get next">
         <input type="number" id="count" name="count" min="1" size="2" th:value="${count}">
         <label for="count">cards</label>
     </form>
 </div>
+
+<script>
+    const printBtn = document.querySelector("#printBtn");
+    printBtn.addEventListener('click', () => {
+      // initiate print dialog
+      print();
+    });
+</script>
+
 </body>
 </html>