[mirotalksfu] - send file to specific participant

public/js/Room.js

@@ -19,6 +19,7 @@ const _PEER = {
     raiseHand: '<i style="color: rgb(0, 255, 71);" class="fas fa-hand-paper pulsate"></i>',
     lowerHand: '',
     ejectPeer: '<i class="fas fa-times"></i>',
+    sendFile: '<i class="fas fa-upload"></i>',
 };
 
 let participantsCount = 0;
@@ -631,7 +632,7 @@ function handleButtons() {
         rc.closeProducer(RoomClient.mediaType.screen);
     };
     fileShareButton.onclick = () => {
-        rc.selectFileToShare();
+        rc.selectFileToShare(rc.peer_id);
     };
     youTubeShareButton.onclick = () => {
         rc.youTubeShareVideo();
@@ -1296,6 +1297,7 @@ async function getParticipantsTable(peers) {
         <th></th>
         <th></th>
         <th></th>
+        <th></th>
     </tr>`;
 
     table += `
@@ -1304,6 +1306,7 @@ async function getParticipantsTable(peers) {
         <td><button id="muteAllButton" onclick="rc.peerAction('me','${rc.peer_id}','mute',true,true)">${_PEER.audioOff} Mute</button></td>
         <td><button id="hideAllButton" onclick="rc.peerAction('me','${rc.peer_id}','hide',true,true)">${_PEER.videoOff} Hide</button></td>
         <td></td>
+        <td><button id="sendAllButton" onclick="rc.selectFileToShare('${rc.peer_id}')">${_PEER.sendFile} File</button></td>
         <td><button id="ejectAllButton" onclick="rc.peerAction('me','${rc.peer_id}','eject',true,true)">${_PEER.ejectPeer} Eject</button></td>
     </tr>
     `;
@@ -1315,6 +1318,7 @@ async function getParticipantsTable(peers) {
         let peer_video = peer_info.peer_video ? _PEER.videoOn : _PEER.videoOff;
         let peer_hand = peer_info.peer_hand ? _PEER.raiseHand : _PEER.lowerHand;
         let peer_eject = _PEER.ejectPeer;
+        let peer_sendFile = _PEER.sendFile;
         let peer_id = peer_info.peer_id;
         if (rc.peer_id === peer_id) {
             table += `
@@ -1324,6 +1328,7 @@ async function getParticipantsTable(peers) {
                 <td><button>${peer_video}</button></td>
                 <td><button>${peer_hand}</button></td>
                 <td></td>
+                <td></td>
             </tr>
             `;
         } else {
@@ -1333,6 +1338,7 @@ async function getParticipantsTable(peers) {
                 <td><button id='${peer_id}___pAudio' onclick="rc.peerAction('me',this.id,'mute')">${peer_audio}</button></td>
                 <td><button id='${peer_id}___pVideo' onclick="rc.peerAction('me',this.id,'hide')">${peer_video}</button></td>
                 <td><button>${peer_hand}</button></td>
+                <td><button id='${peer_id}' onclick="rc.selectFileToShare(this.id, false)">${peer_sendFile}</button></td>
                 <td><button id='${peer_id}___pEject' onclick="rc.peerAction('me',this.id,'eject')">${peer_eject}</button></td>
             </tr>
             `;

public/js/RoomClient.js

@@ -1628,7 +1628,7 @@ class RoomClient {
     // FILE SHARING
     // ####################################################
 
-    selectFileToShare() {
+    selectFileToShare(peer_id, broadcast = true) {
         this.sound('open');
 
         Swal.fire({
@@ -1660,13 +1660,15 @@ class RoomClient {
                     }
                     // send some metadata about our file to peers in the room
                     this.socket.emit('fileInfo', {
+                        peer_id: peer_id,
+                        broadcast: broadcast,
                         peer_name: this.peer_name,
                         fileName: this.fileToSend.name,
                         fileSize: this.fileToSend.size,
                         fileType: this.fileToSend.type,
                     });
                     setTimeout(() => {
-                        this.sendFileData();
+                        this.sendFileData(peer_id, broadcast);
                     }, 1000);
                 } else {
                     userLog('error', 'File not selected or empty.', 'top-end');
@@ -1699,7 +1701,7 @@ class RoomClient {
         this.receiveInProgress = true;
     }
 
-    sendFileData() {
+    sendFileData(peer_id, broadcast) {
         console.log('Send file ', {
             name: this.fileToSend.name,
             size: this.bytesToSize(this.fileToSend.size),
@@ -1730,8 +1732,13 @@ class RoomClient {
         this.fileReader.addEventListener('load', (e) => {
             if (!this.sendInProgress) return;
 
-            this.sendFSData(e.target.result);
-            offset += e.target.result.byteLength;
+            let data = {
+                peer_id: peer_id,
+                broadcast: broadcast,
+                fileData: e.target.result,
+            };
+            this.sendFSData(data);
+            offset += data.fileData.byteLength;
 
             sendProgress.value = offset;
             sendFilePercentage.innerHTML = 'Send progress: ' + ((offset / this.fileToSend.size) * 100).toFixed(2) + '%';
@@ -1783,8 +1790,8 @@ class RoomClient {
 
     handleFile(data) {
         if (!this.receiveInProgress) return;
-        this.receiveBuffer.push(data);
-        this.receivedSize += data.byteLength;
+        this.receiveBuffer.push(data.fileData);
+        this.receivedSize += data.fileData.byteLength;
         receiveProgress.value = this.receivedSize;
         receiveFilePercentage.innerHTML =
             'Receive progress: ' + ((this.receivedSize / this.incomingFileInfo.fileSize) * 100).toFixed(2) + '%';

src/Server.js

@@ -254,11 +254,19 @@ io.on('connection', (socket) => {
 
     socket.on('fileInfo', (data) => {
         log.debug('Send File Info', data);
-        roomList.get(socket.room_id).broadCast(socket.id, 'fileInfo', data);
+        if (data.broadcast) {
+            roomList.get(socket.room_id).broadCast(socket.id, 'fileInfo', data);
+        } else {
+            roomList.get(socket.room_id).sendTo(data.peer_id, 'fileInfo', data);
+        }
     });
 
     socket.on('file', (data) => {
-        roomList.get(socket.room_id).broadCast(socket.id, 'file', data);
+        if (data.broadcast) {
+            roomList.get(socket.room_id).broadCast(socket.id, 'file', data);
+        } else {
+            roomList.get(socket.room_id).sendTo(data.peer_id, 'file', data);
+        }
     });
 
     socket.on('fileAbort', (data) => {