aboutsummaryrefslogtreecommitdiffstats
path: root/src/webview/screenshare.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/webview/screenshare.js')
-rw-r--r--src/webview/screenshare.js39
1 files changed, 23 insertions, 16 deletions
diff --git a/src/webview/screenshare.js b/src/webview/screenshare.js
index 2715f2e3e..84d2e1e95 100644
--- a/src/webview/screenshare.js
+++ b/src/webview/screenshare.js
@@ -73,25 +73,29 @@ export const screenShareCss = `
73`; 73`;
74 74
75// Patch getDisplayMedia for screen sharing 75// Patch getDisplayMedia for screen sharing
76window.navigator.mediaDevices.getDisplayMedia = () => new Promise(async (resolve, reject) => { 76window.navigator.mediaDevices.getDisplayMedia = () => async (resolve, reject) => {
77 try { 77 try {
78 const sources = await desktopCapturer.getSources({ types: ['screen', 'window'] }); 78 const sources = await desktopCapturer.getSources({
79 types: ['screen', 'window'],
80 });
79 81
80 const selectionElem = document.createElement('div'); 82 const selectionElem = document.createElement('div');
81 selectionElem.classList = 'desktop-capturer-selection'; 83 selectionElem.classList = 'desktop-capturer-selection';
82 selectionElem.innerHTML = ` 84 selectionElem.innerHTML = `
83 <div class="desktop-capturer-selection__scroller"> 85 <div class="desktop-capturer-selection__scroller">
84 <ul class="desktop-capturer-selection__list"> 86 <ul class="desktop-capturer-selection__list">
85 ${sources.map(({ 87 ${sources
86 id, name, thumbnail, 88 .map(
87 }) => ` 89 ({ id, name, thumbnail }) => `
88 <li class="desktop-capturer-selection__item"> 90 <li class="desktop-capturer-selection__item">
89 <button class="desktop-capturer-selection__btn" data-id="${id}" title="${name}"> 91 <button class="desktop-capturer-selection__btn" data-id="${id}" title="${name}">
90 <img class="desktop-capturer-selection__thumbnail" src="${thumbnail.toDataURL()}" /> 92 <img class="desktop-capturer-selection__thumbnail" src="${thumbnail.toDataURL()}" />
91 <span class="desktop-capturer-selection__name">${name}</span> 93 <span class="desktop-capturer-selection__name">${name}</span>
92 </button> 94 </button>
93 </li> 95 </li>
94 `).join('')} 96 `,
97 )
98 .join('')}
95 <li class="desktop-capturer-selection__item"> 99 <li class="desktop-capturer-selection__item">
96 <button class="desktop-capturer-selection__btn" data-id="${CANCEL_ID}" title="Cancel"> 100 <button class="desktop-capturer-selection__btn" data-id="${CANCEL_ID}" title="Cancel">
97 <span class="desktop-capturer-selection__name desktop-capturer-selection__name--cancel">Cancel</span> 101 <span class="desktop-capturer-selection__name desktop-capturer-selection__name--cancel">Cancel</span>
@@ -102,7 +106,8 @@ window.navigator.mediaDevices.getDisplayMedia = () => new Promise(async (resolve
102 `; 106 `;
103 document.body.appendChild(selectionElem); 107 document.body.appendChild(selectionElem);
104 108
105 document.querySelectorAll('.desktop-capturer-selection__btn') 109 document
110 .querySelectorAll('.desktop-capturer-selection__btn')
106 .forEach((button) => { 111 .forEach((button) => {
107 button.addEventListener('click', async () => { 112 button.addEventListener('click', async () => {
108 try { 113 try {
@@ -110,20 +115,22 @@ window.navigator.mediaDevices.getDisplayMedia = () => new Promise(async (resolve
110 if (id === CANCEL_ID) { 115 if (id === CANCEL_ID) {
111 reject(new Error('Cancelled by user')); 116 reject(new Error('Cancelled by user'));
112 } else { 117 } else {
113 const mediaSource = sources.find(source => source.id === id); 118 const mediaSource = sources.find((source) => source.id === id);
114 if (!mediaSource) { 119 if (!mediaSource) {
115 throw new Error(`Source with id ${id} does not exist`); 120 throw new Error(`Source with id ${id} does not exist`);
116 } 121 }
117 122
118 const stream = await window.navigator.mediaDevices.getUserMedia({ 123 const stream = await window.navigator.mediaDevices.getUserMedia(
119 audio: false, 124 {
120 video: { 125 audio: false,
121 mandatory: { 126 video: {
122 chromeMediaSource: 'desktop', 127 mandatory: {
123 chromeMediaSourceId: mediaSource.id, 128 chromeMediaSource: 'desktop',
129 chromeMediaSourceId: mediaSource.id,
130 },
124 }, 131 },
125 }, 132 },
126 }); 133 );
127 resolve(stream); 134 resolve(stream);
128 } 135 }
129 } catch (err) { 136 } catch (err) {
@@ -136,4 +143,4 @@ window.navigator.mediaDevices.getDisplayMedia = () => new Promise(async (resolve
136 } catch (err) { 143 } catch (err) {
137 reject(err); 144 reject(err);
138 } 145 }
139}); 146};