const ScreenShareConfig = { toggle() { if(ScreenShare.isOn && ScreenShare.isStreaming) { wire({kind: 'screen-sharing-stop'}) } else { ScreenShare.requestScreen() } }, view() { const checked = ScreenShare.isOn const onclick = ScreenShareConfig.toggle return m('label.styled', m('input[type=checkbox]', {checked, onclick}), 'screen-share', ) } } const ScreenShare = { streamer: null, stream: null, get isStreaming() { return ScreenShare.streamer === State.username }, get isOn() { return !! ScreenShare.streamer }, async requestScreen() { // ScreenShare.stream = await navigator.mediaDevices.getDisplayMedia() // ScreenShare.streamer = State.username // wire({kind: 'screen-sharing-start'}) }, view() { const style = { overflow: 'scroll', backgroundColor: 'black', color: 'white', fontFamily: 'monospace', } return ScreenShare.isOn && m('.screen-share', {style}, m('.streamer', `${ScreenShare.streamer}'s stream`), m('video.screen[playsinline][autoplay]', {srcObject: ScreenShare.stream}), ) }, } addEventListener('screen-sharing-start', ({detail}) => { ScreenShare.streamer = detail.source }) addEventListener('screen-sharing-stop', ({detail}) => { if(ScreenShare.stream) { ScreenShare.stream.getTracks().forEach(track => track.stop()) ScreenShare.stream = null } ScreenShare.streamer = null }) addEventListener('load', () => { doNotLog.add('screen-share-start') doNotLog.add('screen-share-stop') Headers.push([ScreenShareConfig]) Apps.push([ScreenShare, {key: 'screen-share-container'}]) }) setTimeout(ScreenShare.requestScreen, 200)