-
Skopiuj folder
led-managerna serwer lub komputer- Możesz użyć dowolnego hostingu (np. GitHub Pages - darmowy)
- Lub uruchomić lokalny serwer na komputerze
-
Uruchom serwer lokalny (na komputerze):
cd led-manager python -m http.server 8080 -
Na telefonie otwórz Chrome i wpisz:
http://ADRES_IP_KOMPUTERA:8080/app.html -
Zainstaluj jako aplikację:
- Kliknij menu (3 kropki) → "Dodaj do ekranu głównego"
- Lub poczekaj na automatyczny baner instalacji
-
Gotowe! Aplikacja pojawi się na pulpicie jak normalna app.
Najprostszy sposób - GitHub Pages (darmowy):
- Utwórz konto na https://github.com
- Utwórz nowe repozytorium (np. "led-manager")
- Wgraj pliki z folderu
led-manager - Włącz GitHub Pages w Settings → Pages
- Twoja aplikacja będzie dostępna pod adresem:
https://TWOJA_NAZWA.github.io/led-manager/app.html
- Otwórz https://www.pwabuilder.com
- Wklej URL swojej aplikacji
- Kliknij "Start"
- Przejdź do zakładki "Android"
- Kliknij "Generate" → "Download"
- Pobierzesz plik
.apk
- Skopiuj plik
.apkna telefon - Otwórz plik (może wymagać włączenia "Nieznane źródła" w ustawieniach)
- Zainstaluj
- Gotowe! 🎉
Jeśli chcesz używać aplikacji całkowicie offline:
- Otwórz
app.htmlw Chrome na telefonie (przezfile://lub serwer) - Zainstaluj jako PWA
- Aplikacja będzie działać offline!
Uwaga: Skanowanie sieci wymaga połączenia z WiFi.
- Upewnij się, że telefon jest w tej samej sieci WiFi co ESP32
- Lub połącz się bezpośrednio z siecią "Sypialnia LED" (AP urządzenia)
- Sprawdź czy wpisałeś poprawny adres IP
- Skanowanie działa tylko w sieci lokalnej
- Spróbuj ręcznie wpisać IP:
192.168.4.1(domyślny AP ESP32)
- Użyj Chrome (nie Firefox/Samsung Browser)
- Strona musi być serwowana przez HTTP/HTTPS (nie file://)
led-manager/
├── app.html ← Główna aplikacja (używaj tego!)
├── index.html ← Starsza wersja
├── manifest.json ← Manifest PWA
├── sw.js ← Service Worker (offline)
├── generate-icons.html ← Generator ikon
└── INSTRUKCJA.md ← Ten plik
Aplikacja komunikuje się z ESP32 przez te endpointy:
GET /status- pobiera aktualny stanGET /power?state=0|1- włącza/wyłączaGET /color?cold=X&warm=Y- ustawia kolorGET /brightness?value=X- ustawia jasnośćGET /animation?type=X- ustawia animację startową
Wszystkie endpointy muszą zwracać nagłówki CORS!