146 lines
3.8 KiB
Markdown
146 lines
3.8 KiB
Markdown
# 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
|
||
|
||
```js
|
||
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
|
||
|
||
```js
|
||
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
|
||
|
||
```json
|
||
{
|
||
"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
|
||
|
||
```js
|
||
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:
|
||
|
||
```js
|
||
// 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).
|