pico.chat/apps/screen.js

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)