Druckvorstufen Info Seite

Druckvorstufe GPI Hanover GmbH – Projektbeschreibung

Was ist das Projekt?

Das Projekt ist ein internes Web-Portal für die Druckvorstufen-Abteilung von Graphic Packaging International in Hannover. Es dient als zentrale digitale Anlaufstelle für alle Mitarbeiter der Abteilung und bündelt Dokumente, Prozesse, interne Kommunikation und abteilungsspezifische Verwaltung an einem Ort – ohne dass dafür ein externer Server oder ein CMS nötig ist.

Was macht es besonders?

Vollständig offline-fähig Das Portal läuft komplett lokal. Die HTML-Dateien liegen auf einem Netzlaufwerk (NAS) und werden direkt im Browser geöffnet – kein Hosting, kein Deployment, kein IT-Aufwand.

Intelligente Aktualitätserkennung Dokumente die in den letzten 21 Tagen aktualisiert wurden erhalten automatisch ein „Neu”-Badge. Ab dem 22. Tag verschwindet es ohne manuellen Eingriff.

Lebendiger Geburtstagskalender Der Kalender zeigt Geburtstage der Teammitglieder mit einem visuellen Kalender und einer Listenansicht. Wenn jemand Geburtstag hat erscheint ein animiertes Kuchensymbol neben dem Menüpunkt im Header – auf jeder Seite.

Aktualitätsprüfungs-Countdown Ein animierter Countdown auf der Startseite zeigt wann die nächste Aktualitätsprüfung der Dokumente fällig ist – mit einem Farbverlauf der von grün über gelb zu rot wechselt je näher der Termin rückt.

E-Mail-Vorlagen als Outlook-Entwürfe Vorgefertigte E-Mail-Vorlagen werden nicht nur angezeigt – ein Klick öffnet die Vorlage direkt als bearbeitbaren Entwurf in Microsoft Outlook inklusive Signatur und Formatierung.

Dark- und Light-Mode mit persistenter Speicherung Das Theme wird in einem Cookie mit 10 Jahren Laufzeit gespeichert und beim nächsten Öffnen automatisch wiederhergestellt – seitenübergreifend auf allen Unterseiten.

Personalisierung Jeder Nutzer gibt beim ersten Besuch seinen Namen ein. Die Startseite begrüßt ihn persönlich. Der Name ist jederzeit durch Klick auf den Namen änderbar.

Wie ist es technisch gelöst?

Frontend

Das Portal besteht aus fünf statischen HTML-Seiten mit eigenem CSS und JavaScript – ohne Frameworks wie React oder Vue. Alle Seiten teilen sich ein gemeinsames Navigationssystem, einen Footer mit Saisonanimation und das globale Skript für Theme, Cookie-Verwaltung und Backend-Verbindungsstatus.

• index.html – Startseite mit Dokumentenübersicht, Suchfunktion, Teamfotos, Countdown und Wetter-Widget
• reklamationen.html – Reklamationsfälle
• entscheidungen.html – Entscheidungsprotokoll der Abteilung
• email-vorlagen.html – E-Mail-Vorlagen die als Outlook-Entwurf geöffnet werden
• geburtstag.html – Geburtstagskalender mit Monatsansicht

Backend

Ein einzelnes Python-Script startet beim Login automatisch im Hintergrund und öffnet vier lokale Ports:

Das Script wartet nach dem Start bis die Netzlaufwerke verbunden sind bevor es die netzwerkabhängigen Dienste aktiviert. Die JSON-basierten Dienste (Reklamationen, Entscheidungen) starten sofort.

Datenhaltung

Reklamationen und Entscheidungen werden in einfachen JSON-Dateien gespeichert die auf dem NAS liegen. Das macht sie für alle Nutzer gleichzeitig zugänglich ohne Datenbank.

Autostart

Eine AppleScript-App wird als macOS-Anmeldeobjekt eingetragen. Sie startet das Python-Script beim Login automatisch im Hintergrund – kein Terminal-Fenster, kein manueller Eingriff.

CORS-Lösung

Da die Website als file://-Protokoll geöffnet wird blockiert der Browser normalerweise alle Anfragen an localhost. Das Backend setzt auf jede Antwort explizit Access-Control-Allow-Origin: * und behandelt OPTIONS-Preflight-Requests manuell – so funktionieren alle Datenabrufe zuverlässig ohne die Website hosten zu müssen.

Aus Geheimhaltungsgründen, darf das Projekt hier nicht zur Verfügung gestellt werden.