From b9f055cc25858737db888d9522b60f297b422c34 Mon Sep 17 00:00:00 2001 From: Miroslav Pejic Date: Fri, 5 Nov 2021 20:16:22 +0100 Subject: [PATCH] [mirotalksfu] - confirm mute, hide, eject participants --- public/css/Room.css | 6 ++- public/images/participants.png | Bin 0 -> 1978 bytes public/js/Room.js | 16 +++---- public/js/RoomClient.js | 85 +++++++++++++++++++++++++-------- public/view/Room.html | 3 +- 5 files changed, 77 insertions(+), 33 deletions(-) create mode 100644 public/images/participants.png diff --git a/public/css/Room.css b/public/css/Room.css index 60eee61a..675decef 100644 --- a/public/css/Room.css +++ b/public/css/Room.css @@ -192,12 +192,16 @@ body { border-radius: 5px; } +#sessionTime { + margin-left: 8px; + cursor: default; +} + /*-------------------------------------------------------------- # Style the tab --------------------------------------------------------------*/ .tab { overflow: hidden; - background-color: rgba(0, 0, 0, 0.4); } /* Style the buttons inside the tab */ diff --git a/public/images/participants.png b/public/images/participants.png new file mode 100644 index 0000000000000000000000000000000000000000..f5ee2a61ba02b798a4d56f9b82b27fa05789296a GIT binary patch literal 1978 zcmai#`#TegAIF7Urlm)zZSGN>$SwE7h+1+v?n+FQTVf{K!RE3Z&86d((n)Gmo956; z%(j@x+XA7%A=GuIj}AEwf^+uMWtS_R^KuI-o?-_2Vj?w+X!Bkwo0hwZ-nW-p_~wv?^X)d zCf^@d1- z3ItgW;Fyjt92sJEu9B_4r`Th247XK$**GL?P9e;%gjR2M=}Y~I1LQr$P zuF!o#{s+ThRa~&={H zFYRMo4yQ1sWT$6uo$q%hz^^r{$PQe4RJ~@Df|SBA+}h!oID(wBNYXtFGDAIoE9hxO zjM}k-9d$O|{L>GXgrzvz4eu_glp}9IUI`QBe?)|pWC{W(^@jyi9`jLf_S%zb{~ivb zU$VD<;Z5TD3b?lkI!FTWza){%OeuE~(+gwI0izpWl0d@>S17nIT;4ITYb8!jLkCfnTD2<<_Cy~}PRQ$75dCA?c_K-z+i zjT-c_w2Esp^Cvy_knM5(2U`ahnk{ZKR_<2^xuA}^&~h23{zrb*nS;Ym2C{4nUYqS` zr{a*H$&YWZu&ok}y_Z!Cy%p68C=I-1oqCxz6qND_TkE&FV64LO-l9V`P3-QtzMny# ztHCTH=t1cLOr!A~ag>lYX*}B-5+D*VMny4f{Ng>u{{{5AkEQA>7mVzgqN4?)1_=H; z*C%2Yq;z4IKNL{y`fFsN(0O*8^M)vptR&_>zdY^~xm<<8q$PN9i=)_;w{a_oXKChi z5n&!l-!FQQBzUVtglPqR49aaZ2*!x$U$eLx84Zy!ozb zeYdK)tzLbyTT`Rcs40+%?TboMV5r8Ht$Zv{%^l;^Y{VW*PcB-qq^=J;b`A1b4-o5U6Rs9j+agi+}J2+ zBw`lGjJbmg@FW6NF|IV@Pi-Q{Uf`slmufIyXT>R-_7Sm?$m`;bvJ76Ev*PoM%tPuN zw`7v1x5|N;2c3;mcKORu;U(Jo2X^ZQ=NVoZ9~C%^ItAXO_{#}g;qkWF)j(R zq&1)>b1pgh>$G7L3$T9_*Ol?T*s$jp^GzGWFo=c9yKG{uCF$XO>#(z%bv=S>{Q3r) zboHvir}-F76r$x+Mh>Y5T9la-J}{j|_GpT1NIRF8Uc}#DtG_-$m1?Ed20tSGR+5G_ z<@+_0q~cUhhj(IqDj-|Qb@C{ff4#$6);iSD!xEHjTZ+@mBE>E7Cz z8bH|)C$9NFiS673miCwXB$HIOA>yuD)DE*lzF>Poq@g=aA+rx87egVh54*0OygJ4U+Kj=RnvhOJmijADS@-)1 z!4GWbwqs%C=v+6fg_9y~ Participants ( ${count} )`; } diff --git a/public/js/RoomClient.js b/public/js/RoomClient.js index 62aa31a3..3fc1ffcf 100644 --- a/public/js/RoomClient.js +++ b/public/js/RoomClient.js @@ -18,6 +18,7 @@ const image = { locked: '../images/locked.png', mute: '../images/mute.png', hide: '../images/hide.png', + users: '../images/participants.png', youtube: '../images/youtube.png', }; @@ -1076,7 +1077,7 @@ class RoomClient { this.sound('open'); Swal.fire({ - background: swalBackground, + background: swalBg, position: 'center', title: 'Leave this room?', showDenyButton: true, @@ -2183,6 +2184,13 @@ class RoomClient { peerAction(from_peer_name, id, action, emit = true, broadcast = false) { let peer_id = id; if (emit) { + let data = { + from_peer_name: this.peer_name, + peer_id: peer_id, + action: action, + broadcast: broadcast, + }; + if (!broadcast) { if (participantsCount === 1) return; @@ -2206,36 +2214,73 @@ class RoomClient { let peerVideoButton = this.getId(peer_id + '___pVideo'); if (peerVideoButton) peerVideoButton.innerHTML = _PEER.videoOff; } + this.socket.emit('peerAction', data); } else { if (participantsCount === 1) return; - let actionButton = this.getId(action + 'AllButton'); - if (actionButton) actionButton.style.display = 'none'; - switch (action) { case 'eject': - participantsCount = 1; - refreshParticipantsCount(participantsCount); - setTimeout(() => { - getRoomParticipants(true); - }, 6000); + Swal.fire({ + background: swalBackground, + position: 'center', + imageUrl: image.users, + title: 'Eject All participants except yourself?', + showDenyButton: true, + confirmButtonText: `Yes`, + denyButtonText: `No`, + showClass: { + popup: 'animate__animated animate__fadeInDown', + }, + hideClass: { + popup: 'animate__animated animate__fadeOutUp', + }, + }).then((result) => { + if (result.isConfirmed) { + let actionButton = this.getId(action + 'AllButton'); + if (actionButton) actionButton.style.display = 'none'; + participantsCount = 1; + refreshParticipantsCount(participantsCount); + this.socket.emit('peerAction', data); + setTimeout(() => { + getRoomParticipants(true); + }, 6000); + } + }); break; case 'mute': case 'hide': - setTimeout(() => { - getRoomParticipants(true); - }, 2000); + Swal.fire({ + background: swalBackground, + position: 'center', + imageUrl: action == 'mute' ? image.mute : image.hide, + title: + action == 'mute' ? 'Mute everyone except yourself?' : 'Hide everyone except yourself?', + text: + action == 'mute' + ? "Once muted, you won't be able to unmute them, but they can unmute themselves at any time." + : "Once hided, you won't be able to unhide them, but they can unhide themselves at any time.", + showDenyButton: true, + confirmButtonText: `Yes`, + denyButtonText: `No`, + showClass: { + popup: 'animate__animated animate__fadeInDown', + }, + hideClass: { + popup: 'animate__animated animate__fadeOutUp', + }, + }).then((result) => { + if (result.isConfirmed) { + let actionButton = this.getId(action + 'AllButton'); + if (actionButton) actionButton.style.display = 'none'; + this.socket.emit('peerAction', data); + setTimeout(() => { + getRoomParticipants(true); + }, 2000); + } + }); break; } } - - let data = { - from_peer_name: this.peer_name, - peer_id: peer_id, - action: action, - broadcast: broadcast, - }; - this.socket.emit('peerAction', data); } else { switch (action) { case 'eject': diff --git a/public/view/Room.html b/public/view/Room.html index 045362ac..8d841a75 100644 --- a/public/view/Room.html +++ b/public/view/Room.html @@ -203,8 +203,7 @@ access to use this app.

About


- -
+