deblan-mirror/24eme-signaturepdf
1
0
Fork 0
mirror of https://github.com/24eme/signaturepdf synced 2024-06-19 14:15:29 +02:00
Code Activity

Plus and minus button to change the number of pages displayed per line

Browse source
This commit is contained in:
Vincent LAURENT 2022-04-07 00:13:22 +02:00
parent 720c0ba34d
commit 75813eefaa
2 changed files with 24 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
public/js/organization.js
View file

@ -81,8 +81,9 @@ var loadPDF = async function(pdfBlob, filename, pdfIndex) {
stateCheckboxAll();
});
canvasContainer.querySelector('.btn-rotate').addEventListener('click', function(e) {
console.log(document.querySelector('#input_rotate_'+pageIndex));
pageRender(pageIndex, parseInt(document.querySelector('#input_rotate_'+pageIndex).value) + 90);
let inputRotate = document.querySelector('#input_rotate_'+pageIndex);
inputRotate.value = parseInt(inputRotate.value) + 90;
pageRender(pageIndex);
})
pageRender(pageIndex);
@ -93,8 +94,15 @@ var loadPDF = async function(pdfBlob, filename, pdfIndex) {
});
};
var pageRender = function(pageIndex, rotation = 0) {
var pageRenderAll = function() {
for(pageIndex in pages) {
pageRender(pageIndex);
}
}
var pageRender = function(pageIndex) {
let page = pages[pageIndex];
let rotation = parseInt(document.querySelector('#input_rotate_'+pageIndex).value);
let viewport = page.getViewport({scale: 1, rotation: rotation});
let size = (document.getElementById('container-pages').offsetWidth - (12*nbPagePerLine) - 12) / nbPagePerLine;
let scaleWidth = size / viewport.width;
@ -113,7 +121,6 @@ var pageRender = function(pageIndex, rotation = 0) {
canvasContainer.style.width = (size + 4) + "px";
let canvasPDF = canvasContainer.querySelector('.canvas-pdf');
let context = canvasPDF.getContext('2d');
document.querySelector('#input_rotate_'+pageIndex).value = rotation;
canvasPDF.height = viewport.height;
canvasPDF.width = viewport.width;
@ -177,6 +184,14 @@ var createEventsListener = function() {
loadPDF(pdfBlob, filename, nbPDF);
this.value = '';
});
document.getElementById('btn-zoom-decrease').addEventListener('click', function(event) {
nbPagePerLine++;
pageRenderAll();
});
document.getElementById('btn-zoom-increase').addEventListener('click', function(event) {
nbPagePerLine--;
pageRenderAll();
});
}
async function getPDFBlobFromCache(cacheUrl) {

13
templates/organization.html.php
View file

@ -35,7 +35,7 @@
</footer>
</div>
<div id="page-organization" class="d-none">
<div id="container-pages" class="col-12 pt-1 vh-100 d-flex flex-wrap" style="padding-bottom: 60px;">
<div id="container-pages" class="col-12 pt-1 vh-100 d-flex align-content-start flex-wrap" style="padding-bottom: 60px;">
</div>
<div id="container-bar" class="position-fixed bottom-0 start-0 bg-white w-100 p-2 shadow-lg">
<form id="form_pdf" action="/organize" method="post" enctype="multipart/form-data">
@ -51,13 +51,10 @@
<div class="col-2 d-none d-sm-none d-md-block">
</div>
<div class="col-1 d-none d-sm-none d-md-block">
<select class="form-select">
<option>3 pages</option>
<option>4 pages</option>
<option selected>5 pages</option>
<option>8 pages</option>
<option>10 pages</option>
</select>
<div class="btn-group">
<button id="btn-zoom-decrease" type="button" class="btn btn-outline-dark"><i class="bi bi-dash"></i></button>
<button id="btn-zoom-increase" type="button" class="btn btn-outline-dark"><i class="bi bi-plus"></i></button>
</div>
</div>
<div class="col-2 d-none d-sm-none d-md-block">
</div>