extra fonts plus dynamic fonts

This commit is contained in:
Anthony Stirling 2023-07-09 19:36:41 +01:00
parent a742c1b034
commit 1ddf7abe6f
4 changed files with 46 additions and 27 deletions

View File

@ -1,5 +1,12 @@
package stirling.software.SPDF.controller.web; package stirling.software.SPDF.controller.web;
import java.io.IOException;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.util.List;
import java.util.stream.Collectors;
import org.springframework.stereotype.Controller; import org.springframework.stereotype.Controller;
import org.springframework.ui.Model; import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.GetMapping;
@ -65,8 +72,22 @@ public class GeneralWebController {
@Hidden @Hidden
public String signForm(Model model) { public String signForm(Model model) {
model.addAttribute("currentPage", "sign"); model.addAttribute("currentPage", "sign");
model.addAttribute("fonts", getFontNames());
return "sign"; return "sign";
} }
private List<String> getFontNames() {
try {
return Files.list(Paths.get("src/main/resources/static/fonts"))
.map(Path::getFileName)
.map(Path::toString)
.filter(name -> name.endsWith(".woff2"))
.map(name -> name.substring(0, name.length() - 6)) // Remove .woff2 extension
.collect(Collectors.toList());
} catch (IOException e) {
throw new RuntimeException("Failed to read font directory", e);
}
}
@GetMapping("/crop") @GetMapping("/crop")
@Hidden @Hidden

View File

@ -7,16 +7,20 @@
<script src="js/thirdParty/interact.min.js"></script> <script src="js/thirdParty/interact.min.js"></script>
</head> </head>
<style> <th:block th:each="font : ${fonts}">
@font-face { <style th:inline="text">
font-family: 'Estonia'; @font-face {
src: url(fonts/Estonia.woff2) format('woff2'); font-family: "[[${font}]]";
} src: url('fonts/[[${font}]].woff2') format('woff2');
@font-face { }
font-family: 'Tangerine';
src: url(fonts/Tangerine.woff2) format('woff2'); #font-select option[value="[[${font}]]"] {
} font-family: "[[${font}]]", cursive;
</style> }
</style>
</th:block>
<body> <body>
<div id="page-container"> <div id="page-container">
<div id="content-wrap"> <div id="content-wrap">
@ -169,8 +173,8 @@
<input type="text" class="form-control" id="sigText" name="sigText"> <input type="text" class="form-control" id="sigText" name="sigText">
<label th:text="#{font}"></label> <label th:text="#{font}"></label>
<select class="form-control" name="font" id="font-select"> <select class="form-control" name="font" id="font-select">
<option value="Estonia" class="estonia-font">Estonia</option> <option th:each="font : ${fonts}" th:value="${font}" th:text="${font}" th:class="${font.toLowerCase()+'-font'}"></option>
<option value="Tangerine" class="tangerine-font">Tangerine</option>
</select> </select>
<div class="margin-auto-parent"> <div class="margin-auto-parent">
<button id="save-text-signature" class="btn btn-outline-success mt-2 margin-center" onclick="addDraggableFromText()" th:text="#{sign.add}"></button> <button id="save-text-signature" class="btn btn-outline-success mt-2 margin-center" onclick="addDraggableFromText()" th:text="#{sign.add}"></button>
@ -196,20 +200,14 @@
DraggableUtils.createDraggableCanvasFromUrl(dataURL); DraggableUtils.createDraggableCanvasFromUrl(dataURL);
} }
</script> </script>
<style> <th:block th:each="font : ${fonts}">
#font-select option { <style th:inline="text">
font-size: 30px; #font-select option[value="/*[[${font}]]*/"] {
} font-family: '/*[[${font}]]*/', cursive;
#font-select option[value="Estonia"] {
font-family: 'Estonia', sans-serif;
}
#font-select option[value="Tangerine"] {
font-family: 'Tangerine', cursive;
}
#font-select option[value="Windsong"] {
font-family: 'Windsong', cursive;
} }
</style> </style>
</th:block>
</div> </div>
</div> </div>