From d6e1e645020c8c4497e76740852faf5a33234dd9 Mon Sep 17 00:00:00 2001 From: Miroslav Pejic Date: Sun, 15 May 2022 20:08:13 +0200 Subject: [PATCH] [mirotalk] - refactoring comments --- README.md | 14 +- app/src/Logger.js | 34 +++ app/src/server.js | 20 +- public/js/client.js | 407 ++++++++++++++++----------------- public/js/detectSpeaking.js | 16 ++ public/js/newRoom.js | 3 + public/js/speechRecognition.js | 2 +- public/js/videoGrid.js | 32 +++ 8 files changed, 305 insertions(+), 223 deletions(-) diff --git a/README.md b/README.md index 807b28f0..4a20689c 100644 --- a/README.md +++ b/README.md @@ -73,13 +73,13 @@ - https://mirotalk.up.railway.app/join?room=test&name=mirotalk&audio=0&video=0¬ify=0 - https://mirotalk.herokuapp.com/join?room=test&name=mirotalk&audio=0&video=0¬ify=0 - | Params | Type | Description | - | ------ | ------- | ---------------- | - | room | string | room Id | - | name | string | user name | - | audio | boolean | audio stream | - | video | boolean | video stream | - | notify | boolean | welcome message | + | Params | Type | Description | + | ------ | ------- | --------------- | + | room | string | room Id | + | name | string | user name | + | audio | boolean | audio stream | + | video | boolean | video stream | + | notify | boolean | welcome message | diff --git a/app/src/Logger.js b/app/src/Logger.js index f1836258..e60148a1 100644 --- a/app/src/Logger.js +++ b/app/src/Logger.js @@ -7,27 +7,61 @@ module.exports = class Logger { this.debugOn = debugOn; } + /** + * Console debug logs + * @param {string} msg message + * @param {object} op optional params + * @returns + */ debug(msg, op = '') { if (this.debugOn === false) return; console.debug('[' + this.getDataTime() + '] [' + this.appName + '] ' + msg, op); } + /** + * Console logs + * @param {string} msg message + * @param {object} op optional params + * @returns + */ log(msg, op = '') { console.log('[' + this.getDataTime() + '] [' + this.appName + '] ' + msg, op); } + /** + * Console info logs + * @param {string} msg message + * @param {object} op optional params + * @returns + */ info(msg, op = '') { console.info('[' + this.getDataTime() + '] [' + this.appName + '] ' + msg, op); } + /** + * Console warning logs + * @param {string} msg message + * @param {object} op optional params + * @returns + */ warn(msg, op = '') { console.warn('[' + this.getDataTime() + '] [' + this.appName + '] ' + msg, op); } + /** + * Console error logs + * @param {string} msg message + * @param {object} op optional params + * @returns + */ error(msg, op = '') { console.error('[' + this.getDataTime() + '] [' + this.appName + '] ' + msg, op); } + /** + * Get date time + * @returns {string} date to ISO string + */ getDataTime() { return new Date().toISOString().replace(/T/, ' ').replace(/Z/, ''); } diff --git a/app/src/server.js b/app/src/server.js index 23011720..250bd6c5 100755 --- a/app/src/server.js +++ b/app/src/server.js @@ -425,8 +425,8 @@ io.sockets.on('connect', (socket) => { channels[channel][socket.id] = socket; socket.channels[channel] = channel; - // Send to peer how many peers are connected in the same room - sendToPeer(socket.id, sockets, 'peersCount', { peers_count: Object.keys(peers[channel]).length }); + // Send some server info to joined peer + sendToPeer(socket.id, sockets, 'serverInfo', { peers_count: Object.keys(peers[channel]).length }); }); /** @@ -746,10 +746,10 @@ io.sockets.on('connect', (socket) => { /** * Send async data to all peers in the same room except yourself - * @param {*} room_id id of the room to send data - * @param {*} socket_id socket id of peer that send data - * @param {*} msg message to send to the peers in the same room - * @param {*} config JSON data to send to the peers in the same room + * @param {string} room_id id of the room to send data + * @param {string} socket_id socket id of peer that send data + * @param {string} msg message to send to the peers in the same room + * @param {object} config JSON data to send to the peers in the same room */ async function sendToRoom(room_id, socket_id, msg, config = {}) { for (let peer_id in channels[room_id]) { @@ -763,10 +763,10 @@ async function sendToRoom(room_id, socket_id, msg, config = {}) { /** * Send async data to specified peer - * @param {*} peer_id id of the peer to send data - * @param {*} sockets all peers connections - * @param {*} msg message to send to the peer in the same room - * @param {*} config JSON data to send to the peer in the same room + * @param {string} peer_id id of the peer to send data + * @param {object} sockets all peers connections + * @param {string} msg message to send to the peer in the same room + * @param {object} config JSON data to send to the peer in the same room */ async function sendToPeer(peer_id, sockets, msg, config = {}) { if (peer_id in sockets) { diff --git a/public/js/client.js b/public/js/client.js index 3e5ef33f..d80d4989 100644 --- a/public/js/client.js +++ b/public/js/client.js @@ -463,9 +463,9 @@ function setButtonsToolTip() { /** * Set nice tooltip to element - * @param {*} elem - * @param {*} content - * @param {*} placement + * @param {object} elem element + * @param {string} content message to popup + * @param {string} placement position */ function setTippy(elem, content, placement) { tippy(elem, { @@ -477,7 +477,7 @@ function setTippy(elem, content, placement) { /** * Get peer info using DetecRTC * https://github.com/muaz-khan/DetectRTC - * @returns Obj peer info + * @returns {object} peer info */ function getPeerInfo() { return { @@ -494,7 +494,6 @@ function getPeerInfo() { /** * Get approximative peer geolocation * Get your API Key at https://extreme-ip-lookup.com - * @returns json */ function getPeerGeoLocation() { fetch(peerLoockupUrl) @@ -507,7 +506,7 @@ function getPeerGeoLocation() { /** * Get Signaling server URL - * @returns Signaling server URL + * @returns {string} Signaling server URL */ function getSignalingServer() { if (isHttps) { @@ -525,7 +524,7 @@ function getSignalingServer() { /** * Generate random Room id if not set - * @returns Room Id + * @returns {string} Room Id */ function getRoomId() { // chek if passed as params /join?room=id @@ -546,8 +545,8 @@ function getRoomId() { /** * Generate random Id - * @param {*} length - * @returns random id + * @param {integer} length + * @returns {string} random id */ function makeId(length) { let result = ''; @@ -561,6 +560,7 @@ function makeId(length) { /** * Check if notify is set + * @returns {boolean} true/false (default true) */ function getNotify() { let qs = new URLSearchParams(window.location.search); @@ -574,7 +574,7 @@ function getNotify() { /** * Check if peer name is set - * @returns Peer Name + * @returns {string} Peer Name */ function getPeerName() { let qs = new URLSearchParams(window.location.search); @@ -583,7 +583,7 @@ function getPeerName() { /** * Check if there is peer connections - * @returns true, false otherwise + * @returns {boolean} true/false */ function thereIsPeerConnections() { if (Object.keys(peerConnections).length === 0) return false; @@ -606,7 +606,7 @@ function initClientPeer() { // on receiving data from signaling server... signalingSocket.on('connect', handleConnect); - signalingSocket.on('peersCount', handlePeersCount); + signalingSocket.on('serverInfo', handleServerInfo); signalingSocket.on('roomIsLocked', handleRoomLocked); signalingSocket.on('roomStatus', handleRoomStatus); signalingSocket.on('addPeer', handleAddPeer); @@ -627,8 +627,8 @@ function initClientPeer() { /** * Send async data to signaling server (server.js) - * @param {*} msg msg to send to signaling server - * @param {*} config JSON data to send to signaling server + * @param {string} msg msg to send to signaling server + * @param {object} config data to send to signaling server */ async function sendToServer(msg, config = {}) { await signalingSocket.emit(msg, config); @@ -636,7 +636,7 @@ async function sendToServer(msg, config = {}) { /** * Send async data through RTC Data Channels - * @param {*} config obj data + * @param {object} config data */ async function sendToDataChannel(config) { if (thereIsPeerConnections() && typeof config === 'object' && config !== null) { @@ -665,9 +665,10 @@ function handleConnect() { } /** - * How many peers are connected to the same room + * Handle some signaling server info + * @param {object} config data */ -function handlePeersCount(config) { +function handleServerInfo(config) { let peers_count = config.peers_count; console.log('Peers count', peers_count); if (notify && peers_count == 1) { @@ -820,8 +821,7 @@ function welcomeUser() { /** * When we join a group, our signaling server will send out 'addPeer' events to each pair of users in the group (creating a fully-connected graph of users, * ie if there are 6 people in the channel you will connect directly to the other 5, so there will be a total of 15 connections in the network). - * - * @param {*} config + * @param {object} config data */ function handleAddPeer(config) { // console.log("addPeer", JSON.stringify(config)); @@ -859,6 +859,7 @@ function handleAddPeer(config) { /** * Handle peers connection state + * @param {string} peer_id socket.id */ function handlePeersConnectionStatus(peer_id) { peerConnections[peer_id].onconnectionstatechange = function (event) { @@ -869,8 +870,7 @@ function handlePeersConnectionStatus(peer_id) { /** * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/onicecandidate - * - * @param {*} peer_id + * @param {string} peer_id socket.id */ function handleOnIceCandidate(peer_id) { peerConnections[peer_id].onicecandidate = (event) => { @@ -887,9 +887,8 @@ function handleOnIceCandidate(peer_id) { /** * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/ontrack - * - * @param {*} peer_id - * @param {*} peers + * @param {string} peer_id socket.id + * @param {object} peers all peers info connected to the same room */ function handleOnTrack(peer_id, peers) { peerConnections[peer_id].ontrack = (event) => { @@ -904,8 +903,7 @@ function handleOnTrack(peer_id, peers) { /** * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/addTrack - * - * @param {*} peer_id + * @param {string} peer_id socket.id */ function handleAddTracks(peer_id) { localMediaStream.getTracks().forEach((track) => { @@ -919,8 +917,7 @@ function handleAddTracks(peer_id) { * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/createDataChannel * https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/ondatachannel * https://developer.mozilla.org/en-US/docs/Web/API/RTCDataChannel/onmessage - * - * @param {*} peer_id + * @param {string} peer_id socket.id */ function handleRTCDataChannels(peer_id) { peerConnections[peer_id].ondatachannel = (event) => { @@ -963,8 +960,7 @@ function handleRTCDataChannels(peer_id) { /** * Only one side of the peer connection should create the offer, the signaling server picks one to be the offerer. * The other user will get a 'sessionDescription' event and will create an offer, then send back an answer 'sessionDescription' to us - * - * @param {*} peer_id + * @param {string} peer_id socket.id */ function handleRtcOffer(peer_id) { // https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/onnegotiationneeded @@ -999,8 +995,7 @@ function handleRtcOffer(peer_id) { /** * Peers exchange session descriptions which contains information about their audio / video settings and that sort of stuff. First * the 'offerer' sends a description to the 'answerer' (with type "offer"), then the answerer sends one back (with type "answer"). - * - * @param {*} config + * @param {object} config data */ function handleSessionDescription(config) { console.log('Remote Session Description', config); @@ -1051,8 +1046,7 @@ function handleSessionDescription(config) { /** * The offerer will send a number of ICE Candidate blobs to the answerer so they * can begin trying to find the best path to one another on the net. - * - * @param {*} config + * @param {object} config data */ function handleIceCandidate(config) { let peer_id = config.peer_id; @@ -1066,6 +1060,7 @@ function handleIceCandidate(config) { /** * Disconnected from Signaling Server. * Tear down all of our peer connections and remove all the media divs. + * @param {object} reason of disconnection */ function handleDisconnect(reason) { console.log('Disconnected from signaling server', { reason: reason }); @@ -1088,8 +1083,7 @@ function handleDisconnect(reason) { * telling them to trash the media channels they have open for those that peer. If it was this client that left a channel, * they'll also receive the removePeers. If this client was disconnected, they wont receive removePeers, but rather the * signaling_socket.on('disconnect') code will kick in and tear down all the peer sessions. - * - * @param {*} config + * @param {object} config data */ function handleRemovePeer(config) { console.log('Signaling server said to remove peer:', config); @@ -1114,7 +1108,7 @@ function handleRemovePeer(config) { /** * Set mirotalk theme | dark | grey | ... - * @param {*} theme + * @param {string} theme type */ function setTheme(theme) { if (!theme) return; @@ -1155,7 +1149,7 @@ function setTheme(theme) { /** * Set buttons bar position - * @param {*} position vertical / horizontal + * @param {string} position vertical / horizontal */ function setButtonsBarPosition(position) { if (!position || isMobileDevice) return; @@ -1187,9 +1181,8 @@ function setButtonsBarPosition(position) { * Setup local media stuff. Ask user for permission to use the computers microphone and/or camera, * attach it to an