vrubelroman/send2streamer
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
send2streamer/public/send.html

126 lines
2.9 KiB
HTML
Raw Normal View History

Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
Multi-tenant platform: per-streamer overlay/sender links + CI/CD Streamers log in with Google on a new landing page and get a dashboard with two auto-generated, permanent links: one for their OBS/StreamLabs Browser Source, one to share with viewers. Messages are now scoped to the right streamer via Socket.IO rooms instead of broadcasting globally. Streamer records and tokens are persisted in SQLite (node:sqlite) so links survive restarts/redeploys. Also adds a Forgejo Actions pipeline mirroring t2sTelegramBot's: build, smoke-test, push to the local registry, then deploy to the prod host over SSH. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:53:07 +00:00
<title>Отправить сообщение на стрим</title>
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
<meta name="viewport" content="width=device-width, initial-scale=1" />
Fix TTS overlap deterministically, preserve message order, fix flaky Google login button Overlay display duration is now computed server-side from estimated reading time (text length / speaking rate), not from the audio element's 'ended' event — edge-tts streams MP3 without a duration header, and OBS's embedded browser fires 'ended' unreliably for that, which is why the earlier event-based fix didn't hold up. Per-streamer broadcasts are now serialized through a queue, so a message waiting on an AI reply can no longer be overtaken by a later message from a different viewer that doesn't need one. Also fix the Google Sign-In button intermittently not rendering: the GSI script tag is async/defer, and both index.html and send.html/js called google.accounts.id.initialize() without waiting for it to actually finish loading — a race that failed silently until the script was cached from a previous load.
2026-07-08 18:21:57 +00:00
<script>
window.googleGsiLoaded = new Promise((resolve) => { window.resolveGoogleGsiLoaded = resolve; });
</script>
<script src="https://accounts.google.com/gsi/client" async defer onload="resolveGoogleGsiLoaded()"></script>
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
<style>
body {
font-family: system-ui, sans-serif;
max-width: 480px;
margin: 60px auto;
padding: 0 20px;
}
Multi-tenant platform: per-streamer overlay/sender links + CI/CD Streamers log in with Google on a new landing page and get a dashboard with two auto-generated, permanent links: one for their OBS/StreamLabs Browser Source, one to share with viewers. Messages are now scoped to the right streamer via Socket.IO rooms instead of broadcasting globally. Streamer records and tokens are persisted in SQLite (node:sqlite) so links survive restarts/redeploys. Also adds a Forgejo Actions pipeline mirroring t2sTelegramBot's: build, smoke-test, push to the local registry, then deploy to the prod host over SSH. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:53:07 +00:00
h1 {
font-size: 22px;
margin-bottom: 4px;
}
.subtitle {
color: #666;
font-size: 14px;
margin-bottom: 24px;
}
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
#user-bar {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
}
#user-bar img {
width: 32px;
height: 32px;
border-radius: 50%;
}
#logout {
margin-left: auto;
cursor: pointer;
color: #888;
font-size: 14px;
}
Let viewers set a per-streamer display name Viewers can type a custom name shown to the streamer instead of their Google account name. It's saved per (streamer, viewer) pair in SQLite and pre-filled on future visits to the same send link. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 16:49:51 +00:00
label {
display: block;
font-size: 13px;
color: #666;
margin-bottom: 4px;
}
#display-name {
width: 100%;
font-size: 16px;
padding: 8px 10px;
box-sizing: border-box;
margin-bottom: 16px;
}
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
textarea {
width: 100%;
height: 100px;
font-size: 16px;
padding: 10px;
box-sizing: border-box;
resize: vertical;
}
button {
margin-top: 10px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
#status {
margin-top: 10px;
font-size: 14px;
color: #888;
min-height: 20px;
}
Add optional AI reply via DeepSeek Viewers can check a box on the send page to get a short AI-generated reply to their message, voiced with a distinct TTS voice and queued on the overlay after the original message. The system prompt lives in ai-prompt.txt (editable without touching code) instead of being hardcoded. TTS for both viewer messages and AI replies now announces who it's from ("Сообщение от X." / "Ответ от ИИ.") before the text. No-ops entirely if DEEPSEEK_API_KEY isn't set. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 17:23:41 +00:00
.checkbox-row {
display: flex;
align-items: center;
gap: 6px;
margin-top: 10px;
font-size: 14px;
}
.checkbox-row label {
display: inline;
margin-bottom: 0;
color: inherit;
}
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
#hidden-until-login {
display: none;
}
</style>
</head>
<body>
Multi-tenant platform: per-streamer overlay/sender links + CI/CD Streamers log in with Google on a new landing page and get a dashboard with two auto-generated, permanent links: one for their OBS/StreamLabs Browser Source, one to share with viewers. Messages are now scoped to the right streamer via Socket.IO rooms instead of broadcasting globally. Streamer records and tokens are persisted in SQLite (node:sqlite) so links survive restarts/redeploys. Also adds a Forgejo Actions pipeline mirroring t2sTelegramBot's: build, smoke-test, push to the local registry, then deploy to the prod host over SSH. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:53:07 +00:00
<h1>Сообщение на стрим</h1>
<p class="subtitle">Войдите через Google и напишите сообщение — оно появится на стриме с озвучкой.</p>
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
<div id="login-container"></div>
<div id="hidden-until-login">
<div id="user-bar">
<img id="user-pic" src="" alt="" />
<span id="user-name"></span>
<span id="logout">выйти</span>
</div>
Let viewers set a per-streamer display name Viewers can type a custom name shown to the streamer instead of their Google account name. It's saved per (streamer, viewer) pair in SQLite and pre-filled on future visits to the same send link. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 16:49:51 +00:00
<label for="display-name">Ваше имя (покажется стримеру вместо имени из Google)</label>
<input id="display-name" type="text" maxlength="60" placeholder="Имя..." />
Multi-tenant platform: per-streamer overlay/sender links + CI/CD Streamers log in with Google on a new landing page and get a dashboard with two auto-generated, permanent links: one for their OBS/StreamLabs Browser Source, one to share with viewers. Messages are now scoped to the right streamer via Socket.IO rooms instead of broadcasting globally. Streamer records and tokens are persisted in SQLite (node:sqlite) so links survive restarts/redeploys. Also adds a Forgejo Actions pipeline mirroring t2sTelegramBot's: build, smoke-test, push to the local registry, then deploy to the prod host over SSH. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:53:07 +00:00
<textarea id="message" placeholder="Текст для стрима..." maxlength="500"></textarea>
Add optional AI reply via DeepSeek Viewers can check a box on the send page to get a short AI-generated reply to their message, voiced with a distinct TTS voice and queued on the overlay after the original message. The system prompt lives in ai-prompt.txt (editable without touching code) instead of being hardcoded. TTS for both viewer messages and AI replies now announces who it's from ("Сообщение от X." / "Ответ от ИИ.") before the text. No-ops entirely if DEEPSEEK_API_KEY isn't set. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 17:23:41 +00:00
<div class="checkbox-row">
<input id="ai-reply" type="checkbox" />
Let streamers name their AI assistant; fix overlay TTS audio overlap Streamer dashboard gains an editable AI assistant name (default "Альтушка Ирина"), stored per-streamer and used for the overlay label, TTS intro, and DeepSeek system prompt. Also fixes a bug where a long message's TTS audio could still be playing when the next queued message started its own audio — the overlay queue now waits for the current audio to actually finish (not just the configured display duration) before advancing.
2026-07-08 17:28:36 +00:00
<label for="ai-reply" id="ai-reply-label">Задать вопрос Альтушке Ирине 🤖</label>
Add optional AI reply via DeepSeek Viewers can check a box on the send page to get a short AI-generated reply to their message, voiced with a distinct TTS voice and queued on the overlay after the original message. The system prompt lives in ai-prompt.txt (editable without touching code) instead of being hardcoded. TTS for both viewer messages and AI replies now announces who it's from ("Сообщение от X." / "Ответ от ИИ.") before the text. No-ops entirely if DEEPSEEK_API_KEY isn't set. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 17:23:41 +00:00
</div>
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
<button id="send">Отправить</button>
<div id="status"></div>
</div>
<script src="/socket.io/socket.io.js"></script>
Multi-tenant platform: per-streamer overlay/sender links + CI/CD Streamers log in with Google on a new landing page and get a dashboard with two auto-generated, permanent links: one for their OBS/StreamLabs Browser Source, one to share with viewers. Messages are now scoped to the right streamer via Socket.IO rooms instead of broadcasting globally. Streamer records and tokens are persisted in SQLite (node:sqlite) so links survive restarts/redeploys. Also adds a Forgejo Actions pipeline mirroring t2sTelegramBot's: build, smoke-test, push to the local registry, then deploy to the prod host over SSH. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:53:07 +00:00
<script src="/send.js"></script>
Initial commit: overlay + sender pages for StreamLabs browser source Express + Socket.IO backend with Google login on the sender page, a transparent overlay page for OBS/StreamLabs Browser Source, and TTS voice-over via the edge-tts Python CLI (same engine as t2sTelegramBot). Dockerized for deployment. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-01 15:17:25 +00:00
</body>
</html>
Reference in a new issue Copy permalink