Web components are powerful. WebRTC is amazing. What do you get when you mix the two? I present my project, RTC Bricks, for unleashing WebRTC creativity using web components in vanilla JavaScript in four video demonstrations as follows: (1) a generic web component for publish-subscribe of WebRTC media stream, (2) native application adapter for APIs beyond what a web browser can offer, (3) awesome audio and visual effects for real-time media, (4) collaboration tools for video conferencing and telephony. You can also try these demonstrations using the live hands-on tutorial.
A generic web component for publish-subscribe of WebRTC media stream (32min)
What is <video-io>? How to show live camera view? How to change the component's appearance? How to report and place a video message? How to do delayed playback? How to connect a publisher and a subscriber? What is the named stream abstraction? How to connect video-io with external media servers or video conferencing services? How to use the video-io API? How to use the video-io installed app? How to select devices?
Native application adapter for APIs beyond what a web browser can offer (11min)
What is native-electron? How to use raw TCP or UDP socket from a web app? How to create transparent or frameless window? How does its access control work?
Awesome audio and visual effects for real-time media (16min)
What is video-mix? How to do end-to-end encryption of media path? How to do image processing on video? How to merge multiple webcam videos? How to change video speed for slow motion or fast forward? How to convert live video to sketch art? How to apply 3D perspective projection? How to add graphics effects? How to do pixel match for security camera? How to do 3D layout in video conference? How to apply spatial audio in 2D or 3D? How to convert speech to text? How to do speech recognition? How to do automatic caption in live call?
Collaboration tools for video conferencing and telephony (34min)
What is flex-box? What is media-chat? What is shared-storage? How to use external real-time database for storage? What is call signaling? How to do join-leave vs. invite-answer call flow? How to customize text chat interface? How to add whiteboard, notepad or shared editor in a video call? How to share games in a video conference? How to share any web app in a conference? What is click-to-call?
No comments:
Post a Comment