datecalc/README.md

# Elpatrons Datumsrechner

Diese moderne Python-Webanwendung (Flask) ermöglicht verschiedene Datumsberechnungen über eine übersichtliche Weboberfläche:

## Demo

Datumsrechner Live: [https://date.elpatron.me](https://date.elpatron.me)

![image-20250725095959116](./assets/image-20250725095959116.png)

## Funktionen

- Anzahl der Tage zwischen zwei Daten
- Anzahl der Werktage zwischen zwei Daten
- Anzeige des Wochentags eines Datums
- Datum plus/minus X Tage
- Datum plus/minus X Werktage
- Datum plus/minus X Wochen/Monate
- Kalenderwoche zu Datum
- Start-/Enddatum einer Kalenderwoche eines Jahres
- Statistik-Dashboard mit Passwortschutz unter `/stats`

## Installation (lokal)

1. Python 3.8+ installieren
2. Abhängigkeiten installieren:

```bash
pip install -r requirements.txt
```

## Starten der App

```bash
python app.py
```

Die App ist dann unter http://localhost:5000 erreichbar.

## Statistik-Dashboard (/stats) & Passwortschutz

Das Dashboard ist mit einem statischen Passwort geschützt, das über die Umgebungsvariable `STATS_PASSWORD` gesetzt wird.

![image-20250725100127004](./assets/image-20250725100127004.png)

Beispiel (PowerShell):

```powershell
$env:STATS_PASSWORD = "meinSicheresPasswort"
python app.py
```

Für Docker:

```powershell
$env:STATS_PASSWORD = "meinSicheresPasswort"
docker run -e STATS_PASSWORD=$env:STATS_PASSWORD -p 5000:5000 datumsrechner
```

## Docker (empfohlen für Produktion)

Die App läuft im Container mit dem WSGI-Server **Gunicorn**:

```bash
docker build -t datumsrechner .
docker run -p 5000:5000 datumsrechner
```

- Gunicorn startet automatisch (siehe Dockerfile)
- Empfohlen für produktiven Einsatz

### Log-Verzeichnis mounten (Logs auf dem Host speichern)

Um die Logdateien außerhalb des Containers zu speichern, kannst du das log-Verzeichnis mounten:

**PowerShell-Beispiel:**

```powershell
docker run -e STATS_PASSWORD=deinPasswort -p 5000:5000 -v ${PWD}/log:/app/log datumsrechner
```

### docker-compose Beispiel

Erstelle eine Datei `docker-compose.yml`:

```yaml
services:
  datumsrechner:
    build: .
    ports:
      - "5000:5000"
    environment:
      - STATS_PASSWORD=deinPasswort
    volumes:
      - ./log:/app/log
```

Starte mit:

```bash
docker-compose up --build
```

## REST API

Alle Datumsfunktionen stehen auch als REST-API zur Verfügung. Die API akzeptiert und liefert JSON.  
**Basis-URL:** `http://localhost:5000/api/`

**Hinweis:** Die Nutzung der REST API wird im Statistik-Dashboard ausgewertet und als Diagramm angezeigt.

### Endpunkte und Beispiele

#### 1. Tage/Werktage zwischen zwei Daten

**POST** `/api/tage_werktage`

```json
{
  "start": "2024-06-01",
  "end": "2024-06-10",
  "werktage": true
}
```

**Mit curl:**
```bash
curl -X POST http://localhost:5000/api/tage_werktage \
  -H "Content-Type: application/json" \
  -d '{"start": "2024-06-01", "end": "2024-06-10", "werktage": true}'
```

**Antwort:**
```json
{ "result": 7 }
```

#### 2. Wochentag zu einem Datum

**POST** `/api/wochentag`

```json
{ "datum": "2024-06-10" }
```

**Mit curl:**
```bash
curl -X POST http://localhost:5000/api/wochentag \
  -H "Content-Type: application/json" \
  -d '{"datum": "2024-06-10"}'
```

**Antwort:**
```json
{ "result": "Montag" }
```

#### 3. Kalenderwoche zu Datum

**POST** `/api/kw_berechnen`

```json
{ "datum": "2024-06-10" }
```

**Mit curl:**
```bash
curl -X POST http://localhost:5000/api/kw_berechnen \
  -H "Content-Type: application/json" \
  -d '{"datum": "2024-06-10"}'
```

**Antwort:**
```json
{ "result": "KW 24 (2024)", "kw": 24, "jahr": 2024 }
```

#### 4. Start-/Enddatum einer Kalenderwoche

**POST** `/api/kw_datum`

```json
{ "jahr": 2024, "kw": 24 }
```

**Mit curl:**
```bash
curl -X POST http://localhost:5000/api/kw_datum \
  -H "Content-Type: application/json" \
  -d '{"jahr": 2024, "kw": 24}'
```

**Antwort:**
```json
{
  "result": "10.06.2024 bis 16.06.2024",
  "start": "2024-06-10",
  "end": "2024-06-16"
}
```

#### 5. Datum plus/minus Tage, Wochen, Monate

**POST** `/api/plusminus`

```json
{
  "datum": "2024-06-10",
  "anzahl": 5,
  "einheit": "tage",
  "richtung": "add",
  "werktage": false
}
```

**Mit curl:**
```bash
curl -X POST http://localhost:5000/api/plusminus \
  -H "Content-Type: application/json" \
  -d '{"datum": "2024-06-10", "anzahl": 5, "einheit": "tage", "richtung": "add", "werktage": false}'
```

**Antwort:**
```json
{ "result": "2024-06-15" }
```

**Hinweis:**  
- `"einheit"`: `"tage"`, `"wochen"` oder `"monate"`
- `"richtung"`: `"add"` (plus) oder `"sub"` (minus)
- `"werktage"`: `true` für Werktage, sonst `false` (nur bei `"tage"` unterstützt)

#### 6. Statistik

**GET** `/api/stats`

**Mit curl:**
```bash
curl http://localhost:5000/api/stats
```

**Antwort:**
```json
{
  "pageviews": 42,
  "func_counts": { "plusminus": 10, "tage_werktage": 5 },
  "impressions_per_day": { "2024-06-10": 7 }
}
```

#### 7. Monitoring & Healthcheck

**GET** `/api/monitor`

**Mit curl:**
```bash
curl http://localhost:5000/api/monitor
```

**Antwort:**
```json
{
  "status": "ok",
  "message": "App running",
  "time": "2025-07-24T13:37:00.123456",
  "uptime_seconds": 12345,
  "pageviews_last_7_days": 42
}
```

---

**Fehlerfälle** liefern immer einen HTTP-Statuscode 400 und ein JSON mit `"error"`-Feld, z.B.:

```json
{ "error": "Ungültige Eingabe", "details": "..." }
```

## Progressive Web App (PWA)

Elpatrons Datumsrechner ist als PWA installierbar (z.B. auf Android/iOS-Homescreen oder Desktop). Die App funktioniert offline für die Startseite und statische Ressourcen, die Datumsberechnung bleibt serverseitig.

- Manifest und Service Worker sind integriert
- App-Icon und Theme-Color für Homescreen
- Installation über Browser-Menü ("Zum Startbildschirm hinzufügen")

## Monitoring & Healthcheck

Die App bietet einen Monitoring-Endpunkt unter `/monitor`, der Statusinformationen als JSON zurückgibt (z.B. für Uptime-Robot, Docker Healthcheck oder eigene Tools):

- Status (ok)
- Aktuelle Serverzeit
- Uptime (Sekunden seit Start)
- Pageviews der letzten 7 Tage

Beispiel-Aufruf:

```
GET https://date.elpatron.me/monitor
```

Antwort:

```json
{
  "status": "ok",
  "message": "App running",
  "time": "2025-07-24T13:37:00.123456",
  "uptime_seconds": 12345,
  "pageviews_last_7_days": 42
}
```

## Entwicklung & Hinweise

- Die HTML-Templates liegen im Ordner `templates/` (Trennung von Logik und Darstellung)
- Das Projekt ist auf Codeberg gehostet: [https://codeberg.org/elpatron/datecalc](https://codeberg.org/elpatron/datecalc)
- Modernes, responsives Design mit Akkordeon und Icons

## Automatisierte Tests

Automatisierte Tests sind mit pytest möglich:

```powershell
pip install -r requirements.txt
pytest test_app.py
```

Die Tests prüfen u.a. die Erreichbarkeit der App, die wichtigsten Funktionen und den Schutz vor XSS-Angriffen.

## Hinweise

### Motivation

Finde mal eine Datumsrechner- Webapp, die nicht völlig Werbe- und Tracking verseucht ist! Da ich sowas häufiger mal brauche, hab ich mir eine eigene gemacht.

### Vibe Coding

Dieses Projekt wurde zu nahezu 100% mit Unterstützung künsticher Intelligenz (*[Vibe Coding](https://de.wikipedia.org/wiki/Vibe_Coding)*) erstellt. Das Grundgerüst war nach ca. 45 Minuten fertig gestellt, insgesamt hat die Entwicklung des Projekts ca. 4 Stunden Zeit beansprucht.

### Statistik-Erfassung, Logging

Es werden keine IP-Adressen oder sonstigen persönlichen Daten gespeichert, lediglich die Zahl der Aufrufe der Funktionen in einer kumulierten Darstellung. Die Logdatei enthält nur Einträge der letzten sieben Tage.

### Barrierefreiheit (Accessibility)

*Elpatrons Datumsrechner* ist barrierefrei gestaltet und erfüllt zentrale Anforderungen an Accessibility (a11y):

- *Semantische HTML-Struktur:* Überschriften, Labels und Formularelemente sind korrekt ausgezeichnet und verknüpft.
- *ARIA-Attribute:* Accordion und Statusmeldungen sind mit ARIA-Attributen versehen, damit Screenreader die Struktur und Zustände erkennen.
- *Tastaturbedienbarkeit:* Alle interaktiven Elemente (Accordion, Buttons, Formulare) sind vollständig per Tastatur bedienbar (inkl. Fokus-Indikator und Pfeiltasten-Navigation im Accordion).
- *Fokus-Indikatoren:* Deutliche visuelle Hervorhebung des Fokus für alle Bedienelemente.
- *Farbkontraste:* Hohe Kontraste für Texte, Buttons und Ergebnisboxen, geprüft nach WCAG-Richtlinien.
- *Status- und Fehlermeldungen:* Ergebnisse und Fehler werden mit `aria-live` für Screenreader zugänglich gemacht.
- *Mobile Optimierung:* Zusätzliche Meta-Tags für bessere Bedienbarkeit auf mobilen Geräten und Unterstützung von Screenreadern.
- *SEO:* Das Thema Barrierefreiheit ist in den Meta-Tags für Suchmaschinen sichtbar.

Damit ist die App für Menschen mit unterschiedlichen Einschränkungen (z.B. Sehbehinderung, motorische Einschränkungen) gut nutzbar und entspricht modernen Webstandards.

## Lizenz

Dieses Projekt steht unter der [MIT-Lizenz](LICENSE).

---
(c) 2025 [Markus Busche](https://digitalcourage.social/@elpatron)