X-Git-Url: https://git.kengrimes.com/?p=henge%2Fkiak.git;a=blobdiff_plain;f=client.js;h=1f626254630af111594f1e8e79a0ecd9bd097610;hp=676861a8d1ea02c2ae203f97ffca247a0f585b0e;hb=01bded344986da59b5b34091b85979e116a85693;hpb=a64cde9da6eac0b1d9dae8828ae89d5845fd5908 diff --git a/client.js b/client.js index 676861a..1f62625 100644 --- a/client.js +++ b/client.js @@ -4,13 +4,13 @@ document.title = "Strapp.io Client" body.appendChild(root) document.body = body const conf = {"iceServers": [{ "urls": "stun:stun.1.google.com:19302" }] } +let dataChannel /* TODO: duplicate in both client.js and host.js */ function getPublicKey() { return new Promise( (resolve, reject) => { /* Check local storage for public key */ if (!window.localStorage.getItem('public-key')) { - console.log('public key is undefined') /* If doesn't exist, generate public and private key pair, store in local storage */ crypto.subtle.generateKey( @@ -47,7 +47,8 @@ function postServer(url, data) { request.send(data) } -/* TODO: All this does is wrap a function in a promise */ +/* TODO: All this does is wrap a function in a promise. Allows pollServerForAnswer + to call itself recursively with the same promise */ function pollServer(url, clientPubKey, func) { return new Promise((resolve, reject) => { func(url, clientPubKey, resolve, reject ) @@ -66,14 +67,14 @@ function pollServerForAnswer(url, data, resolve, reject) { request.onreadystatechange = () => { if (request.status === 200) { if(request.readyState === 4) { - console.log('Client: Recieved response from Host') + console.log('Client: Recieved Answer from Host') console.log(request) resolve(request.response) } } else if (request.status === 504) { console.log('timed out, resending') - pollServerTimeout(url, data, resolve, reject) + pollServerForAnswer(url, data, resolve, reject) } else { reject('server unhandled response of status ' + request.status) @@ -83,67 +84,61 @@ function pollServerForAnswer(url, data, resolve, reject) { } /* Poll server for ice candidates until ice is complete */ -function pollServerForICECandidate(cpc) { - window.setInterval(() => { - if (cpc.iceGatheringState.localeCompare('complete') !== 0) { - return new Promise((resolve, reject) => { +function pollServerForICECandidate(cpc, url, pubKey) { + let intervalID = window.setInterval(() => { + if (cpc.iceConnectionState.localeCompare('connected') !== 0 + && cpc.iceConnectionState.localeCompare('completed') !== 0) { + console.log('Client: Polling server begin for intervalID = ' + intervalID) console.log('Client: Requesting ICE Candidates from server') const request = new XMLHttpRequest() - request.open('GET', window.location, true) + request.open('GET', url, true) request.setRequestHeader('Content-Type', 'application/json' ) request.setRequestHeader('X-Strapp-Type', 'ice-candidate-request') + request.setRequestHeader('X-client-pubkey', pubKey) request.onreadystatechange = () => { if (request.status === 200) { if(request.readyState === 4) { console.log('Client: Recieved ICE Candidate from Host') - resolve(request.response) + cpc.addIceCandidate(new RTCIceCandidate(JSON.parse(request.response).ice)) } } else if (request.status === 204) { console.log('Ice Candidate unavailable, trying again in one second') } else { - reject('server unhandled response of status ' + request.status) + console.log('server unhandled response of status ' + request.status) + clearInterval(intervalID) } } - request.send(cpc.pubKey) - }).then((response) => { - console.log('Client: Adding Ice Candidate ') - cpc.addIceCandidate(response.candidate) - }).catch((err) => { - console.log('pollServerForICECandidate: ' + err) - }) + request.send() } else { clearTimeout() + clearInterval(intervalID) } - }, 2000) + }, 5000) } -/* Create, set, and get client Offer. Poll server for host answer. - Set host answer as client remoteDescription */ +/* Create and send offer -> Send ICE Candidates -> Poll for ICE Candidates */ getPublicKey().then((cpk) => { + console.log('Client: Create and send offer') const cpc = new RTCPeerConnection(conf) /* Start data channel */ - sendChannel = cpc.createDataChannel("sendChannel"); - sendChannel.onopen = () => { - console.log('client data channel on line') - sendChannel.onmessage = (message) => { - console.log(message.data) - } - sendChannel.send('Hi from the Client') - }; - /* Start polling for ice candidate */ + dataChannel = cpc.createDataChannel("sendChannel"); + dataChannel.onmessage = (msg) => { + console.log(msg.data) + } + dataChannel.onopen = () => { + dataChannel.send(`Hi from the Client`) + } - console.log(cpc.iceConnectionState) cpc.oniceconnectionstatechange = () => { console.log('iceConnectionState = ' + cpc.iceConnectionState) } - - cpc.onnegotiationneeded = () => { + console.log('negotiation needed!') cpc.createOffer().then((offer) => { return cpc.setLocalDescription(offer) }) @@ -157,11 +152,9 @@ getPublicKey().then((cpk) => { return pollServer(window.location, offer, pollServerForAnswer) }).then((serverResponse) => { const answer = JSON.parse(serverResponse) - console.log('Client: received host answer') - cpc.setRemoteDescription(answer.sdp).then(() => { - console.log('Client: Polling for ICE candidates') - pollServerForICECandidate(cpc) - }) + console.log('Client: Polling for ICE candidates') + pollServerForICECandidate(cpc, window.location, cpk.n) + cpc.setRemoteDescription(answer.sdp) cpc.onicecandidate = (event) => { if (event.candidate) { console.log('Client: Sending ice candidate to host') @@ -175,6 +168,8 @@ getPublicKey().then((cpk) => { console.log('Client: No more Ice Candidates to send') } } + + }).catch( (err) => { console.log('error in sdp handshake: ' + err) })