ra100/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <title>Transmit text</title>
</head>
<body>

<h1>ALICE</h1>

<div class="text">test</div>

<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="main.js" async></script>

</body>
</html>

## indexAlice.html
<!DOCTYPE html>
<html>
<head>
  <title>Transmit text</title>
</head>
<body>

<h1>ALICE</h1>

<div class="text">test</div>

<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script src="simple.signal.Alice.js" async></script>

</body>
</html>

## indexEve.html
<!DOCTYPE html>
<html>
<head>
  <title>Transmit text</title>
</head>
<body>

<h1>EVE</h1>

<div class="text">test</div>

<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
<script src="simple.signal.Eve.js" async></script>

</body>
</html>

## main.js
const servers = null
const channelName = 'name'
const dataChannelOptions = {
  ordered: true,
  negotiated: true,
  id: 0
}
const axiosInstance = axios.create({
  baseURL: 'http://localhost:8080/rtc',
  headers: {'Content-Type': 'application/json'},
})

// 1. Alice creates an RTCPeerConnection object.
const connection = new RTCPeerConnection(servers)

const channel = connection.createDataChannel(channelName, dataChannelOptions)

channel.onopen = () => {
  console.log('channel open readyState', channel.readyState)
  channel.send('Connection initiated')
}
channel.onclose = () => {
  console.log('channel close readyState', channel.readyState)
}
channel.onmessage = event => {
  console.log('Alice data received', event.data)
}

window.rtcSendMessage = msg => {
  channel.send(msg)
}

// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
// 11. The handler is called when network candidates become available.
connection.onicecandidate = ({candidate}) => {
  if(!candidate) { return }
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
  axiosInstance({
    method: 'post',
    url: '/candidate',
    data: candidate
  }).then(console.log).catch(console.error)
}

connection.onicecandidateerror = console.error
connection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
rtcCreateOffer = async () => {
  const offer = await connection.createOffer()
// 3. Alice calls setLocalDescription() with her offer.
  connection.setLocalDescription(offer)
// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
  console.log('send this Offer to Eve\n', JSON.stringify(offer))
  return offer
}

rtcAcceptOffer = async (offer) => {
// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
  await connection.setRemoteDescription(offer)
// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
  const answer = await connection.createAnswer()
// 7.  Eve sets her answer as the local description by calling setLocalDescription().
  connection.setLocalDescription(answer)
// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
  console.log('send this Answer to Alice\n', JSON.stringify(answer))
  return answer
}

rtcAcceptAnswer = async (answer) => {
// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
  await connection.setRemoteDescription(answer)
}

// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
rtcAcceptCandidate = async (candidate) => {
  await connection.addIceCandidate(candidate)
}


window.rtcAlice = async () => {
  const offer = await rtcCreateOffer()
  await axiosInstance({
    method: 'post',
    url: '/offer',
    data: offer
  }).catch(console.warn)


  const answerInterval = setInterval(() => {
    axiosInstance({
      method: 'get',
      url: '/answer'
    }).then(({data}) => {
      clearInterval(answerInterval)
      rtcAcceptAnswer(data)
    }).catch(console.warn)
  }, 500)
}

window.rtcEve = async () => {
  const offerInterval = setInterval(() => {
    axiosInstance({
      method: 'get',
      url: '/offer'
    }).then(async ({data}) => {
      clearInterval(offerInterval)
      const answer = await rtcAcceptOffer(data)
      axiosInstance({
        method: 'post',
        url: '/answer',
        data: answer
      }).then(console.log).catch(console.warn)

      const candidateInterval = setInterval(() => {
        axiosInstance({
          method: 'get',
          url: '/candidate'
        }).then(({data}) => {
          clearInterval(candidateInterval)
          rtcAcceptCandidate(data)
        }).catch(console.warn)
      }, 500)

    }).catch(console.warn)
  }, 500)
}


## main1.js
const servers = null
const channelName = 'name'
const dataChannelOptions = {
  ordered: true,
  negotiated: true,
  id: 0
}
const axiosInstance = axios.create({
  baseURL: 'http://localhost:8080/rtc',
  headers: {'Content-Type': 'application/json'},
})

// 1. Alice creates an RTCPeerConnection object.
const connection = new RTCPeerConnection(servers)

const channel = connection.createDataChannel(channelName, dataChannelOptions)

channel.onopen = () => {
  console.log('channel open readyState', channel.readyState)
  channel.send('Connection initiated')
}
channel.onclose = () => {
  console.log('channel close readyState', channel.readyState)
}
channel.onmessage = event => {
  console.log('Alice data received', event.data)
}

window.rtcSendMessage = msg => {
  channel.send(msg)
}

// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
// 11. The handler is called when network candidates become available.
connection.onicecandidate = ({candidate}) => {
  if(!candidate) { return }
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
  axiosInstance({
    method: 'post',
    url: '/candidate',
    data: candidate
  }).then(console.log).catch(console.error)
}

connection.onicecandidateerror = console.error
connection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
rtcCreateOffer = async () => {
  const offer = await connection.createOffer()
// 3. Alice calls setLocalDescription() with her offer.
  connection.setLocalDescription(offer)
// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
  console.log('send this Offer to Eve\n', JSON.stringify(offer))
  return offer
}

rtcAcceptOffer = async (offer) => {
// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
  await connection.setRemoteDescription(offer)
// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
  const answer = await connection.createAnswer()
// 7.  Eve sets her answer as the local description by calling setLocalDescription().
  connection.setLocalDescription(answer)
// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
  console.log('send this Answer to Alice\n', JSON.stringify(answer))
  return answer
}

rtcAcceptAnswer = async (answer) => {
// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
  await connection.setRemoteDescription(answer)
}

// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
rtcAcceptCandidate = async (candidate) => {
  await connection.addIceCandidate(candidate)
}


window.rtcAlice = async () => {
  const offer = await rtcCreateOffer()
  await axiosInstance({
    method: 'post',
    url: '/offer',
    data: offer
  }).catch(console.warn)


  const answerInterval = setInterval(() => {
    axiosInstance({
      method: 'get',
      url: '/answer'
    }).then(({data}) => {
      clearInterval(answerInterval)
      rtcAcceptAnswer(data)
    }).catch(console.warn)
  }, 500)
}

window.rtcEve = async () => {
  const offerInterval = setInterval(() => {
    axiosInstance({
      method: 'get',
      url: '/offer'
    }).then(async ({data}) => {
      clearInterval(offerInterval)
      const answer = await rtcAcceptOffer(data)
      axiosInstance({
        method: 'post',
        url: '/answer',
        data: answer
      }).then(console.log).catch(console.warn)

      const candidateInterval = setInterval(() => {
        axiosInstance({
          method: 'get',
          url: '/candidate'
        }).then(({data}) => {
          clearInterval(candidateInterval)
          rtcAcceptCandidate(data)
        }).catch(console.warn)
      }, 500)

    }).catch(console.warn)
  }, 500)
}


## simple.signal.Alice.js
const servers = {
  'iceServers': [{
    'url': 'stun:stun.l.google.com:19302'
  }]
}
// const servers = null
const channelName = 'asdf'

// 1. Alice creates an RTCPeerConnection object.
const aliceConnection = new RTCPeerConnection(servers)

const sendChannel = aliceConnection.createDataChannel(channelName)

sendChannel.onopen = () => {
  console.log('sendChannel open readyState', sendChannel.readyState)
  sendChannel.send(JSON.stringify({some: 'data'}))
}
sendChannel.onclose = () => {
  console.log('sendChannel close readyState', sendChannel.readyState)
}
sendChannel.onmessage = event => {
  console.log('Alice data received', event.data)
}

window.rtcSendMessage = msg => {
  sendChannel.send(msg)
}

// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
// 11. The handler is called when network candidates become available.
aliceConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
}
aliceConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
}
aliceConnection.onicecandidateerror = console.error
aliceConnection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
window.rtcCreateOffer = async () => {
  const offer = await aliceConnection.createOffer()
// 3. Alice calls setLocalDescription() with her offer.
  aliceConnection.setLocalDescription(offer)
// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
  console.log('send this Offer to Eve\n', JSON.stringify(offer))
}

window.rtcAcceptOffer = async (offer) => {
// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
  await aliceConnection.setRemoteDescription(offer)
// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
  const answer = await aliceConnection.createAnswer()
// 7.  Eve sets her answer as the local description by calling setLocalDescription().
  aliceConnection.setLocalDescription(answer)
// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
  console.log('send this Answer to Alice\n', JSON.stringify(answer))
}

window.rtcAcceptAnswer = async (answer) => {
// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
  await aliceConnection.setRemoteDescription(answer)
}

// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
window.rtcAcceptCandidate = async (candidate) => {
  await aliceConnection.addIceCandidate(candidate)
}

## simple.signal.Eve.js
// const servers = {
//   'iceServers': [{
//     'url': 'stun:stun.l.google.com:19302'
//   }]
// }
const servers = null
const channelName = 'asdf'

let sendChannel

// 1. Alice creates an RTCPeerConnection object.
const aliceConnection = new RTCPeerConnection(servers)

// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
// 11. The handler is called when network candidates become available.
aliceConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
}
aliceConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
}
aliceConnection.onicecandidateerror = console.error
aliceConnection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
window.rtcCreateOffer = async () => {
  const offer = await aliceConnection.createOffer()
// 3. Alice calls setLocalDescription() with her offer.
  aliceConnection.setLocalDescription(offer)
// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
  console.log('send this Offer to Eve\n', JSON.stringify(offer))
}

window.rtcAcceptOffer = async (offer) => {
// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
  await aliceConnection.setRemoteDescription(offer)
// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
  const answer = await aliceConnection.createAnswer()
// 7.  Eve sets her answer as the local description by calling setLocalDescription().
  aliceConnection.setLocalDescription(answer)
// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
  console.log('send this Answer to Alice\n', JSON.stringify(answer))
}

window.rtcAcceptAnswer = async (answer) => {
// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
  await aliceConnection.setRemoteDescription(answer)
}

// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
window.rtcAcceptCandidate = async (candidate) => {
  await aliceConnection.addIceCandidate(candidate)
}

aliceConnection.ondatachannel = event => {
  console.log('Eve datachannel does something')
  sendChannel = event.channel
  sendChannel.onmessage = event => {
    console.log('data received', event.data)
  }
  sendChannel.onopen = event => {
    console.log(`Receive channel state is: ${sendChannel.readyState}`)
  }
  sendChannel.onclose = event => {
    console.log(`Receive channel state is: ${sendChannel.readyState}`)
  }
}

window.rtcSendMessage = msg => {
  sendChannel.send(msg)
}


## simple.signal.js
const servers = {
  'iceServers': [{
    'url': 'stun:stun.l.google.com:19302'
  }]
}
const channelName = 'asdf'

const localConnection = new RTCPeerConnection(servers)

localConnection.onicecandidate = event => {
  console.log('onicecandidate', event.candidate)
  console.log('ice candidate', JSON.stringify(event.candidate))
}
localConnection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

localConnection.onnegotiationneeded = async () => {
  try {
    await localConnection.setLocalDescription(await localConnection.createOffer());
    // send the offer to the other peer
    console.log('send offer', JSON.stringify(localConnection.localDescription));
  } catch (err) {
    console.error(err);
  }
}

const sendChannel = localConnection.createDataChannel(channelName)

sendChannel.onopen = () => {
  console.log('sendChannel open readyState', sendChannel.readyState)
  sendChannel.send(JSON.stringify({some: 'data'}))
}

sendChannel.onclose = () => {
  console.log('sendChannel close readyState', sendChannel.readyState)
}

localConnection.ondatachannel = event => {
  localConnection = event.channel
  localConnection.onmessage = event => {
    console.log('data received', event.data)
  }
  localConnection.onopen = event => {
    console.log(`Receive channel state is: ${localConnection.readyState}`)
  }
  localConnection.onclose = event => {
    console.log(`Receive channel state is: ${localConnection.readyState}`)
  }
}

window.rtcOffer = async description => {
  await localConnection.setRemoteDescription(description)
  await localConnection.setLocalDescription(await localConnection.createAnswer())
  console.log('offer description', JSON.stringify(localConnection.localDescription))
}

window.rtcAnswer = async description => {
  await localConnection.setRemoteDescription(description)
}

window.rtcCandidate = async candidate => {
  await localConnection.addIceCandidate(candidate)
}

window.sendMessage = msg => {
  sendChannel.send(msg)
}

## simple.signal.onetab.js
const servers = {
  'iceServers': [{
    'url': 'stun:stun.l.google.com:19302'
  }]
}
// const servers = null
const channelName = 'asdf'

// 1. Alice creates an RTCPeerConnection object.
const aliceConnection = new RTCPeerConnection(servers)
const eveConnection = new RTCPeerConnection(servers)

const sendChannel = aliceConnection.createDataChannel(channelName)

sendChannel.onopen = () => {
  console.log('sendChannel open readyState', sendChannel.readyState)
  sendChannel.send(JSON.stringify({some: 'data'}))
}
sendChannel.onclose = () => {
  console.log('sendChannel close readyState', sendChannel.readyState)
}
sendChannel.onmessage = event => {
  console.log('Alice data received', event.data)
}

window.rtcSendMessage = msg => {
  sendChannel.send(msg)
}

// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
// 11. The handler is called when network candidates become available.
aliceConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
  window.rtcAcceptCandidate(candidate)
}
eveConnection.onicecandidate = ({candidate}) => {
// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
  console.log('send this candidate to Eve\n', JSON.stringify(candidate))
  window.rtcAcceptCandidate(candidate)
}
aliceConnection.onicecandidateerror = console.error
aliceConnection.oniceconnectionstatechange = event =>
  console.log('localConnection change', event)

// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
window.rtcCreateOffer = async () => {
  const offer = await aliceConnection.createOffer()
// 3. Alice calls setLocalDescription() with her offer.
  aliceConnection.setLocalDescription(offer)
// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
  console.log('send this Offer to Eve\n', JSON.stringify(offer))
  window.rtcAcceptOffer(offer)
}

window.rtcAcceptOffer = async (offer) => {
// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
  await eveConnection.setRemoteDescription(offer)
// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
  const answer = await eveConnection.createAnswer()
// 7.  Eve sets her answer as the local description by calling setLocalDescription().
  eveConnection.setLocalDescription(answer)
// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
  console.log('send this Answer to Alice\n', JSON.stringify(answer))
  window.rtcAcceptAnswer(answer)
}

window.rtcAcceptAnswer = async (answer) => {
// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
  await aliceConnection.setRemoteDescription(answer)
}

// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
window.rtcAcceptCandidate = async (candidate) => {
  await eveConnection.addIceCandidate(candidate)
}

let receiveChannel

eveConnection.ondatachannel = event => {
  console.log('Eve datachannel does something')
  receiveChannel = event.channel
  receiveChannel.onmessage = event => {
    console.log('data received', event.data)
  }
  receiveChannel.onopen = event => {
    console.log(`Receive channel state is: ${receiveChannel.readyState}`)
  }
  receiveChannel.onclose = event => {
    console.log(`Receive channel state is: ${receiveChannel.readyState}`)
  }
}

window.rtcSendMessageToAlice = (message) => {
  receiveChannel.send(message)
}
	<!DOCTYPE html>
	<html>
	<head>
	<title>Transmit text</title>
	</head>
	<body>

	<h1>ALICE</h1>

	<div class="text">test</div>

	<script src="https://webrtc.github.io/adapter/adapter-latest.js"></script>
	<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
	<script src="main.js" async></script>

	</body>
	</html>
	const servers = null
	const channelName = 'name'
	const dataChannelOptions = {
	ordered: true,
	negotiated: true,
	id: 0
	}
	const axiosInstance = axios.create({
	baseURL: 'http://localhost:8080/rtc',
	headers: {'Content-Type': 'application/json'},
	})

	// 1. Alice creates an RTCPeerConnection object.
	const connection = new RTCPeerConnection(servers)

	const channel = connection.createDataChannel(channelName, dataChannelOptions)

	channel.onopen = () => {
	console.log('channel open readyState', channel.readyState)
	channel.send('Connection initiated')
	}
	channel.onclose = () => {
	console.log('channel close readyState', channel.readyState)
	}
	channel.onmessage = event => {
	console.log('Alice data received', event.data)
	}

	window.rtcSendMessage = msg => {
	channel.send(msg)
	}

	// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
	// 11. The handler is called when network candidates become available.
	connection.onicecandidate = ({candidate}) => {
	if(!candidate) { return }
	// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
	console.log('send this candidate to Eve\n', JSON.stringify(candidate))
	axiosInstance({
	method: 'post',
	url: '/candidate',
	data: candidate
	}).then(console.log).catch(console.error)
	}

	connection.onicecandidateerror = console.error
	connection.oniceconnectionstatechange = event =>
	console.log('localConnection change', event)

	// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
	rtcCreateOffer = async () => {
	const offer = await connection.createOffer()
	// 3. Alice calls setLocalDescription() with her offer.
	connection.setLocalDescription(offer)
	// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
	console.log('send this Offer to Eve\n', JSON.stringify(offer))
	return offer
	}

	rtcAcceptOffer = async (offer) => {
	// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
	await connection.setRemoteDescription(offer)
	// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
	const answer = await connection.createAnswer()
	// 7. Eve sets her answer as the local description by calling setLocalDescription().
	connection.setLocalDescription(answer)
	// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
	console.log('send this Answer to Alice\n', JSON.stringify(answer))
	return answer
	}

	rtcAcceptAnswer = async (answer) => {
	// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
	await connection.setRemoteDescription(answer)
	}

	// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
	rtcAcceptCandidate = async (candidate) => {
	await connection.addIceCandidate(candidate)
	}


	window.rtcAlice = async () => {
	const offer = await rtcCreateOffer()
	await axiosInstance({
	method: 'post',
	url: '/offer',
	data: offer
	}).catch(console.warn)


	const answerInterval = setInterval(() => {
	axiosInstance({
	method: 'get',
	url: '/answer'
	}).then(({data}) => {
	clearInterval(answerInterval)
	rtcAcceptAnswer(data)
	}).catch(console.warn)
	}, 500)
	}

	window.rtcEve = async () => {
	const offerInterval = setInterval(() => {
	axiosInstance({
	method: 'get',
	url: '/offer'
	}).then(async ({data}) => {
	clearInterval(offerInterval)
	const answer = await rtcAcceptOffer(data)
	axiosInstance({
	method: 'post',
	url: '/answer',
	data: answer
	}).then(console.log).catch(console.warn)

	const candidateInterval = setInterval(() => {
	axiosInstance({
	method: 'get',
	url: '/candidate'
	}).then(({data}) => {
	clearInterval(candidateInterval)
	rtcAcceptCandidate(data)
	}).catch(console.warn)
	}, 500)

	}).catch(console.warn)
	}, 500)
	}
	const servers = {
	'iceServers': [{
	'url': 'stun:stun.l.google.com:19302'
	}]
	}
	// const servers = null
	const channelName = 'asdf'

	// 1. Alice creates an RTCPeerConnection object.
	const aliceConnection = new RTCPeerConnection(servers)

	const sendChannel = aliceConnection.createDataChannel(channelName)

	sendChannel.onopen = () => {
	console.log('sendChannel open readyState', sendChannel.readyState)
	sendChannel.send(JSON.stringify({some: 'data'}))
	}
	sendChannel.onclose = () => {
	console.log('sendChannel close readyState', sendChannel.readyState)
	}
	sendChannel.onmessage = event => {
	console.log('Alice data received', event.data)
	}

	window.rtcSendMessage = msg => {
	sendChannel.send(msg)
	}

	// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
	// 11. The handler is called when network candidates become available.
	aliceConnection.onicecandidate = ({candidate}) => {
	// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
	console.log('send this candidate to Eve\n', JSON.stringify(candidate))
	}
	aliceConnection.onicecandidate = ({candidate}) => {
	// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
	console.log('send this candidate to Eve\n', JSON.stringify(candidate))
	}
	aliceConnection.onicecandidateerror = console.error
	aliceConnection.oniceconnectionstatechange = event =>
	console.log('localConnection change', event)

	// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
	window.rtcCreateOffer = async () => {
	const offer = await aliceConnection.createOffer()
	// 3. Alice calls setLocalDescription() with her offer.
	aliceConnection.setLocalDescription(offer)
	// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
	console.log('send this Offer to Eve\n', JSON.stringify(offer))
	}

	window.rtcAcceptOffer = async (offer) => {
	// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
	await aliceConnection.setRemoteDescription(offer)
	// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
	const answer = await aliceConnection.createAnswer()
	// 7. Eve sets her answer as the local description by calling setLocalDescription().
	aliceConnection.setLocalDescription(answer)
	// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
	console.log('send this Answer to Alice\n', JSON.stringify(answer))
	}

	window.rtcAcceptAnswer = async (answer) => {
	// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
	await aliceConnection.setRemoteDescription(answer)
	}

	// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
	window.rtcAcceptCandidate = async (candidate) => {
	await aliceConnection.addIceCandidate(candidate)
	}
	// const servers = {
	// 'iceServers': [{
	// 'url': 'stun:stun.l.google.com:19302'
	// }]
	// }
	const servers = null
	const channelName = 'asdf'

	let sendChannel

	// 1. Alice creates an RTCPeerConnection object.
	const aliceConnection = new RTCPeerConnection(servers)

	// 10. Alice creates an RTCPeerConnection object with an onicecandidate handler.
	// 11. The handler is called when network candidates become available.
	aliceConnection.onicecandidate = ({candidate}) => {
	// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
	console.log('send this candidate to Eve\n', JSON.stringify(candidate))
	}
	aliceConnection.onicecandidate = ({candidate}) => {
	// 12. In the handler, Alice sends stringified candidate data to Eve, via their signaling channel.
	console.log('send this candidate to Eve\n', JSON.stringify(candidate))
	}
	aliceConnection.onicecandidateerror = console.error
	aliceConnection.oniceconnectionstatechange = event =>
	console.log('localConnection change', event)

	// 2. Alice creates an offer (an SDP session description) with the RTCPeerConnection createOffer() method.
	window.rtcCreateOffer = async () => {
	const offer = await aliceConnection.createOffer()
	// 3. Alice calls setLocalDescription() with her offer.
	aliceConnection.setLocalDescription(offer)
	// 4. Alice stringifies the offer and uses a signaling mechanism to send it to Eve.
	console.log('send this Offer to Eve\n', JSON.stringify(offer))
	}

	window.rtcAcceptOffer = async (offer) => {
	// 5. Eve calls setRemoteDescription() with Alice's offer, so that her RTCPeerConnection knows about Alice's setup.
	await aliceConnection.setRemoteDescription(offer)
	// 6. Eve calls createAnswer(), and the success callback for this is passed a local session description: Eve's answer.
	const answer = await aliceConnection.createAnswer()
	// 7. Eve sets her answer as the local description by calling setLocalDescription().
	aliceConnection.setLocalDescription(answer)
	// 8. Eve then uses the signaling mechanism to send her stringified answer back to Alice.
	console.log('send this Answer to Alice\n', JSON.stringify(answer))
	}

	window.rtcAcceptAnswer = async (answer) => {
	// 9. Alice sets Eve's answer as the remote session description using setRemoteDescription().
	await aliceConnection.setRemoteDescription(answer)
	}

	// 13. When Eve gets a candidate message from Alice, she calls addIceCandidate(), to add the candidate to the remote peer description.
	window.rtcAcceptCandidate = async (candidate) => {
	await aliceConnection.addIceCandidate(candidate)
	}

	aliceConnection.ondatachannel = event => {
	console.log('Eve datachannel does something')
	sendChannel = event.channel
	sendChannel.onmessage = event => {
	console.log('data received', event.data)
	}
	sendChannel.onopen = event => {
	console.log(`Receive channel state is: ${sendChannel.readyState}`)
	}
	sendChannel.onclose = event => {
	console.log(`Receive channel state is: ${sendChannel.readyState}`)
	}
	}

	window.rtcSendMessage = msg => {
	sendChannel.send(msg)
	}