OpenTera WebRTC API (JavaScript) 1.2.5
OpenTera WebRTC JavaScript Library API Documentation

Examples

Data Channel Client Example

client.html

1 <!DOCTYPE html>
2 <html>
3  <head>
4  <title>Web Data Channel Client</title>
5  <meta charset="UTF-8">
6 
7  <script src="openteraWebrtcWebClient.js"></script>
8  </head>
9  <body>
10 
11  <h1>Web Data Channel Client</h1>
12 
13  <h4>Name: </h4>
14  <input id="name_input" type="text"></input>
15 
16  <h4>Password: </h4>
17  <input id="password_input" type="text" value="abc"></input>
18 
19  <h4>Signaling Server Connection: </h4>
20  <button id="connect_button" type="button">Connect</button>
21  <button id="close_button" type="button">Close</button>
22 
23  <h4>Clients: </h4>
24  <ul id="client_list"></ul>
25 
26  <h4>Call All: </h4>
27  <button id="call_all_button" type="button">Call All</button>
28  <button id="hang_up_all_button" type="button">Hang Up All</button>
29  <button id="close_all_room_peer_connections" type="button">Close All Room Peer Connections</button>
30 
31  <h4>Call One: </h4>
32  <input id="id_input" type="text"></input>
33  <button id="call_one_button" type="button">Call</button>
34 
35  <h4>Messages: </h4>
36  <input id="text_input" type="text"></input>
37  <button id="send_button" type="button">Send</button><br><br>
38  <textarea id="chat_text_area" rows="10" cols="50" readonly></textarea>
39 
40 
41 
42  <script src="client.js"></script>
43 
44  </body>
45 </html>

client.js

1 (function() {
2  let nameInput = document.getElementById('name_input');
3  let passwordInput = document.getElementById('password_input');
4  let connectButton = document.getElementById('connect_button');
5  let closeButton = document.getElementById('close_button');
6  let clientList = document.getElementById('client_list');
7  let callAllButton = document.getElementById('call_all_button');
8  let hangUpAllButton = document.getElementById('hang_up_all_button');
9  let closeAllRoomPeerConnectionsButton = document.getElementById('close_all_room_peer_connections');
10  let idInput = document.getElementById('id_input');
11  let callOneButton = document.getElementById('call_one_button');
12  let textInput = document.getElementById('text_input');
13  let sendButton = document.getElementById('send_button');
14  let chatTextArea = document.getElementById('chat_text_area');
15 
16  closeButton.disabled = true;
17  callAllButton.disabled = true;
18  hangUpAllButton.disabled = true;
19  closeAllRoomPeerConnectionsButton.disabled = true;
20  callOneButton.disabled = true;
21  sendButton.disabled = true;
22  chatTextArea.value = '';
23 
24  let dataChannelClient = null;
25 
26  function connectDataChannelClientEvents() {
27  dataChannelClient.onSignalingConnectionOpen = () => {
28  connectButton.disabled = true;
29  closeButton.disabled = false;
30  };
31  dataChannelClient.onSignalingConnectionClose = async () => {
32  connectButton.disabled = false;
33  closeButton.disabled = true;
34  callAllButton.disabled = true;
35  hangUpAllButton.disabled = true;
36  closeAllRoomPeerConnectionsButton.disabled = true;
37  callOneButton.disabled = true;
38  };
39  dataChannelClient.onSignalingConnectionError = message => {
40  alert(message);
41  }
42  dataChannelClient.onRoomClientsChange = clients => {
43  callAllButton.disabled = !(clients.length > 1 && hangUpAllButton.disabled);
44  callOneButton.disabled = callAllButton.disabled;
45 
46  clientList.innerHTML = '';
47  clients.forEach(client => {
48  let li = document.createElement('li');
49  li.textContent = client.id + ' - ' + client.name;
50  li.style.color = client.isConnected ? 'green' : 'red';
51  clientList.appendChild(li);
52  });
53  };
54 
55  dataChannelClient.callAcceptor = async (id, name, clientData) => {
56  return confirm('Do you accept the call from ' + name + '?');
57  };
58 
59  dataChannelClient.onCallReject = (id, name, clientData) => {
60  alert('The call is rejected (' + name + ')');
61  };
62 
63  dataChannelClient.onClientConnectionFail = (id, name, clientData) => {
64  console.log('The connect with the client ' + name + '(' + id + ') failed.');
65  }
66 
67  dataChannelClient.onDataChannelOpen = (id, name, clientData) => {
68  sendButton.disabled = false;
69  callAllButton.disabled = true;
70  hangUpAllButton.disabled = false;
71  closeAllRoomPeerConnectionsButton.disabled = false;
72  callOneButton.disabled = true;
73  }
74  dataChannelClient.onDataChannelClose = (id, name, clientData) => {
75  sendButton.disabled = !dataChannelClient.isRtcConnected;
76  callAllButton.disabled = dataChannelClient.isRtcConnected;
77  hangUpAllButton.disabled = !dataChannelClient.isRtcConnected;
78  closeAllRoomPeerConnectionsButton.disabled = !dataChannelClient.isRtcConnected;
79  callOneButton.disabled = dataChannelClient.isRtcConnected;
80  };
81  dataChannelClient.onDataChannelMessage = (id, name, clientData, message) => {
82  chatTextArea.value += id + ' - ' + name + ': ';
83  chatTextArea.value += message;
84  chatTextArea.value += '\n';
85  };
86  }
87 
88 
89  connectButton.onclick = async () => {
90  const SignalingServerConfiguration = {
91  url: 'ws://localhost:8080/signaling',
92  name: nameInput.value,
93  data: {}, // Client custom data
94  room: 'chat',
95  password: passwordInput.value
96  };
97  const DataChannelConfiguration = {}; // See: https://developer.mozilla.org/fr/docs/Web/API/RTCPeerConnection/createDataChannel#RTCDataChannelInit_dictionary
98  const RtcConfiguration = { // See: https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/RTCPeerConnection#RTCConfiguration_dictionary
99  iceServers: await window.openteraWebrtcWebClient.iceServers.fetchFromServer('http://localhost:8080/iceservers', passwordInput.value)
100  };
101  let logger = (...args) => console.log(...args);
102 
103  dataChannelClient = new window.openteraWebrtcWebClient.DataChannelClient(SignalingServerConfiguration,
104  DataChannelConfiguration, RtcConfiguration, logger);
105  connectDataChannelClientEvents();
106 
107  await dataChannelClient.connect();
108  };
109  closeButton.onclick = () => {
110  dataChannelClient.close();
111  clientList.innerHTML = '';
112  };
113  callAllButton.onclick = () => dataChannelClient.callAll();
114  hangUpAllButton.onclick = () => dataChannelClient.hangUpAll();
115  closeAllRoomPeerConnectionsButton.onclick = () => dataChannelClient.closeAllRoomPeerConnections();
116  callOneButton.onclick = () => dataChannelClient.callIds([idInput.value]);
117  sendButton.onclick = () => {
118  chatTextArea.value += 'Me: ';
119  chatTextArea.value += textInput.value;
120  chatTextArea.value += '\n';
121 
122  dataChannelClient.sendToAll(textInput.value)
123  };
124 })();

Stream Client Example

client.html

1 <!DOCTYPE html>
2 <html>
3  <head>
4  <title>Stream Client</title>
5  <meta charset="UTF-8">
6 
7  <script src="openteraWebrtcWebClient.js"></script>
8  </head>
9  <body>
10 
11  <h1>Stream Client</h1>
12 
13  <h2>Local Stream</h2>
14  <video id="local_video" muted></video>
15  <br/>
16  <button id="mute_audio_button" type="button">Mute Audio</button>
17  <button id="unmute_audio_button" type="button">Unmute Audio</button>
18  <button id="mute_video_button" type="button">Mute Video</button>
19  <button id="unmute_video_button" type="button">Unmute Video</button>
20 
21  <h2>Remove Stream</h2>
22  <h4>Name: </h4>
23  <input id="name_input" type="text"></input>
24 
25  <h4>Password: </h4>
26  <input id="password_input" type="text" value="abc"></input>
27 
28  <h4>Signaling Server Connection: </h4>
29  <button id="connect_button" type="button">Connect</button>
30  <button id="close_button" type="button">Close</button>
31 
32  <h4>Clients: </h4>
33  <ul id="client_list"></ul>
34 
35  <h4>Call All: </h4>
36  <button id="call_all_button" type="button">Call All</button>
37  <button id="hang_up_all_button" type="button">Hang Up All</button>
38  <button id="close_all_room_peer_connections" type="button">Close All Room Peer Connections</button>
39 
40  <h4>Call One: </h4>
41  <input id="id_input" type="text"></input>
42  <button id="call_one_button" type="button">Call</button>
43 
44  <div id="remote_videos"></div>
45 
46  <script src="client.js"></script>
47 
48  </body>
49 </html>

client.js

1 (function() {
2  let localVideo = document.getElementById('local_video');
3  let muteAudioButton = document.getElementById('mute_audio_button');
4  let unmuteAudioButton = document.getElementById('unmute_audio_button');
5  let muteVideoButton = document.getElementById('mute_video_button');
6  let unmuteVideoButton = document.getElementById('unmute_video_button');
7  let nameInput = document.getElementById('name_input');
8  let passwordInput = document.getElementById('password_input');
9  let connectButton = document.getElementById('connect_button');
10  let closeButton = document.getElementById('close_button');
11  let clientList = document.getElementById('client_list');
12  let callAllButton = document.getElementById('call_all_button');
13  let hangUpAllButton = document.getElementById('hang_up_all_button');
14  let closeAllRoomPeerConnectionsButton = document.getElementById('close_all_room_peer_connections');
15  let idInput = document.getElementById('id_input');
16  let callOneButton = document.getElementById('call_one_button');
17  let remoteVideos = document.getElementById('remote_videos');
18 
19  muteAudioButton.disabled = true;
20  unmuteAudioButton.disabled = true;
21  muteVideoButton.disabled = true;
22  unmuteVideoButton.disabled = true;
23  closeButton.disabled = true;
24  callAllButton.disabled = true;
25  hangUpAllButton.disabled = true;
26  closeAllRoomPeerConnectionsButton.disabled = true;
27  callOneButton.disabled = true;
28 
29  let streamClient = null;
30 
31  window.openteraWebrtcWebClient.devices.getDefaultStream().then(stream => {
32  localVideo.srcObject = stream;
33  localVideo.autoplay = true;
34  });
35 
36  function connectStreamClientEvents() {
37  streamClient.onSignalingConnectionOpen = () => {
38  connectButton.disabled = true;
39  closeButton.disabled = false;
40  };
41  streamClient.onSignalingConnectionClose = async () => {
42  connectButton.disabled = false;
43  closeButton.disabled = true;
44  callAllButton.disabled = true;
45  hangUpAllButton.disabled = true;
46  closeAllRoomPeerConnectionsButton.disabled = true;
47  callOneButton.disabled = true;
48  };
49  streamClient.onSignalingConnectionError = message => {
50  alert(message);
51  }
52  streamClient.onRoomClientsChange = clients => {
53  callAllButton.disabled = !(clients.length > 1 && hangUpAllButton.disabled);
54  callOneButton.disabled = callAllButton.disabled;
55 
56  clientList.innerHTML = '';
57  clients.forEach(client => {
58  let li = document.createElement('li');
59  li.textContent = client.id + ' - ' + client.name;
60  li.style.color = client.isConnected ? 'green' : 'red';
61  clientList.appendChild(li);
62  });
63  };
64 
65  streamClient.onClientConnectionFail = (id, name, clientData) => {
66  console.log('The connect with the client ' + name + '(' + id + ') failed.');
67  }
68 
69  streamClient.onAddRemoteStream = (id, name, clientData, stream) => {
70  callAllButton.disabled = true;
71  hangUpAllButton.disabled = false;
72  closeAllRoomPeerConnectionsButton.disabled = false;
73  callOneButton.disabled = true;
74 
75  let h5 = document.createElement("h5");;
76  h5.innerHTML = id + ' - ' + name;
77  h5.id = 'h5' + id;
78 
79  let video = document.createElement("video");
80  video.srcObject = stream;
81  video.id = 'video' + id;
82  video.autoplay = true;
83 
84  remoteVideos.appendChild(h5);
85  remoteVideos.appendChild(video);
86  }
87  streamClient.onClientDisconnect = (id, name, clientData) => {
88  callAllButton.disabled = streamClient.isRtcConnected;
89  hangUpAllButton.disabled = !streamClient.isRtcConnected;
90  closeAllRoomPeerConnectionsButton.disabled = !streamClient.isRtcConnected;
91  callOneButton.disabled = streamClient.isRtcConnected;
92 
93  remoteVideos.removeChild(document.getElementById('h5' + id));
94  remoteVideos.removeChild(document.getElementById('video' + id));
95  };
96  }
97 
98  function updateMuteButtons() {
99  muteAudioButton.disabled = streamClient.isLocalAudioMuted;
100  unmuteAudioButton.disabled = !streamClient.isLocalAudioMuted;
101  muteVideoButton.disabled = streamClient.isLocalVideoMuted;
102  unmuteVideoButton.disabled = !streamClient.isLocalVideoMuted;
103  }
104 
105  muteAudioButton.onclick = () => {
106  streamClient.muteLocalAudio();
107  updateMuteButtons();
108  };
109  unmuteAudioButton.onclick = () => {
110  streamClient.unmuteLocalAudio();
111  updateMuteButtons();
112  };
113  muteVideoButton.onclick = () => {
114  streamClient.muteLocalVideo();
115  updateMuteButtons();
116  };
117  unmuteVideoButton.onclick = () => {
118  streamClient.unmuteLocalVideo();
119  updateMuteButtons();
120  };
121  connectButton.onclick = async () => {
122  const SignalingServerConfiguration = {
123  url: 'ws://localhost:8080/signaling',
124  name: nameInput.value,
125  data: {}, // Client custom data
126  room: 'chat',
127  password: passwordInput.value
128  };
129  const StreamConfiguration = {
130  localStream: localVideo.srcObject, // Optional
131  isSendOnly: false
132  };
133  const RtcConfiguration = { // See: https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/RTCPeerConnection#RTCConfiguration_dictionary
134  iceServers: await window.openteraWebrtcWebClient.iceServers.fetchFromServer('http://localhost:8080/iceservers', passwordInput.value)
135  };
136  let logger = (...args) => console.log(...args);
137 
138  streamClient = new window.openteraWebrtcWebClient.StreamClient(SignalingServerConfiguration,
139  StreamConfiguration, RtcConfiguration, logger);
140  connectStreamClientEvents();
141 
142  await streamClient.connect();
143  updateMuteButtons();
144  };
145  closeButton.onclick = () => {
146  streamClient.close();
147  clientList.innerHTML = '';
148  remoteVideos.innerHTML = '';
149  };
150  callAllButton.onclick = () => streamClient.callAll();
151  hangUpAllButton.onclick = () => streamClient.hangUpAll();
152  closeAllRoomPeerConnectionsButton.onclick = () => streamClient.closeAllRoomPeerConnections();
153  callOneButton.onclick = () => streamClient.callIds([idInput.value]);
154 })();

Stream Data Channel Client Example

client.html

1 <!DOCTYPE html>
2 <html>
3  <head>
4  <title>Stream Client</title>
5  <meta charset="UTF-8">
6 
7  <script src="openteraWebrtcWebClient.js"></script>
8  </head>
9  <body>
10 
11  <h1>Stream Client</h1>
12 
13  <h2>Local Stream</h2>
14  <video id="local_video" muted></video>
15  <br/>
16  <button id="mute_audio_button" type="button">Mute Audio</button>
17  <button id="unmute_audio_button" type="button">Unmute Audio</button>
18  <button id="mute_video_button" type="button">Mute Video</button>
19  <button id="unmute_video_button" type="button">Unmute Video</button>
20 
21  <h2>Remove Stream and Messages</h2>
22  <h4>Name: </h4>
23  <input id="name_input" type="text"></input>
24 
25  <h4>Password: </h4>
26  <input id="password_input" type="text" value="abc"></input>
27 
28  <h4>Signaling Server Connection: </h4>
29  <button id="connect_button" type="button">Connect</button>
30  <button id="close_button" type="button">Close</button>
31 
32  <h4>Clients: </h4>
33  <ul id="client_list"></ul>
34 
35  <h4>Call All: </h4>
36  <button id="call_all_button" type="button">Call All</button>
37  <button id="hang_up_all_button" type="button">Hang Up All</button>
38  <button id="close_all_room_peer_connections" type="button">Close All Room Peer Connections</button>
39 
40  <h4>Call One: </h4>
41  <input id="id_input" type="text"></input>
42  <button id="call_one_button" type="button">Call</button>
43 
44  <h4>Messages: </h4>
45  <input id="text_input" type="text"></input>
46  <button id="send_button" type="button">Send</button><br><br>
47  <textarea id="chat_text_area" rows="10" cols="50" readonly></textarea>
48 
49  <h4>Remote Stream: </h4>
50  <div id="remote_videos"></div>
51 
52  <script src="client.js"></script>
53 
54  </body>
55 </html>

client.js

1 (function() {
2  let localVideo = document.getElementById('local_video');
3  let muteAudioButton = document.getElementById('mute_audio_button');
4  let unmuteAudioButton = document.getElementById('unmute_audio_button');
5  let muteVideoButton = document.getElementById('mute_video_button');
6  let unmuteVideoButton = document.getElementById('unmute_video_button');
7  let nameInput = document.getElementById('name_input');
8  let passwordInput = document.getElementById('password_input');
9  let connectButton = document.getElementById('connect_button');
10  let closeButton = document.getElementById('close_button');
11  let clientList = document.getElementById('client_list');
12  let callAllButton = document.getElementById('call_all_button');
13  let hangUpAllButton = document.getElementById('hang_up_all_button');
14  let closeAllRoomPeerConnectionsButton = document.getElementById('close_all_room_peer_connections');
15  let idInput = document.getElementById('id_input');
16  let callOneButton = document.getElementById('call_one_button');
17  let textInput = document.getElementById('text_input');
18  let sendButton = document.getElementById('send_button');
19  let chatTextArea = document.getElementById('chat_text_area');
20  let remoteVideos = document.getElementById('remote_videos');
21 
22  muteAudioButton.disabled = true;
23  unmuteAudioButton.disabled = true;
24  muteVideoButton.disabled = true;
25  unmuteVideoButton.disabled = true;
26  closeButton.disabled = true;
27  callAllButton.disabled = true;
28  hangUpAllButton.disabled = true;
29  closeAllRoomPeerConnectionsButton.disabled = true;
30  callOneButton.disabled = true;
31  sendButton.disabled = true;
32 
33  let streamDataChannelClient = null;
34 
35  window.openteraWebrtcWebClient.devices.getDefaultStream().then(stream => {
36  localVideo.srcObject = stream;
37  localVideo.autoplay = true;
38  });
39 
40  function connectStreamClientEvents() {
41  streamDataChannelClient.onSignalingConnectionOpen = () => {
42  connectButton.disabled = true;
43  closeButton.disabled = false;
44  };
45  streamDataChannelClient.onSignalingConnectionClose = async () => {
46  connectButton.disabled = false;
47  closeButton.disabled = true;
48  callAllButton.disabled = true;
49  hangUpAllButton.disabled = true;
50  closeAllRoomPeerConnectionsButton.disabled = true;
51  callOneButton.disabled = true;
52  };
53  streamDataChannelClient.onSignalingConnectionError = message => {
54  alert(message);
55  }
56  streamDataChannelClient.onRoomClientsChange = clients => {
57  callAllButton.disabled = !(clients.length > 1 && hangUpAllButton.disabled);
58  callOneButton.disabled = callAllButton.disabled;
59 
60  clientList.innerHTML = '';
61  clients.forEach(client => {
62  let li = document.createElement('li');
63  li.textContent = client.id + ' - ' + client.name;
64  li.style.color = client.isConnected ? 'green' : 'red';
65  clientList.appendChild(li);
66  });
67  };
68 
69  streamDataChannelClient.onClientConnectionFail = (id, name, clientData) => {
70  console.log('The connect with the client ' + name + '(' + id + ') failed.');
71  }
72 
73  streamDataChannelClient.onAddRemoteStream = (id, name, clientData, stream) => {
74  sendButton.disabled = false;
75  callAllButton.disabled = true;
76  hangUpAllButton.disabled = false;
77  closeAllRoomPeerConnectionsButton.disabled = false;
78  callOneButton.disabled = true;
79 
80  let h5 = document.createElement("h5");;
81  h5.innerHTML = id + ' - ' + name;
82  h5.id = 'h5' + id;
83 
84  let video = document.createElement("video");
85  video.srcObject = stream;
86  video.id = 'video' + id;
87  video.autoplay = true;
88 
89  remoteVideos.appendChild(h5);
90  remoteVideos.appendChild(video);
91  }
92  let onClientDisconnect = (id, name, clientData) => {
93  sendButton.disabled = !streamDataChannelClient.isRtcConnected;
94  callAllButton.disabled = streamDataChannelClient.isRtcConnected;
95  hangUpAllButton.disabled = !streamDataChannelClient.isRtcConnected;
96  closeAllRoomPeerConnectionsButton.disabled = !streamDataChannelClient.isRtcConnected;
97  callOneButton.disabled = streamDataChannelClient.isRtcConnected;
98 
99  let h5 = document.getElementById('h5' + id);
100  let video = document.getElementById('video' + id);
101  if (h5 !== null) {
102  remoteVideos.removeChild(document.getElementById('h5' + id));
103  }
104  if (video !== null) {
105  remoteVideos.removeChild(document.getElementById('video' + id));
106  }
107  };
108  streamDataChannelClient.onClientDisconnect = onClientDisconnect;
109 
110  streamDataChannelClient.onDataChannelOpen = (id, name, clientData) => {
111  sendButton.disabled = false;
112  callAllButton.disabled = true;
113  hangUpAllButton.disabled = false;
114  closeAllRoomPeerConnectionsButton.disabled = false;
115  callOneButton.disabled = true;
116  }
117  streamDataChannelClient.onDataChannelClose = onClientDisconnect;
118  streamDataChannelClient.onDataChannelMessage = (id, name, clientData, message) => {
119  chatTextArea.value += id + ' - ' + name + ': ';
120  chatTextArea.value += message;
121  chatTextArea.value += '\n';
122  };
123  }
124 
125  function updateMuteButtons() {
126  muteAudioButton.disabled = streamDataChannelClient.isLocalAudioMuted;
127  unmuteAudioButton.disabled = !streamDataChannelClient.isLocalAudioMuted;
128  muteVideoButton.disabled = streamDataChannelClient.isLocalVideoMuted;
129  unmuteVideoButton.disabled = !streamDataChannelClient.isLocalVideoMuted;
130  }
131 
132  muteAudioButton.onclick = () => {
133  streamDataChannelClient.muteLocalAudio();
134  updateMuteButtons();
135  };
136  unmuteAudioButton.onclick = () => {
137  streamDataChannelClient.unmuteLocalAudio();
138  updateMuteButtons();
139  };
140  muteVideoButton.onclick = () => {
141  streamDataChannelClient.muteLocalVideo();
142  updateMuteButtons();
143  };
144  unmuteVideoButton.onclick = () => {
145  streamDataChannelClient.unmuteLocalVideo();
146  updateMuteButtons();
147  };
148  connectButton.onclick = async () => {
149  const SignalingServerConfiguration = {
150  url: 'ws://localhost:8080/signaling',
151  name: nameInput.value,
152  data: {}, // Client custom data
153  room: 'chat',
154  password: passwordInput.value
155  };
156  const StreamConfiguration = {
157  localStream: localVideo.srcObject, // Optional
158  isSendOnly: false
159  };
160  const DataChannelConfiguration = {}; // See: https://developer.mozilla.org/fr/docs/Web/API/RTCPeerConnection/createDataChannel#RTCDataChannelInit_dictionary
161  const RtcConfiguration = { // See: https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/RTCPeerConnection#RTCConfiguration_dictionary
162  iceServers: await window.openteraWebrtcWebClient.iceServers.fetchFromServer('http://localhost:8080/iceservers', passwordInput.value)
163  };
164  let logger = (...args) => console.log(...args);
165 
166  streamDataChannelClient = new window.openteraWebrtcWebClient.StreamDataChannelClient(SignalingServerConfiguration,
167  StreamConfiguration, DataChannelConfiguration, RtcConfiguration, logger);
168  connectStreamClientEvents();
169 
170  await streamDataChannelClient.connect();
171  updateMuteButtons();
172  };
173  closeButton.onclick = () => {
174  streamDataChannelClient.close();
175  clientList.innerHTML = '';
176  remoteVideos.innerHTML = '';
177  };
178  callAllButton.onclick = () => streamDataChannelClient.callAll();
179  hangUpAllButton.onclick = () => streamDataChannelClient.hangUpAll();
180  closeAllRoomPeerConnectionsButton.onclick = () => streamDataChannelClient.closeAllRoomPeerConnections();
181  callOneButton.onclick = () => streamDataChannelClient.callIds([idInput.value]);
182  sendButton.onclick = () => {
183  chatTextArea.value += 'Me: ';
184  chatTextArea.value += textInput.value;
185  chatTextArea.value += '\n';
186 
187  streamDataChannelClient.sendToAll(textInput.value)
188  };
189 })();