diff options
author | Daniel Calviño Sánchez <danxuliu@gmail.com> | 2021-10-20 15:33:24 +0300 |
---|---|---|
committer | Joas Schilling <coding@schilljs.com> | 2021-10-20 16:57:36 +0300 |
commit | d9f022119cb1f214791650631ac1df5ff4f83e05 (patch) | |
tree | 6712a4ee1efcd92ac47ffde7ec605de3cebc6596 /src/mixins | |
parent | e8b4bd5f0990109a544dca77514fc2499d93d58a (diff) |
Show background blur in the device checker
The video stream got from MediaDevicesManager is now passed to a
VirtualBackground node, and its output is converted again to a stream
like the one used before with a TrackToStream node. In the future it
might be better to use a full media pipeline, but for now this is good
enough.
Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
Diffstat (limited to 'src/mixins')
-rw-r--r-- | src/mixins/devices.js | 22 |
1 files changed, 21 insertions, 1 deletions
diff --git a/src/mixins/devices.js b/src/mixins/devices.js index 6020f35d2..e519ec360 100644 --- a/src/mixins/devices.js +++ b/src/mixins/devices.js @@ -20,6 +20,8 @@ * */ +import TrackToStream from '../utils/media/pipeline/TrackToStream' +import VirtualBackground from '../utils/media/pipeline/VirtualBackground' import { mediaDevicesManager } from '../utils/webrtc/index' import attachMediaStream from 'attachmediastream' import hark from 'hark' @@ -39,6 +41,8 @@ export const devices = { initialized: false, currentVolume: -100, volumeThreshold: -100, + virtualBackground: null, + videoTrackToStream: null, } }, @@ -209,15 +213,19 @@ export const devices = { } if (!videoStream) { + this.virtualBackground._setInputTrack('default', null) + return } + this.virtualBackground._setInputTrack('default', this.videoStream.getVideoTracks()[0]) + const options = { autoplay: true, mirror: true, muted: true, } - attachMediaStream(videoStream, this.$refs.video, options) + attachMediaStream(this.videoTrackToStream.getStream(), this.$refs.video, options) }, stopAudioStream() { @@ -239,6 +247,8 @@ export const devices = { }, stopVideoStream() { + this.virtualBackground._setInputTrack('default', null) + if (!this.videoStream) { return } @@ -256,6 +266,16 @@ export const devices = { }, mounted() { + this.virtualBackground = new VirtualBackground() + // The virtual background should be enabled and disabled as needed by + // the inheriters of the mixin. + this.virtualBackground.setEnabled(false) + + this.videoTrackToStream = new TrackToStream() + this.videoTrackToStream.addInputTrackSlot('video') + + this.virtualBackground.connectTrackSink('default', this.videoTrackToStream, 'video') + if (this.initializeOnMounted) { this.initializeDevicesMixin() } |