You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

screen.js 2.3KB

4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
5 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
5 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
5 vuotta sitten
4 vuotta sitten
4 vuotta sitten
5 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
4 vuotta sitten
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. addEventListener('rpc-new', ({detail}) => {
  2. const {uid, kind} = detail.value
  3. if(kind === 'screen') {
  4. const sender = ScreenShare.isSource && ScreenShare.stream
  5. const receiver = !ScreenShare.isSource && ScreenShare.stream
  6. signal({kind: 'rpc-setup', value: {uid, sender, receiver}})
  7. }
  8. })
  9. const ScreenShareConfig = {
  10. view() {
  11. if (ScreenShare.isOff) {
  12. const onclick = ScreenShare.getStream
  13. return m('button', {onclick}, 'share screen')
  14. }
  15. else {
  16. const onclick = () => wire({kind: 'screen-stop'})
  17. return m('button', {onclick}, 'stop screen')
  18. }
  19. }
  20. }
  21. const ScreenShare = {
  22. isSource: false,
  23. stream: new MediaStream(),
  24. get isOff() {
  25. return ScreenShare.stream.getTracks().length === 0
  26. },
  27. async getStream() {
  28. await navigator.mediaDevices
  29. .getDisplayMedia({})
  30. .then(stream => stream
  31. .getTracks()
  32. .forEach(tr => ScreenShare.stream.addTrack(tr, stream))
  33. )
  34. ScreenShare.isSource = true
  35. State.others.forEach(target => {
  36. signal({kind: 'rpc-needed', value: {kind: 'screen', target}})
  37. })
  38. m.redraw()
  39. },
  40. async stopStream() {
  41. ScreenShare.stream.getTracks().forEach(tr => tr.stop())
  42. ScreenShare.stream = new MediaStream()
  43. ScreenShare.isSource = false
  44. m.redraw()
  45. },
  46. view() {
  47. return ScreenShare.isOff ? [] : m('.screen',
  48. ScreenShare.isSource
  49. ? m('.video-info', 'Screen sharing')
  50. : m('video[playsinline][autoplay]', {
  51. oncreate: ({dom}) => {
  52. dom.srcObject = ScreenShare.stream
  53. },
  54. onupdate: ({dom}) => {
  55. if(dom.srcObject !== ScreenShare.stream) {
  56. dom.srcObject = ScreenShare.stream
  57. }
  58. },
  59. }))
  60. },
  61. }
  62. addEventListener('screen-stop', () => {
  63. ScreenShare.stopStream()
  64. })
  65. addEventListener('join', ({detail: {value: user}}) => {
  66. if(ScreenShare.isSource) {
  67. signal({kind: 'rpc-needed', value: {kind: 'screen', target: user}})
  68. }
  69. })
  70. addEventListener('load', () => {
  71. doNotLog.add('screen-stop')
  72. Headers.push([ScreenShareConfig])
  73. Apps.push([ScreenShare, {key: 'screen-share-container'}])
  74. })