9 Commits

Author SHA1 Message Date
d0d8e0aeb1 v1.3.13: Weitere Verbesserung der Farbkontraste für Wochentag- und Kalenderwoche-Header 2025-08-01 13:56:34 +02:00
c19cb17623 v1.3.12: Verbesserte Farbkontraste für bessere Barrierefreiheit 2025-08-01 13:49:02 +02:00
e2367d0b0e chore: Version auf 1.3.11 erhöht - Sprachausgabe-Funktion und verbesserte Feiertage-Anzeige 2025-08-01 13:10:31 +02:00
1eb55e32dc feat: Sprachausgabe-Funktion für barrierefreie Nutzung hinzugefügt
- Vorlesen-Buttons (🔊) bei allen Ergebnissen
- Web Speech API mit deutscher Sprachausgabe
- Vollständige Tastaturnavigation (Tab, Enter, Leertaste)
- ESC-Taste zum Stoppen der Wiedergabe
- Barrierefreiheit verbessert für Menschen mit Sehbehinderungen
- README aktualisiert mit Sprachausgabe-Dokumentation
2025-08-01 12:51:28 +02:00
9a45444db4 Version 1.3.10: Versionsanzeige im Footer hinzugefügt 2025-07-26 10:28:30 +02:00
386a3f688f Verbessere stats_dashboard.html: Schriftart angepasst und API-Counts entfernt 2025-07-26 10:25:11 +02:00
04dc301e5b CSS-Fixes: Scrollbars auf allen Geräten entfernt, responsive Box-Sizing und Breitenanpassung verbessert 2025-07-26 08:41:06 +02:00
aaf6dbdec0 API: Bundesland-Feiertage für REST API erweitert
- tage_werktage Endpunkt unterstützt jetzt bundesland Parameter
- Swagger-Dokumentation aktualisiert mit bundesland Parameter
- Alle 16 deutschen Bundesländer in der API-Dokumentation aufgelistet
2025-07-25 17:13:39 +02:00
e2a5c1a3fa Feat: Bundesland-Feiertage für Werktagsberechnung hinzugefügt
- Neue Funktion zur Abfrage bundeslandspezifischer Feiertage über feiertage-api.de
- Werktagsberechnung berücksichtigt jetzt optional Feiertage des gewählten Bundeslandes
- Frontend: Dropdown für Bundesland-Auswahl (nur aktiv wenn Werktage-Checkbox aktiviert)
- Anzeige der Anzahl Wochenendtage und Feiertage im Ergebnis
- REST API erweitert um bundesland-Parameter
- README.md aktualisiert mit Dokumentation der neuen Funktion
2025-07-25 17:10:57 +02:00
7 changed files with 633 additions and 41 deletions

View File

@@ -41,15 +41,40 @@ Datumsrechner Live: [https://date.elpatron.me](https://date.elpatron.me)
## Funktionen ## Funktionen
- Anzahl der Tage zwischen zwei Daten - Anzahl der Tage zwischen zwei Daten
- Anzahl der Werktage zwischen zwei Daten - Anzahl der Werktage zwischen zwei Daten (mit optionaler Berücksichtigung bundeslandspezifischer Feiertage)
- Anzeige des Wochentags eines Datums - Anzeige des Wochentags eines Datums
- Datum plus/minus X Tage - Datum plus/minus X Tage
- Datum plus/minus X Werktage - Datum plus/minus X Werktage
- Datum plus/minus X Wochen/Monate - Datum plus/minus X Wochen/Monate
- Kalenderwoche zu Datum - Kalenderwoche zu Datum
- Start-/Enddatum einer Kalenderwoche eines Jahres - Start-/Enddatum einer Kalenderwoche eines Jahres
- **Sprachausgabe** für alle Ergebnisse (barrierefrei)
- Statistik-Dashboard mit Passwortschutz unter `/stats` - Statistik-Dashboard mit Passwortschutz unter `/stats`
## Bundesland-Feiertage
Die Werktagsberechnung kann optional bundeslandspezifische Feiertage berücksichtigen. Dazu wird die kostenlose API von [feiertage-api.de](https://feiertage-api.de) verwendet.
**Verfügbare Bundesländer:**
- Baden-Württemberg (BW)
- Bayern (BY)
- Berlin (BE)
- Brandenburg (BB)
- Bremen (HB)
- Hamburg (HH)
- Hessen (HE)
- Mecklenburg-Vorpommern (MV)
- Niedersachsen (NI)
- Nordrhein-Westfalen (NW)
- Rheinland-Pfalz (RP)
- Saarland (SL)
- Sachsen (SN)
- Sachsen-Anhalt (ST)
- Schleswig-Holstein (SH)
- Thüringen (TH)
Die Feiertage werden automatisch für den gewählten Zeitraum abgerufen und bei der Werktagsberechnung als arbeitsfreie Tage behandelt. Im Ergebnis werden zusätzlich die Anzahl der Wochenendtage und Feiertage angezeigt.
## Installation (lokal) ## Installation (lokal)
1. Python 3.8+ installieren 1. Python 3.8+ installieren
@@ -148,7 +173,8 @@ Alle Datumsfunktionen stehen auch als REST-API zur Verfügung. Die API akzeptier
{ {
"start": "2024-06-01", "start": "2024-06-01",
"end": "2024-06-10", "end": "2024-06-10",
"werktage": true "werktage": true,
"bundesland": "BY"
} }
``` ```
@@ -156,7 +182,7 @@ Alle Datumsfunktionen stehen auch als REST-API zur Verfügung. Die API akzeptier
```bash ```bash
curl -X POST http://localhost:5000/api/tage_werktage \ curl -X POST http://localhost:5000/api/tage_werktage \
-H "Content-Type: application/json" \ -H "Content-Type: application/json" \
-d '{"start": "2024-06-01", "end": "2024-06-10", "werktage": true}' -d '{"start": "2024-06-01", "end": "2024-06-10", "werktage": true, "bundesland": "BY"}'
``` ```
**Antwort:** **Antwort:**
@@ -164,6 +190,8 @@ curl -X POST http://localhost:5000/api/tage_werktage \
{ "result": 7 } { "result": 7 }
``` ```
**Hinweis:** Der Parameter `bundesland` ist optional und wird nur bei `"werktage": true` berücksichtigt. Verfügbare Bundesland-Kürzel siehe oben.
#### 2. Wochentag zu einem Datum #### 2. Wochentag zu einem Datum
**POST** `/api/wochentag` **POST** `/api/wochentag`
@@ -381,6 +409,7 @@ Es werden keine IP-Adressen oder sonstigen persönlichen Daten gespeichert, ledi
- *Fokus-Indikatoren:* Deutliche visuelle Hervorhebung des Fokus für alle Bedienelemente. - *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. - *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. - *Status- und Fehlermeldungen:* Ergebnisse und Fehler werden mit `aria-live` für Screenreader zugänglich gemacht.
- **Sprachausgabe:** Alle Ergebnisse können über 🔊-Buttons vorgelesen werden (Web Speech API, deutsche Sprache).
- *Mobile Optimierung:* Zusätzliche Meta-Tags für bessere Bedienbarkeit auf mobilen Geräten und Unterstützung von Screenreadern. - *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. - *SEO:* Das Thema Barrierefreiheit ist in den Meta-Tags für Suchmaschinen sichtbar.

50
app.py
View File

@@ -4,16 +4,32 @@ import numpy as np
from dateutil.relativedelta import relativedelta from dateutil.relativedelta import relativedelta
import os import os
import time import time
import requests
app_start_time = time.time() app_start_time = time.time()
app = Flask(__name__) app = Flask(__name__)
app.secret_key = os.environ.get('SECRET_KEY', 'dev-key') app.secret_key = os.environ.get('SECRET_KEY', 'dev-key')
# Version der App
APP_VERSION = "1.3.13"
# HTML-Template wird jetzt aus templates/index.html geladen # HTML-Template wird jetzt aus templates/index.html geladen
WOCHENTAGE = ["Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag", "Sonntag"] WOCHENTAGE = ["Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag", "Sonntag"]
def get_feiertage(year, bundesland):
"""Holt die Feiertage für ein Jahr und Bundesland von feiertage-api.de."""
url = f"https://feiertage-api.de/api/?jahr={year}&nur_land={bundesland}"
try:
resp = requests.get(url, timeout=5)
data = resp.json()
# Die API gibt ein Dict mit Feiertagsnamen als Key, jeweils mit 'datum' als Wert
return [v['datum'] for v in data.values() if 'datum' in v]
except Exception as e:
print(f"Fehler beim Abrufen der Feiertage: {e}")
return []
@app.route('/', methods=['GET', 'POST']) @app.route('/', methods=['GET', 'POST'])
def index(): def index():
# Rudimentäres Logging für Page Impressions # Rudimentäres Logging für Page Impressions
@@ -40,6 +56,7 @@ def index():
from datetime import datetime as dt from datetime import datetime as dt
f.write(f"{dt.now().isoformat()} PAGEVIEW\n") f.write(f"{dt.now().isoformat()} PAGEVIEW\n")
tage = werktage = wochentag = datumsrechnung = werktagsrechnung = kw_berechnen = kw_datum = wochen_monate = None tage = werktage = wochentag = datumsrechnung = werktagsrechnung = kw_berechnen = kw_datum = wochen_monate = None
feiertage_anzahl = wochenendtage_anzahl = None
active_idx = 0 active_idx = 0
plusminus_result = None plusminus_result = None
if request.method == 'POST': if request.method == 'POST':
@@ -53,13 +70,27 @@ def index():
start = request.form.get('start1') start = request.form.get('start1')
end = request.form.get('end1') end = request.form.get('end1')
is_werktage = request.form.get('werktage') in ('on', 'true', '1', True) is_werktage = request.form.get('werktage') in ('on', 'true', '1', True)
bundesland = request.form.get('bundesland')
try: try:
d1 = datetime.strptime(start, '%Y-%m-%d') d1 = datetime.strptime(start, '%Y-%m-%d')
d2 = datetime.strptime(end, '%Y-%m-%d') d2 = datetime.strptime(end, '%Y-%m-%d')
if d1 > d2:
d1, d2 = d2, d1
# Feiertage bestimmen
holidays = []
if bundesland:
years = set([d1.year, d2.year])
for y in years:
holidays.extend(get_feiertage(y, bundesland))
# Alle Tage im Bereich
all_days = [(d1 + timedelta(days=i)).date() for i in range((d2 - d1).days + 1)]
# Wochenendtage zählen
wochenendtage_anzahl = sum(1 for d in all_days if d.weekday() >= 5)
# Feiertage zählen (nur die, die im Bereich liegen und nicht auf Wochenende fallen)
feiertage_im_zeitraum = [f for f in holidays if d1.date() <= datetime.strptime(f, '%Y-%m-%d').date() <= d2.date()]
feiertage_anzahl = sum(1 for f in feiertage_im_zeitraum if datetime.strptime(f, '%Y-%m-%d').date().weekday() < 5)
if is_werktage: if is_werktage:
if d1 > d2: tage = np.busday_count(d1.date(), (d2 + timedelta(days=1)).date(), holidays=holidays)
d1, d2 = d2, d1
tage = np.busday_count(d1.date(), (d2 + timedelta(days=1)).date())
else: else:
tage = abs((d2 - d1).days) tage = abs((d2 - d1).days)
except Exception: except Exception:
@@ -129,7 +160,9 @@ def index():
plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Monate: {result.strftime('%d.%m.%Y')}" plusminus_result = f"Datum {d.strftime('%d.%m.%Y')} {'plus' if anzahl_int>=0 else 'minus'} {abs(anzahl_int)} Monate: {result.strftime('%d.%m.%Y')}"
except Exception: except Exception:
plusminus_result = 'Ungültige Eingabe' plusminus_result = 'Ungültige Eingabe'
return render_template('index.html', tage=tage, werktage=werktage, wochentag=wochentag, plusminus_result=plusminus_result, kw_berechnen=kw_berechnen, kw_datum=kw_datum, active_idx=active_idx) return render_template('index.html', tage=tage, werktage=werktage, wochentag=wochentag, plusminus_result=plusminus_result, kw_berechnen=kw_berechnen, kw_datum=kw_datum, active_idx=active_idx
, feiertage_anzahl=feiertage_anzahl, wochenendtage_anzahl=wochenendtage_anzahl, app_version=APP_VERSION
)
def parse_log_stats(log_path): def parse_log_stats(log_path):
@@ -187,13 +220,20 @@ def api_tage_werktage():
start = data.get('start') start = data.get('start')
end = data.get('end') end = data.get('end')
is_werktage = data.get('werktage', False) is_werktage = data.get('werktage', False)
bundesland = data.get('bundesland')
try: try:
d1 = datetime.strptime(start, '%Y-%m-%d') d1 = datetime.strptime(start, '%Y-%m-%d')
d2 = datetime.strptime(end, '%Y-%m-%d') d2 = datetime.strptime(end, '%Y-%m-%d')
if is_werktage: if is_werktage:
if d1 > d2: if d1 > d2:
d1, d2 = d2, d1 d1, d2 = d2, d1
tage = int(np.busday_count(d1.date(), (d2 + timedelta(days=1)).date())) holidays = []
if bundesland:
# Feiertage für alle Jahre im Bereich holen
years = set([d1.year, d2.year])
for y in years:
holidays.extend(get_feiertage(y, bundesland))
tage = int(np.busday_count(d1.date(), (d2 + timedelta(days=1)).date(), holidays=holidays))
else: else:
tage = abs((d2 - d1).days) tage = abs((d2 - d1).days)
return jsonify({'result': tage}) return jsonify({'result': tage})

324
h origin main --no-edit Normal file
View File

@@ -0,0 +1,324 @@
SSUUMMMMAARRYY OOFF LLEESSSS CCOOMMMMAANNDDSS
Commands marked with * may be preceded by a number, _N.
Notes in parentheses indicate the behavior if _N is given.
A key preceded by a caret indicates the Ctrl key; thus ^K is ctrl-K.
h H Display this help.
q :q Q :Q ZZ Exit.
---------------------------------------------------------------------------
MMOOVVIINNGG
e ^E j ^N CR * Forward one line (or _N lines).
y ^Y k ^K ^P * Backward one line (or _N lines).
ESC-j * Forward one file line (or _N file lines).
ESC-k * Backward one file line (or _N file lines).
f ^F ^V SPACE * Forward one window (or _N lines).
b ^B ESC-v * Backward one window (or _N lines).
z * Forward one window (and set window to _N).
w * Backward one window (and set window to _N).
ESC-SPACE * Forward one window, but don't stop at end-of-file.
ESC-b * Backward one window, but don't stop at beginning-of-file.
d ^D * Forward one half-window (and set half-window to _N).
u ^U * Backward one half-window (and set half-window to _N).
ESC-) RightArrow * Right one half screen width (or _N positions).
ESC-( LeftArrow * Left one half screen width (or _N positions).
ESC-} ^RightArrow Right to last column displayed.
ESC-{ ^LeftArrow Left to first column.
F Forward forever; like "tail -f".
ESC-F Like F but stop when search pattern is found.
r ^R ^L Repaint screen.
R Repaint screen, discarding buffered input.
---------------------------------------------------
Default "window" is the screen height.
Default "half-window" is half of the screen height.
---------------------------------------------------------------------------
SSEEAARRCCHHIINNGG
/_p_a_t_t_e_r_n * Search forward for (_N-th) matching line.
?_p_a_t_t_e_r_n * Search backward for (_N-th) matching line.
n * Repeat previous search (for _N-th occurrence).
N * Repeat previous search in reverse direction.
ESC-n * Repeat previous search, spanning files.
ESC-N * Repeat previous search, reverse dir. & spanning files.
^O^N ^On * Search forward for (_N-th) OSC8 hyperlink.
^O^P ^Op * Search backward for (_N-th) OSC8 hyperlink.
^O^L ^Ol Jump to the currently selected OSC8 hyperlink.
ESC-u Undo (toggle) search highlighting.
ESC-U Clear search highlighting.
&_p_a_t_t_e_r_n * Display only matching lines.
---------------------------------------------------
Search is case-sensitive unless changed with -i or -I.
A search pattern may begin with one or more of:
^N or ! Search for NON-matching lines.
^E or * Search multiple files (pass thru END OF FILE).
^F or @ Start search at FIRST file (for /) or last file (for ?).
^K Highlight matches, but don't move (KEEP position).
^R Don't use REGULAR EXPRESSIONS.
^S _n Search for match in _n-th parenthesized subpattern.
^W WRAP search if no match found.
^L Enter next character literally into pattern.
---------------------------------------------------------------------------
JJUUMMPPIINNGG
g < ESC-< * Go to first line in file (or line _N).
G > ESC-> * Go to last line in file (or line _N).
p % * Go to beginning of file (or _N percent into file).
t * Go to the (_N-th) next tag.
T * Go to the (_N-th) previous tag.
{ ( [ * Find close bracket } ) ].
} ) ] * Find open bracket { ( [.
ESC-^F _<_c_1_> _<_c_2_> * Find close bracket _<_c_2_>.
ESC-^B _<_c_1_> _<_c_2_> * Find open bracket _<_c_1_>.
---------------------------------------------------
Each "find close bracket" command goes forward to the close bracket
matching the (_N-th) open bracket in the top line.
Each "find open bracket" command goes backward to the open bracket
matching the (_N-th) close bracket in the bottom line.
m_<_l_e_t_t_e_r_> Mark the current top line with <letter>.
M_<_l_e_t_t_e_r_> Mark the current bottom line with <letter>.
'_<_l_e_t_t_e_r_> Go to a previously marked position.
'' Go to the previous position.
^X^X Same as '.
ESC-m_<_l_e_t_t_e_r_> Clear a mark.
---------------------------------------------------
A mark is any upper-case or lower-case letter.
Certain marks are predefined:
^ means beginning of the file
$ means end of the file
---------------------------------------------------------------------------
CCHHAANNGGIINNGG FFIILLEESS
:e [_f_i_l_e] Examine a new file.
^X^V Same as :e.
:n * Examine the (_N-th) next file from the command line.
:p * Examine the (_N-th) previous file from the command line.
:x * Examine the first (or _N-th) file from the command line.
^O^O Open the currently selected OSC8 hyperlink.
:d Delete the current file from the command line list.
= ^G :f Print current file name.
---------------------------------------------------------------------------
MMIISSCCEELLLLAANNEEOOUUSS CCOOMMMMAANNDDSS
-_<_f_l_a_g_> Toggle a command line option [see OPTIONS below].
--_<_n_a_m_e_> Toggle a command line option, by name.
__<_f_l_a_g_> Display the setting of a command line option.
___<_n_a_m_e_> Display the setting of an option, by name.
+_c_m_d Execute the less cmd each time a new file is examined.
!_c_o_m_m_a_n_d Execute the shell command with $SHELL.
#_c_o_m_m_a_n_d Execute the shell command, expanded like a prompt.
|XX_c_o_m_m_a_n_d Pipe file between current pos & mark XX to shell command.
s _f_i_l_e Save input to a file.
v Edit the current file with $VISUAL or $EDITOR.
V Print version number of "less".
---------------------------------------------------------------------------
OOPPTTIIOONNSS
Most options may be changed either on the command line,
or from within less by using the - or -- command.
Options may be given in one of two forms: either a single
character preceded by a -, or a name preceded by --.
-? ........ --help
Display help (from command line).
-a ........ --search-skip-screen
Search skips current screen.
-A ........ --SEARCH-SKIP-SCREEN
Search starts just after target line.
-b [_N] .... --buffers=[_N]
Number of buffers.
-B ........ --auto-buffers
Don't automatically allocate buffers for pipes.
-c ........ --clear-screen
Repaint by clearing rather than scrolling.
-d ........ --dumb
Dumb terminal.
-D xx_c_o_l_o_r . --color=xx_c_o_l_o_r
Set screen colors.
-e -E .... --quit-at-eof --QUIT-AT-EOF
Quit at end of file.
-f ........ --force
Force open non-regular files.
-F ........ --quit-if-one-screen
Quit if entire file fits on first screen.
-g ........ --hilite-search
Highlight only last match for searches.
-G ........ --HILITE-SEARCH
Don't highlight any matches for searches.
-h [_N] .... --max-back-scroll=[_N]
Backward scroll limit.
-i ........ --ignore-case
Ignore case in searches that do not contain uppercase.
-I ........ --IGNORE-CASE
Ignore case in all searches.
-j [_N] .... --jump-target=[_N]
Screen position of target lines.
-J ........ --status-column
Display a status column at left edge of screen.
-k _f_i_l_e ... --lesskey-file=_f_i_l_e
Use a compiled lesskey file.
-K ........ --quit-on-intr
Exit less in response to ctrl-C.
-L ........ --no-lessopen
Ignore the LESSOPEN environment variable.
-m -M .... --long-prompt --LONG-PROMPT
Set prompt style.
-n ......... --line-numbers
Suppress line numbers in prompts and messages.
-N ......... --LINE-NUMBERS
Display line number at start of each line.
-o [_f_i_l_e] .. --log-file=[_f_i_l_e]
Copy to log file (standard input only).
-O [_f_i_l_e] .. --LOG-FILE=[_f_i_l_e]
Copy to log file (unconditionally overwrite).
-p _p_a_t_t_e_r_n . --pattern=[_p_a_t_t_e_r_n]
Start at pattern (from command line).
-P [_p_r_o_m_p_t] --prompt=[_p_r_o_m_p_t]
Define new prompt.
-q -Q .... --quiet --QUIET --silent --SILENT
Quiet the terminal bell.
-r -R .... --raw-control-chars --RAW-CONTROL-CHARS
Output "raw" control characters.
-s ........ --squeeze-blank-lines
Squeeze multiple blank lines.
-S ........ --chop-long-lines
Chop (truncate) long lines rather than wrapping.
-t _t_a_g .... --tag=[_t_a_g]
Find a tag.
-T [_t_a_g_s_f_i_l_e] --tag-file=[_t_a_g_s_f_i_l_e]
Use an alternate tags file.
-u -U .... --underline-special --UNDERLINE-SPECIAL
Change handling of backspaces, tabs and carriage returns.
-V ........ --version
Display the version number of "less".
-w ........ --hilite-unread
Highlight first new line after forward-screen.
-W ........ --HILITE-UNREAD
Highlight first new line after any forward movement.
-x [_N[,...]] --tabs=[_N[,...]]
Set tab stops.
-X ........ --no-init
Don't use termcap init/deinit strings.
-y [_N] .... --max-forw-scroll=[_N]
Forward scroll limit.
-z [_N] .... --window=[_N]
Set size of window.
-" [_c[_c]] . --quotes=[_c[_c]]
Set shell quote characters.
-~ ........ --tilde
Don't display tildes after end of file.
-# [_N] .... --shift=[_N]
Set horizontal scroll amount (0 = one half screen width).
--exit-follow-on-close
Exit F command on a pipe when writer closes pipe.
--file-size
Automatically determine the size of the input file.
--follow-name
The F command changes files if the input file is renamed.
--form-feed
Stop scrolling when a form feed character is reached.
--header=[_L[,_C[,_N]]]
Use _L lines (starting at line _N) and _C columns as headers.
--incsearch
Search file as each pattern character is typed in.
--intr=[_C]
Use _C instead of ^X to interrupt a read.
--lesskey-context=_t_e_x_t
Use lesskey source file contents.
--lesskey-src=_f_i_l_e
Use a lesskey source file.
--line-num-width=[_N]
Set the width of the -N line number field to _N characters.
--match-shift=[_N]
Show at least _N characters to the left of a search match.
--modelines=[_N]
Read _N lines from the input file and look for vim modelines.
--mouse
Enable mouse input.
--no-edit-warn
Don't warn when using v command on a file opened via LESSOPEN.
--no-keypad
Don't send termcap keypad init/deinit strings.
--no-histdups
Remove duplicates from command history.
--no-number-headers
Don't give line numbers to header lines.
--no-paste
Ignore pasted input.
--no-search-header-lines
Searches do not include header lines.
--no-search-header-columns
Searches do not include header columns.
--no-search-headers
Searches do not include header lines or columns.
--no-vbell
Disable the terminal's visual bell.
--redraw-on-quit
Redraw final screen when quitting.
--rscroll=[_C]
Set the character used to mark truncated lines.
--save-marks
Retain marks across invocations of less.
--search-options=[EFKNRW-]
Set default options for every search.
--show-preproc-errors
Display a message if preprocessor exits with an error status.
--proc-backspace
Process backspaces for bold/underline.
--PROC-BACKSPACE
Treat backspaces as control characters.
--proc-return
Delete carriage returns before newline.
--PROC-RETURN
Treat carriage returns as control characters.
--proc-tab
Expand tabs to spaces.
--PROC-TAB
Treat tabs as control characters.
--status-col-width=[_N]
Set the width of the -J status column to _N characters.
--status-line
Highlight or color the entire line containing a mark.
--use-backslash
Subsequent options use backslash as escape char.
--use-color
Enables colored text.
--wheel-lines=[_N]
Each click of the mouse wheel moves _N lines.
--wordwrap
Wrap lines at spaces.
---------------------------------------------------------------------------
LLIINNEE EEDDIITTIINNGG
These keys can be used to edit text being entered
on the "command line" at the bottom of the screen.
RightArrow ..................... ESC-l ... Move cursor right one character.
LeftArrow ...................... ESC-h ... Move cursor left one character.
ctrl-RightArrow ESC-RightArrow ESC-w ... Move cursor right one word.
ctrl-LeftArrow ESC-LeftArrow ESC-b ... Move cursor left one word.
HOME ........................... ESC-0 ... Move cursor to start of line.
END ............................ ESC-$ ... Move cursor to end of line.
BACKSPACE ................................ Delete char to left of cursor.
DELETE ......................... ESC-x ... Delete char under cursor.
ctrl-BACKSPACE ESC-BACKSPACE ........... Delete word to left of cursor.
ctrl-DELETE .... ESC-DELETE .... ESC-X ... Delete word under cursor.
ctrl-U ......... ESC (MS-DOS only) ....... Delete entire line.
UpArrow ........................ ESC-k ... Retrieve previous command line.
DownArrow ...................... ESC-j ... Retrieve next command line.
TAB ...................................... Complete filename & cycle.
SHIFT-TAB ...................... ESC-TAB Complete filename & reverse cycle.
ctrl-L ................................... Complete filename, list all.

View File

@@ -2,3 +2,4 @@ Flask==3.0.3
numpy==1.26.4 numpy==1.26.4
python-dateutil==2.9.0.post0 python-dateutil==2.9.0.post0
pytest==8.2.2 pytest==8.2.2
requests

View File

@@ -21,7 +21,12 @@
"properties": { "properties": {
"start": { "type": "string", "format": "date" }, "start": { "type": "string", "format": "date" },
"end": { "type": "string", "format": "date" }, "end": { "type": "string", "format": "date" },
"werktage": { "type": "boolean", "default": false } "werktage": { "type": "boolean", "default": false },
"bundesland": {
"type": "string",
"description": "Bundesland-Kürzel für Feiertagsberücksichtigung (nur bei werktage=true)",
"enum": ["BW", "BY", "BE", "BB", "HB", "HH", "HE", "MV", "NI", "NW", "RP", "SL", "SN", "ST", "SH", "TH"]
}
}, },
"required": ["start", "end"] "required": ["start", "end"]
} }

View File

@@ -36,15 +36,22 @@
--text: #1e293b; --text: #1e293b;
--shadow: 0 2px 8px rgba(30,41,59,0.07); --shadow: 0 2px 8px rgba(30,41,59,0.07);
} }
* {
box-sizing: border-box;
}
body { body {
background: var(--background); background: var(--background);
color: var(--text); color: var(--text);
font-family: 'Segoe UI', Arial, sans-serif; font-family: 'Segoe UI', Arial, sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
overflow-x: hidden;
box-sizing: border-box;
} }
.container { .container {
max-width: 480px; max-width: 480px;
width: 100%;
margin: 3em auto; margin: 3em auto;
background: var(--surface); background: var(--surface);
border-radius: 16px; border-radius: 16px;
@@ -52,6 +59,7 @@ body {
padding: 2.5em 2em 2em 2em; padding: 2.5em 2em 2em 2em;
border: 1px solid var(--border); border: 1px solid var(--border);
position: relative; position: relative;
box-sizing: border-box;
} }
.help-button-container { .help-button-container {
position: absolute; position: absolute;
@@ -63,21 +71,21 @@ body {
width: 2.2em; width: 2.2em;
height: 2.2em; height: 2.2em;
border-radius: 50%; border-radius: 50%;
background: rgba(37, 99, 235, 0.1); background: rgba(37, 99, 235, 0.15);
color: var(--primary); color: var(--primary-dark);
border: 1px solid var(--border); border: 1px solid var(--border);
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 1em; font-size: 1em;
font-weight: 500; font-weight: 600;
transition: all 0.2s; transition: all 0.2s;
min-width: 44px; min-width: 44px;
min-height: 44px; min-height: 44px;
} }
.help-button:hover { .help-button:hover {
background: rgba(37, 99, 235, 0.2); background: rgba(37, 99, 235, 0.25);
border-color: var(--primary); border-color: var(--primary);
} }
.help-button:focus { .help-button:focus {
@@ -136,6 +144,7 @@ body {
border-radius: 12px; border-radius: 12px;
padding: 2em; padding: 2em;
max-width: 90%; max-width: 90%;
width: 90%;
max-height: 90%; max-height: 90%;
overflow-y: auto; overflow-y: auto;
position: relative; position: relative;
@@ -143,6 +152,7 @@ body {
margin: 0 auto; margin: 0 auto;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
box-sizing: border-box;
} }
.modal-close { .modal-close {
position: absolute; position: absolute;
@@ -233,7 +243,7 @@ input[type="date"] {
border: 1px solid var(--border); border: 1px solid var(--border);
border-radius: 6px; border-radius: 6px;
font-size: 1em; font-size: 1em;
background: #f1f5f9; background: #ffffff;
color: var(--text); color: var(--text);
} }
.today-btn { .today-btn {
@@ -282,12 +292,49 @@ button:focus, .accordion-header:focus {
.result { .result {
margin-top: 1em; margin-top: 1em;
font-weight: bold; font-weight: bold;
background: #e0e7ff; background: #dbeafe;
color: #1e293b; color: #1e293b;
border-radius: 6px; border-radius: 6px;
padding: 0.7em 1em; padding: 0.7em 1em;
padding-right: 4em;
box-shadow: 0 1px 2px rgba(30,41,59,0.04); box-shadow: 0 1px 2px rgba(30,41,59,0.04);
border: 2px solid #2563eb; border: 2px solid #2563eb;
position: relative;
min-height: 3.5em;
}
.read-aloud-btn {
position: absolute;
top: 0.5em;
right: 0.5em;
background: rgba(37, 99, 235, 0.15);
color: var(--primary-dark);
border: 1px solid var(--border);
border-radius: 4px;
padding: 0.3em 0.6em;
font-size: 0.8em;
cursor: pointer;
transition: all 0.2s;
min-width: 44px;
min-height: 44px;
display: flex;
align-items: center;
justify-content: center;
z-index: 5;
}
.read-aloud-btn:hover {
background: rgba(37, 99, 235, 0.25);
border-color: var(--primary);
}
.read-aloud-btn:focus {
outline: 3px solid #facc15;
outline-offset: 2px;
box-shadow: 0 0 0 4px #1e293b;
background: rgba(37, 99, 235, 0.25);
border-color: var(--primary);
}
.read-aloud-btn.playing {
background: var(--primary);
color: white;
} }
.accordion { .accordion {
border-radius: 12px; border-radius: 12px;
@@ -351,11 +398,11 @@ button:focus, .accordion-header:focus {
color: #fff; color: #fff;
} }
.header-wochentag { .header-wochentag {
background: #f59e42; background: #dc2626;
color: #1e293b; color: #fff;
} }
.header-wochentag.active, .header-wochentag:hover { .header-wochentag.active, .header-wochentag:hover {
background: #d97706; background: #b91c1c;
color: #fff; color: #fff;
} }
.header-plusminus-tage { .header-plusminus-tage {
@@ -383,19 +430,19 @@ button:focus, .accordion-header:focus {
color: #fff; color: #fff;
} }
.header-kw { .header-kw {
background: #a78bfa;
color: #1e293b;
}
.header-kw.active, .header-kw:hover {
background: #7c3aed; background: #7c3aed;
color: #fff; color: #fff;
} }
.header-kw.active, .header-kw:hover {
background: #6d28d9;
color: #fff;
}
.header-kw-datum { .header-kw-datum {
background: #facc15; background: #a16207;
color: #1e293b; color: #fff;
} }
.header-kw-datum.active, .header-kw-datum:hover { .header-kw-datum.active, .header-kw-datum:hover {
background: #ca8a04; background: #854d0e;
color: #fff; color: #fff;
} }
.header-plusminus { .header-plusminus {
@@ -410,6 +457,8 @@ button:focus, .accordion-header:focus {
.container { .container {
margin: 1em; margin: 1em;
padding: 1.2em 0.7em 1em 0.7em; padding: 1.2em 0.7em 1em 0.7em;
width: calc(100% - 2em);
max-width: none;
} }
h1 { h1 {
font-size: 1.3em; font-size: 1.3em;
@@ -432,6 +481,10 @@ button:focus, .accordion-header:focus {
.modal-content { .modal-content {
padding: 1.5em; padding: 1.5em;
margin: 1em; margin: 1em;
width: calc(100% - 2em);
max-width: none;
left: 0;
transform: none;
} }
} }
@@ -509,6 +562,75 @@ footer br + a {
// Fokus zurück auf den Hilfe-Button setzen // Fokus zurück auf den Hilfe-Button setzen
document.querySelector('.help-button').focus(); document.querySelector('.help-button').focus();
} }
// Sprachausgabe-Funktionalität
let currentSpeech = null;
function readAloud(text, button) {
// Stoppe vorherige Wiedergabe
if (currentSpeech) {
currentSpeech.cancel();
}
// Entferne "playing" Klasse von allen Buttons
document.querySelectorAll('.read-aloud-btn').forEach(btn => {
btn.classList.remove('playing');
btn.textContent = '🔊';
});
// Erstelle neue Sprachausgabe
currentSpeech = new SpeechSynthesisUtterance(text);
currentSpeech.lang = 'de-DE';
currentSpeech.rate = 0.9;
currentSpeech.pitch = 1;
// Button-Status aktualisieren
button.classList.add('playing');
button.textContent = '⏹️';
// Event-Handler für Ende der Wiedergabe
currentSpeech.onend = function() {
button.classList.remove('playing');
button.textContent = '🔊';
currentSpeech = null;
};
currentSpeech.onerror = function() {
button.classList.remove('playing');
button.textContent = '🔊';
currentSpeech = null;
};
// Wiedergabe starten
speechSynthesis.speak(currentSpeech);
}
function readAloudFromElement(button) {
// Finde das Ergebnis-Element (das div mit class="result")
const resultElement = button.closest('.result');
if (!resultElement) return;
// Entferne den Button-Text aus dem zu lesenden Text
const buttonText = button.textContent;
let textToRead = resultElement.textContent.replace(buttonText, '').trim();
// Bereinige den Text (entferne HTML-Tags und überschüssige Leerzeichen)
textToRead = textToRead.replace(/<[^>]*>/g, '').replace(/\s+/g, ' ').trim();
readAloud(textToRead, button);
}
function stopReading() {
if (currentSpeech) {
currentSpeech.cancel();
currentSpeech = null;
}
document.querySelectorAll('.read-aloud-btn').forEach(btn => {
btn.classList.remove('playing');
btn.textContent = '🔊';
});
}
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
// Sofortige Aktivierung der ersten Accordion-Sektion um Layout-Shifts zu vermeiden // Sofortige Aktivierung der ersten Accordion-Sektion um Layout-Shifts zu vermeiden
const activeIdx = parseInt("{{ active_idx|default(0) }}"); const activeIdx = parseInt("{{ active_idx|default(0) }}");
@@ -547,6 +669,7 @@ footer br + a {
document.addEventListener('keydown', function(e) { document.addEventListener('keydown', function(e) {
if (e.key === 'Escape') { if (e.key === 'Escape') {
hideHelp(); hideHelp();
stopReading();
} }
}); });
@@ -571,9 +694,9 @@ footer br + a {
<div id="help-tooltip" class="help-tooltip" role="tooltip">Öffnet ein Hilfefenster mit Informationen über den Datumsrechner</div> <div id="help-tooltip" class="help-tooltip" role="tooltip">Öffnet ein Hilfefenster mit Informationen über den Datumsrechner</div>
</div> </div>
<div style="text-align:center; margin-bottom:1.2em;"> <div style="text-align:center; margin-bottom:1.2em;">
<div style="font-size:1.1em; font-style:italic; color:#64748b;">Elpatrons</div> <div style="font-size:1.1em; font-style:italic; color:#475569;">Elpatrons</div>
<h1 style="margin:0;">Datumsrechner</h1> <h1 style="margin:0;">Datumsrechner</h1>
<div style="font-size:0.9em; color:#353535; margin-top:0.3em;"> <div style="font-size:0.9em; color:#1e293b; margin-top:0.3em;">
Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>. Eine <em>freie</em> Web-App: barriere<em>frei</em>, werbe<em>frei</em>, tracking<em>frei</em>, lizenz<em>frei</em> und kosten<em>frei</em>.
</div> </div>
</div> </div>
@@ -604,15 +727,49 @@ footer br + a {
<legend class="sr-only">Optionen</legend> <legend class="sr-only">Optionen</legend>
<input type="checkbox" name="werktage" id="werktage" {% if request.form.get('werktage') %}checked{% endif %} aria-checked="{{ 'true' if request.form.get('werktage') else 'false' }}"> <input type="checkbox" name="werktage" id="werktage" {% if request.form.get('werktage') %}checked{% endif %} aria-checked="{{ 'true' if request.form.get('werktage') else 'false' }}">
<label for="werktage" style="margin:0;">Nur Werktage</label> <label for="werktage" style="margin:0;">Nur Werktage</label>
<label for="bundesland" style="margin-left:1em;">Feiertage berücksichtigen für:
<select name="bundesland" id="bundesland" {% if not request.form.get('werktage') %}disabled{% endif %}>
<option value="">(kein Bundesland)</option>
<option value="BW" {% if request.form.get('bundesland') == 'BW' %}selected{% endif %}>Baden-Württemberg</option>
<option value="BY" {% if request.form.get('bundesland') == 'BY' %}selected{% endif %}>Bayern</option>
<option value="BE" {% if request.form.get('bundesland') == 'BE' %}selected{% endif %}>Berlin</option>
<option value="BB" {% if request.form.get('bundesland') == 'BB' %}selected{% endif %}>Brandenburg</option>
<option value="HB" {% if request.form.get('bundesland') == 'HB' %}selected{% endif %}>Bremen</option>
<option value="HH" {% if request.form.get('bundesland') == 'HH' %}selected{% endif %}>Hamburg</option>
<option value="HE" {% if request.form.get('bundesland') == 'HE' %}selected{% endif %}>Hessen</option>
<option value="MV" {% if request.form.get('bundesland') == 'MV' %}selected{% endif %}>Mecklenburg-Vorpommern</option>
<option value="NI" {% if request.form.get('bundesland') == 'NI' %}selected{% endif %}>Niedersachsen</option>
<option value="NW" {% if request.form.get('bundesland') == 'NW' %}selected{% endif %}>Nordrhein-Westfalen</option>
<option value="RP" {% if request.form.get('bundesland') == 'RP' %}selected{% endif %}>Rheinland-Pfalz</option>
<option value="SL" {% if request.form.get('bundesland') == 'SL' %}selected{% endif %}>Saarland</option>
<option value="SN" {% if request.form.get('bundesland') == 'SN' %}selected{% endif %}>Sachsen</option>
<option value="ST" {% if request.form.get('bundesland') == 'ST' %}selected{% endif %}>Sachsen-Anhalt</option>
<option value="SH" {% if request.form.get('bundesland') == 'SH' %}selected{% endif %}>Schleswig-Holstein</option>
<option value="TH" {% if request.form.get('bundesland') == 'TH' %}selected{% endif %}>Thüringen</option>
</select>
</label>
</fieldset> </fieldset>
<button name="action" value="tage_werktage" type="submit">Berechnen</button> <button name="action" value="tage_werktage" type="submit">Berechnen</button>
</form> </form>
{% if tage is not none %} {% if tage is not none %}
<div class="result" aria-live="polite"> <div class="result" aria-live="polite">
<button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
{% if request.form.get('werktage') %} {% if request.form.get('werktage') %}
Anzahl der Werktage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}</b>: {{ tage }} Anzahl der Werktage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}:</b>{% if request.form.get('bundesland') %} (Feiertage: {{ request.form.get('bundesland') }}){% endif %}: {{ tage }}
{% else %} {% else %}
Anzahl der Tage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}</b>: {{ tage }} Anzahl der Tage zwischen <b>{{ format_date(request.form.get('start1', '')) }}</b> und <b>{{ format_date(request.form.get('end1', '')) }}</b>: {{ tage }}.
{% endif %}
{% if wochenendtage_anzahl is not none or (feiertage_anzahl is not none and request.form.get('bundesland')) %}
<br>
<span style="font-size:0.98em; color:#1e293b;">
{% if wochenendtage_anzahl is not none %}
<b>Davon sind {{ wochenendtage_anzahl }}</b> Tage Wochenendtage.
{% endif %}
{% if feiertage_anzahl is not none and request.form.get('bundesland') %}
{% if wochenendtage_anzahl is not none %}, {% endif %}
<b>{{ feiertage_anzahl }}</b> Feiertage (Mo-Fr, {{ request.form.get('bundesland') }})
{% endif %}
</span>
{% endif %} {% endif %}
</div> </div>
{% endif %} {% endif %}
@@ -637,7 +794,10 @@ footer br + a {
<button name="action" value="wochentag" type="submit">Anzeigen</button> <button name="action" value="wochentag" type="submit">Anzeigen</button>
</form> </form>
{% if wochentag is not none %} {% if wochentag is not none %}
<div class="result" aria-live="polite">Wochentag von <b>{{ format_date(request.form.get('datum3', '')) }}</b>: {{ wochentag }}</div> <div class="result" aria-live="polite">
<button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
Wochentag von <b>{{ format_date(request.form.get('datum3', '')) }}</b>: {{ wochentag }}
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
@@ -660,7 +820,10 @@ footer br + a {
<button name="action" value="kw_berechnen" type="submit">Kalenderwoche berechnen</button> <button name="action" value="kw_berechnen" type="submit">Kalenderwoche berechnen</button>
</form> </form>
{% if kw_berechnen is not none %} {% if kw_berechnen is not none %}
<div class="result" aria-live="polite">Kalenderwoche von <b>{{ format_date(request.form.get('datum6', '')) }}</b>: {{ kw_berechnen }}</div> <div class="result" aria-live="polite">
<button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
Kalenderwoche von <b>{{ format_date(request.form.get('datum6', '')) }}</b>: {{ kw_berechnen }}
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
@@ -683,7 +846,10 @@ footer br + a {
<button name="action" value="kw_datum" type="submit">Start-/Enddatum berechnen</button> <button name="action" value="kw_datum" type="submit">Start-/Enddatum berechnen</button>
</form> </form>
{% if kw_datum is not none %} {% if kw_datum is not none %}
<div class="result" aria-live="polite">Start-/Enddatum der KW <b>{{ request.form.get('kw7', '') }}</b> im Jahr <b>{{ request.form.get('jahr7', '') }}</b>: {{ kw_datum }}</div> <div class="result" aria-live="polite">
<button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
Start-/Enddatum der KW <b>{{ request.form.get('kw7', '') }}</b> im Jahr <b>{{ request.form.get('jahr7', '') }}</b>: {{ kw_datum }}
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
@@ -726,7 +892,10 @@ footer br + a {
<button name="action" value="plusminus" type="submit">Berechnen</button> <button name="action" value="plusminus" type="submit">Berechnen</button>
</form> </form>
{% if plusminus_result is not none %} {% if plusminus_result is not none %}
<div class="result" aria-live="polite">{{ plusminus_result }}</div> <div class="result" aria-live="polite">
<button type="button" class="read-aloud-btn" onclick="readAloudFromElement(this)" onkeydown="if(event.key==='Enter'||event.key===' ') { event.preventDefault(); readAloudFromElement(this); }" aria-label="Ergebnis vorlesen" title="Ergebnis vorlesen" tabindex="0">🔊</button>
{{ plusminus_result }}
</div>
{% endif %} {% endif %}
</div> </div>
</div> </div>
@@ -783,10 +952,25 @@ footer br + a {
</div> </div>
</div> </div>
<footer style="text-align:center; margin-top:2em; color:#64748b; font-size:0.98em; padding-bottom:1.5em;"> <footer style="text-align:center; margin-top:2em; color:#475569; font-size:0.98em; padding-bottom:1.5em;">
Dies ist ein werbe- und trackingfreier <a href="https://codeberg.org/elpatron/datecalc/src/branch/main/README.md" target="_blank" style="color:#2563eb; text-decoration:underline;">Open Source Datumsrechner</a><br> Dies ist ein werbe- und trackingfreier <a href="https://codeberg.org/elpatron/datecalc/src/branch/main/README.md" target="_blank" style="color:#1e40af; text-decoration:underline;">Open Source Datumsrechner</a><br>
<a href="/api-docs" target="_blank" style="color:#2563eb; text-decoration:underline;">REST API Dokumentation (Swagger)</a><br> <a href="/api-docs" target="_blank" style="color:#1e40af; text-decoration:underline;">REST API Dokumentation (Swagger)</a><br>
© 2025 <a href="mailto:elpatron@mailbox.org?subject=Datumsrechner" style="color:#2563eb; text-decoration:underline;">M. Busche</a> © 2025 <a href="mailto:elpatron@mailbox.org?subject=Datumsrechner" style="color:#1e40af; text-decoration:underline;">M. Busche</a>
<div style="margin-top:0.5em; font-size:0.85em; color:#64748b;">v{{ app_version }}</div>
</footer> </footer>
<script>
document.addEventListener('DOMContentLoaded', function() {
var werktageCheckbox = document.getElementById('werktage');
var bundeslandSelect = document.getElementById('bundesland');
if (werktageCheckbox && bundeslandSelect) {
function toggleBundesland() {
bundeslandSelect.disabled = !werktageCheckbox.checked;
}
werktageCheckbox.addEventListener('change', toggleBundesland);
// Initial setzen
toggleBundesland();
}
});
</script>
</body> </body>
</html> </html>

View File

@@ -6,6 +6,13 @@
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css">
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
<style> <style>
body {
font-family: 'Segoe UI', Arial, sans-serif;
background: #f8fafc;
color: #1e293b;
margin: 0;
padding: 0;
}
.dashboard-box { max-width: 600px; margin: 3em auto; background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #cbd5e1; padding: 2em 2em 1.5em 2em; border: 1px solid #e5e7eb; } .dashboard-box { max-width: 600px; margin: 3em auto; background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #cbd5e1; padding: 2em 2em 1.5em 2em; border: 1px solid #e5e7eb; }
.dashboard-box h2 { text-align: center; margin-bottom: 1.2em; } .dashboard-box h2 { text-align: center; margin-bottom: 1.2em; }
.stats-row { display: flex; justify-content: space-between; margin-bottom: 2em; } .stats-row { display: flex; justify-content: space-between; margin-bottom: 2em; }
@@ -16,9 +23,9 @@
</head> </head>
<body> <body>
<div class="dashboard-box"> <div class="dashboard-box">
<h2>Statistik-Dashboard</h2> <h1>Statistik-Dashboard</h1>
<div class="stats-row"> <div class="stats-row">
<div class="stats-label">Gesamt-Pageviews:</div> <div class="stats-label">Gesamt-Pageviews (7 Tage):</div>
<div class="stats-value">{{ pageviews }}</div> <div class="stats-value">{{ pageviews }}</div>
</div> </div>
<div class="chart-container"> <div class="chart-container">
@@ -32,12 +39,12 @@
<canvas id="apiChart" width="400" height="220"></canvas> <canvas id="apiChart" width="400" height="220"></canvas>
</div> </div>
{% endif %} {% endif %}
<pre style="background:#f3f4f6; color:#334155; padding:0.5em; border-radius:6px; font-size:0.9em;">API-Counts: {{ api_counts|tojson }}</pre>
<a href="/" style="color:#2563eb;">Zurück zur App</a> <a href="/" style="color:#2563eb;">Zurück zur App</a>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
// Impressions pro Tag // Impressions pro Tag
// eslint-disable-next-line
const imprData = {{ impressions_per_day|tojson }}; const imprData = {{ impressions_per_day|tojson }};
const imprLabels = Object.keys(imprData); const imprLabels = Object.keys(imprData);
const imprCounts = Object.values(imprData); const imprCounts = Object.values(imprData);
@@ -62,6 +69,7 @@
} }
}); });
// Funktionsaufrufe // Funktionsaufrufe
// eslint-disable-next-line
const funcCounts = {{ func_counts|tojson }}; const funcCounts = {{ func_counts|tojson }};
const labels = Object.keys(funcCounts); const labels = Object.keys(funcCounts);
const data = Object.values(funcCounts); const data = Object.values(funcCounts);
@@ -83,6 +91,7 @@
} }
}); });
// API-Nutzung // API-Nutzung
// eslint-disable-next-line
const apiCounts = {{ api_counts|tojson }}; const apiCounts = {{ api_counts|tojson }};
if (Object.keys(apiCounts).length > 0 && document.getElementById('apiChart')) { if (Object.keys(apiCounts).length > 0 && document.getElementById('apiChart')) {
new Chart(document.getElementById('apiChart').getContext('2d'), { new Chart(document.getElementById('apiChart').getContext('2d'), {