mirror of
https://github.com/Shik3i/KoalaSync.git
synced 2026-08-11 03:58:58 +00:00
Merge remote-tracking branch 'origin/main' into feature/textchat
# Conflicts: # extension/background.js # extension/popup.js
This commit is contained in:
Timo
@@ -1,6 +1,14 @@
|
||||
// KoalaSync Landing Page Logic
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const siteAccessBanner = document.querySelector('.site-access-banner');
|
||||
const siteAccessBannerDismiss = document.querySelector('.site-access-banner-dismiss');
|
||||
if (siteAccessBanner && siteAccessBannerDismiss) {
|
||||
siteAccessBannerDismiss.addEventListener('click', () => {
|
||||
siteAccessBanner.hidden = true;
|
||||
});
|
||||
}
|
||||
|
||||
// Mockup Video Title Randomization on Load
|
||||
const SERIES_NAMES = [
|
||||
'Stranger Things',
|
||||
|
||||
@@ -235,6 +235,7 @@ async function compile() {
|
||||
'styles/hero.css',
|
||||
'styles/landing-primary.css',
|
||||
'styles/legal.css',
|
||||
'styles/support.css',
|
||||
'styles/landing-controls.css',
|
||||
'styles/join-spinner.css',
|
||||
'styles/landing-sections.css',
|
||||
@@ -522,6 +523,7 @@ async function compile() {
|
||||
{ src: 'join.html', dest: 'join.html' },
|
||||
{ src: 'imprint.html', dest: 'imprint.html' },
|
||||
{ src: 'privacy.html', dest: 'privacy.html' },
|
||||
{ src: 'site-access-help.html', dest: 'site-access-help.html' },
|
||||
{ src: 'impressum-de.html', dest: 'de/impressum.html' },
|
||||
{ src: 'datenschutz-de.html', dest: 'de/datenschutz.html' },
|
||||
{ src: 'impressum.html', dest: 'impressum.html' },
|
||||
@@ -734,6 +736,12 @@ function generateSitemap(wwwDir) {
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.3</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://sync.koalastuff.net/site-access-help.html</loc>
|
||||
<lastmod>${today}</lastmod>
|
||||
<changefreq>weekly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://sync.koalastuff.net/de/impressum</loc>
|
||||
<lastmod>${today}</lastmod>
|
||||
|
||||
+1
-1
@@ -78,7 +78,7 @@ Compatibility depends on each website's player implementation and can change whe
|
||||
|
||||
## Technical information
|
||||
|
||||
- Current website release: 2.6.1
|
||||
- Current website release: 2.6.4
|
||||
- License: MIT
|
||||
- Extension runtime: dependency-free browser extension code
|
||||
- Relay: Node.js with Socket.IO-compatible WebSocket messaging
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Starte eine Watch Party auf Netflix, Emby, Jellyfin, YouTube, Twitch und fast jedem HTML5-Video. Open Source, datenschutzfreundlich und ohne Konto.",
|
||||
"NAV_FEATURES": "Funktionen",
|
||||
"NAV_HOW_IT_WORKS": "So funktioniert's",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync kann nicht auf deine Videoseite zugreifen?",
|
||||
"SUPPORT_BANNER_CTA": "Websitezugriff reparieren",
|
||||
"SUPPORT_BANNER_DISMISS": "Hinweis schließen",
|
||||
"HERO_TITLE": "Mach jedes Video zur <span class='hero-highlight'>Watch Party</span>.",
|
||||
"HERO_SUBTITLE": "Dein Kino-Abend auf Distanz, ohne Lags. Kein Account, kein Tracking, keine Werbung. Einfach Link teilen und gemeinsam Play drücken.",
|
||||
"HERO_MASCOT_ALT": "Ein niedlicher Koala steht da und schaut nach unten auf die Download-Buttons",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Host a watch party on Netflix, Emby, Jellyfin, YouTube, Twitch and almost any HTML5 video. Open source, privacy-first, and account-free.",
|
||||
"NAV_FEATURES": "Features",
|
||||
"NAV_HOW_IT_WORKS": "How it works",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync cannot access your video site?",
|
||||
"SUPPORT_BANNER_CTA": "Fix website access",
|
||||
"SUPPORT_BANNER_DISMISS": "Dismiss notification",
|
||||
"HERO_TITLE": "Turn any video into a <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Your remote movie night without lags. No account, no tracking, no ads. Just share a link and press play together.",
|
||||
"HERO_MASCOT_ALT": "A cute koala standing and looking down at the download buttons",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Organiza una watch party en Netflix, Emby, Jellyfin, YouTube, Twitch y casi cualquier vídeo HTML5. Open source, privada y sin cuenta.",
|
||||
"NAV_FEATURES": "Características",
|
||||
"NAV_HOW_IT_WORKS": "Cómo funciona",
|
||||
"SUPPORT_BANNER_TEXT": "¿KoalaSync no puede acceder al sitio del vídeo?",
|
||||
"SUPPORT_BANNER_CTA": "Reparar acceso al sitio",
|
||||
"SUPPORT_BANNER_DISMISS": "Cerrar aviso",
|
||||
"HERO_TITLE": "Convierte cualquier vídeo en una <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Tu noche de cine a distancia, sin retrasos. Sin cuenta, sin rastreo, sin anuncios. Comparte un enlace y dale al play juntos.",
|
||||
"HERO_MASCOT_ALT": "Un lindo koala de pie mirando hacia abajo a los botones de descarga",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Organisez une watch party sur Netflix, Emby, Jellyfin, YouTube, Twitch et presque toute vidéo HTML5. Open source, privé et sans compte.",
|
||||
"NAV_FEATURES": "Fonctionnalités",
|
||||
"NAV_HOW_IT_WORKS": "Comment ça marche",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync n’accède pas à votre site vidéo ?",
|
||||
"SUPPORT_BANNER_CTA": "Réparer l’accès au site",
|
||||
"SUPPORT_BANNER_DISMISS": "Fermer l’avertissement",
|
||||
"HERO_TITLE": "Transformez n'importe quelle vidéo en <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Votre soirée ciné à distance, sans décalage. Pas de compte, pas de tracking, pas de pub. Partagez un lien et lancez la lecture ensemble.",
|
||||
"HERO_MASCOT_ALT": "Un koala mignon debout et regardant vers le bas les boutons de téléchargement",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Avvia una watch party su Netflix, Emby, Jellyfin, YouTube, Twitch e quasi ogni video HTML5. Open source, privata e senza account.",
|
||||
"NAV_FEATURES": "Funzionalità",
|
||||
"NAV_HOW_IT_WORKS": "Come Funziona",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync non riesce ad accedere al sito video?",
|
||||
"SUPPORT_BANNER_CTA": "Ripristina l’accesso al sito",
|
||||
"SUPPORT_BANNER_DISMISS": "Chiudi avviso",
|
||||
"HERO_TITLE": "Trasforma qualsiasi video in una <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "La tua serata film a distanza, senza lag. Niente account, niente tracciamento, niente pubblicità. Condividi un link e premete play insieme.",
|
||||
"HERO_MASCOT_ALT": "Un simpatico koala che guarda i pulsanti di download",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Netflix、Emby、Jellyfin、YouTube、Twitch、ほぼすべてのHTML5動画でウォッチパーティーを開催。オープンソース、プライバシー重視、アカウント不要。",
|
||||
"NAV_FEATURES": "機能",
|
||||
"NAV_HOW_IT_WORKS": "仕組み",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync が動画サイトにアクセスできませんか？",
|
||||
"SUPPORT_BANNER_CTA": "サイトアクセスを修復",
|
||||
"SUPPORT_BANNER_DISMISS": "通知を閉じる",
|
||||
"HERO_TITLE": "どんな動画も<span class='hero-highlight'>ウォッチパーティー</span>に。",
|
||||
"HERO_SUBTITLE": "離れていても一緒に映画ナイト。アカウント不要、トラッキングなし、広告なし。リンクを共有して、一緒に再生するだけ。",
|
||||
"HERO_MASCOT_ALT": "ダウンロードボタンを見下ろしているかわいいコアラ",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Netflix, Emby, Jellyfin, YouTube, Twitch 및 거의 모든 HTML5 영상에서 워치 파티를 열어보세요. 오픈소스, 개인정보 보호 중심, 계정 불필요.",
|
||||
"NAV_FEATURES": "특징",
|
||||
"NAV_HOW_IT_WORKS": "작동 방식",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync가 동영상 사이트에 액세스할 수 없나요?",
|
||||
"SUPPORT_BANNER_CTA": "사이트 액세스 복구",
|
||||
"SUPPORT_BANNER_DISMISS": "알림 닫기",
|
||||
"HERO_TITLE": "어떤 영상이든 <span class='hero-highlight'>워치 파티</span>로.",
|
||||
"HERO_SUBTITLE": "지연 없는 원격 영화의 밤. 계정 없음, 추적 없음, 광고 없음. 링크만 공유하고 함께 재생하세요.",
|
||||
"HERO_MASCOT_ALT": "다운로드 버튼을 내려다보고 서 있는 귀여운 코알라",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Start een watch party op Netflix, Emby, Jellyfin, YouTube, Twitch en bijna elke HTML5-video. Open source, privacyvriendelijk en zonder account.",
|
||||
"NAV_FEATURES": "Functies",
|
||||
"NAV_HOW_IT_WORKS": "Hoe het werkt",
|
||||
"SUPPORT_BANNER_TEXT": "Heeft KoalaSync geen toegang tot je videosite?",
|
||||
"SUPPORT_BANNER_CTA": "Websitetoegang herstellen",
|
||||
"SUPPORT_BANNER_DISMISS": "Melding sluiten",
|
||||
"HERO_TITLE": "Maak van elke video een <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Jouw filmavond op afstand, zonder vertraging. Geen account, geen tracking, geen advertenties. Deel een link en druk samen op play.",
|
||||
"HERO_MASCOT_ALT": "Een schattige koala die staat en naar beneden kijkt naar de downloadknoppen",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Zorganizuj watch party na Netflix, Emby, Jellyfin, YouTube, Twitch i prawie każdym wideo HTML5. Open source, prywatnie i bez konta.",
|
||||
"NAV_FEATURES": "Funkcje",
|
||||
"NAV_HOW_IT_WORKS": "Jak to działa",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync nie ma dostępu do strony z filmem?",
|
||||
"SUPPORT_BANNER_CTA": "Napraw dostęp do strony",
|
||||
"SUPPORT_BANNER_DISMISS": "Zamknij powiadomienie",
|
||||
"HERO_TITLE": "Zamień dowolne wideo w <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Twój zdalny wieczór filmowy bez opóźnień. Bez konta, bez śledzenia, bez reklam. Udostępnij link i naciśnijcie play razem.",
|
||||
"HERO_MASCOT_ALT": "Uroczy koala stojący i patrzący w dół na przyciski pobierania",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Crie uma watch party na Netflix, Emby, Jellyfin, YouTube, Twitch e quase qualquer vídeo HTML5. Open source, privado e sem conta.",
|
||||
"NAV_FEATURES": "Recursos",
|
||||
"NAV_HOW_IT_WORKS": "Como Funciona",
|
||||
"SUPPORT_BANNER_TEXT": "O KoalaSync não consegue acessar o site do vídeo?",
|
||||
"SUPPORT_BANNER_CTA": "Corrigir acesso ao site",
|
||||
"SUPPORT_BANNER_DISMISS": "Fechar aviso",
|
||||
"HERO_TITLE": "Transforme qualquer vídeo em uma <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Sua sessão de cinema à distância, sem atrasos. Sem conta, sem rastreamento, sem anúncios. Compartilhe um link e deem play juntos.",
|
||||
"HERO_MASCOT_ALT": "Um coala fofo olhando para os botões de download",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Cria uma watch party na Netflix, Emby, Jellyfin, YouTube, Twitch e quase qualquer vídeo HTML5. Open source, privado e sem conta.",
|
||||
"NAV_FEATURES": "Funcionalidades",
|
||||
"NAV_HOW_IT_WORKS": "Como Funciona",
|
||||
"SUPPORT_BANNER_TEXT": "O KoalaSync não consegue aceder ao site do vídeo?",
|
||||
"SUPPORT_BANNER_CTA": "Corrigir acesso ao site",
|
||||
"SUPPORT_BANNER_DISMISS": "Fechar aviso",
|
||||
"HERO_TITLE": "Transforma qualquer vídeo numa <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "A tua noite de cinema à distância, sem atrasos. Sem conta, sem rastreio, sem anúncios. Partilha um link e carreguem no play juntos.",
|
||||
"HERO_MASCOT_ALT": "Um coala fofo a olhar para os botões de download",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Запускайте watch party в Netflix, Emby, Jellyfin, YouTube, Twitch и почти любом HTML5-видео. Open source, приватно и без аккаунта.",
|
||||
"NAV_FEATURES": "Функции",
|
||||
"NAV_HOW_IT_WORKS": "Как это работает",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync не может получить доступ к сайту с видео?",
|
||||
"SUPPORT_BANNER_CTA": "Исправить доступ к сайту",
|
||||
"SUPPORT_BANNER_DISMISS": "Закрыть уведомление",
|
||||
"HERO_TITLE": "Преврати любое видео в <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Ваш киновечер на расстоянии, без задержек. Без аккаунта, без слежки, без рекламы. Просто поделитесь ссылкой и нажмите play вместе.",
|
||||
"HERO_MASCOT_ALT": "Милый коала стоит и смотрит вниз на кнопки загрузки",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Netflix, Emby, Jellyfin, YouTube, Twitch ve neredeyse tüm HTML5 videolarında watch party başlatın. Açık kaynak, gizlilik odaklı ve hesapsız.",
|
||||
"NAV_FEATURES": "Özellikler",
|
||||
"NAV_HOW_IT_WORKS": "Nasıl Çalışır",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync video sitesine erişemiyor mu?",
|
||||
"SUPPORT_BANNER_CTA": "Site erişimini düzelt",
|
||||
"SUPPORT_BANNER_DISMISS": "Bildirimi kapat",
|
||||
"HERO_TITLE": "Herhangi bir videoyu <span class='hero-highlight'>watch party</span>'ye dönüştür.",
|
||||
"HERO_SUBTITLE": "Gecikmesiz uzaktan film gecen. Hesap yok, takip yok, reklam yok. Sadece bir bağlantı paylaş ve birlikte oynatın.",
|
||||
"HERO_MASCOT_ALT": "İndirme düğmelerine bakan sevimli bir koala",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "Запускайте watch party у Netflix, Emby, Jellyfin, YouTube, Twitch і майже будь-якому HTML5-відео. Open source, приватно й без акаунта.",
|
||||
"NAV_FEATURES": "особливості",
|
||||
"NAV_HOW_IT_WORKS": "Як це працює",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync не має доступу до сайту з відео?",
|
||||
"SUPPORT_BANNER_CTA": "Виправити доступ до сайту",
|
||||
"SUPPORT_BANNER_DISMISS": "Закрити сповіщення",
|
||||
"HERO_TITLE": "Перетвори будь-яке відео на <span class='hero-highlight'>watch party</span>.",
|
||||
"HERO_SUBTITLE": "Ваш кіновечір на відстані, без затримок. Без акаунта, без стеження, без реклами. Просто поділіться посиланням і натисніть play разом.",
|
||||
"HERO_MASCOT_ALT": "Мила коала стоїть і дивиться вниз на кнопки завантаження",
|
||||
|
||||
@@ -14,6 +14,9 @@
|
||||
"TWITTER_DESCRIPTION": "在 Netflix、Emby、Jellyfin、YouTube、Twitch 和几乎任意 HTML5 视频上发起一起看派对。开源、重视隐私、无需账号。",
|
||||
"NAV_FEATURES": "特征",
|
||||
"NAV_HOW_IT_WORKS": "它是如何运作的",
|
||||
"SUPPORT_BANNER_TEXT": "KoalaSync 无法访问视频网站？",
|
||||
"SUPPORT_BANNER_CTA": "修复网站访问权限",
|
||||
"SUPPORT_BANNER_DISMISS": "关闭提示",
|
||||
"HERO_TITLE": "把任意视频变成<span class='hero-highlight'>一起看派对</span>。",
|
||||
"HERO_SUBTITLE": "远程电影之夜，毫无延迟。无需账号、无跟踪、无广告。分享链接，一起播放。",
|
||||
"HERO_MASCOT_ALT": "一只可爱的考拉站着，低头看着下载按钮",
|
||||
|
||||
@@ -0,0 +1,146 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="lang-en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>KoalaSync Cannot Access Your Video Site? Fix Website Access</title>
|
||||
<meta name="description" content="Restore KoalaSync website access immediately in Chrome, Edge, Brave, Opera, or Vivaldi when a video tab cannot be linked or controlled.">
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="preload" href="style.min.css" as="style">
|
||||
<link rel="stylesheet" href="style.min.css">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="assets/favicon-32x32.png">
|
||||
<link rel="canonical" href="https://sync.koalastuff.net/site-access-help.html">
|
||||
<link rel="alternate" hreflang="en" href="https://sync.koalastuff.net/site-access-help.html">
|
||||
<link rel="alternate" hreflang="x-default" href="https://sync.koalastuff.net/site-access-help.html">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://sync.koalastuff.net/site-access-help.html">
|
||||
<meta property="og:title" content="Fix KoalaSync website access">
|
||||
<meta property="og:description" content="Quick browser-specific steps for reconnecting KoalaSync to a video tab.">
|
||||
<meta property="og:image" content="https://sync.koalastuff.net/assets/og-image.png">
|
||||
<meta name="theme-color" content="#10190e">
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "TechArticle",
|
||||
"headline": "Fix KoalaSync website access",
|
||||
"description": "Restore KoalaSync access when a browser blocks the extension on a video website.",
|
||||
"inLanguage": "en",
|
||||
"url": "https://sync.koalastuff.net/site-access-help.html",
|
||||
"isPartOf": {
|
||||
"@type": "WebSite",
|
||||
"name": "KoalaSync",
|
||||
"url": "https://sync.koalastuff.net/"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<script src="lang-init.min.js"></script>
|
||||
</head>
|
||||
<body class="support-page">
|
||||
<div class="scroll-progress-bar"></div>
|
||||
<a class="skip-link" href="#main-content">Skip to troubleshooting</a>
|
||||
|
||||
<nav>
|
||||
<div class="container nav-content">
|
||||
<a class="logo-area" href="./" aria-label="KoalaSync home">
|
||||
<img class="nav-logo-img" src="assets/NewLogoIcon_128.webp" srcset="assets/NewLogoIcon_64.webp 64w, assets/NewLogoIcon_128.webp 128w, assets/NewLogoIcon.webp 256w" sizes="64px" alt="KoalaSync logo" width="64" height="64">
|
||||
<span>KoalaSync</span>
|
||||
</a>
|
||||
<div class="nav-links" id="primary-nav" role="navigation" aria-label="Primary">
|
||||
<a href="./">Home</a>
|
||||
<a href="https://github.com/Shik3i/KoalaSync" target="_blank" rel="noopener">GitHub</a>
|
||||
</div>
|
||||
<div class="nav-right">
|
||||
<button class="theme-toggle" id="theme-toggle" type="button" aria-label="Toggle light or dark theme" title="Toggle light or dark theme">
|
||||
<svg class="theme-icon-sun" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18" aria-hidden="true"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41"/></svg>
|
||||
<svg class="theme-icon-moon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18" aria-hidden="true"><path d="M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z"/></svg>
|
||||
</button>
|
||||
<button class="hamburger" aria-label="Toggle navigation menu" aria-expanded="false" aria-controls="primary-nav">
|
||||
<svg viewBox="0 0 24 24" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" aria-hidden="true"><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main id="main-content" class="support-content">
|
||||
<header class="support-hero">
|
||||
<span class="support-status">KoalaSync cannot see your video</span>
|
||||
<h1>KoalaSync opens, but your video does nothing?</h1>
|
||||
<p class="support-lead">Chrome may have switched off KoalaSync for that video website. You can still look connected to a room, but KoalaSync cannot see or control the video until you allow access again.</p>
|
||||
</header>
|
||||
|
||||
<section class="support-card" aria-labelledby="quick-fix-title">
|
||||
<span class="support-eyebrow">Fix it now — no update required</span>
|
||||
<h2 id="quick-fix-title">Turn KoalaSync back on for the video website</h2>
|
||||
<ol class="support-steps">
|
||||
<li>Leave the video website open.</li>
|
||||
<li>Look at the top-right of the browser, next to the long box that shows the website address. Click the <strong>Extensions</strong> button (usually a puzzle-piece icon). If you cannot see it, open the three-dot menu first and choose <strong>Extensions</strong>.</li>
|
||||
<li>Look for <strong>Access requested</strong>. Click <strong>KoalaSync</strong> underneath it to allow access.</li>
|
||||
<li>If you do not see <strong>Access requested</strong>, find KoalaSync in the same menu, open its three-dot menu, choose <strong>This can read and change site data</strong>, then choose <strong>On this site</strong>. You can also choose <strong>On all sites</strong> if you want KoalaSync to work automatically on every supported website.</li>
|
||||
<li>Return to the video and click the browser’s reload button (the circular arrow).</li>
|
||||
<li>Open KoalaSync and select the video tab again.</li>
|
||||
</ol>
|
||||
<p>You do not need to wait for a KoalaSync update. These steps work immediately.</p>
|
||||
<p><a class="support-link" href="https://support.google.com/chrome/answer/2664769?hl=en#:~:text=Let%20extensions%20read%20and%20change%20site%20data" target="_blank" rel="noopener">Open Google’s official step-by-step instructions for changing an extension’s website access</a></p>
|
||||
</section>
|
||||
|
||||
<div class="support-callout" role="note">
|
||||
<span class="support-callout-icon" aria-hidden="true">i</span>
|
||||
<div>
|
||||
<strong>KoalaSync did not add a new kind of permission.</strong>
|
||||
<p>Chrome changed how it handles an extension’s existing access to websites. This change can switch KoalaSync off for a website even though KoalaSync itself was not updated. Allowing KoalaSync on the video website turns it back on.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="support-card" aria-labelledby="chromium-title">
|
||||
<span class="support-eyebrow">Chrome, Edge, Brave, Opera, Vivaldi</span>
|
||||
<h2 id="chromium-title">Where to click</h2>
|
||||
<ol>
|
||||
<li>Keep the video tab open so the browser knows which website you want to allow.</li>
|
||||
<li>Open the <strong>Extensions</strong> menu at the top-right of the browser.</li>
|
||||
<li>Under <strong>Access requested</strong>, click <strong>KoalaSync</strong>.</li>
|
||||
<li>If your browser shows the older menu, open KoalaSync’s three-dot menu and choose <strong>This can read and change site data</strong> → <strong>On this site</strong>.</li>
|
||||
<li>Reload the video page, open KoalaSync, and select that tab again.</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section class="support-card" aria-labelledby="why-title">
|
||||
<span class="support-eyebrow">Why this suddenly happened</span>
|
||||
<h2 id="why-title">Chrome changed this without a KoalaSync update</h2>
|
||||
<p>Chrome is gradually giving people a new extensions menu. It can arrive on one computer today and on another computer later. That is why KoalaSync can suddenly stop working in one browser while it still works in another.</p>
|
||||
<p>Your room can still show as connected because the room connection and access to the video are two separate things. KoalaSync cannot control the video until Chrome allows it on that website again.</p>
|
||||
</section>
|
||||
|
||||
<section class="support-card" aria-labelledby="still-title">
|
||||
<span class="support-eyebrow">Still not working?</span>
|
||||
<h2 id="still-title">Run these checks in order</h2>
|
||||
<ul>
|
||||
<li>Update KoalaSync in both browsers. Friends using different releases should update before testing again.</li>
|
||||
<li>Reload the video page after granting access. An already-open page may still have the old blocked state.</li>
|
||||
<li>Open KoalaSync and reselect the exact tab containing the player.</li>
|
||||
<li>Confirm the debug report says <strong>Video Found</strong>. A page without a standard player may need site-specific support.</li>
|
||||
<li>Temporarily test without another extension that also modifies the player.</li>
|
||||
<li>If it still fails, collect a debug report from each participant before leaving the room.</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<div class="support-actions">
|
||||
<a class="btn btn-primary" href="./">Back to KoalaSync</a>
|
||||
<a class="btn btn-secondary" href="https://github.com/Shik3i/KoalaSync/issues" target="_blank" rel="noopener">Report a reproducible issue</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p class="footer-ram">Rooms are ephemeral and stored in RAM.</p>
|
||||
<p class="footer-copyright">© 2026 KoalaSync. Open source under the MIT License.</p>
|
||||
<div class="footer-links">
|
||||
<a href="imprint.html">Legal notice</a>
|
||||
<a href="privacy.html">Privacy</a>
|
||||
<a href="https://github.com/Shik3i/KoalaSync" target="_blank" rel="noopener">GitHub</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="app.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Vendored
+110
@@ -92,6 +92,116 @@
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.site-access-banner {
|
||||
position: fixed;
|
||||
top: 89px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 900;
|
||||
border-block: 1px solid color-mix(in oklch, var(--accent) 42%, transparent);
|
||||
background: color-mix(in oklch, var(--accent) 16%, var(--bg));
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
|
||||
transition: top 0.3s ease;
|
||||
}
|
||||
|
||||
nav.nav-scrolled + .site-access-banner {
|
||||
top: 59px;
|
||||
}
|
||||
|
||||
.site-access-banner-inner {
|
||||
position: relative;
|
||||
min-height: 50px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.75rem;
|
||||
color: var(--text);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 650;
|
||||
text-align: center;
|
||||
padding-right: 4rem;
|
||||
padding-left: 4rem;
|
||||
}
|
||||
|
||||
.site-access-banner-icon {
|
||||
flex: 0 0 auto;
|
||||
display: inline-grid;
|
||||
place-items: center;
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
color: var(--text-on-green);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.site-access-banner-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35rem;
|
||||
color: var(--accent);
|
||||
font-weight: 800;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.18em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.site-access-banner-link:hover {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.site-access-banner-dismiss {
|
||||
position: absolute;
|
||||
right: 2rem;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
display: inline-grid;
|
||||
place-items: center;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
border-radius: 999px;
|
||||
background: transparent;
|
||||
color: var(--text-muted);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.site-access-banner-dismiss:hover,
|
||||
.site-access-banner-dismiss:focus-visible {
|
||||
background: color-mix(in oklch, var(--accent) 18%, transparent);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.site-access-banner {
|
||||
top: 73px;
|
||||
}
|
||||
|
||||
nav.nav-scrolled + .site-access-banner {
|
||||
top: 59px;
|
||||
}
|
||||
|
||||
.site-access-banner-inner {
|
||||
min-height: 64px;
|
||||
padding: 0.65rem 3rem 0.65rem 1rem;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.site-access-banner-icon {
|
||||
width: 1.3rem;
|
||||
height: 1.3rem;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.site-access-banner-dismiss {
|
||||
right: 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
@@ -0,0 +1,242 @@
|
||||
/* --- Site-access troubleshooting page --- */
|
||||
.support-page {
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.support-page::before {
|
||||
content: '';
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: -1;
|
||||
pointer-events: none;
|
||||
background:
|
||||
radial-gradient(circle at 15% 8%, color-mix(in oklch, var(--accent) 15%, transparent), transparent 32rem),
|
||||
radial-gradient(circle at 85% 30%, color-mix(in oklch, var(--accent-terracotta) 10%, transparent), transparent 30rem);
|
||||
}
|
||||
|
||||
.support-content {
|
||||
width: min(980px, calc(100% - 2rem));
|
||||
margin: 0 auto;
|
||||
padding: 9rem 0 4rem;
|
||||
}
|
||||
|
||||
.support-hero {
|
||||
max-width: 760px;
|
||||
margin: 0 auto 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.support-eyebrow,
|
||||
.support-status {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.45rem;
|
||||
border: 1px solid color-mix(in oklch, var(--accent) 35%, transparent);
|
||||
border-radius: 999px;
|
||||
background: color-mix(in oklch, var(--accent) 12%, var(--card));
|
||||
color: var(--accent);
|
||||
padding: 0.4rem 0.8rem;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.support-status::before {
|
||||
content: '';
|
||||
width: 0.55rem;
|
||||
height: 0.55rem;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
box-shadow: 0 0 0 0.3rem color-mix(in oklch, var(--accent) 16%, transparent);
|
||||
}
|
||||
|
||||
.support-hero h1 {
|
||||
margin: 1rem 0;
|
||||
color: var(--text);
|
||||
font-size: clamp(2.35rem, 6vw, 4.3rem);
|
||||
line-height: 1.05;
|
||||
letter-spacing: -0.045em;
|
||||
}
|
||||
|
||||
.support-lead {
|
||||
color: var(--text-muted);
|
||||
font-size: clamp(1rem, 2vw, 1.18rem);
|
||||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.support-card,
|
||||
.support-callout {
|
||||
border: 1px solid var(--card-border);
|
||||
border-radius: 22px;
|
||||
background: var(--card-surface);
|
||||
box-shadow: 0 18px 55px rgba(0, 0, 0, 0.15);
|
||||
backdrop-filter: blur(14px);
|
||||
}
|
||||
|
||||
.support-card {
|
||||
padding: clamp(1.35rem, 4vw, 2.25rem);
|
||||
}
|
||||
|
||||
.support-content > .support-card + .support-card,
|
||||
.support-grid + .support-card,
|
||||
.support-card + .support-grid,
|
||||
.support-callout + .support-card {
|
||||
margin-top: 1.25rem;
|
||||
}
|
||||
|
||||
.support-card h2,
|
||||
.support-card h3 {
|
||||
color: var(--text);
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.support-card h2 {
|
||||
margin: 0 0 0.8rem;
|
||||
font-size: clamp(1.35rem, 3vw, 1.75rem);
|
||||
}
|
||||
|
||||
.support-card > .support-eyebrow {
|
||||
display: flex;
|
||||
width: fit-content;
|
||||
margin: 0 0 1rem;
|
||||
}
|
||||
|
||||
.support-card h3 {
|
||||
margin-bottom: 0.55rem;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
.support-card p,
|
||||
.support-card li,
|
||||
.support-callout p {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.support-card p + p,
|
||||
.support-card p + ul,
|
||||
.support-card p + ol,
|
||||
.support-card ul + p,
|
||||
.support-card ol + p {
|
||||
margin-top: 0.85rem;
|
||||
}
|
||||
|
||||
.support-card ul,
|
||||
.support-card ol {
|
||||
padding-left: 1.2rem;
|
||||
}
|
||||
|
||||
.support-card li + li {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
|
||||
.support-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
gap: 1.25rem;
|
||||
margin-top: 1.25rem;
|
||||
}
|
||||
|
||||
.support-steps {
|
||||
list-style: none;
|
||||
padding: 0 !important;
|
||||
counter-reset: support-step;
|
||||
}
|
||||
|
||||
.support-steps li {
|
||||
position: relative;
|
||||
min-height: 2.4rem;
|
||||
padding-left: 3.2rem;
|
||||
counter-increment: support-step;
|
||||
}
|
||||
|
||||
.support-steps li::before {
|
||||
content: counter(support-step);
|
||||
position: absolute;
|
||||
top: -0.15rem;
|
||||
left: 0;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
border-radius: 12px;
|
||||
background: var(--accent);
|
||||
color: var(--text-on-green);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.support-callout {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr);
|
||||
gap: 1rem;
|
||||
align-items: start;
|
||||
margin: 1.25rem 0;
|
||||
padding: 1.25rem;
|
||||
border-color: color-mix(in oklch, var(--accent) 40%, transparent);
|
||||
background: color-mix(in oklch, var(--accent) 10%, var(--card-surface));
|
||||
}
|
||||
|
||||
.support-callout-icon {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border-radius: 999px;
|
||||
background: var(--accent);
|
||||
color: var(--text-on-green);
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.support-callout strong {
|
||||
display: block;
|
||||
margin-bottom: 0.3rem;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.support-link {
|
||||
color: var(--accent);
|
||||
font-weight: 700;
|
||||
text-decoration: underline;
|
||||
text-underline-offset: 0.18em;
|
||||
}
|
||||
|
||||
.support-link:hover {
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.support-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 0.8rem;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.support-actions .btn {
|
||||
min-width: 180px;
|
||||
}
|
||||
|
||||
html.theme-light .support-card,
|
||||
html.theme-light .support-callout {
|
||||
background-color: var(--card-surface);
|
||||
box-shadow: 0 18px 45px rgba(44, 62, 37, 0.1);
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.support-content {
|
||||
width: min(100% - 1rem, 980px);
|
||||
padding-top: 7.5rem;
|
||||
}
|
||||
|
||||
.support-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.support-card {
|
||||
border-radius: 18px;
|
||||
}
|
||||
|
||||
.support-callout {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
+17
-1
@@ -116,7 +116,7 @@
|
||||
"priceCurrency": "EUR"
|
||||
},
|
||||
"description": "{{SCHEMA_APP_DESC}}",
|
||||
"softwareVersion": "2.6.1",
|
||||
"softwareVersion": "2.6.4",
|
||||
"license": "https://opensource.org/licenses/MIT",
|
||||
"sameAs": "https://github.com/Shik3i/KoalaSync",
|
||||
"image": "https://sync.koalastuff.net/assets/NewLogoIcon.webp",
|
||||
@@ -360,6 +360,22 @@
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<aside class="site-access-banner" aria-labelledby="site-access-banner-text">
|
||||
<div class="container site-access-banner-inner">
|
||||
<span class="site-access-banner-icon" aria-hidden="true">!</span>
|
||||
<span id="site-access-banner-text">{{SUPPORT_BANNER_TEXT}}</span>
|
||||
<a href="/site-access-help.html" class="site-access-banner-link">
|
||||
<span>{{SUPPORT_BANNER_CTA}}</span>
|
||||
</a>
|
||||
<button class="site-access-banner-dismiss" type="button" aria-label="{{SUPPORT_BANNER_DISMISS}}">
|
||||
<svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" aria-hidden="true">
|
||||
<line x1="6" y1="6" x2="18" y2="18" />
|
||||
<line x1="18" y1="6" x2="6" y2="18" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<main id="main-content">
|
||||
<header class="hero" id="top">
|
||||
<div class="container hero-grid">
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
{
|
||||
"version": "2.6.1",
|
||||
"date": "2026-07-15T03:57:56Z"
|
||||
"version": "2.6.4",
|
||||
"date": "2026-07-16T09:51:25Z"
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user