From 3742298114c13a715bb387bd911fbbefc049779d Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Tue, 27 Feb 2018 20:04:21 +0800 Subject: [PATCH 1/9] Add on disconnect rules. --- step-06/index.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) diff --git a/step-06/index.js b/step-06/index.js index c0c25ce..856ee0f 100644 --- a/step-06/index.js +++ b/step-06/index.js @@ -60,8 +60,15 @@ io.sockets.on('connection', function(socket) { } }); - socket.on('bye', function(){ - console.log('received bye'); + socket.on('disconnect', function(room) { + // for a real app, would be room-only (not broadcast) + // io.sockets.in(room).emit('bye', room); + console.log('leaving room', room); + socket.broadcast.emit('bye', room); + }); + + socket.on('bye', function(room){ + console.log('received bye', room); }); }); From 9aeb70651ae2b76bf7cf543fe92d7256da931bea Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Tue, 27 Feb 2018 20:08:11 +0800 Subject: [PATCH 2/9] Add handlers for when peer leaves the room --- step-06/js/main.js | 31 +++++++++++++++++++++++++++++-- 1 file changed, 29 insertions(+), 2 deletions(-) diff --git a/step-06/js/main.js b/step-06/js/main.js index 276d1d0..eb1e8f0 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -89,6 +89,18 @@ if (location.hostname.match(/localhost|127\.0\.0/)) { socket.emit('ipaddr'); } +socket.on('bye', function(leftRoom) { + console.log('Peer left room. Refreshing to re-create room.', leftRoom); + if (room !== leftRoom) return; + dataChannel.readyState = 'closed'; + window.location.reload(); +}) + +window.addEventListener('unload', function() { + console.log('Leaving room ' + room); + socket.emit('disconnect', room); +}); + /** * Send message to signaling server */ @@ -127,7 +139,7 @@ function grabWebCamVideo() { } function gotStream(stream) { - console.log('getUserMedia video stream URL:', streamURL); + console.log('getUserMedia video stream URL:', stream); window.stream = stream; // stream available to console video.srcObject = stream; video.onloadedmetadata = function() { @@ -303,7 +315,18 @@ var img = photoContext.getImageData(0, 0, photoContextW, photoContextH), len = img.data.byteLength, n = len / CHUNK_LEN | 0; +console.log('status of dataChannel', dataChannel); // REMOVE 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 +380,9 @@ function randomToken() { } function logError(err) { - console.log(err.toString(), err); + if (typeof err === 'string') { + console.warn(err); + } else { + console.warn(err.toString(), err); + } } From 8d17dca42c60e68f9399031ac192dcb6f33c5a9d Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Mon, 5 Mar 2018 07:51:58 +0800 Subject: [PATCH 3/9] Replace 'bye' custom events with 'disconnect' events --- step-06/index.js | 12 ++---------- step-06/js/main.js | 16 ++++------------ 2 files changed, 6 insertions(+), 22 deletions(-) diff --git a/step-06/index.js b/step-06/index.js index 856ee0f..434544d 100644 --- a/step-06/index.js +++ b/step-06/index.js @@ -60,15 +60,7 @@ io.sockets.on('connection', function(socket) { } }); - socket.on('disconnect', function(room) { - // for a real app, would be room-only (not broadcast) - // io.sockets.in(room).emit('bye', room); - console.log('leaving room', room); - socket.broadcast.emit('bye', room); - }); - - socket.on('bye', function(room){ - console.log('received bye', room); + socket.on('disconnect', function(reason) { + console.log(`Peer or server disconnected. Reason: ${reason}.`); }); - }); diff --git a/step-06/js/main.js b/step-06/js/main.js index eb1e8f0..f186639 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -89,18 +89,12 @@ if (location.hostname.match(/localhost|127\.0\.0/)) { socket.emit('ipaddr'); } -socket.on('bye', function(leftRoom) { - console.log('Peer left room. Refreshing to re-create room.', leftRoom); - if (room !== leftRoom) return; - dataChannel.readyState = 'closed'; +socket.on('disconnect', function(reason) { + console.log(`Disconnected: ${reason}. Refreshing to re-create room.`); + if (dataChannel.readyState) { dataChannel.readyState = 'closed'; } window.location.reload(); }) -window.addEventListener('unload', function() { - console.log('Leaving room ' + room); - socket.emit('disconnect', room); -}); - /** * Send message to signaling server */ @@ -174,9 +168,7 @@ function signalingMessageCallback(message) { candidate: message.candidate })); - } else if (message === 'bye') { -// TODO: cleanup RTC connection? -} + } } function createPeerConnection(isInitiator, config) { From 9f4ca19257b56747a53d53e30dfaed2c2f8cecbc Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Mon, 5 Mar 2018 08:30:55 +0800 Subject: [PATCH 4/9] Add bye message to handle voluntary leaves. --- step-06/index.js | 5 +++++ step-06/js/main.js | 18 +++++++++++++++++- 2 files changed, 22 insertions(+), 1 deletion(-) diff --git a/step-06/index.js b/step-06/index.js index 434544d..ae178ae 100644 --- a/step-06/index.js +++ b/step-06/index.js @@ -62,5 +62,10 @@ io.sockets.on('connection', function(socket) { 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 f186639..9a3a70d 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -91,7 +91,23 @@ if (location.hostname.match(/localhost|127\.0\.0/)) { socket.on('disconnect', function(reason) { console.log(`Disconnected: ${reason}. Refreshing to re-create room.`); - if (dataChannel.readyState) { dataChannel.readyState = 'closed'; } + window.location.reload(); +}) + + +function leaveRoom() { + console.log(`Unloading window. Notifying peers in ${room}.`); + socket.emit('bye', room); +} + +window.addEventListener('unload', leaveRoom); + +socket.on('bye', function(room) { + console.log(`Peer leaving room ${room}. Refreshing to re-create room.`); + // TODO(nitobuendia): check if peer re-connected immediately. + // Otherwise, we reach infinite loops of re-connexion until one is slow. + // Avoid duplicated message when re-creating room because other peer left. + window.removeEventListener('unload', leaveRoom); window.location.reload(); }) From 89c29feaea0b3cf3d61af92f34adaab969634efa Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Tue, 6 Mar 2018 08:28:37 +0800 Subject: [PATCH 5/9] Improve join / room comments. --- step-06/js/main.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/step-06/js/main.js b/step-06/js/main.js index 9a3a70d..19ea515 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -82,13 +82,14 @@ 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}. Refreshing to re-create room.`); window.location.reload(); From bfbc5cd2e7fef643fcf13dffeb5f14b3274e5366 Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Thu, 8 Mar 2018 07:26:55 +0800 Subject: [PATCH 6/9] Replace reloads for button disablement Control button status to avoid sending messages when channel is not open. --- step-06/js/main.js | 30 ++++++++++++++++++++++-------- 1 file changed, 22 insertions(+), 8 deletions(-) diff --git a/step-06/js/main.js b/step-06/js/main.js index 19ea515..b61ffc1 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); @@ -91,8 +95,9 @@ if (location.hostname.match(/localhost|127\.0\.0/)) { // Leaving rooms and disconnecting from peers. socket.on('disconnect', function(reason) { - console.log(`Disconnected: ${reason}. Refreshing to re-create room.`); - window.location.reload(); + console.log(`Disconnected: ${reason}.`); + sendBtn.disabled = true; + snapAndSendBtn.disabled = true; }) @@ -104,12 +109,13 @@ function leaveRoom() { window.addEventListener('unload', leaveRoom); socket.on('bye', function(room) { - console.log(`Peer leaving room ${room}. Refreshing to re-create room.`); - // TODO(nitobuendia): check if peer re-connected immediately. - // Otherwise, we reach infinite loops of re-connexion until one is slow. - // Avoid duplicated message when re-creating room because other peer left. - window.removeEventListener('unload', leaveRoom); - window.location.reload(); + 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(); + } }) /** @@ -237,8 +243,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(); } From 39d738cb596bd0da932dea599224422b0407d4e8 Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Thu, 8 Mar 2018 07:31:47 +0800 Subject: [PATCH 7/9] Fix bug when no error message is sent --- step-06/js/main.js | 1 + 1 file changed, 1 insertion(+) diff --git a/step-06/js/main.js b/step-06/js/main.js index b61ffc1..2ec4e04 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -403,6 +403,7 @@ function randomToken() { } function logError(err) { + if (!err) return; if (typeof err === 'string') { console.warn(err); } else { From c1812c48c2f2fbe3e44445c4c3652c1fc4affd6f Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Thu, 8 Mar 2018 07:37:59 +0800 Subject: [PATCH 8/9] Combine leaveRoom function with unload event --- step-06/js/main.js | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) diff --git a/step-06/js/main.js b/step-06/js/main.js index 2ec4e04..d941da6 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -98,15 +98,7 @@ socket.on('disconnect', function(reason) { console.log(`Disconnected: ${reason}.`); sendBtn.disabled = true; snapAndSendBtn.disabled = true; -}) - - -function leaveRoom() { - console.log(`Unloading window. Notifying peers in ${room}.`); - socket.emit('bye', room); -} - -window.addEventListener('unload', leaveRoom); +}); socket.on('bye', function(room) { console.log(`Peer leaving room ${room}.`); @@ -116,7 +108,13 @@ socket.on('bye', function(room) { 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 From 96670ea77faecb691db131582a5e51caa5ce5c93 Mon Sep 17 00:00:00 2001 From: Nito Buendia Date: Thu, 8 Mar 2018 07:39:07 +0800 Subject: [PATCH 9/9] Remove temporary comments --- step-06/js/main.js | 1 - 1 file changed, 1 deletion(-) diff --git a/step-06/js/main.js b/step-06/js/main.js index d941da6..9ba7701 100644 --- a/step-06/js/main.js +++ b/step-06/js/main.js @@ -336,7 +336,6 @@ var img = photoContext.getImageData(0, 0, photoContextW, photoContextH), len = img.data.byteLength, n = len / CHUNK_LEN | 0; -console.log('status of dataChannel', dataChannel); // REMOVE console.log('Sending a total of ' + len + ' byte(s)'); if (!dataChannel) {