Add EnvelopeGenerator.Web/wwwroot/README.md

EnvelopeGenerator.Web/wwwroot/README.md

@@ -0,0 +1,74 @@
+# 📄 PSPDFKit-Integration – Vanilla JavaScript
+
+Dieses Projekt zeigt, wie die PDF-Anzeige- und Signaturbibliothek [PSPDFKit](https://pspdfkit.com/web/) mithilfe von **Vanilla JavaScript** integriert werden kann.
+
+## 🚀 Verwendungszweck
+
+PSPDFKit wurde in der Webanwendung verwendet, um PDF-Dokumente:
+- anzuzeigen,
+- zu signieren,
+- mit Anmerkungen zu versehen,
+- Formularfelder auszufüllen.
+
+Benutzer können Dokumente **direkt über den Browser signieren und versenden**.
+
+---
+
+## 🔧 Wo und wie wurde PSPDFKit verwendet?
+
+### 1. PSPDFKit laden
+
+PSPDFKit wurde mit der Funktion `loadPSPDFKit` in `UI.js` gestartet:
+
+```js
+PSPDFKit.load({
+  container: ‚#app‘,
+  document: arrayBuffer,
+  licenseKey: ‚YOUR_LICENSE_KEY‘,
+  ...
+})
+```
+
+### 2. Anmerkungen und Formularfelder
+
+In `annotation.js` werden die folgenden Felder dynamisch zu PDF-Dokumenten hinzugefügt:
+
+- **Signaturfeld** (`SignatureFormField`)
+- **Position** (`TextFormField`)
+- **Stadt** (`TextFormField`)
+- **Datum** (`TextFormField`, wird automatisch mit dem heutigen Datum ausgefüllt)
+- **Bezeichnungen** (`Ort`, `Position`, `Date`) – dies sind nur lesbare Textfelder.
+- **Rahmen für Signaturbild** – wird dynamisch erstellt und platziert, wenn der Benutzer unterschreibt.
+
+Die Felder werden entsprechend ihrer Position auf dem PDF berechnet und für jedes Feld wird eine eindeutige ID erstellt.
+
+---
+
+### 3. Anpassungen der Symbolleiste
+
+In `UI.js` ist die Standard-Symbolleiste (`toolbarItems`) von PSPDFKit konfiguriert:
+
+- Es werden nur zulässige Elemente (`sidebar`, `zoom`, `pager`, `search` usw.) angezeigt.
+- Je nach Benutzerberechtigung (z. B. schreibgeschützt oder beschreibbar) werden die folgenden speziellen Schaltflächen dynamisch hinzugefügt:
+
+**Beschreibbarer Modus:**
+- `Teilen` (SHARE)
+- `Logout` (LOGOUT)
+- `Zurücksetzen` (RESET)
+- `Ablehnen` (REJECT)
+- `Finalisieren` (FINISH)
+
+**Nur-Lesemodus:**
+- Die Schaltfläche `Teilen` kopiert nur den Link in die Zwischenablage (COPY_URL)
+
+Für mobile Geräte werden zusätzlich vereinfachte Schaltflächen angezeigt.
+
+---
+
+### 📁 Wichtige Dateien
+
+| Datei             | Beschreibung                                      |
+|-------------------|-----------------------------------------------|
+| `app.js`          | Hauptanwendungsklasse, Dokumentladen und -steuerung |
+| `ui.js`           | PSPDFKit-UI-Einrichtung und Symbolleistenverwaltung      |
+| `annotation.js`   | Erstellen und Löschen von Anmerkungsfeldern |