2021-05-04 00:30:20 +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 " >
2021-09-22 00:21:35 +02:00
< link href = " /vendor/bootstrap.min.css?5.1.1 " rel = " stylesheet " >
< link href = " /vendor/bootstrap-icons.css?1.5.0 " rel = " stylesheet " >
2021-09-22 00:42:33 +02:00
< style >
@ font - face {
font - family : 'Caveat' ;
font - style : normal ;
font - weight : 400 ;
src : url ( / vendor / fonts / Caveat - Regular . ttf ) format ( 'truetype' );
}
2021-10-02 01:27:59 +02:00
2021-10-07 01:38:44 +02:00
. offcanvas . list - item - add label : hover , . offcanvas . list - item - add label : active , . offcanvas . list - item - add label . active , . offcanvas . list - item - add . btn - check : active + . btn - outline - secondary , . offcanvas . list - item - add . btn - check : checked + . btn - outline - secondary {
2021-10-03 09:43:22 +02:00
background : #c9d1d8;
2021-10-02 01:27:59 +02:00
border : 1 px solid #000;
box - shadow : 0 . 25 rem . 5 rem rgba ( 0 , 0 , 0 , . 075 ) ! important
}
2021-09-22 00:42:33 +02:00
</ style >
2021-05-04 00:30:20 +02:00
< title > Signature PDF </ title >
</ head >
< body >
< div class = " container-fluid " >
< div class = " row " >
2021-10-07 01:38:44 +02:00
< div id = " container-pages " class = " col-lg-9 col-md-9 col-sm-12 col-xs-12 bg-light text-center " ></ div >
</ div >
< div class = " offcanvas offcanvas-end show d-none d-md-block " data - bs - backdrop = " false " data - bs - scroll = " true " data - keyboard = " false " tabindex = " -1 " id = " offcanvasTop " aria - labelledby = " offcanvasTopLabel " >
< div class = " offcanvas-header " >
< h5 id = " offcanvasTopLabel " > Signature du PDF </ h5 >
< button type = " button " class = " btn-close text-reset d-md-none " data - bs - dismiss = " offcanvas " aria - label = " Close " ></ button >
</ div >
< div class = " offcanvas-body " >
< div id = " svg_list_signature " class = " list-item-add " ></ div >
< div class = " d-grid gap-2 mb-2 list-item-add " >
< input type = " radio " class = " btn-check " id = " radio_svg_signature_add " name = " svg_2_add " autocomplete = " off " value = " signature " >
< label data - bs - toggle = " modal " data - bs - target = " #modalAddSvg " data - type = " signature " class = " btn btn-outline-secondary text-black text-start btn-add-svg-type " for = " radio_svg_signature_add " >< i class = " bi bi-vector-pen " ></ i > Signature < small class = " text-muted float-end " > Ajouter </ small ></ label >
</ div >
< div id = " svg_list_initials " class = " list-item-add " ></ div >
< div class = " d-grid gap-2 mb-2 list-item-add " >
< input type = " radio " class = " btn-check " id = " radio_svg_initials_add " name = " svg_2_add " autocomplete = " off " value = " intials " >
< label data - bs - toggle = " modal " data - bs - target = " #modalAddSvg " data - type = " initials " data - modalnav = " #nav-type-tab " class = " btn btn-outline-secondary text-black text-start btn-add-svg-type " for = " radio_svg_initials_add " >< i class = " bi bi-type " ></ i > Paraphe < small class = " text-muted float-end " > Ajouter </ small ></ label >
</ div >
< div id = " svg_list_rubber_stamber " class = " list-item-add " ></ div >
< div class = " d-grid gap-2 mb-2 list-item-add " >
< input type = " radio " class = " btn-check " id = " radio_svg_rubber_stamber_add " name = " svg_2_add " autocomplete = " off " value = " rubber_stamber " >
< label data - bs - toggle = " modal " data - bs - target = " #modalAddSvg " data - type = " rubber_stamber " data - modalnav = " #nav-import-tab " class = " btn btn-outline-secondary text-black text-start btn-add-svg-type " for = " radio_svg_rubber_stamber_add " >< i class = " bi bi-card-text " ></ i > Tampon < small class = " text-muted float-end " > Ajouter </ small ></ label >
</ div >
< div class = " d-grid gap-2 mb-2 list-item-add " >
< input type = " radio " class = " btn-check " id = " radio_svg_text " name = " svg_2_add " autocomplete = " off " value = " text " >
< label draggable = " true " style = " cursor: grab; " class = " btn btn-outline-secondary text-black text-start btn-svg " for = " radio_svg_text " >< i class = " bi bi-textarea-t " ></ i > Texte </ label >
</ div >
< div id = " svg_list " class = " d-grid gap-2 mt-2 mb-2 list-item-add " ></ div >
2021-10-03 09:34:05 +02:00
2021-10-07 01:38:44 +02:00
< div class = " d-grid gap-2 mt-2 " >
< button type = " button " id = " btn-add-svg " class = " btn btn-sm btn-light " data - bs - toggle = " modal " data - bs - target = " #modalAddSvg " >< i class = " bi bi-plus-circle " ></ i > Ajouter un élément </ button >
</ div >
2021-10-02 00:36:44 +02:00
2021-10-07 01:38:44 +02:00
< form class = " position-absolute bottom-0 pb-2 ps-0 pe-4 w-100 d-none d-sm-none d-md-block " id = " form_pdf " action = " /<?php echo $key ?>/save " method = " post " >
< div class = " d-grid gap-2 mt-2 " >
< button class = " btn btn-primary " disabled = " disabled " type = " submit " id = " save " >< i class = " bi bi-download " ></ i > Télécharger le PDF Signé </ button >
2021-05-04 00:30:20 +02:00
</ div >
2021-10-07 01:38:44 +02:00
</ form >
</ div >
</ div >
< div class = " position-fixed top-0 start-0 bg-white w-100 p-2 shadow d-md-none " >
< div class = " d-grid gap-2 " >
2021-10-07 09:29:58 +02:00
< button id = " btn_svn_select " class = " btn btn-light btn-lg " data - bs - toggle = " offcanvas " data - bs - target = " #offcanvasTop " aria - controls = " offcanvasTop " >< i class = " bi bi-hand-index " ></ i > Séléctionner une signature </ button >
2021-10-07 01:38:44 +02:00
</ div >
< div id = " svg_selected_container " class = " d-grid gap-2 d-none " >
< div class = " btn-group " >
< button class = " btn btn-outline-secondary " >< img id = " svg_selected " src = " " style = " max-height: 40px; " class = " img-fluid " /></ button >
< button class = " btn btn-link " data - bs - toggle = " offcanvas " data - bs - target = " #offcanvasTop " aria - controls = " offcanvasTop " > Changer </ button >
</ div >
</ div >
</ div >
< div class = " position-fixed bottom-0 start-0 bg-white w-100 p-2 shadow d-md-none " >
< div class = " d-grid gap-2 " >
< button class = " btn btn-primary " disabled = " disabled " type = " submit " id = " save_mobile " >< i class = " bi bi-download " ></ i > Télécharger le PDF Signé </ button >
</ div >
2021-05-04 00:30:20 +02:00
</ div >
</ div >
2021-09-21 19:41:11 +02:00
2021-09-25 15:01:22 +02:00
< div class = " modal fade " id = " modalAddSvg " tabindex = " -1 " aria - labelledby = " exampleModalLabel " aria - hidden = " true " >
< div class = " modal-dialog " >
< div class = " modal-content " >
< div class = " modal-body " >
< nav >
< div class = " nav nav-tabs " id = " nav-tab " role = " tablist " >
< button class = " nav-link active " id = " nav-draw-tab " data - bs - toggle = " tab " data - bs - target = " #nav-draw " type = " button " role = " tab " aria - controls = " nav-draw " aria - selected = " true " >< i class = " bi bi-vector-pen " ></ i > Dessiner </ button >
< button class = " nav-link " id = " nav-type-tab " data - bs - toggle = " tab " data - bs - target = " #nav-type " type = " button " role = " tab " aria - controls = " nav-type " aria - selected = " false " >< i class = " bi bi-fonts " ></ i > Saisir </ button >
< button class = " nav-link " id = " nav-import-tab " data - bs - toggle = " tab " data - bs - target = " #nav-import " type = " button " role = " tab " aria - controls = " nav-import " aria - selected = " false " >< i class = " bi bi-image " ></ i > Importer </ button >
</ div >
</ nav >
2021-09-25 15:36:34 +02:00
< div class = " tab-content mt-3 " id = " nav-svg-add " >
2021-09-25 15:01:22 +02:00
< div class = " tab-pane fade show active " id = " nav-draw " role = " tabpanel " aria - labelledby = " nav-draw-tab " >
2021-09-26 23:43:17 +02:00
< canvas id = " signature-pad " class = " border bg-light " width = " 462 " height = " 200 " ></ canvas >
2021-09-25 15:01:22 +02:00
</ div >
< div class = " tab-pane fade " id = " nav-type " role = " tabpanel " aria - labelledby = " nav-type-tab " >
< input id = " input-text-signature " type = " text " class = " form-control form-control-lg " placeholder = " Ma signature " style = " font-family: Caveat; font-size: 48px; " />
</ div >
< div class = " tab-pane fade " id = " nav-import " role = " tabpanel " aria - labelledby = " nav-import-tab " >
< div class = " text-center " >
2021-09-25 15:36:34 +02:00
< img id = " img-upload " class = " d-none " style = " max-width: 460px; max-height: 200px; " src = " " />
2021-09-25 15:01:22 +02:00
</ div >
< form id = " form-image-upload " action = " /image2svg " method = " POST " enctype = " multipart/form-data " >
< input id = " input-image-upload " class = " form-control " name = " image " type = " file " >
</ form >
</ div >
</ div >
2021-10-03 09:34:05 +02:00
< input id = " input-svg-type " type = " hidden " />
</ div >
2021-09-25 15:01:22 +02:00
< div class = " modal-footer " >
2021-09-25 15:36:34 +02:00
< button tabindex = " -1 " type = " button " class = " btn btn-secondary " data - bs - dismiss = " modal " > Annuler </ button >
2021-10-02 00:48:34 +02:00
< button id = " btn_modal_ajouter " type = " button " disabled = " disabled " class = " btn btn-primary " data - bs - dismiss = " modal " > Ajouter </ button >
2021-09-25 15:01:22 +02:00
</ div >
</ div >
</ div >
</ div >
2021-10-07 01:38:44 +02:00
< span id = " is_mobile " class = " d-md-none " ></ span >
2021-09-28 19:48:04 +02:00
< script src = " /vendor/bootstrap.min.js?5.1.1 " ></ script >
2021-09-22 00:08:27 +02:00
< script src = " /vendor/pdf.js?legacy " ></ script >
2021-10-07 01:38:44 +02:00
< script src = " /vendor/fabric.min.js?4.6.0 " ></ script >
2021-09-22 00:21:35 +02:00
< script src = " /vendor/signature_pad.umd.min.js?3.0.0-beta.3 " ></ script >
< script src = " /vendor/opentype.min.js?1.3.3 " ></ script >
2021-05-04 00:30:20 +02:00
< script >
2021-09-21 23:44:34 +02:00
var url = '/<?php echo $key ?>/pdf' ;
2021-05-04 00:30:20 +02:00
</ script >
< script src = " /js/app.js " ></ script >
</ body >
</ html >
