85 lines
4.4 KiB
HTML
85 lines
4.4 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Unterschrift - PDF Signatur</title>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.11.174/pdf.min.js"></script>
|
|
<link rel="stylesheet" href="../css/signature.css">
|
|
<script src="../js/i18n.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<div class="language-switcher">
|
|
<button id="langSwitch" class="lang-button" onclick="toggleLanguage()">
|
|
<span id="langDisplay">DE</span>
|
|
</button>
|
|
</div>
|
|
<div class="header">
|
|
<h1 data-i18n="signature.title">✍️ Unterschriften-Station</h1>
|
|
<p data-i18n="signature.subtitle">Bereit für Unterschriften</p>
|
|
</div>
|
|
|
|
<div class="content">
|
|
<div id="loadingSection" class="loading">
|
|
<div class="spinner"></div>
|
|
<p data-i18n="signature.connecting">Verbinde mit Server...</p>
|
|
</div>
|
|
|
|
<div id="waitingSection" class="waiting-message" style="display: none;">
|
|
<div class="icon">📄</div>
|
|
<h2 data-i18n="signature.waitingForPdf">Warte auf PDF...</h2>
|
|
<p data-i18n="signature.waitingDesc">Bereit zum Unterschreiben. Lade ein PDF auf der Master-Station hoch.</p>
|
|
<div id="alreadyConnectedWarning" class="already-connected-warning" style="display: none;">
|
|
<div class="warning-icon">⚠️</div>
|
|
<div class="warning-text">
|
|
<strong data-i18n="signature.warning">Hinweis:</strong> <span data-i18n="signature.warningText">Bereits eine andere Signatur-Station ist mit dem Master verbunden. Diese Station kann nicht verwendet werden, solange die andere Station aktiv ist.</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="signatureSection" style="display: none;">
|
|
<div class="pdf-display" id="pdfDisplay">
|
|
<h3 data-i18n="signature.documentToSign">📄 Zu unterschreibendes Dokument</h3>
|
|
<div id="pageInfoSignature" style="margin: 10px 0; font-weight: bold; color: #11998e; font-size: 1.1em;" data-i18n="signature.pageInfo">
|
|
Seite 1 von 1
|
|
</div>
|
|
<div id="pdfPagesContainer" style="max-height: 60vh; overflow-y: auto; border: 2px solid #11998e; border-radius: 8px; padding: 10px; background: white;">
|
|
<!-- Pages will be inserted here dynamically -->
|
|
</div>
|
|
<p style="margin-top: 15px; color: #666; font-size: 0.9em;" data-i18n="signature.scrollHint">Scrolle nach unten um alle Seiten zu sehen</p>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<strong data-i18n="signature.instruction">📝 Anleitung:</strong> <span data-i18n="signature.instructionText">Zeichnen Sie Ihre Unterschrift mit dem Finger oder der Maus im Feld unten. Drücken Sie dann auf "Unterschrift senden".</span>
|
|
</div>
|
|
|
|
<div class="signature-section">
|
|
<h3 style="margin-bottom: 15px;" data-i18n="signature.signatureField">Unterschriftsfeld:</h3>
|
|
<canvas id="signatureCanvas" class="signature-pad" width="740" height="300"></canvas>
|
|
</div>
|
|
|
|
<div class="controls">
|
|
<button class="button button-clear" id="clearButton" data-i18n="signature.clear">
|
|
🗑️ Löschen
|
|
</button>
|
|
<button class="button button-submit" id="submitButton" disabled data-i18n="signature.send">
|
|
✓ Unterschrift senden
|
|
</button>
|
|
</div>
|
|
|
|
<div class="success-message" id="successMessage">
|
|
<h2 data-i18n="signature.successTitle">✅ Erfolgreich!</h2>
|
|
<p data-i18n="signature.successText">Ihre Unterschrift wurde erfolgreich übertragen.</p>
|
|
</div>
|
|
|
|
<div class="error-message" id="errorMessage" data-i18n="signature.error">
|
|
❌ Fehler beim Senden der Unterschrift. Bitte versuchen Sie es erneut.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="../js/signature.js"></script>
|
|
</body>
|
|
</html> |