From 39a187b6da89f05a2cffd3c2e0eeeac5c23e21e2 Mon Sep 17 00:00:00 2001 From: Anthony Stirling <77850077+Frooodle@users.noreply.github.com> Date: Sat, 19 Aug 2023 16:59:34 +0100 Subject: [PATCH] darkmode fix for account and pagenumber support filename --- .../api/other/PageNumbersController.java | 2 +- src/main/resources/application.properties | 1 - src/main/resources/messages_en_GB.properties | 3 + src/main/resources/static/css/dark-mode.css | 53 ++++++++++- src/main/resources/static/js/darkmode.js | 95 ++++++++++--------- src/main/resources/templates/account.html | 10 +- .../templates/other/add-page-numbers.html | 4 +- 7 files changed, 111 insertions(+), 57 deletions(-) diff --git a/src/main/java/stirling/software/SPDF/controller/api/other/PageNumbersController.java b/src/main/java/stirling/software/SPDF/controller/api/other/PageNumbersController.java index 9096e64e..92aa8d91 100644 --- a/src/main/java/stirling/software/SPDF/controller/api/other/PageNumbersController.java +++ b/src/main/java/stirling/software/SPDF/controller/api/other/PageNumbersController.java @@ -116,7 +116,7 @@ public class PageNumbersController { Rectangle pageSize = page.getPageSize(); PdfCanvas pdfCanvas = new PdfCanvas(page.newContentStreamAfter(), page.getResources(), pdfDoc); - String text = customText != null ? customText.replace("{n}", String.valueOf(pageNumber)).replace("{total}", String.valueOf(pdfDoc.getNumberOfPages())) : String.valueOf(pageNumber); + String text = customText != null ? customText.replace("{n}", String.valueOf(pageNumber)).replace("{total}", String.valueOf(pdfDoc.getNumberOfPages())).replace("{filename}", file.getOriginalFilename().replaceFirst("[.][^.]+$", "")) : String.valueOf(pageNumber); PdfFont font = PdfFontFactory.createFont(StandardFonts.HELVETICA); float textWidth = font.getWidth(text, fontSize); diff --git a/src/main/resources/application.properties b/src/main/resources/application.properties index 20638f7d..da508e20 100644 --- a/src/main/resources/application.properties +++ b/src/main/resources/application.properties @@ -20,7 +20,6 @@ server.error.include-message=always #logging.level.org.springframework=DEBUG #logging.level.org.springframework.security=DEBUG -#login.enabled=true server.servlet.session.tracking-modes=cookie server.servlet.context-path=${APP_ROOT_PATH:/} diff --git a/src/main/resources/messages_en_GB.properties b/src/main/resources/messages_en_GB.properties index 58fc107f..5ca0bd74 100644 --- a/src/main/resources/messages_en_GB.properties +++ b/src/main/resources/messages_en_GB.properties @@ -374,6 +374,9 @@ addPageNumbers.selectText.3=Position addPageNumbers.selectText.4=Starting Number addPageNumbers.selectText.5=Pages to Number addPageNumbers.selectText.6=Custom Text +addPageNumbers.customTextDesc=Custom Text +addPageNumbers.numberPagesDesc=Which pages to number, default 'all', also accepts 1-5 or 2,5,9 etc +addPageNumbers.customNumberDesc=Defaults to {n}, also accepts 'Page {n} of {total}', 'Text-{n}', '{filename}-{n} addPageNumbers.submit=Add Page Numbers diff --git a/src/main/resources/static/css/dark-mode.css b/src/main/resources/static/css/dark-mode.css index 0e78e4ae..cf2e028d 100644 --- a/src/main/resources/static/css/dark-mode.css +++ b/src/main/resources/static/css/dark-mode.css @@ -1,5 +1,5 @@ /* Dark Mode Styles */ -body { +body, select, textarea { --body-background-color: 51, 51, 51; --base-font-color: 255, 255, 255; background-color: rgb(var(--body-background-color)) !important; @@ -41,4 +41,53 @@ body { .favorite-icon img { filter: brightness(0) invert(1) !important; -} \ No newline at end of file +} +table thead { + background-color: #333 !important; + border: 1px solid #444; +} +table th, table td { + border: 1px solid #444 !important; + color: white; +} +.btn { + background-color: #444 !important; + border: none; + color: #fff !important; +} +.btn-primary { + background-color: #007bff !important; + border: none; + color: #fff !important; +} +.btn-secondary { + background-color: #6c757d !important; + border: none; + color: #fff !important; +} +.btn-info { + background-color: #17a2b8 !important; + border: none; + color: #fff !important; +} +.btn-danger { + background-color: #dc3545 !important; + border: none; + color: #fff !important; +} +.btn-outline-secondary { + color: #fff !important; + border-color: #fff; +} +.btn-outline-secondary:hover { + background-color: #444 !important; + color: #007bff !important; + border-color: #007bff; +} +.blackwhite-icon { + filter: brightness(0) invert(1); +} +hr { + border-color: rgba(255, 255, 255, 0.6); /* semi-transparent white */ + background-color: rgba(255, 255, 255, 0.6); /* for some browsers that might use background instead of border for
*/ +} diff --git a/src/main/resources/static/js/darkmode.js b/src/main/resources/static/js/darkmode.js index c91bfa68..9139e801 100644 --- a/src/main/resources/static/js/darkmode.js +++ b/src/main/resources/static/js/darkmode.js @@ -1,6 +1,44 @@ var toggleCount = 0; var lastToggleTime = Date.now(); +var elements = { + lightModeStyles: null, + darkModeStyles: null, + rainbowModeStyles: null, + darkModeIcon: null +}; + +function getElements() { + elements.lightModeStyles = document.getElementById("light-mode-styles"); + elements.darkModeStyles = document.getElementById("dark-mode-styles"); + elements.rainbowModeStyles = document.getElementById("rainbow-mode-styles"); + elements.darkModeIcon = document.getElementById("dark-mode-icon"); +} + +function setMode(mode) { + elements.lightModeStyles.disabled = mode !== "off"; + elements.darkModeStyles.disabled = mode !== "on"; + elements.rainbowModeStyles.disabled = mode !== "rainbow"; + + if (mode === "on") { + elements.darkModeIcon.src = "moon.svg"; + // Add the table-dark class to tables for dark mode + var tables = document.querySelectorAll('.table'); + tables.forEach(table => { + table.classList.add('table-dark'); + }); + } else if (mode === "off") { + elements.darkModeIcon.src = "sun.svg"; + // Remove the table-dark class for light mode + var tables = document.querySelectorAll('.table-dark'); + tables.forEach(table => { + table.classList.remove('table-dark'); + }); + } else if (mode === "rainbow") { + elements.darkModeIcon.src = "rainbow.svg"; + } +} + function toggleDarkMode() { var currentTime = Date.now(); if (currentTime - lastToggleTime < 1000) { @@ -10,67 +48,32 @@ function toggleDarkMode() { } lastToggleTime = currentTime; - var lightModeStyles = document.getElementById("light-mode-styles"); - var darkModeStyles = document.getElementById("dark-mode-styles"); - var rainbowModeStyles = document.getElementById("rainbow-mode-styles"); - var darkModeIcon = document.getElementById("dark-mode-icon"); - if (toggleCount >= 18) { localStorage.setItem("dark-mode", "rainbow"); - lightModeStyles.disabled = true; - darkModeStyles.disabled = true; - rainbowModeStyles.disabled = false; - darkModeIcon.src = "rainbow.svg"; + setMode("rainbow"); } else if (localStorage.getItem("dark-mode") == "on") { localStorage.setItem("dark-mode", "off"); - lightModeStyles.disabled = false; - darkModeStyles.disabled = true; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "sun.svg"; + setMode("off"); } else { localStorage.setItem("dark-mode", "on"); - lightModeStyles.disabled = true; - darkModeStyles.disabled = false; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "moon.svg"; + setMode("on"); } } document.addEventListener("DOMContentLoaded", function() { - var lightModeStyles = document.getElementById("light-mode-styles"); - var darkModeStyles = document.getElementById("dark-mode-styles"); - var rainbowModeStyles = document.getElementById("rainbow-mode-styles"); - var darkModeIcon = document.getElementById("dark-mode-icon"); + getElements(); - if (localStorage.getItem("dark-mode") == "on") { - lightModeStyles.disabled = true; - darkModeStyles.disabled = false; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "moon.svg"; - } else if (localStorage.getItem("dark-mode") == "off") { - lightModeStyles.disabled = false; - darkModeStyles.disabled = true; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "sun.svg"; - } else if (localStorage.getItem("dark-mode") == "rainbow") { - lightModeStyles.disabled = true; - darkModeStyles.disabled = true; - rainbowModeStyles.disabled = false; - darkModeIcon.src = "rainbow.svg"; + var currentMode = localStorage.getItem("dark-mode"); + if (currentMode === "on" || currentMode === "off" || currentMode === "rainbow") { + setMode(currentMode); + } else if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) { + setMode("on"); } else { - if (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) { - darkModeStyles.disabled = false; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "moon.svg"; - } else { - darkModeStyles.disabled = true; - rainbowModeStyles.disabled = true; - darkModeIcon.src = "sun.svg"; - } + setMode("off"); } document.getElementById("dark-mode-toggle").addEventListener("click", function(event) { event.preventDefault(); toggleDarkMode(); }); -}); \ No newline at end of file +}); diff --git a/src/main/resources/templates/account.html b/src/main/resources/templates/account.html index ceba9cc4..bd01c24e 100644 --- a/src/main/resources/templates/account.html +++ b/src/main/resources/templates/account.html @@ -30,7 +30,7 @@
- +
@@ -44,7 +44,7 @@
- +
@@ -70,13 +70,13 @@
diff --git a/src/main/resources/templates/other/add-page-numbers.html b/src/main/resources/templates/other/add-page-numbers.html index 8972d1cc..9111ab44 100644 --- a/src/main/resources/templates/other/add-page-numbers.html +++ b/src/main/resources/templates/other/add-page-numbers.html @@ -103,12 +103,12 @@ + th:placeholder="#{addPageNumbers.numberPagesDesc}" />
+ th:placeholder="#{addPageNumbers.customNumberDesc}" />