Skip to content

Commit 22871df

Browse files
committed
Make it work again
1 parent 8c5e0c7 commit 22871df

File tree

3 files changed

+49
-70
lines changed

3 files changed

+49
-70
lines changed

javascript/rtcdata/index.html

+4
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,9 @@
99
</head>
1010
<body>
1111
<canvas id="canvas"></canvas>
12+
<button id="initiate">Initiate</button>
13+
<textarea id="sdp"></textarea>
14+
<button id="receive">Set remote offer</button>
15+
<button id="accept">Accept answer</button>
1216
</body>
1317
</html>

javascript/rtcdata/package-lock.json

+4
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

javascript/rtcdata/rtcdata.js

+41-70
Original file line numberDiff line numberDiff line change
@@ -1,99 +1,70 @@
11
document.addEventListener('DOMContentLoaded', init)
22

3-
function init() {
4-
var PeerConnection = window.RTCPeerConnection
5-
|| window.webkitRTCPeerConnection
3+
async function init() {
4+
document.getElementById('initiate')
5+
.addEventListener('click', initiate)
66

7-
// For local IP addresses
8-
var ice = null
7+
document.getElementById('receive')
8+
.addEventListener('click', receive)
99

10-
// For finding the public IP address
11-
// var ice = {"iceServers": [
12-
// {"url": "stun:stun.l.google.com:19302"},
13-
// ]};
14-
15-
var pc = new PeerConnection(ice)
10+
document.getElementById('accept')
11+
.addEventListener('click', accept)
12+
}
1613

17-
pc.onaddstream = function() {
18-
console.log('new data stream?')
19-
}
14+
const pc = new RTCPeerConnection()
2015

21-
pc.ondatachannel = function() {
22-
console.log('got data channel')
23-
}
16+
pc.ondatachannel = (ev) => {
17+
console.log('got data channel')
18+
}
2419

25-
pc.onicecandidate = function(ev) {
26-
if (ev.candidate != null)
27-
remotepc.addIceCandidate(ev.candidate)
28-
}
20+
pc.onicecandidate = (ev) => {
21+
console.log('ice candidate', ev)
22+
pc.addIceCandidate(ev.candidate)
23+
}
2924

30-
pc.oniceconnectionstatechange = function(ev) {
31-
console.log('statechange', ev)
32-
}
25+
pc.oniceconnectionstatechange = (ev) => {
26+
console.log('ice statechange', ev)
27+
}
3328

34-
var dc = pc.createDataChannel('data', {
29+
async function initiate() {
30+
const dc = pc.createDataChannel('data', {
3531
ordered: false,
3632
maxRetransmits: 0,
3733
})
3834

39-
dc.onopen = function() {
35+
dc.onopen = ev => {
4036
console.log('data channel open')
41-
// pc.getStats()
42-
// .then(function(stats) { console.log(stats) })
43-
dc.send('bouah')
4437
}
4538

46-
dc.onmessage = function() {
47-
console.log('data message')
39+
dc.onmessage = (ev) => {
40+
console.log('data message', ev.data)
4841
}
4942

50-
dc.onclose = function() {
43+
dc.onclose = (ev) => {
5144
console.log('data channel closed')
5245
}
5346

54-
dc.onerror = function() {
47+
dc.onerror = (ev) => {
5548
console.log('data channel error')
5649
}
5750

58-
// Remote peer
59-
var remotepc = new PeerConnection(ice)
51+
const offer = await pc.createOffer()
52+
pc.setLocalDescription(offer)
6053

61-
remotepc.onicecandidate = function(ev) {
62-
if (ev.candidate != null)
63-
pc.addIceCandidate(ev.candidate)
64-
}
65-
66-
remotepc.ondatachannel = function(ev) {
67-
console.log('(remote) got data channel')
68-
ev.channel.onmessage = function(ev) {
69-
console.log('(remote) data message: ', ev.data)
70-
}
71-
}
54+
document.getElementById('sdp')
55+
.value = JSON.stringify(offer)
56+
}
7257

73-
// This spaghetti plate is brought to you by FF and Chrome not having the same
74-
// interface. Chrome uses success and failure callbacks, FF a mix of Promises
75-
// and callbacks.
76-
var p = pc.createOffer(handleOffer, failure)
77-
if (p) p.then(handleOffer)
78-
79-
function handleOffer(offer) {
80-
pc.setLocalDescription(offer, function() {
81-
remotepc.setRemoteDescription(
82-
pc.localDescription, function() {
83-
var p = remotepc.createAnswer(handleAnswer, failure)
84-
if (p) p.then(handleAnswer)
85-
}, failure)
86-
}, failure)
87-
}
58+
async function receive() {
59+
const sdp = JSON.parse(document.getElementById('sdp').value)
8860

89-
function handleAnswer(answer) {
90-
remotepc.setLocalDescription(
91-
answer, function() {
92-
pc.setRemoteDescription(remotepc.localDescription)
93-
}, failure)
94-
}
61+
await pc.setRemoteDescription(sdp)
62+
const answer = await pc.createAnswer()
63+
pc.setLocalDescription(answer)
64+
document.getElementById('sdp').value = JSON.stringify(answer)
65+
}
9566

96-
function failure(err) {
97-
console.error(err)
98-
}
67+
async function accept() {
68+
const sdp = JSON.parse(document.getElementById('sdp').value)
69+
await pc.setRemoteDescription(sdp)
9970
}

0 commit comments

Comments
 (0)