1
0
mirror of https://github.com/24eme/signaturepdf.git synced 2023-08-25 09:33:08 +02:00

Transformation du texte avec une police originale en chemin svg

This commit is contained in:
Vincent LAURENT 2021-09-20 22:49:44 +02:00
parent 6d50b1a87e
commit c563595bd2
4 changed files with 16 additions and 7 deletions

BIN
font/Caveat-Regular.ttf Normal file

Binary file not shown.

View File

@ -5,10 +5,17 @@ var pdfjsLib = window['pdfjs-dist/build/pdf'];
// The workerSrc property shall be specified.
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://mozilla.github.io/pdf.js/build/pdf.worker.js';
// Asynchronous download of PDF
var loadingTask = pdfjsLib.getDocument(url);
loadingTask.promise.then(function(pdf) {
var fontCaveat = null;
opentype.load('font/Caveat-Regular.ttf', function(err, font) {
fontCaveat = font;
});
var signaturePad = new SignaturePad(document.getElementById('signature-pad'), {
backgroundColor: 'rgba(255, 255, 255, 0)',
penColor: 'rgb(0, 0, 0)',
@ -99,12 +106,11 @@ loadingTask.promise.then(function(pdf) {
}
if(document.getElementById('radio_signature_text').checked) {
var textSignature = new fabric.Text(document.getElementById('input-text-signature').value, {
fontFamily: 'Caveat'
});
textSignature.top = y - (textSignature.getScaledHeight() / 2);
textSignature.left = x - (textSignature.getScaledWidth() / 2);
canvasEdition.add(textSignature).renderAll();
var fontPath = fontCaveat.getPath(document.getElementById('input-text-signature').value, 0, 0, 42);
var fabricPath = new fabric.Path(fontPath.toPathData());
fabricPath.top = y - (fabricPath.getScaledHeight() / 2);
fabricPath.left = x - (fabricPath.getScaledWidth() / 2);
canvasEdition.add(fabricPath).renderAll();
}
if(document.getElementById('radio_signature_text_classic').checked) {

2
js/opentype.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -20,7 +20,7 @@
<aside class="col-lg-2 col-md-3 col-sm-4 col-xs-6 mt-2 position-fixed end-0 bg-white">
<div class="form-check form-switch float-end"><input class="form-check-input" type="radio" name="radio_signature" id="radio_signature_pad"></div>
<h5><i class="bi bi-vector-pen"></i> À main lever</h5>
<canvas id="signature-pad" class="border bg-light" width=200 height=150></canvas>
<canvas id="signature-pad" class="border bg-light" width=235 height=125></canvas>
<hr />
<div class="form-check form-switch float-end"><input class="form-check-input" type="radio" name="radio_signature" id="radio_signature_text"></div>
<h5><i class="bi bi-fonts"></i> Texte à la main</h5>
@ -54,5 +54,6 @@
var url = '/data/<?php echo $key ?>.pdf';
</script>
<script src="/js/app.js"></script>
<script src="/js/opentype.min.js"></script>
</body>
</html>