# 📄 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 |