8
8
'use strict' ;
9
9
10
10
const preferredDisplaySurface = document . getElementById ( 'displaySurface' ) ;
11
- const startButton = document . getElementById ( 'startButton' ) ;
11
+ const startStopButton = document . getElementById ( 'startButton' ) ;
12
+ const videoElement = document . querySelector ( 'video' ) ;
12
13
13
14
if ( adapter . browserDetails . browser === 'chrome' &&
14
15
adapter . browserDetails . version >= 107 ) {
@@ -21,16 +22,15 @@ if (adapter.browserDetails.browser === 'chrome' &&
21
22
}
22
23
23
24
function handleSuccess ( stream ) {
24
- startButton . disabled = true ;
25
+ startStopButton . textContent = 'Stop' ;
25
26
preferredDisplaySurface . disabled = true ;
26
- const video = document . querySelector ( 'video' ) ;
27
- video . srcObject = stream ;
27
+ videoElement . srcObject = stream ;
28
28
29
29
// demonstrates how to detect that the user has stopped
30
30
// sharing the screen via the browser UI.
31
31
stream . getVideoTracks ( ) [ 0 ] . addEventListener ( 'ended' , ( ) => {
32
32
errorMsg ( 'The user has ended sharing the screen' ) ;
33
- startButton . disabled = false ;
33
+ startStopButton . textContent = 'Start' ;
34
34
preferredDisplaySurface . disabled = false ;
35
35
} ) ;
36
36
}
@@ -48,18 +48,27 @@ function errorMsg(msg, error) {
48
48
}
49
49
50
50
51
- startButton . addEventListener ( 'click' , ( ) => {
52
- const options = { audio : true , video : true } ;
53
- const displaySurface = preferredDisplaySurface . options [ preferredDisplaySurface . selectedIndex ] . value ;
54
- if ( displaySurface !== 'default' ) {
55
- options . video = { displaySurface} ;
51
+ startStopButton . addEventListener ( 'click' , ( ) => {
52
+ if ( startStopButton . textContent === 'Start' ) {
53
+ const options = { audio : true , video : true } ;
54
+ const displaySurface = preferredDisplaySurface . options [ preferredDisplaySurface . selectedIndex ] . value ;
55
+ if ( displaySurface !== 'default' ) {
56
+ options . video = { displaySurface} ;
57
+ }
58
+ navigator . mediaDevices . getDisplayMedia ( options )
59
+ . then ( handleSuccess , handleError ) ;
60
+ }
61
+ else {
62
+ // demonstrates how to stop the stream from JavaScript
63
+ errorMsg ( 'JavaScript has ended sharing the screen' ) ;
64
+ videoElement . srcObject . getTracks ( ) . forEach ( track => track . stop ( ) ) ;
65
+ videoElement . srcObject = null ;
66
+ startStopButton . textContent = 'Start' ;
56
67
}
57
- navigator . mediaDevices . getDisplayMedia ( options )
58
- . then ( handleSuccess , handleError ) ;
59
68
} ) ;
60
69
61
70
if ( ( navigator . mediaDevices && 'getDisplayMedia' in navigator . mediaDevices ) ) {
62
- startButton . disabled = false ;
71
+ startStopButton . disabled = false ;
63
72
} else {
64
73
errorMsg ( 'getDisplayMedia is not supported' ) ;
65
74
}
0 commit comments