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

PDF Organisation page for mobile

This commit is contained in:
Vincent LAURENT 2022-03-30 09:52:09 +02:00
parent 2bca27fd42
commit d51f31109f
2 changed files with 13 additions and 9 deletions

View File

@ -1,7 +1,13 @@
var pdfRenderTasks = [];
var pdfPages = [];
var windowWidth = window.innerWidth;
var is_mobile = function() {
return !(window.getComputedStyle(document.getElementById('is_mobile')).display === "none");
};
var nbPagePerLine = 4;
if(is_mobile()) {
nbPagePerLine = 2;
}
var loadPDF = async function(pdfBlob, filename) {
var pdfjsLib = window['pdfjs-dist/build/pdf'];
@ -30,9 +36,11 @@ var loadPDF = async function(pdfBlob, filename) {
canvasContainer.addEventListener('dragstart', function(e) {
this.querySelector('.canvas-pdf').classList.add('shadow-lg');
e.dataTransfer.setData('element', this.id);
this.querySelector('.canvas-pdf').style.opacity = 0.4;
});
canvasContainer.addEventListener('dragend', function(e) {
this.querySelector('.canvas-pdf').classList.remove('shadow-lg');
this.querySelector('.canvas-pdf').style.opacity = 1;
});
canvasContainer.addEventListener('dragover', function(e) {
if (e.preventDefault) {
@ -83,10 +91,6 @@ var loadPDF = async function(pdfBlob, filename) {
});
};
var is_mobile = function() {
return !(window.getComputedStyle(document.getElementById('is_mobile')).display === "none");
};
var stateCheckbox = function(checkbox) {
let checkboxContainer = checkbox.parentNode.parentNode.parentNode;

View File

@ -37,22 +37,22 @@
<input id="input_pdf" name="pdf" type="file" class="d-none" />
<input id="input_pages" type="hidden" value="" name="pages" />
<div class="row">
<div class="col-3">
<div class="col-3 d-none d-sm-none d-md-block">
<div class="form-switch mt-2 ms-2">
<input class="form-check-input" checked="checked" type="checkbox" id="checkbox_all_pages">
<label class="form-check-label" for="checkbox_all_pages">Séléctionner toutes les pages</label>
</div>
</div>
<div class="col-2">
<div class="col-2 d-none d-sm-none d-md-block">
</div>
<div class="col-1">
<div class="col-1 d-none d-sm-none d-md-block">
<select class="form-select">
<option selected>4 pages</option>
</select>
</div>
<div class="col-4">
<div class="col-4 d-none d-sm-none d-md-block">
</div>
<div class="col-2">
<div class="col-sm-12 col-md-2">
<div class="d-grid gap-2">
<button class="btn btn-primary" type="submit" id="save"><i class="bi bi-download"></i> Télécharger le PDF</button>
</div>