undo wrong commit file for sign
This commit is contained in:
parent
acda1e4dd8
commit
32bace863c
2 changed files with 13 additions and 41 deletions
|
@ -37,6 +37,14 @@ public class OtherWebController {
|
||||||
return "other/extract-images";
|
return "other/extract-images";
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@GetMapping("/flatten")
|
||||||
|
@Hidden
|
||||||
|
public String flattenForm(Model model) {
|
||||||
|
model.addAttribute("currentPage", "flatten");
|
||||||
|
return "other/flatten";
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@GetMapping("/change-metadata")
|
@GetMapping("/change-metadata")
|
||||||
@Hidden
|
@Hidden
|
||||||
|
|
|
@ -60,11 +60,8 @@
|
||||||
<div class = "btn-group">
|
<div class = "btn-group">
|
||||||
<input type="radio" class="btn-check" name="signature-type" id="draw-signature" autocomplete="off" checked>
|
<input type="radio" class="btn-check" name="signature-type" id="draw-signature" autocomplete="off" checked>
|
||||||
<label class="btn btn-outline-secondary" for="draw-signature">Draw signature</label>
|
<label class="btn btn-outline-secondary" for="draw-signature">Draw signature</label>
|
||||||
<input type="radio" class="btn-check" name="signature-type" id="generate-signature" autocomplete="off">
|
|
||||||
<label class="btn btn-outline-secondary" for="generate-signature">Generate Signature</label>
|
|
||||||
<input type="radio" class="btn-check" name="signature-type" id="import-image" autocomplete="off">
|
<input type="radio" class="btn-check" name="signature-type" id="import-image" autocomplete="off">
|
||||||
<label class="btn btn-outline-secondary" for="import-image">Import image</label>
|
<label class="btn btn-outline-secondary" for="import-image">Import image</label>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div th:replace="~{fragments/common :: fileSelector(name='signature-upload', multiple=false, accept='image/*', inputText=#{imgPrompt})}"></div>
|
<div th:replace="~{fragments/common :: fileSelector(name='signature-upload', multiple=false, accept='image/*', inputText=#{imgPrompt})}"></div>
|
||||||
|
@ -75,11 +72,7 @@
|
||||||
<button id="clear-signature" class="btn btn-outline-danger mt-2">Clear</button>
|
<button id="clear-signature" class="btn btn-outline-danger mt-2">Clear</button>
|
||||||
<button id="save-signature" class="btn btn-outline-success mt-2">Save</button>
|
<button id="save-signature" class="btn btn-outline-success mt-2">Save</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="signature-text-input-container" style="display: none;">
|
|
||||||
<input type="text" id="signature-text-input" class="form-control mt-2" placeholder="Type your signature here...">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div id="pdf-container">
|
<div id="pdf-container">
|
||||||
<canvas id="pdf-canvas"></canvas>
|
<canvas id="pdf-canvas"></canvas>
|
||||||
<canvas id="signature-canvas" hidden style="position: absolute;" data-scale="1"></canvas>
|
<canvas id="signature-canvas" hidden style="position: absolute;" data-scale="1"></canvas>
|
||||||
|
@ -96,7 +89,6 @@
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
const pdfUpload = document.querySelector('input[name=pdf-upload]');
|
const pdfUpload = document.querySelector('input[name=pdf-upload]');
|
||||||
const signatureUpload = document.querySelector('input[name=signature-upload]');
|
const signatureUpload = document.querySelector('input[name=signature-upload]');
|
||||||
const signatureTextInput = document.querySelector('input[name=signatureTextInput]');
|
|
||||||
const pdfCanvas = document.getElementById('pdf-canvas');
|
const pdfCanvas = document.getElementById('pdf-canvas');
|
||||||
const signatureCanvas = document.getElementById('signature-canvas');
|
const signatureCanvas = document.getElementById('signature-canvas');
|
||||||
const downloadPdfBtn = document.getElementById('download-pdf');
|
const downloadPdfBtn = document.getElementById('download-pdf');
|
||||||
|
@ -132,44 +124,17 @@
|
||||||
signaturePad.clear();
|
signaturePad.clear();
|
||||||
});
|
});
|
||||||
|
|
||||||
$("input[name=signature-type]").change(function () {
|
$("input[name=signature-type]").change(function() {
|
||||||
const drawSignatureInput = document.getElementById("draw-signature");
|
const drawSignatureInput = document.getElementById('draw-signature');
|
||||||
const generateSignatureInput = document.getElementById("generate-signature");
|
signaturePadContainer.style.display = drawSignatureInput.checked ? 'block' : 'none';
|
||||||
const importImageInputContainer = document.querySelector("input[name=signature-upload]").closest(".custom-file-chooser");
|
document.querySelector('input[name=signature-upload]').closest(".custom-file-chooser").style.display = drawSignatureInput.checked ? 'none' : 'block';
|
||||||
signaturePadContainer.style.display = drawSignatureInput.checked ? "block" : "none";
|
|
||||||
importImageInputContainer.style.display = drawSignatureInput.checked ? "none" : (generateSignatureInput.checked ? "none" : "block");
|
|
||||||
document.getElementById("signature-text-input-container").style.display = generateSignatureInput.checked ? "block" : "none";
|
|
||||||
|
|
||||||
if (drawSignatureInput.checked) {
|
if (drawSignatureInput.checked) {
|
||||||
populateSignatureFromPad();
|
populateSignatureFromPad();
|
||||||
} else if (generateSignatureInput.checked) {
|
|
||||||
populateSignatureFromText();
|
|
||||||
} else {
|
} else {
|
||||||
populateSignatureFromFileUpload();
|
populateSignatureFromFileUpload();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
function populateSignatureFromText() {
|
|
||||||
const signatureText = document.getElementById("signature-text-input").value;
|
|
||||||
if (!signatureText) return;
|
|
||||||
|
|
||||||
const canvas = document.createElement("canvas");
|
|
||||||
const ctx = canvas.getContext("2d");
|
|
||||||
ctx.font = "32px Arial";
|
|
||||||
const textMetrics = ctx.measureText(signatureText);
|
|
||||||
|
|
||||||
canvas.width = textMetrics.width;
|
|
||||||
canvas.height = parseInt(ctx.font, 10);
|
|
||||||
|
|
||||||
ctx.fillStyle = "black";
|
|
||||||
ctx.font = "32px Arial";
|
|
||||||
ctx.fillText(signatureText, 0, canvas.height * 0.8);
|
|
||||||
|
|
||||||
const dataURL = canvas.toDataURL();
|
|
||||||
populateSignature(dataURL);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function populateSignature(imgUrl) {
|
function populateSignature(imgUrl) {
|
||||||
const img = new Image();
|
const img = new Image();
|
||||||
|
@ -219,7 +184,6 @@
|
||||||
populateSignature(dataURL);
|
populateSignature(dataURL);
|
||||||
}
|
}
|
||||||
signatureUpload.addEventListener('change', populateSignatureFromFileUpload);
|
signatureUpload.addEventListener('change', populateSignatureFromFileUpload);
|
||||||
signatureTextInput.addEventListener('change', populateSignatureFromText);
|
|
||||||
saveSignatureBtn.addEventListener('click', populateSignatureFromPad);
|
saveSignatureBtn.addEventListener('click', populateSignatureFromPad);
|
||||||
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue