2026-06-08 09:37:18 +02:00
2026-05-28 14:51:09 +02:00

ALS Alert Screen

Jednostronicowa aplikacja HTML/JS wyświetlająca alarmy maszyn na podstawie danych z WebSocket. Przeznaczona do montażu na monitorze halowym.


Działanie

Strona nasłuchuje danych z WebSocket dla każdej skonfigurowanej maszyny. W zależności od statusów maszyn wyświetla jeden z dwóch widoków:

Sytuacja Widok
Brak maszyny w alarmie Iframe z http://diluals31/terminal/ift/5/PL/index
Co najmniej jedna maszyna w alarmie Ekran alarmowy z kartami maszyn

Alarm jest wykrywany gdy pole status w danych maszyny zawiera słowo alarm (bez rozróżnienia wielkości liter), np. "Alarm - awaria", "ALARM".


Ekran alarmowy

  • Karty maszyn wypełniają cały dostępny ekran w układzie siatki N×M (możliwie kwadratowej).
  • Numer maszyny jest wyświetlany bardzo dużą czcionką, widoczną z daleka — rozmiar skaluje się automatycznie zarówno do wymiarów ekranu (vw/vh), jak i szerokości karty (cqw), więc tekst nigdy nie jest ucięty.
  • Pod numerem wyświetlany jest pełny tekst statusu.
  • Pasek u góry pokazuje liczbę maszyn w alarmie i miga.

Układ siatki w zależności od liczby alarmów

Alarmy Kolumny Wiersze
1 1 1
2 2 1
3 2 2
4 2 2
5 3 2
6 3 2
9 3 3

Konfiguracja

Wszystkie parametry konfiguracyjne znajdują się na początku sekcji <script> w pliku als_alert_screen.html.

Lista maszyn

const MACHINES = [
    "1.64", "1.76", "2.60", ...
];

Każdy wpis to numer maszyny używany w adresie WebSocket. Aby dodać lub usunąć maszynę — edytuj tę tablicę.

Adres WebSocket

const WS_BASE = "ws://luport.local/ws/als-data/";

Dla każdej maszyny otwierane jest połączenie pod adresem WS_BASE + id + "/",
np. ws://luport.local/ws/als-data/2.60/.

Format wiadomości WebSocket

{
    "type": "machine_update",
    "machine": "2.60",
    "data": {
        "machine": "2.60",
        "status": "Automatyczny",
        "mold": 6447,
        "variant": [3],
        "cavities": 2,
        "order": "202605350  0010",
        "qty_planned": 8400,
        "qty_produced_ok": 2132,
        "qty_produced_nok": 10,
        "cycle_time_planned": 58.0,
        "cycle_time_average": 57.4,
        "progress": 25
    },
    "timestamp": "2026-05-28T12:00:32.898808"
}

Strona obsługuje tylko wiadomości z "type": "machine_update". Pozostałe są ignorowane.

Czas ponownego połączenia

const RECONNECT_MS = 5000;

Przy zerwaniu połączenia WS strona automatycznie próbuje ponownie po 5 sekundach.


Tryb debug

Służy do podglądu ekranu alarmowego bez rzeczywistych danych WS.

Przez URL

Otwórz stronę z parametrem ?debug:

als_alert_screen.html?debug

Ładuje przykładowe dane dla maszyn 2.60, 3.22, 4.09 i natychmiast pokazuje ekran alarmowy. Połączenia WS nie są nawiązywane. Pasek statusu wyświetla [DEBUG] widok alarmowy.

Przez konsolę przeglądarki

W każdej chwili można przełączyć widok bez przeładowania strony:

// włącz widok alarmowy
DEBUG_ALARM = true; updateDisplay();

// wróć do normalnego widoku
DEBUG_ALARM = false; updateDisplay();

Dane przykładowe

Maszyny i dane używane w trybie debug są zdefiniowane w zmiennych DEBUG_MACHINES i DEBUG_DATA — można je swobodnie edytować.


Pasek statusu

W prawym dolnym rogu ekranu widoczny jest mały pasek z liczbą aktywnych połączeń WebSocket:

WS: 32 / 35

Wymagania

  • Przeglądarka z obsługą WebSocket, CSS Container Queries (cqw) i min() w CSS — spełnia każda nowoczesna przeglądarka (Chrome 105+, Firefox 110+, Edge 105+).
  • Dostęp sieciowy do luport.local (WebSocket) oraz diluals31 (iframe).
S
Description
Ekran informujący o alarmach na maszynach wyświetlany na ekranie informacyjnym produkcji.
Readme 128 KiB
Languages
HTML 69.9%
Python 30.1%