2022-03-28 00:56:00 +02:00
<! doctype html >
< html lang = " fr_FR " >
< head >
<!-- Required meta tags -->
< meta charset = " utf-8 " >
< meta name = " viewport " content = " width=device-width, initial-scale=1 " >
< link href = " /vendor/bootstrap.min.css?5.1.1 " rel = " stylesheet " >
< link href = " /vendor/bootstrap-icons.css?1.5.0 " rel = " stylesheet " >
2022-10-08 01:34:31 +02:00
< link href = " /css/app.css?202210080134 " rel = " stylesheet " >
2022-03-28 00:56:00 +02:00
< link rel = " icon " type = " image/x-icon " href = " /favicon-organization.ico " >
< title > Organiser un PDF </ title >
</ head >
2022-05-08 23:07:24 +02:00
< body >
2022-04-01 14:41:58 +02:00
< noscript >
< div class = " alert alert-danger text-center " role = " alert " >
< i class = " bi bi-exclamation-triangle " ></ i > Site non fonctionnel sans JavaScript activé
</ div >
</ noscript >
2022-03-28 00:56:00 +02:00
< div id = " page-upload " >
2022-05-08 23:07:24 +02:00
< ul class = " nav justify-content-center nav-tabs mt-2 " >
< li class = " nav-item " >
< a class = " nav-link " href = " /signature " >< i class = " bi bi-vector-pen " ></ i > Signer </ a >
</ li >
< li class = " nav-item " >
< a class = " nav-link active " href = " /organization " >< i class = " bi bi-ui-checks-grid " ></ i > Organiser </ a >
</ li >
</ ul >
2022-10-16 23:38:37 +02:00
< div class = " px-4 py-4 text-center " >
< h1 class = " display-5 fw-bold mb-0 mt-3 " >< i class = " bi bi-ui-checks-grid " ></ i > Organiser des PDF </ h1 >
< p class = " fw-light mb-3 subtitle text-dark text-nowrap " style = " overflow: hidden; text-overflow: ellipsis; " > Fusionner , trier , pivoter , supprimer , extraire des pages </ p >
2022-05-07 11:11:40 +02:00
< div class = " col-md-6 col-lg-5 col-xl-4 col-xxl-3 mx-auto " >
2022-03-28 00:56:00 +02:00
< div class = " col-12 " >
2022-10-17 15:31:43 +02:00
< label class = " form-label mt-3 " for = " input_pdf_upload " > Choisir un PDF < small class = " opacity-75 " style = " cursor: help " title = " Le PDF ne doit pas dépasser <?php echo round( $maxSize / 1024 / 1024) ?> Mo " >< i class = " bi bi-info-circle " ></ i ></ small ></ label >
2022-05-07 11:11:40 +02:00
< input id = " input_pdf_upload " placeholder = " Choisir un PDF " class = " form-control form-control-lg " type = " file " accept = " .pdf,application/pdf " />
2022-10-16 23:38:37 +02:00
< p class = " mt-2 small fw-light text-dark " > Le PDF sera traité par le serveur sans être conservé ni stocké </ p >
2022-05-07 11:11:40 +02:00
< a class = " btn btn-sm btn-link opacity-75 " href = " #https://raw.githubusercontent.com/24eme/signaturepdf/master/tests/files/document.pdf " > Tester avec un PDF de démo </ a >
2022-03-28 00:56:00 +02:00
</ div >
</ div >
</ div >
2022-10-10 23:26:20 +02:00
< footer class = " text-center text-muted mb-2 fixed-bottom opacity-75 " >
2022-10-10 23:19:41 +02:00
< small > Logiciel libre < span class = " d-none d-md-inline " > sous license AGPL - 3.0 </ span >: < a href = " https://github.com/24eme/signaturepdf " > voir le code source </ a ></ small >
2022-03-28 00:56:00 +02:00
</ footer >
</ div >
2022-04-10 01:35:35 +02:00
< div id = " page-organization " style = " padding-right: 350px; " class = " d-none " >
2022-10-11 00:57:47 +02:00
< div id = " div-margin-top " style = " height: 88px; " class = " d-md-none " ></ div >
2022-10-17 15:44:48 +02:00
< div style = " top: 62px; " class = " w-100 position-absolute text-center text-muted opacity-50 d-md-none " >< em > Toucher une page pour la sélectionner </ em ></ div >
2022-10-14 00:22:47 +02:00
< div id = " container-main " >
< div id = " container-pages " class = " col-12 pt-1 vh-100 d-flex align-content-start flex-wrap position-relative " style = " overflow-y: scroll; overflow-x: hidden; " >
</ div >
2022-04-28 19:09:56 +02:00
</ div >
2022-05-24 00:43:34 +02:00
< div id = " container-btn-zoom " class = " btn-group-vertical position-fixed " style = " top: 6px; right: 368px; " >
2022-04-28 19:09:56 +02:00
< button id = " btn-zoom-increase " class = " btn btn-outline-dark bg-white text-dark " >< i class = " bi bi-zoom-in " ></ i ></ button >
< button id = " btn-zoom-decrease " class = " btn btn-outline-dark bg-white text-dark " >< i class = " bi bi-zoom-out " ></ i ></ button >
2022-03-28 00:56:00 +02:00
</ div >
2022-10-08 11:05:03 +02:00
< div id = " div-margin-bottom " style = " height: 55px; " class = " d-md-none " ></ div >
2022-04-10 01:35:35 +02:00
< div class = " offcanvas offcanvas-end show d-none d-md-block shadow-sm " data - bs - backdrop = " false " data - bs - scroll = " true " data - bs - keyboard = " false " tabindex = " -1 " id = " sidebarTools " aria - labelledby = " sidebarToolsLabel " >
< a class = " btn btn-close btn-sm position-absolute opacity-25 d-none d-sm-none d-md-block " title = " Fermer ce PDF et retourner à l'accueil " style = " position: absolute; top: 2px; right: 2px; font-size: 10px; " href = " /organization " ></ a >
< div class = " offcanvas-header mb-0 pb-0 " >
< h5 class = " mb-1 d-block w-100 " id = " sidebarToolsLabel " > Organisation de PDF < span class = " float-end me-2 " title = " Ce PDF est stocké sur votre ordinateur pour être signé par vous uniquement " >< i class = " bi-ui-checks-grid " ></ i ></ span ></ h5 >
< button type = " button " class = " btn-close text-reset d-md-none " data - bs - dismiss = " offcanvas " aria - label = " Close " ></ button >
</ div >
2022-05-23 23:57:14 +02:00
< div class = " offcanvas-body pt-3 " style = " padding-bottom: 60px; " >
2022-10-17 00:49:32 +02:00
< div id = " list_pdf_container " >
< ul id = " list_pdf " class = " list-group " >
</ ul >
</ div >
2022-04-28 19:09:56 +02:00
< div class = " d-grid gap-2 mt-2 " >
2022-05-07 01:17:03 +02:00
< button type = " button " class = " btn btn-sm btn-outline-dark " onclick = " document.getElementById('input_pdf_upload_2').click(); " >< i class = " bi bi-plus-circle " ></ i > Ajouter un PDF </ button >
2022-05-23 23:57:14 +02:00
< input id = " input_pdf_upload_2 " class = " form-control d-none " type = " file " accept = " .pdf,application/pdf " multiple = " true " >
2022-04-28 19:09:56 +02:00
</ div >
2022-05-17 01:54:45 +02:00
< hr />
2022-05-18 10:04:49 +02:00
< div id = " container_btn_select " class = " opacity-50 card " >
2022-10-17 15:44:48 +02:00
< div class = " card-header small text-center p-1 " >< span > Aucune </ span > page ( s ) sélectionnée ( s ) < button id = " btn_cancel_select " type = " button " class = " btn-close btn-close-white float-end " aria - label = " Close " ></ button ></ div >
2022-05-21 01:43:49 +02:00
< div class = " card-body d-grid gap-2 p-2 " >
< button id = " btn_rotate_select " disabled = " disabled " type = " button " class = " btn btn-sm btn-outline-secondary " >< i class = " bi bi-arrow-clockwise " ></ i > Tourner de 90 ° </ button >
2022-10-08 01:07:49 +02:00
< button id = " btn_drag_select " disabled = " disabled " type = " button " class = " btn btn-sm btn-outline-secondary " >< i class = " bi bi-arrows-move " ></ i > Déplacer </ button >
2022-05-21 01:43:49 +02:00
< button id = " btn_delete_select " disabled = " disabled " type = " button " class = " btn btn-sm btn-outline-secondary " >< i class = " bi bi-trash " ></ i > Supprimer </ button >
< button id = " save-select " class = " btn btn-sm btn-outline-secondary " disabled = " disabled " form = " form_pdf " type = " submit " >< i class = " bi bi-download " ></ i > Télécharger </ button >
2022-05-18 10:04:49 +02:00
</ div >
2022-10-17 15:44:48 +02:00
< div class = " card-footer d-none small text-center p-1 border-primary bg-primary bg-opacity-25 " >< a id = " btn_cancel_select_footer " type = " button " aria - label = " Close " style = " text-decoration: none; " class = " text-primary " >< i class = " bi bi-x-lg " ></ i > Annuler la sélection </ a ></ div >
2022-05-17 01:54:45 +02:00
</ div >
2022-04-10 01:35:35 +02:00
< div class = " position-absolute bottom-0 pb-2 ps-0 pe-4 w-100 " >
< form id = " form_pdf " action = " /organize " method = " post " enctype = " multipart/form-data " >
< input id = " input_pdf " name = " pdf[] " type = " file " class = " d-none " />
< input id = " input_pages " type = " hidden " value = " " name = " pages " />
2022-05-18 21:28:49 +02:00
< div class = " d-grid gap-2 mt-2 " >
2022-10-17 15:50:46 +02:00
< button class = " btn btn-primary " type = " submit " id = " save " >< i class = " bi bi-download " ></ i > Télécharger le PDF complet </ button >
2022-03-29 01:05:43 +02:00
</ div >
2022-04-10 01:35:35 +02:00
</ form >
</ div >
</ div >
2022-03-28 00:56:00 +02:00
</ div >
2022-10-07 23:45:33 +02:00
< div id = " top_bar " class = " position-fixed top-0 start-0 bg-white w-100 shadow-sm d-md-none p-2 " >
2022-10-15 01:51:00 +02:00
< div id = " top_bar_action " >
< div class = " d-flex " role = " group " >
2022-10-17 00:49:32 +02:00
< button id = " btn_liste_pdf " type = " button " data - bs - toggle = " modal " data - bs - target = " #modalFichier " class = " btn btn-dark flex-grow-1 me-2 " style = " white-space: nowrap; overflow: hidden; text-overflow: ellipsis; " >
2022-10-07 23:45:33 +02:00
< i class = " bi bi-files " ></ i > < span id = " liste_pdf_titre_mobile " ></ span >
</ button >
2022-10-15 01:51:00 +02:00
< button type = " button " class = " btn btn-outline-dark position-relative " style = " padding-left: 30px; " onclick = " document.getElementById('input_pdf_upload_2').click(); this.blur(); " >< i class = " bi bi-plus-circle position-absolute " style = " left: 10px; " ></ i > Ajouter & nbsp ; un & nbsp ; PDF </ button >
2022-10-07 23:45:33 +02:00
</ div >
</ div >
< div id = " top_bar_action_selection " class = " d-none " >
2022-10-17 00:49:32 +02:00
< div id = " top_bar_action_selection_recap " class = " bg-primary text-white text-center rounded-top p-1 position-relative " >< button id = " btn_liste_pdf_bar " type = " button " style = " text-decoration: none;left: 0px; top:0px; " class = " btn bg-white bg-opacity-50 text-primary position-absolute p-0 ps-1 pe-1 mt-1 ms-1 " >< i class = " bi bi-files " ></ i >& nbsp ; < span ></ span > PDF </ button >< span id = " top_bar_action_selection_recap_nb_pages " > Aucune </ span > page ( s ) < button id = " btn_cancel_select_mobile " type = " button " style = " text-decoration: none;right: 0px; top:0px; " class = " btn bg-white bg-opacity-50 text-primary position-absolute p-0 ps-1 pe-1 mt-1 me-1 " >< i class = " bi bi-x-lg " ></ i >& nbsp ; Annuler </ button ></ div >
2022-10-07 23:45:33 +02:00
< div class = " btn-group w-100 " >
< button id = " btn_rotate_select_mobile " type = " button " class = " btn btn-outline-primary " style = " border-top-left-radius: 0 !important; " >< i class = " bi bi-arrow-clockwise " ></ i > Tourner </ button >
2022-10-08 01:07:49 +02:00
< button id = " btn_drag_select_mobile " type = " button " class = " btn btn-outline-primary " >< i class = " bi bi-arrows-move " ></ i > Déplacer </ button >
2022-10-07 23:45:33 +02:00
< button id = " btn_delete_select_mobile " type = " button " class = " btn btn-outline-primary " style = " border-top-right-radius: 0 !important; " >< i class = " bi bi-trash " ></ i > Supprimer </ button >
</ div >
</ div >
2022-05-24 00:43:34 +02:00
</ div >
2022-10-07 23:45:33 +02:00
< div id = " bottom_bar " class = " position-fixed bottom-0 start-0 bg-white w-100 p-2 shadow-sm d-md-none " >
< div id = " bottom_bar_action " class = " d-grid gap-2 " >
2022-10-17 15:50:46 +02:00
< button class = " btn btn-primary " type = " submit " id = " save_mobile " >< i class = " bi bi-download " ></ i > Télécharger le PDF complet </ button >
2022-05-21 10:05:17 +02:00
</ div >
2022-10-07 23:45:33 +02:00
< div id = " bottom_bar_action_selection " class = " d-grid gap-2 d-none " >
2022-10-17 15:44:48 +02:00
< button id = " save-select_mobile " class = " btn btn-outline-primary " type = " submit " form = " form_pdf " >< i class = " bi bi-download " ></ i > Télécharger la sélection </ button >
2022-10-07 23:45:33 +02:00
</ div >
2022-05-21 10:01:17 +02:00
</ div >
</ div >
2022-10-14 00:22:47 +02:00
< div class = " modal fade " id = " modalDrag " tabindex = " -1 " >
< div class = " modal-dialog modal-dialog-scrollable modal-xl modal-fullscreen-md-down " >
< div class = " modal-content " >
< div class = " modal-header " >
2022-10-14 00:25:26 +02:00
< h5 class = " modal-title " > Déplacement de page ( s ) </ h5 >
2022-10-14 00:22:47 +02:00
< button type = " button " class = " btn-close " data - bs - dismiss = " modal " aria - label = " Close " ></ button >
</ div >
< div class = " modal-body bg-light ps-5 " >
</ div >
</ div >
</ div >
</ div >
2022-10-17 00:49:32 +02:00
< div class = " modal fade " id = " modalFichier " tabindex = " -1 " >
< div class = " modal-dialog " >
< div class = " modal-content " >
< div class = " modal-header " >
< h1 class = " modal-title fs-5 " id = " exampleModalLabel " > Documents PDF </ h1 >
< button type = " button " class = " btn-close " data - bs - dismiss = " modal " aria - label = " Close " ></ button >
</ div >
< div class = " modal-body " >
</ div >
</ div >
</ div >
</ div >
2022-05-21 10:05:17 +02:00
2022-03-28 00:56:00 +02:00
< span id = " is_mobile " class = " d-md-none " ></ span >
< script src = " /vendor/bootstrap.min.js?5.1.3 " ></ script >
< script src = " /vendor/pdf.js?legacy " ></ script >
< script >
var maxSize = < ? php echo $maxSize ?> ;
</ script >
2022-10-18 00:02:41 +02:00
< script src = " /js/organization.js?2022101800002 " ></ script >
2022-03-28 00:56:00 +02:00
</ body >
</ html >