From a82de89fcac13ff4ba9b16769e61bb614eb91652 Mon Sep 17 00:00:00 2001 From: Ignace Date: Tue, 11 Aug 2026 19:11:40 +0200 Subject: [PATCH] pages per period --- README.md | 5 +++-- generate_graphs.py | 46 ++++++++++++++++++++++++++++++++-------------- 2 files changed, 35 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index e0d36b3..365b647 100644 --- a/README.md +++ b/README.md @@ -39,8 +39,9 @@ the new values. If the RRD has already been created, do not change the order of mountpoints unless you intentionally want the historical graph labels to refer to different disks. -The generated PNG files and a responsive, auto-refreshing `index.html` are -placed in `/var/www/html/system-monitor` by default. +The generated PNG files and four responsive, auto-refreshing dashboard pages +are placed in `/var/www/html/system-monitor` by default. `index.html` shows +the last 3 hours and links to the 1-day, 2-week, and 1-year pages. With a web server installed, such as nginx or Apache, they can be served directly; otherwise they can simply be opened or copied as PNG files. diff --git a/generate_graphs.py b/generate_graphs.py index 08c7d1e..f5555ae 100755 --- a/generate_graphs.py +++ b/generate_graphs.py @@ -80,22 +80,40 @@ def main() -> None: graph(output_dir / f"{filename}-{period_name}.png", rrd, start, f"{title} — {period_name}", unit, series, logarithmic, stacked, disk_memory, network_mixed) - cards = "\n".join( - f'

{html.escape(title)}

' + "".join( - f'
{period}
' - f'{html.escape(title)}, {period}
' - for period in PERIODS - ) + "
" - for filename, title, _unit, _series, _logarithmic, _stacked, _disk_memory, _network_mixed in definitions - ) - page = f""" + page_files = { + "3hours": "index.html", + "1day": "1day.html", + "2weeks": "2weeks.html", + "1year": "1year.html", + } + period_labels = { + "3hours": "3 hours", + "1day": "1 day", + "2weeks": "2 weeks", + "1year": "1 year", + } + for period in PERIODS: + cards = "\n".join( + f'

{html.escape(title)}

' + f'
' + for filename, title, *_rest in definitions + ) + navigation = " ".join( + f'' + f'{period_labels[item]}' + for item in PERIODS + ) + page = f""" -System monitor +System monitor — {period_labels[period]} -

System monitor

{cards}""" - (output_dir / "index.html").write_text(page) +nav{{display:flex;gap:.5rem;flex-wrap:wrap}} nav a{{padding:.5rem .75rem;background:#e2e8f0;color:#172033;text-decoration:none;border-radius:.35rem}} +nav a.active{{background:#2563eb;color:white}} section{{background:white;padding:1rem;margin:1rem 0;border-radius:.5rem;box-shadow:0 1px 4px #0002}} +img{{width:100%;height:auto}} +

System monitor — {period_labels[period]}

{cards}""" + (output_dir / page_files[period]).write_text(page) if __name__ == "__main__":