const ScreenShare = { | |||||
isOn: false, | |||||
start() { | |||||
const screen = document.querySelector('video.screen') | |||||
navigator.mediaDevices.getDisplayMedia() | |||||
.then(s => {screen.srcObject = s}) | |||||
.catch(e => console.error(e)) | |||||
}, | |||||
toggle() { | |||||
ScreenShare.isOn = !ScreenShare.isOn | |||||
ScreenShare.start() | |||||
}, | |||||
view() { | |||||
const style = { | |||||
width: '80%', | |||||
height: '80%', | |||||
} | |||||
return m('video.screen[playsinline][autoplay]', {style}) | |||||
}, | |||||
} |
<script src="/apps/streams.js"></script> | <script src="/apps/streams.js"></script> | ||||
<script src="/apps/chat.js"></script> | <script src="/apps/chat.js"></script> | ||||
<script src="/apps/volume.js"></script> | <script src="/apps/volume.js"></script> | ||||
<!-- <script src="/apps/screen.js"></script> --> | |||||
<script src="/pico.js" defer></script> | <script src="/pico.js" defer></script> | ||||
</head> | </head> | ||||
<body style="margin: 0; padding: 0;"> | <body style="margin: 0; padding: 0;"> |
m(VideoConfig), | m(VideoConfig), | ||||
m(ChatConfig), | m(ChatConfig), | ||||
m('button', {onclick: VolumeMap.toggle}, 'volume'), | m('button', {onclick: VolumeMap.toggle}, 'volume'), | ||||
// m('button', {onclick: ScreenShare.toggle}, 'screen'), | |||||
] : [ | ] : [ | ||||
m('form.login', | m('form.login', | ||||
{onsubmit: Base.sendLogin}, | {onsubmit: Base.sendLogin}, | ||||
m(StreamContainer, {key: 'lolo'}), | m(StreamContainer, {key: 'lolo'}), | ||||
m(Shadow, {key: 'chat-shadow', app: Chat}), | m(Shadow, {key: 'chat-shadow', app: Chat}), | ||||
m(Shadow, {key: 'map-shadow', app: VolumeMap}), | m(Shadow, {key: 'map-shadow', app: VolumeMap}), | ||||
// m(Shadow, {key: 'screen-shadow', app: ScreenShare}), | |||||
] : m(Settings), | ] : m(Settings), | ||||
) | ) | ||||
}, | }, |