Mirrors/Stirling-PDF
Mirrors/Stirling-PDF
1
0
Fork 0
mirror of https://github.com/Frooodle/Stirling-PDF.git synced 2025-09-03 17:52:30 +02:00
Code Issues Packages Projects Releases Wiki Activity

remove sign old

Browse Source
This commit is contained in:
Anthony Stirling 2023-03-25 21:45:40 +00:00
parent 37b3617927
commit bd030888f6
1 changed files with 0 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

145
src/main/resources/templates/sign-pdfold.html
View File

@ -1,145 +0,0 @@
<!DOCTYPE html>
<html th:lang="${#locale.language}" th:lang-direction="#{language.direction}" xmlns:th="http://www.thymeleaf.org">
<head>
<th:block th:insert="~{fragments/common :: head(title=#{extractImages.title})}"></th:block>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.12.313/pdf.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/pdf-lib@1.17.1/dist/pdf-lib.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.5.12/cropper.min.js"></script>
<style>
canvas {
border: 1px solid black;
}
</style>
</head>
<body>
<div id="page-container">
<div id="content-wrap">
<div th:insert="~{fragments/navbar.html :: navbar}"></div>
<br> <br>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-6">
<h2 th:text="#{extractImages.header}"></h2>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PDF Signature App</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.12.313/pdf.min.js"></script>
<script src="https://unpkg.com/pdf-lib@1.18.0/dist/umd/pdf-lib.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/signature_pad@4.1.5/dist/signature_pad.umd.min.js"></script>
<input type="file" id="pdf-upload" accept=".pdf" />
<div>
<canvas id="pdf-canvas"></canvas>
<canvas id="signature-pad" width="400" height="200"></canvas>
</div>
<button id="save-signature">Save Signature</button>
<button id="download-pdf">Download PDF</button>
<script>
const pdfUpload = document.getElementById('pdf-upload');
document.addEventListener('DOMContentLoaded', () => {
const pdfCanvas = document.getElementById('pdf-canvas');
const signatureCanvas = document.getElementById('signature-pad');
const saveSignatureBtn = document.getElementById('save-signature');
const downloadPdfBtn = document.getElementById('download-pdf');
const pdfCtx = pdfCanvas.getContext('2d');
const signaturePad = new SignaturePad(signatureCanvas);
let pdfDoc = null;
let signatureImage = null;
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.12.313/pdf.worker.min.js';
async function loadPdf(pdfData) {
pdfDoc = await pdfjsLib.getDocument({ data: pdfData }).promise;
renderPage(1);
}
pdfUpload.addEventListener('change', async (event) => {
const file = event.target.files[0];
if (file) {
const pdfData = await file.arrayBuffer();
loadPdf(pdfData);
}
});
function renderPage(pageNum) {
pdfDoc.getPage(pageNum).then((page) => {
const viewport = page.getViewport({ scale: 1 });
pdfCanvas.width = viewport.width;
pdfCanvas.height = viewport.height;
const renderCtx = {
canvasContext: pdfCtx,
viewport: viewport,
};
page.render(renderCtx);
});
}
saveSignatureBtn.addEventListener('click', () => {
if (signaturePad.isEmpty()) {
alert('Please provide a signature.');
} else {
signatureImage = signaturePad.toDataURL();
signaturePad.clear();
}
});
downloadPdfBtn.addEventListener('click', async () => {
if (!signatureImage) {
alert('Please save a signature first.');
return;
}
// Load the original PDF
const pdfBytes = await pdfUpload.files[0].arrayBuffer();
const pdfDoc = await PDFLib.PDFDocument.load(pdfBytes);
// Embed the signature image
const signaturePng = await fetch(signatureImage).then((res) => res.arrayBuffer());
const signatureImageObject = await pdfDoc.embedPng(signaturePng);
// Get the page to insert the signature
const [page] = pdfDoc.getPages();
const { width, height } = page.getSize();
// Set the signature dimensions and position (customize this as needed)
const signatureWidth = 200;
const signatureHeight = 100;
const signatureX = width / 2 - signatureWidth / 2;
const signatureY = height / 2 - signatureHeight / 2;
// Add the signature image to the page
page.drawImage(signatureImageObject, {
x: signatureX,
y: signatureY,
width: signatureWidth,
height: signatureHeight,
});
// Serialize the PDF and create a download link
const pdfBytesModified = await pdfDoc.save();
const blob = new Blob([pdfBytesModified], { type: 'application/pdf' });
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = 'signed-document.pdf';
link.click();
});
if (pdfUpload.files[0]) {
(async () => {
if (pdfUpload.files[0]) {
await loadPdf(await pdfUpload.files[0].arrayBuffer());
}
})();
}
});
</script>
</div>
</div>
</div>
</div>
<div th:insert="~{fragments/footer.html :: footer}"></div>
</div>