Browse Source

More granular media stream creation

master
Roderic Day 5 years ago
parent
commit
524d9d98f2
1 changed files with 24 additions and 13 deletions
  1. +24
    -13
      pico.js

+ 24
- 13
pico.js View File

noiseSuppresion: true, noiseSuppresion: true,
echoCancellation: true, echoCancellation: true,
}, },
videoOptions: {
camera: {width: {ideal: 320}, facingMode: 'user', frameRate: 26},
screen: {mediaSource: 'screen', frameRate: 26},
none: false,
},
getSelectedConstraints: () => {
const videoChoice = document.querySelector('#media-source').value
getSelectedMedia: async () => {
const stream = new MediaStream()

const muted = document.querySelector('#mute-check').checked const muted = document.querySelector('#mute-check').checked
return {
video: Media.videoOptions[videoChoice],
audio: muted ? false : Media.audioDefaults,
if(!muted) {
const audio = Media.audioDefaults
const audioStream = await navigator.mediaDevices.getUserMedia({audio})
audioStream.getAudioTracks().forEach(track => stream.addTrack(track))
}

const source = document.querySelector('#media-source').value
if(source === 'camera') {
const video = {width: {ideal: 320}, facingMode: 'user', frameRate: 26}
const videoStream = await navigator.mediaDevices.getUserMedia({video})
videoStream.getVideoTracks().forEach(track => stream.addTrack(track))
}
if(source === 'screen' && navigator.mediaDevices.getDisplayMedia) {
const videoStream = await navigator.mediaDevices.getDisplayMedia()
videoStream.getVideoTracks().forEach(track => stream.addTrack(track))
} }

return stream
}, },
turnOn: async () => { turnOn: async () => {
const constraints = Media.getSelectedConstraints()
const media = await navigator.mediaDevices.getUserMedia(constraints)
const media = await Media.getSelectedMedia()
State.media[State.username] = media State.media[State.username] = media
wire({kind: 'peerInfo', value: {type: 'request'}}) wire({kind: 'peerInfo', value: {type: 'request'}})
m.redraw() m.redraw()
return m('.media', return m('.media',
m('button', {onclick: Media.turnOn}, 'turn on'), m('button', {onclick: Media.turnOn}, 'turn on'),
m('select#media-source', m('select#media-source',
Object.keys(Media.videoOptions).map(description => m('option', description)),
m('option', 'camera'),
m('option', 'screen'),
m('option', 'none'),
), ),
m('label', m('input#mute-check', {type: 'checkbox'}), 'mute'), m('label', m('input#mute-check', {type: 'checkbox'}), 'mute'),
) )

Loading…
Cancel
Save