@flashphoner/sfusdk-examples 2.0.244 → 2.0.248
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -2
- package/src/client/chat.js +15 -1
- package/src/client/config.json +2 -2
- package/src/client/controls.js +4 -2
- package/src/client/main.html +3 -2
- package/src/client/main.js +49 -47
- package/src/commons/js/display.js +1481 -635
- package/src/commons/js/util.js +4 -0
- package/src/player/player.js +3 -7
- package/src/track-test/track-test.css +26 -0
- package/src/track-test/track-test.html +89 -0
- package/src/track-test/track-test.js +646 -0
- package/src/two-way-streaming/config.json +3 -3
- package/src/two-way-streaming/two-way-streaming.js +86 -89
- package/src/webrtc-abr-player/player.js +16 -23
- package/src/client/display.js +0 -502
- package/src/client/util.js +0 -67
package/src/commons/js/util.js
CHANGED
package/src/player/player.js
CHANGED
|
@@ -109,7 +109,7 @@ const init = function() {
|
|
|
109
109
|
*/
|
|
110
110
|
const connect = async function(state) {
|
|
111
111
|
//create peer connection
|
|
112
|
-
pc = new RTCPeerConnection();
|
|
112
|
+
const pc = new RTCPeerConnection();
|
|
113
113
|
//get config object for room creation
|
|
114
114
|
const roomConfig = getRoomConfig(mainConfig);
|
|
115
115
|
roomConfig.url = $("#url").val();
|
|
@@ -220,13 +220,9 @@ const onOperationFailed = function(state, event) {
|
|
|
220
220
|
const playStreams = async function(state) {
|
|
221
221
|
//create remote display item to show remote streams
|
|
222
222
|
try {
|
|
223
|
-
remoteDisplay =
|
|
224
|
-
div: document.getElementById("remoteVideo"),
|
|
225
|
-
room: state.room,
|
|
226
|
-
peerConnection: state.pc
|
|
227
|
-
});
|
|
223
|
+
remoteDisplay = initDefaultRemoteDisplay(state.room, document.getElementById("remoteVideo"), {quality: true});
|
|
228
224
|
// Start WebRTC negotiation
|
|
229
|
-
await state.room.join(state.pc);
|
|
225
|
+
await state.room.join(state.pc, null, null, 1);
|
|
230
226
|
} catch(e) {
|
|
231
227
|
if (e.type === constants.SFU_ROOM_EVENT.OPERATION_FAILED) {
|
|
232
228
|
onOperationFailed(state, e);
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
video, object {
|
|
2
|
+
width: 100%;
|
|
3
|
+
height: 100%;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.local-video-display {
|
|
7
|
+
border: 1px solid rgba(0, 0, 0, 0.8);
|
|
8
|
+
text-align: center;
|
|
9
|
+
width: 200px;
|
|
10
|
+
height: auto;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.display {
|
|
14
|
+
width: 100%;
|
|
15
|
+
height: 100%;
|
|
16
|
+
display: inline-block;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.display > video, object {
|
|
20
|
+
width: 100%;
|
|
21
|
+
height: 100%;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
video:-webkit-full-screen {
|
|
25
|
+
border-radius: 1px;
|
|
26
|
+
}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
6
|
+
<title>SFU tracks switching test</title>
|
|
7
|
+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet"
|
|
8
|
+
integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
|
|
9
|
+
<!-- JavaScript Bundle with Popper -->
|
|
10
|
+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js"
|
|
11
|
+
integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
|
|
12
|
+
crossorigin="anonymous"></script>
|
|
13
|
+
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
|
|
14
|
+
<link rel="stylesheet" href="track-test.css">
|
|
15
|
+
<script type="text/javascript" src="../sfu.js"></script>
|
|
16
|
+
<script type="text/javascript" src="../commons/js/util.js"></script>
|
|
17
|
+
<script type="text/javascript" src="../commons/js/config.js"></script>
|
|
18
|
+
<script type="text/javascript" src="../commons/js/display.js"></script>
|
|
19
|
+
<script type="text/javascript" src="track-test.js"></script>
|
|
20
|
+
</head>
|
|
21
|
+
<body onload="init()">
|
|
22
|
+
<div class="container" id="main">
|
|
23
|
+
<div class="col-sm-12">
|
|
24
|
+
<h2 class="text-center">SFU tracks switching test</h2>
|
|
25
|
+
|
|
26
|
+
<div class="row col-sm-12 justify-content-center">
|
|
27
|
+
<div id="connectionForm" class="col-sm-6 text-center">
|
|
28
|
+
<label for="url" class="control-label">Server url</label>
|
|
29
|
+
<input class="form-control" id="url" type="text">
|
|
30
|
+
<label for="roomName" class="control-label">Room name</label>
|
|
31
|
+
<input class="form-control" id="roomName" type="text">
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
<div class="row col-sm-12 justify-content-center" style="margin-top: 10px;">
|
|
35
|
+
<div class="col-sm-6 text-center">
|
|
36
|
+
<div class="text-center text-muted">Publisher</div>
|
|
37
|
+
<div id="publishForm" class="input-group col-sm-5" style="margin-top: 10px;">
|
|
38
|
+
<input class="form-control" id="publishName" type="text" style="height: 30px;" placeholder="Publisher name">
|
|
39
|
+
<div class="input-group-btn">
|
|
40
|
+
<button id="publishBtn" type="button" style="height: 30px; width: auto;">Publish</button>
|
|
41
|
+
</div>
|
|
42
|
+
</div>
|
|
43
|
+
<div class="text-center" style="margin-top: 20px">
|
|
44
|
+
<div id="publishStatus"></div>
|
|
45
|
+
<div id="publishErrorInfo"></div>
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
</div>
|
|
49
|
+
<div class="row col-sm-12 justify-content-center" style="margin-top: 10px">
|
|
50
|
+
<div id="localVideo" class="col-sm-6 justify-content-center"></div>
|
|
51
|
+
</div>
|
|
52
|
+
<div class="row col-sm-12 justify-content-center" style="margin-top: 10px;">
|
|
53
|
+
<div class="col-sm-6 text-center">
|
|
54
|
+
<div class="text-center text-muted">Player</div>
|
|
55
|
+
<div id="test1Form" class="input-group col-sm-5" style="margin-top: 10px;">
|
|
56
|
+
<div class="input-group-btn">
|
|
57
|
+
<button id="test1Btn" type="button" style="height: 30px; width: auto;">Test 1</button>
|
|
58
|
+
</div>
|
|
59
|
+
</div>
|
|
60
|
+
<div class="text-center" style="margin-top: 20px">
|
|
61
|
+
<div id="test1Status"></div>
|
|
62
|
+
<div id="test1ErrorInfo"></div>
|
|
63
|
+
</div>
|
|
64
|
+
<div id="test2Form" class="input-group col-sm-5" style="margin-top: 10px;">
|
|
65
|
+
<div class="input-group-btn">
|
|
66
|
+
<button id="test2Btn" type="button" style="height: 30px; width: auto;">Test 2</button>
|
|
67
|
+
</div>
|
|
68
|
+
</div>
|
|
69
|
+
<div class="text-center" style="margin-top: 20px">
|
|
70
|
+
<div id="test2Status"></div>
|
|
71
|
+
<div id="test2ErrorInfo"></div>
|
|
72
|
+
</div>
|
|
73
|
+
<div id="test3Form" class="input-group col-sm-5" style="margin-top: 10px;">
|
|
74
|
+
<div class="input-group-btn">
|
|
75
|
+
<button id="test3Btn" type="button" style="height: 30px; width: auto;">Test 3</button>
|
|
76
|
+
</div>
|
|
77
|
+
</div>
|
|
78
|
+
<div class="text-center" style="margin-top: 20px">
|
|
79
|
+
<div id="test3Status"></div>
|
|
80
|
+
<div id="test3ErrorInfo"></div>
|
|
81
|
+
</div>
|
|
82
|
+
</div>
|
|
83
|
+
</div>
|
|
84
|
+
<div class="row col-sm-12 justify-content-center" style="margin-top: 10px">
|
|
85
|
+
<div id="remoteVideo" class="col-sm-6 justify-content-center"></div>
|
|
86
|
+
</div>
|
|
87
|
+
</div>
|
|
88
|
+
</body>
|
|
89
|
+
</html>
|