From b8f216d1666f03c3305b4bcd83b10c2e1f209796 Mon Sep 17 00:00:00 2001 From: Vincent LAURENT Date: Sat, 26 Mar 2022 11:02:47 +0100 Subject: [PATCH] The upload and the signature in a single page and the page is no longer reloaded after the upload --- app.php | 14 ++- public/js/{app.js => signature.js} | 96 +++++++++++++++++-- templates/index.html.php | 74 -------------- .../{pdf.html.php => signature.html.php} | 25 ++++- 4 files changed, 114 insertions(+), 95 deletions(-) rename public/js/{app.js => signature.js} (90%) delete mode 100644 templates/index.html.php rename templates/{pdf.html.php => signature.html.php} (89%) diff --git a/app.php b/app.php index ac12e5b..47aa346 100644 --- a/app.php +++ b/app.php @@ -40,18 +40,16 @@ function convertPHPSizeToBytes($sSize) } $f3->route('GET /', + function($f3) { + $f3->reroute('/signature'); + } +); +$f3->route('GET /signature', function($f3) { $f3->set('maxSize', min(array(convertPHPSizeToBytes(ini_get('post_max_size')), convertPHPSizeToBytes(ini_get('upload_max_filesize'))))); $f3->set('maxPage', ini_get('max_file_uploads') - 1); - echo View::instance()->render('index.html.php'); - } -); -$f3->route('GET /sign', - function($f3) { - $f3->set('maxPage', ini_get('max_file_uploads') - 1); - - echo View::instance()->render('pdf.html.php'); + echo View::instance()->render('signature.html.php'); } ); $f3->route('POST /image2svg', diff --git a/public/js/app.js b/public/js/signature.js similarity index 90% rename from public/js/app.js rename to public/js/signature.js index 965889a..01b9f65 100644 --- a/public/js/app.js +++ b/public/js/signature.js @@ -17,14 +17,11 @@ var menuOffcanvas = null; var currentCursor = null; var signaturePad = null; -var loadPDF = async function(url) { +var loadPDF = async function(pdfBlob, filename) { var pdfjsLib = window['pdfjs-dist/build/pdf']; pdfjsLib.GlobalWorkerOptions.workerSrc = '/vendor/pdf.worker.js?legacy'; - const cache = await caches.open('pdf'); - var responsePdf = await cache.match(url); - var pdfBlob = await responsePdf.blob(); - url = await URL.createObjectURL(pdfBlob); + let url = await URL.createObjectURL(pdfBlob); var dataTransfer = new DataTransfer(); dataTransfer.items.add(new File([pdfBlob], filename, { @@ -161,13 +158,13 @@ var is_mobile = function() { var responsiveDisplay = function() { if(is_mobile()) { - document.body.style.paddingRight = "inherit"; + document.getElementById('page-signature').style.paddingRight = "inherit"; menu.classList.remove('show'); menuOffcanvas.hide(); document.getElementById('container-pages').classList.remove('vh-100'); } else { menuOffcanvas.show(); - document.body.style.paddingRight = "350px"; + document.getElementById('page-signature').style.paddingRight = "350px"; document.getElementById('container-pages').classList.add('vh-100'); } menu.classList.remove('d-md-block'); @@ -879,8 +876,66 @@ var createSignaturePad = function() { }); }; -(function () { +async function getPDFBlobFromCache(cacheUrl) { + const cache = await caches.open('pdf'); + let responsePdf = await cache.match(cacheUrl); + if(!responsePdf) { + return null; + } + + let pdfBlob = await responsePdf.blob(); + + return pdfBlob; +} + +async function uploadFromUrl(url) { + var response = await fetch(url); + if(response.status != 200) { + return; + } + var pdfBlob = await response.blob(); + + if(pdfBlob.type != 'application/pdf' && pdfBlob.type != 'application/octet-stream') { + return; + } + let dataTransfer = new DataTransfer(); + let filename = url.replace(/^.*\//, ''); + dataTransfer.items.add(new File([pdfBlob], filename, { + type: 'application/pdf' + })); + document.getElementById('input_pdf_upload').files = dataTransfer.files; + document.getElementById('input_pdf_upload').dispatchEvent(new Event("change")); +} + +var pageUpload = async function() { + history.replaceState({}, "Signature de PDF", "/signature"); + + document.getElementById('input_pdf_upload').value = ''; + document.getElementById('page-upload').classList.remove('d-none'); + document.getElementById('page-signature').classList.add('d-none'); + document.getElementById('input_pdf_upload').focus(); + const cache = await caches.open('pdf'); + document.getElementById('input_pdf_upload').addEventListener('change', async function(event) { + if(document.getElementById('input_pdf_upload').files[0].size > maxSize) { + + alert("Le PDF ne doit pas dépasser Mo"); + document.getElementById('input_pdf_upload').value = ""; + return; + } + let filename = document.getElementById('input_pdf_upload').files[0].name; + let response = new Response(document.getElementById('input_pdf_upload').files[0], { "status" : 200, "statusText" : "OK" }); + let urlPdf = '/pdf/'+filename; + await cache.put(urlPdf, response); + + history.replaceState({}, "Signature de PDF", '/signature#'+filename); + pageSignature(urlPdf) + }); +} + +var pageSignature = async function(url) { + document.getElementById('page-upload').classList.add('d-none'); + document.getElementById('page-signature').classList.remove('d-none'); fabric.Textbox.prototype._wordJoiners = /[]/; menu = document.getElementById('sidebarTools'); menuOffcanvas = new bootstrap.Offcanvas(menu); @@ -895,11 +950,34 @@ var createSignaturePad = function() { fontCaveat = font; }); + let pdfBlob = await getPDFBlobFromCache(url); + let filename = url.replace('/pdf/', ''); + if(!pdfBlob) { + document.location = '/signature'; + return; + } + createSignaturePad(); responsiveDisplay(); displaysSVG(); stateAddLock(); createEventsListener(); - loadPDF(url); + loadPDF(pdfBlob, filename); +}; +(function () { + if(window.location.hash && window.location.hash.match(/^\#http/)) { + let hashUrl = window.location.hash.replace(/^\#/, ''); + pageUpload(); + uploadFromUrl(hashUrl); + } else if(window.location.hash) { + pageSignature('/pdf/'+window.location.hash.replace(/^\#/, '')); + } else { + pageUpload(); + } + window.addEventListener('hashchange', function() { + //window.location.href = window.location.href; + window.location.reload(); + }) + //pageSignature(url); })(); \ No newline at end of file diff --git a/templates/index.html.php b/templates/index.html.php deleted file mode 100644 index 39757ed..0000000 --- a/templates/index.html.php +++ /dev/null @@ -1,74 +0,0 @@ - - - - - - - - - - Signature PDF - - -
-

Signer un PDF

-
-
- - -

Le PDF ne doit pas dépasser Mo et pages

- Tester avec un PDF de démo -
-
-
- - - - - diff --git a/templates/pdf.html.php b/templates/signature.html.php similarity index 89% rename from templates/pdf.html.php rename to templates/signature.html.php index 24aecde..a751a44 100644 --- a/templates/pdf.html.php +++ b/templates/signature.html.php @@ -10,7 +10,24 @@ Signature PDF - + +
+
+

Signer un PDF

+
+
+ + +

Le PDF ne doit pas dépasser Mo et pages

+ Tester avec un PDF de démo +
+
+
+ +
+
@@ -122,6 +139,7 @@
+ @@ -130,10 +148,9 @@ - +