---
title: >-
  HS2 UI
date: 2017-08-06 00:00:00
modified: 2026-05-23 09:24:42
lang: pl
authors: Piotr Pelica
url: https://pelica.net/pl/hs2-ui
tags:
 - technology
 - self-hosting
 - raspberry-pi
 - homelab
status: published
---

# HS2 UI

Hejże!

Zrobiłem ostatnio maaaasę drobnych, kosmetycznych aktualizacji w HS2, które nie wpływają znacząco na funkcjonalność, dodają natomiast wiele, jeśli chodzi o stronę estetyczną panelu.

![CSS](https://cdn2.pelica.net/posts/hs2ui/Q3cUg29-69ab537b8e9ee.gif)

### Menu, widżety i inne drobne zmiany

media[2103]

W pierwszej kolejności najbardziej rzucającą się w oczy zmianą jest kolor menu, które teraz jest ciemne. Nie jest zupełnie czarne, a kolor tekstu nie jest również w pełni biały – uzyskujemy dzięki temu mniejszy kontrast, przez co samo menu wydaje się bardziej naturalne i nie przyciąga tak wzroku.

Dodatkowo usunąłem kolory z nagłówków widżetów – są teraz przezroczyste, tj. tego samego koloru, co reszta widżetu. Dzięki temu nie odstają tak bardzo od reszty, a także pozwala to na tworzenie takich fajnych bajerów jak widżet radia – zwróćcie uwagę na okładkę. Tytuł widżetu znajduje się na niej.

### Radio

media[2104]

Właśnie a propos radia – panel nim sterujący doczekał się (prawie) całkowitego przebudowania. Nową funkcją jest przede wszystkim okładka utworu, pobierana z bazy serwisu Last.fm. Informacje o utworze znajdują się zaraz pod nią, a przyciski sterujące zyskały bardziej kompaktowy wygląd.

media[2105]

Rozwiązanie to powoduje przede wszystkim zwiększoną czytelność. Usunąłem też zbędny w tym miejscu adres strumienia – użytkownik wciąż może go odczytać na liście stacji.

### Pogoda

media[2106]

Moduł pogody również doczekał się upiększenia. Powiększyłem banner ze zdjęciem, wyciągnąłem treść do góry – na banner. Wygląda to całkiem nieźle i powoduje, że zdjęcie nie jest już tak bardzo odłączone od reszty. Od strony backendu dodałem obsługę większej ilości funkcji API, w tym sytuacji, w których stacja niespodziewanie stanie się niedostępna. Użytkownik jest wtedy informowany o takiej sytuacji stosownym komunikatem.

#### Wykresy z danymi historycznymi pogody

Dodatkowo HS2 obsługuje teraz także dane historyczne z API – w chwili obecnej ostatnie 24 godziny wyświetlane są na wykresie. Dostępne są dane dla temperatury, ciśnienia i wilgotności, które wyświetlane są na kartach – wystarczy wybrać żądane dane z menu na górze wykresu.

### Sieć

media[2107]

Nowym modułem jest moduł sieci. Pozwala on na sprawdzanie jakie urządzenia są obecnie podłączone do sieci lokalnej. Skanowanie odbywa się za pomocą pakietów ARP – jest więc stosunkowo szybkie, dodatkowo odbywa się asynchronicznie w stosunku do użytkownika, ten nie zobaczy więc nawet, kiedy skan jest w toku.

Znalezione urządzenia wyświetlane są w przystępnej, graficznej formie. Po najechaniu myszą (bądź dotknięciu na urządzeniu mobilnym) wyświetli się więcej informacji odnośnie urządzenia – adres IP oraz MAC, status (online bądź offline) a także, jeśli skaner posiada informacje w swojej bazie, producenta urządzenia. Użytkownik może nadać znalezionym urządzeniom własne nazwy tak, by były dla niego łatwo rozpoznawalne.

### Podsumowanie

I to tyle z nowości w HS2 – tak, jak mówiłem, masa drobnych zmian, głównie kosmetycznych. Zmiany te powodują, że HS2 zaczyna przypominać coraz bardziej komercyjny produkt – a w sumie o to chodziło. Nie wspominając już o tym, że mam na czym eksperymentować 🙂