diff --git a/step-06/index.js b/step-06/index.js index c0c25ce..ae178ae 100644 --- a/step-06/index.js +++ b/step-06/index.js @@ -60,8 +60,12 @@ io.sockets.on('connection', function(socket) { } }); - socket.on('bye', function(){ - console.log('received bye'); + socket.on('disconnect', function(reason) { + console.log(`Peer or server disconnected. Reason: ${reason}.`); + socket.broadcast.emit('bye'); }); + socket.on('bye', function(room) { + console.log(`Peer said bye on room ${room}.`); + }); }); diff --git a/step-06/js/main.js b/step-06/js/main.js index 0d44f93..9ba7701 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -29,6 +29,10 @@ snapBtn.addEventListener('click', snapPhoto); sendBtn.addEventListener('click', sendPhoto); snapAndSendBtn.addEventListener('click', snapAndSend); +// Disable send buttons by default. +sendBtn.disabled = true; +snapAndSendBtn.disabled = true; + // Create a random room if not already present in the URL. var isInitiator; var room = window.location.hash.substring(1); @@ -82,13 +86,36 @@ socket.on('message', function(message) { signalingMessageCallback(message); }); -// Join a room +// Joining a room. socket.emit('create or join', room); if (location.hostname.match(/localhost|127\.0\.0/)) { socket.emit('ipaddr'); } +// Leaving rooms and disconnecting from peers. +socket.on('disconnect', function(reason) { + console.log(`Disconnected: ${reason}.`); + sendBtn.disabled = true; + snapAndSendBtn.disabled = true; +}); + +socket.on('bye', function(room) { + console.log(`Peer leaving room ${room}.`); + sendBtn.disabled = true; + snapAndSendBtn.disabled = true; + // If peer did not create the room, re-enter to be creator. + if (!isInitiator) { + window.location.reload(); + } +}); + +window.addEventListener('unload', function() { + console.log(`Unloading window. Notifying peers in ${room}.`); + socket.emit('bye', room); +}); + + /** * Send message to signaling server */ @@ -162,9 +189,7 @@ function signalingMessageCallback(message) { candidate: message.candidate })); - } else if (message === 'bye') { -// TODO: cleanup RTC connection? -} + } } function createPeerConnection(isInitiator, config) { @@ -216,8 +241,16 @@ function onDataChannelCreated(channel) { channel.onopen = function() { console.log('CHANNEL opened!!!'); + sendBtn.disabled = false; + snapAndSendBtn.disabled = false; }; + channel.onclose = function () { + console.log('Channel closed.'); + sendBtn.disabled = true; + snapAndSendBtn.disabled = true; + } + channel.onmessage = (adapter.browserDetails.browser === 'firefox') ? receiveDataFirefoxFactory() : receiveDataChromeFactory(); } @@ -304,6 +337,16 @@ len = img.data.byteLength, n = len / CHUNK_LEN | 0; console.log('Sending a total of ' + len + ' byte(s)'); + +if (!dataChannel) { + logError('Connection has not been initiated. ' + + 'Get two peers in the same room first'); + return; +} else if (dataChannel.readyState === 'closed') { + logError('Connection was lost. Peer closed the connection.'); + return; +} + dataChannel.send(len); // split the photo and send in chunks of about 64KB @@ -357,5 +400,10 @@ function randomToken() { } function logError(err) { - console.log(err.toString(), err); + if (!err) return; + if (typeof err === 'string') { + console.warn(err); + } else { + console.warn(err.toString(), err); + } }