63 lines
2.8 KiB
PHP
63 lines
2.8 KiB
PHP
|
<?php include('includes/header.php'); ?>
|
||
|
|
|
||
|
|
<?= alertMessage(); ?>
|
||
|
|
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h4 class="mt-3 mb-4">Unterschrift Schüler:in</h4>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<form action="code.php" method="POST" enctype="multipart/form-data">
|
||
|
|
<input type="hidden" name="id" value="<?= $studentInfos['data']['id'] ;?>" required>
|
||
|
|
<div class="row">
|
||
|
|
<div class="d-flex flex-row justify-content-center align-items-center">
|
||
|
|
<!-- Canvas-Element für die Unterschrift -->
|
||
|
|
<canvas id="signatureCanvas" width="280" height="150" style="border:1px solid #000;"></canvas>
|
||
|
|
<input type="hidden" name="signature" id="signatureInput" required>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="col-md-12 mt-4">
|
||
|
|
<a href="teilnahmebedingungen.php" class="btn btn-light float-start"><i class="ti ti-arrow-left me-2"></i>Zurück</a>
|
||
|
|
<button type="submit" id="submitBtn" name="signaturestudent" class="btn btn-info float-end mx-1">Weiter<i class="ti ti-arrow-right ms-2"></i> </button>
|
||
|
|
<button type="button" id="clearButton" class="btn btn-light float-end"><i class="ti ti-rotate"></i></button>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
<?php include('includes/footer.php'); ?>
|
||
|
|
<!-- JavaScript -->
|
||
|
|
<script>
|
||
|
|
document.addEventListener('DOMContentLoaded', function() {
|
||
|
|
// Referenz zum Canvas-Element
|
||
|
|
var canvas = document.getElementById('signatureCanvas');
|
||
|
|
var signaturePad = new SignaturePad(canvas);
|
||
|
|
|
||
|
|
// Eventlistener zum Löschen der Unterschrift
|
||
|
|
document.getElementById('clearButton').addEventListener('click', function() {
|
||
|
|
signaturePad.clear(); // Löscht die Unterschrift im Signature Pad
|
||
|
|
document.getElementById('signatureInput').value = ''; // Setzt den Wert des versteckten Eingabefelds auf leer
|
||
|
|
});
|
||
|
|
|
||
|
|
// Überprüft, ob eine gespeicherte Unterschrift vorhanden ist
|
||
|
|
<?php if (!empty($studentInfos['data']['sig_student'])): ?>
|
||
|
|
var signatureDataUrl = '<?= $studentInfos['data']['sig_student']; ?>';
|
||
|
|
var img = new Image();
|
||
|
|
img.onload = function() {
|
||
|
|
canvas.getContext('2d').drawImage(img, 0, 0);
|
||
|
|
};
|
||
|
|
img.src = signatureDataUrl;
|
||
|
|
document.getElementById('signatureInput').value = signatureDataUrl; // Setzt den Wert des versteckten Eingabefelds auf die Base64-codierte URL
|
||
|
|
<?php endif; ?>
|
||
|
|
|
||
|
|
// Eventlistener zum Speichern der Unterschrift beim Klicken des Submit-Buttons
|
||
|
|
document.getElementById('submitBtn').addEventListener('click', function() {
|
||
|
|
// Konvertiert die Unterschrift in eine Base64-codierte URL
|
||
|
|
var signatureDataUrl = signaturePad.toDataURL();
|
||
|
|
// Setzt den Wert des versteckten Eingabefelds auf die Base64-codierte URL
|
||
|
|
document.getElementById('signatureInput').value = signatureDataUrl;
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|