Кнопка «Фон» в тулбаре комнаты и выбор фона в превью на входе: три готовые
сцены и свои картинки из профиля. Фон применяется процессором к самому
публикуемому треку (`LocalVideoTrack.setProcessor`), а НЕ пересозданием
`RoomOptions` — ссылка на них обязана оставаться стабильной, иначе
`LiveKitRoom` переподключается к комнате.
Фича только для ДЕСКТОПА, и «десктоп» определяется по возможностям устройства
(`pointer: fine` + `hover: hover` + `maxTouchPoints`), а НЕ по ширине окна:
узкое окно на десктопе — всё ещё десктоп, а широкий планшет — всё ещё планшет,
который сегментация греет. На мобильном кнопки нет вовсе, а не задизейбленной.
Ассеты сегментации отдаются СО СВОЕГО домена: библиотека по умолчанию тянет
wasm с jsdelivr, а модель с storage.googleapis.com, и в закрытом контуре фича
молча не работала бы. Модель (Apache 2.0, см. NOTICE.txt) лежит в репозитории,
wasm-рантайм (~19 МБ) копируется из node_modules плагином сборки. Сама
библиотека и модель грузятся ЛЕНИВО — только когда фон реально включают, вход
в конференцию не стал медленнее.
Три дефолтные сцены — собственные векторные рисунки (`design/backgrounds/`),
а не фотографии из интернета: у нарисованной сцены нет чужой лицензии, а
продукт расходится по инсталляциям, и проверять права на каждую копию некому.
Свои картинки — в профиле, до 10 штук, с уменьшением до 1280px и переводом в
WebP прямо в браузере перед отправкой. Удаление применённого сейчас фона
сбрасывает выбор на «без фона»: хранится ключ записи, а не URL картинки.
Смена камеры фон не теряет (`restartTrack` перезапускает процессор сам),
выключение и включение камеры — навешивает его на новый трек заново.
⚠️ Прокси dev-сервера для `/media/` — обязательно со слэшем: ключ `/media`
Vite матчит префиксом и перехватывает заодно `/mediapipe/...`, из-за чего
модель получала 404 и фон молча не включался.
34 lines
2.1 KiB
Markdown
34 lines
2.1 KiB
Markdown
# Дефолтные фоны замены фона видео
|
||
|
||
Три сцены, которые предлагаются участнику «из коробки» при включённом модуле
|
||
«Замена фона» (`instance_settings.virtual_background`):
|
||
|
||
| файл | сцена |
|
||
|---|---|
|
||
| `office.svg` | офис: окно с городом, картина, лампа, стеллаж, растение |
|
||
| `beach.svg` | пляж: море, песок, пальмы по краям кадра |
|
||
| `space-station.svg` | космическая станция: панели, иллюминатор с Землёй |
|
||
|
||
## Откуда взялись картинки
|
||
|
||
**Это собственные векторные рисунки VidConf, а не фотографии из интернета.**
|
||
Так решено сознательно (решение оператора от 09.08.2026): чужая фотография
|
||
тянет за собой чужую лицензию, а продукт самоуправляемый и расходится по
|
||
инсталляциям — проверять права на каждую копию некому. У нарисованной сцены
|
||
правовых вопросов нет вовсе.
|
||
|
||
Сцены намеренно расфокусированы (`feGaussianBlur`) и оставляют спокойным центр
|
||
кадра: там находится человек, а резкая графика за спиной сильнее всего выдаёт
|
||
подмену фона.
|
||
|
||
## Как пересобрать
|
||
|
||
```bash
|
||
python3 design/backgrounds/render.py
|
||
```
|
||
|
||
Скрипт растеризует каждый `*.svg` в 1280×720 через headless Chrome и кладёт
|
||
результат в `frontend/public/backgrounds/*.webp` (именно эти файлы и
|
||
раздаются фронтендом). Нужны установленный Google Chrome и Pillow.
|
||
Правьте SVG — WebP пересобирается из них, вручную растровые файлы не трогаем.
|