WebRTC Демо

Управляй десктопом со смартфона через WebRTC

Демо #1 🎱 Шарик (акселерометр)

Наклоняй телефон, чтобы катить 3D-шарик по экрану с помощью акселерометра.

DeviceMotion → DataChannel → Three.js
Демо #2 🔴 Лазерная указка

Используй телефон как лазерную указку — наклоняй, чтобы двигать красную точку по экрану.

DeviceOrientation → DataChannel
Демо #3 🖱️ Тачпад

Используй экран телефона как беспроводную мышь для десктопа.

Touch → DataChannel
Демо #4 🎮 Геймпад

Используй телефон как геймпад — крестовина и кнопки управляют кораблём в реальном времени.

Touch → DataChannel → Canvas game
Демо #5 🎨 Рисование

Рисуй на телефоне и наблюдай мазки на десктопе в реальном времени. Несколько телефонов могут рисовать одновременно.

Touch → DataChannel → Canvas
Демо #6 🎙️ Микрофон

Говори в телефон — аудиовизуализация в реальном времени на десктопе через WebRTC MediaStream.

getUserMedia → MediaStream → Web Audio API
Демо #7 📷 QR-сканер

Наведи телефон на QR-код — результат мгновенно появляется на десктопе через WebRTC DataChannel.

Camera + jsQR → DataChannel
Демо #8 🔭 Гироскоп → 3D-камера

Крути телефон — камера вращается внутри 3D-космоса. Телефон работает как VR-контроллер.

DeviceOrientation → DataChannel → Three.js
Демо #9 🎤 Пульт презентации

Листай слайды с телефона. Тач-зона — лазерная указка. Счётчик слайдов синхронизируется обратно на телефон.

DataChannel ↔ bidirectional · лазер-указка
Демо #10 🎨 Камера → Фильтры

Стрим с камеры телефона на десктоп через WebRTC MediaStream. Выбирай фильтры с телефона — эффект в реальном времени.

getUserMedia → MediaStream + DataChannel → Canvas