Wiele kanałów i osobne nakładki

Podziel czat według platformy w 4 krokach

Przykład: jedna nakładka pokazuje tylko czat Twitch, druga tylko YouTube. Nadal czytasz wszystko w jednym Docku.

Dodaj wszystkie czaty do Social Stream Ninja. Sprawdź, czy po jednej nowej wiadomości z każdego pojawia się w Dok czatu transmisji. Pozostaw ten Dock bez filtrów. To Twój własny widok.
Skopiuj wygenerowany dock.html dwa razy. Kopiowanie zachowuje sesję, hasło, wersję i ustawienia serwera.
Dodaj filtr na końcu każdej kopii, np. &onlyfrom=twitch&hidemenu (zobacz tabelę poniżej).
Dodaj każdy link do OBS jako osobne Źródło przeglądarki. Nadaj im jasne nazwy, np. Czat Twitch i Czat YouTube.

Trzymaj każdą nakładkę w jej własnym źródle przeglądarki OBS. — Każda nakładka ma własne źródło przeglądarkowe.

Przechwytywanie Twitch + YouTube
Jedna sesja SSN Dock widzi oba
Widoki OBS Tylko Twitch i tylko YouTube

Jeden strumień danych może zasilać wiele filtrowanych widoków.

Opcje filtrowania nakładek czatu

Chcę pokazać…	Dodaj do linku Docka
Tylko Twitch	`&onlyfrom=twitch&hidemenu`
Tylko YouTube	`&onlyfrom=youtube&hidemenu`
Twitch i YouTube razem	`&onlyfrom=twitch,youtube&hidemenu`
Wszystko oprócz Discorda	`&hidefrom=discord&hidemenu`

Pełny przykład:

https://socialstream.ninja/dock.html?session=YOUR_SESSION_ID&onlyfrom=twitch&hidemenu

Użyj onlyfrom i hidefrom tutaj. Opcje z innych nakładek, np. onlytypemogą nie działać na tej stronie. YouTube Shorts to osobny typ: dodaj youtubeshorts jeśli przechwytywanie je zgłasza. Zobacz Typy źródeł.

Podziel Featured Chat (wybrane wiadomości)

Skopiuj wygenerowany featured.html dwa razy.
Dodaj &onlyfrom=twitch do jednego i &onlyfrom=youtube do drugiego.
Pozostaw Dock otwarty, aby wybierać wiadomości.

Featured Chat przyjmuje jedną platformę na link. Lista rozdzielona przecinkami (twitch,youtube) działa tylko w Docku.

Filtr decyduje tylko, które wybrane wiadomości strona przyjmuje. Nie tworzy osobnych kolejek. Odrzucony wybór też nie czyści ekranu. Przy zmianie segmentu samodzielnie wyczyść wyróżnioną wiadomość, aby stara nie została na ekranie.

Dwa kanały na tej samej platformie

onlyfrom=twitch oznacza cały Twitch, nie jeden kanał Twitch. Nazw kanałów i tytułów transmisji nie można używać jako nazw filtrów.

Chcę…	Zrób to
Pokaż kanał pochodzenia każdej wiadomości	Dodaj `&showchannelname` (działa, gdy źródło wysyła nazwę kanału).
Prowadź dwie całkowicie osobne transmisje	Użyj osobnych instancji przechwytywania lub profili, każdy z własną sesją i tylko własnymi źródłami.
Filtruj Dock według karty przeglądarki	`&filtertid=123` (zaawansowane, zobacz poniżej).

Nakładka z inną sesją, ale bez pasującego przechwytywania, pozostanie pusta. Parametr nakładki label nazywa stronę na potrzeby kierowania danych; nie jest filtrem kanału.

Jak filtertid działa

Przyjmuje liczbowy identyfikator karty przeglądarki, z której pochodzi wiadomość. Kilka identyfikatorów rozdziel przecinkami.
Znajdź tid w rzeczywistych przechwyconych danych. Zobacz Dokumentacja zdarzeń i Polecenia i API.
To nie jest identyfikator kanału platformy.
ID kart mogą się zmieniać po ponownym otwarciu źródła. Źródła bez pasującego ID karty mogą być ukryte.
Działa tylko w Docku, nie jako filtr kanału Featured Chat.

Przetestuj każdy widok

Wyślij sztuczną wiadomość Twitch i YouTube do sesji testowej. Użyj Twórz wiadomości testowe.
Sprawdź, czy obie pojawiają się w Docku i każda nakładka czatu pokazuje tylko swoją platformę.
Wyróżnij każdą wiadomość, a potem ją wyczyść. Po zmianie platformy sprawdź każdą stronę wyróżnionych wiadomości.
Powtórz z prawdziwą wiadomością z każdego źródła. Sztuczne wiadomości nie mają rzeczywistych ID kart.

Problem	Spróbuj tego
Widok jest pusty	Usuń na chwilę filtr. Jeśli czat wróci, sprawdź dokładny typ źródła lub ID karty.
Nadal pusto bez filtra	Zobacz rozwiązywanie problemów z sesją i routingiem.
Nazwa źródła OBS zmieniona, ale nic się nie zmieniło	Zmiana nazwy nie zmienia zapisanego linku. Edytuj sam URL.

Czat i alerty w jednej karcie przeglądarki

Połącz nakładki układa linki nakładek w jednej karcie lub jednym źródle przeglądarkowym OBS. Przydaje się do czytania czatu na telefonie podczas transmisji IRL.

Wklej swój Dok czatu transmisji do dolnej warstwy.
Wklej swój Pole alertów wielu transmisji do górnej warstwy. Zachowaj pełne linki z sesją, hasłem i opcjami połączenia.
Pozostaw Przezroczyste tło SSN zaznaczone.
Włącz Zezwalaj na dotyk i przewijanie na tej warstwie dla czatu. Wyłącz dla alertów, aby nie blokowały czatu.
Naciśnij Podgląd, a następnie Pokaż kod QR i zeskanuj telefonem. Lub naciśnij Kopiuj połączone łącze aby wkleić do źródła przeglądarkowego.

Połączony widok nie ma elementów konfiguracji. Pokazuje tylko nakładki.

Opcje warstwy

Chcę…	Zrób to
Dodaj więcej nakładek	Do ośmiu linków.
Przesuń warstwę przed lub za inne	Użyj przycisków strzałek.
Zmień rozmiar lub położenie warstwy	Otwórz Rozmiar i pozycja. Ustaw szerokość, wysokość i położenie od lewej oraz góry w pikselach (`450`) lub procentach (`100%`).
Przywróć warstwę pełnoekranową	Przywróć pełny ekran. Pusta szerokość i wysokość wypełniają przeglądarkę; puste położenie od lewej i góry zaczyna w lewym górnym rogu.
Utwórz lewą kolumnę czatu (1920×1080)	Warstwa czatu: szerokość `450`, wysokość `1080`, od lewej `0`, od góry `0`. Pozostałe warstwy zostają pełnoekranowe.
Edytuj połączony link później	Użyj edytowalnego linku lub dodaj `?edit=1` przed `#`.
Zacznij od nowa	Wyczyść zapisaną konfigurację.

Rozmiary w pikselach nie zmieniają się przy zmianie rozmiaru przeglądarki. Procenty się dostosowują. Każda nakładka zachowuje własną treść i ustawienia.

Zapisywanie, telefony i prywatność

Linki i opcje warstw zapisują się automatycznie w tej przeglądarce, nawet niedokończone. Tryb prywatny może ich nie zachować.
Połączony link i kod QR zawierają cały układ. Skonfiguruj go na komputerze, zeskanuj raz i dodaj do zakładek w telefonie. Otwarcie zapisuje też konfigurację w przeglądarce telefonu.
Zmiany na komputerze nie aktualizują starszego linku. Po edycji skopiuj lub zeskanuj nowy link. Nic nie synchronizuje się przez identyfikator sesji.
Chroń połączone linki i kody QR tak samo jak linki nakładek.
Przechwytywanie SSN musi nadal działać, a telefon musi mieć dostęp do tych samych serwerów co oryginalne linki. localhost lub 127.0.0.1 oznacza sam telefon.
Bardzo długie linki mogą nie mieścić się w kodzie QR. Nadal możesz skopiować link.

Przepis OBS: lewa kolumna czatu z efektami pełnoekranowymi

CSS nie jest potrzebny. Każda warstwa ma własny obszar. Ustaw źródło przeglądarkowe OBS na 1920×1080. Dodawaj warstwy od dołu i wpisuj same liczby (bez przecinków i „px”) w sekcji każdej warstwy: Rozmiar i pozycja.

Warstwa	Szerokość	Wysokość	Lewo	Góra
1. Czat na żywo / dok	450	1000	0	80
2. Licznik hype	450	80	0	0
3. Ściana emoji / emotek	1920	1080	0	0
4. Wyróżniony czat	1470	1080	450	0
5. NinjaBacker (opcjonalnie)	1920	1080	0	0

Górne 80 pikseli zajmuje Hype, a pod nim jest kolumna czatu. Chcesz czat na pełną wysokość za Hype? Ustaw wysokość Live Chat na 1080 i górę na 0. Inne rozmiary scen wymagają innych liczb.

Wklej pełne linki nakładek. Skopiuj je z istniejących źródeł przeglądarkowych, aby zachować sesję, hasło, style i ustawienia połączenia. Pozostaw Przezroczyste tło SSN zaznaczone. Przycinanie, przekształcenia, filtry i własny CSS w OBS nie są częścią linku i nie zostaną przeniesione.
Wyśrodkuj Hype w kolumnie. Na hype.html użyj &align=center. Zastąp wszystkie align=left lub align=right, i usuń alignright. Dla zwartego wyglądu wypróbuj &combineall&hidetitle&style=compact&scale=0.75 (zastąp istniejące wartości). Zwiększ wysokość warstwy Hype, jeśli styl potrzebuje więcej miejsca.
Umieść Featured Chat obok kolumny czatu. Ustaw Od lewej = 450 i Szerokość = 1470 łącznie (450 + 1470 = 1920). Przesunięcie warstwy szerokiej na 1920 w prawo obcięłoby jej krawędź. Dodaj &center na featured.html aby wyśrodkować krótkie wiadomości w tym obszarze. Aby wyśrodkować w całej scenie, ustaw od lewej 0, szerokość 1920 i &center.
Dodaj NinjaBacker na końcu (opcjonalnie). Wklej link nakładki dla widzów jako najwyższą warstwę, z ustawioną animacją wejścia z prawej. Łącznik ustala obszar i kolejność; NinjaBacker własną animację. Tło musi być przezroczyste, a witryna musi zezwalać na osadzanie. Ta warstwa nie należała do testowanego przykładu.
Podejrzyj w rozdzielczości 1920×1080. Wyślij wiadomość z emoji, wyróżnij wiadomość z Docka i włącz dane Hype w SSN. Zwykły czat sam nie wybiera wyróżnionej wiadomości.
Skopiuj nowe połączone łącze do OBS. Ustaw szerokość źródła przeglądarkowego na 1920, wysokość na 1080. Rozmiar podglądu tego nie ustawia. Dopasuj do sceny bez przycinania. Po każdej zmianie układu skopiuj link ponownie; stary link zachowuje stary układ.

Przetestowany połączony widok: Hype wyśrodkowany nad wąską lewą kolumną czatu, emoji w całej scenie i wyróżniona wiadomość wzdłuż dołu po prawej stronie czatu. — Rzeczywisty test Chromium z czterema nakładkami SSN i testowymi danymi. Obraz jest przezroczysty; ciemne tło dodano tu dla czytelności. Kliknij, aby zobaczyć pełny rozmiar. Czcionki i kolory pochodzą z Twoich ustawień nakładek.

Wydajność: Jedno źródło przeglądarkowe nadal uruchamia każdą nakładkę wewnątrz. Mniej źródeł OBS nie gwarantuje niższego użycia procesora ani pamięci. Po zakończeniu zamknij podgląd przeglądarki i porównaj OBS przy wyłączonych starych źródłach. Wydajność na Macu M1 i Twój link NinjaBacker nie są przetestowane. Możesz zostawić Live Chat osobno i połączyć tylko resztę.

Jeśli warstwa jest pusta lub zakrywa czat

Problem	Spróbuj tego
Warstwa jest pusta	Najpierw otwórz osobno oryginalny link. Alerty pozostają puste, dopóki nie nadejdzie zdarzenie. Łączenie nie przechwytuje niczego nowego.
Warstwa ma nieprzezroczyste tło	Automatyczna przezroczystość działa dla `dock.html`, `featured.html`, `multi-alerts.html` i `minecraft.html`. Inne strony wymagają własnego ustawienia przezroczystości. Niektóre zewnętrzne witryny blokują osadzanie.
Nie można dotykać ani przewijać czatu	Nawet przezroczysta warstwa może blokować dotyk. Wyłącz Zezwól na dotyk i przewijanie na warstwach nad czatem, które tego nie potrzebują.
Brak dźwięku na telefonie	Telefon może wymagać dotknięcia przed odtworzeniem dźwięku. Włącz dotyk dla tej warstwy i dotknij jej. Przetestuj na prawdziwym telefonie, zanim na tym polegasz.