FACEIT BANNER / DOCS
Działanie widżetu
Widżet to jeden komponent React (widget/src/widget/Widget.tsx). Ten sam komponent jest używany w OBS i w podglądzie generatora.
Dane i odświeżanie
- getPlayerStats w widget/src/utils/faceit_util.ts pobiera profil, statystyki meczów i ranking z FACEIT Data API v4.
- Wyniki trafiają do stanu Reacta, a efekt odświeża je w interwale z ustawienia refreshInterval.
- W podglądzie generatora widżet nie wywołuje API: dostaje dane przez właściwości preview*.
- Tryb VERSUS pobiera drugiego gracza tą samą funkcją, po identyfikatorze z opponent_id.
Sesja w danych przeglądarki
Przy włączonym saveSession widżet zapisuje w localStorage klucze fcw_session_start, fcw_session_end, fcw_session_player-id i fcw_session_starting-elo. Przy starcie sprawdza, czy sesja jeszcze trwa (koniec w przyszłości i ten sam gracz). Jeśli tak, wygrane i porażki liczą się od zapisanego początku. Jeśli nie, sesja zaczyna się od zera. Koniec sesji jest przesuwany o dwie godziny przy każdym odświeżeniu i przy zamknięciu strony.
Algorytm rozmiaru
resolveBannerSize w widget/src/utils/banner_size.ts zamienia tryby AUTO, Zalecane i Ręcznie na rozmiar docelowy przyciśnięty do limitów układu. Z docelowego rozmiaru liczy skalę: przy zmniejszaniu skala dopasowuje treść do pola, a przy powiększaniu rośnie tylko w 60 procentach (GROWTH_SHARE), resztę miejsca dostaje układ. Widżet ustawia na wrapperze szerokość i wysokość układu oraz właściwość zoom. Wysokość w trybie Zalecane jest pusta, więc baner dopasowuje się do zawartości.
Animacje
- Showcase i Spotlight używają komponentu BroadcastDeck: zakładki, autoplay i pauza.
- Ticker, Cycle i Reel zmieniają strony licznikiem w useEffect; Marquee i Surge animuje CSS.
- Ramka banera (::after) ma pointer-events: none, żeby nie blokowała kliknięć w zakładki.
Zaktualizowano: