[mirotalk] #240 - move participant dropdown menu inside msger-chat-item row

This commit is contained in:
Miroslav Pejic
2026-04-02 08:37:01 +02:00
parent 8ec6d686b5
commit 7368d2f43d
8 changed files with 37 additions and 33 deletions
+1 -1
View File
@@ -1,5 +1,5 @@
# ====================================================
# MiroTalk P2P v.1.7.85 - Environment Configuration
# MiroTalk P2P v.1.7.86 - Environment Configuration
# ====================================================
# App environment
+1 -1
View File
@@ -2,7 +2,7 @@
/**
* ==============================================
* MiroTalk P2P v.1.7.85 - Configuration File
* MiroTalk P2P v.1.7.86 - Configuration File
* ==============================================
*
* This file is the central configuration source.
+1 -1
View File
@@ -45,7 +45,7 @@ dependencies: {
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.7.85
* @version 1.7.86
*
*/
+6 -6
View File
@@ -1,12 +1,12 @@
{
"name": "mirotalk",
"version": "1.7.85",
"version": "1.7.86",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "mirotalk",
"version": "1.7.85",
"version": "1.7.86",
"license": "AGPL-3.0",
"dependencies": {
"@mattermost/client": "11.5.0",
@@ -19,7 +19,7 @@
"cors": "^2.8.6",
"crypto-js": "^4.2.0",
"dompurify": "^3.3.3",
"dotenv": "^17.3.1",
"dotenv": "^17.4.0",
"express": "^5.2.1",
"express-openid-connect": "^2.20.1",
"express-rate-limit": "^8.3.2",
@@ -2538,9 +2538,9 @@
}
},
"node_modules/dotenv": {
"version": "17.3.1",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.3.1.tgz",
"integrity": "sha512-IO8C/dzEb6O3F9/twg6ZLXz164a2fhTnEWb95H23Dm4OuN+92NmEAlTrupP9VW6Jm3sO26tQlqyvyi4CsnY9GA==",
"version": "17.4.0",
"resolved": "https://registry.npmjs.org/dotenv/-/dotenv-17.4.0.tgz",
"integrity": "sha512-kCKF62fwtzwYm0IGBNjRUjtJgMfGapII+FslMHIjMR5KTnwEmBmWLDRSnc3XSNP8bNy34tekgQyDT0hr7pERRQ==",
"license": "BSD-2-Clause",
"engines": {
"node": ">=12"
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "mirotalk",
"version": "1.7.85",
"version": "1.7.86",
"description": "A free WebRTC browser-based video call",
"main": "server.js",
"scripts": {
@@ -54,7 +54,7 @@
"cors": "^2.8.6",
"crypto-js": "^4.2.0",
"dompurify": "^3.3.3",
"dotenv": "^17.3.1",
"dotenv": "^17.4.0",
"express": "^5.2.1",
"express-openid-connect": "^2.20.1",
"express-rate-limit": "^8.3.2",
+4 -2
View File
@@ -1208,13 +1208,14 @@ body {
.msger-private-chat-entry {
display: flex;
align-items: center;
gap: 8px;
min-width: 0;
position: relative;
}
.msger-private-chat-entry .msger-chat-item {
flex: 1;
cursor: pointer;
position: relative;
}
.msger-private-chat-entry .dropdown-menu-custom {
@@ -1228,6 +1229,7 @@ body {
height: 40px;
flex-shrink: 0;
overflow: visible;
margin-left: auto;
}
.msger-private-chat-entry .dropdown-toggle {
@@ -1238,7 +1240,7 @@ body {
height: 40px;
padding: 0;
border-radius: 12px;
background: var(--body-bg);
background: transparent;
}
.msger-private-chat-entry .msger-participant-dropdown-menu .app-dropdown-action {
+1 -1
View File
@@ -107,7 +107,7 @@ let brand = {
},
about: {
imageUrl: '../images/mirotalk-logo.gif',
title: 'WebRTC P2P v1.7.85',
title: 'WebRTC P2P v1.7.86',
html: `
<button
id="support-button"
+21 -19
View File
@@ -15,7 +15,7 @@
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.7.85
* @version 1.7.86
*
*/
@@ -10504,11 +10504,12 @@ function ensureChatGPTConversationEntry() {
const chatGPTEntry = `
<div id="${CHAT_GPT_PEER_ID}_pMsgDiv" class="msger-private-chat-entry" data-peer-name="${CHAT_GPT_NAME.toLowerCase()}">
<button
<div
id="${CHAT_GPT_PEER_ID}_pMsgBtn"
class="msger-chat-item"
type="button"
value="${CHAT_GPT_NAME}"
role="button"
tabindex="0"
data-value="${CHAT_GPT_NAME}"
data-peer-id="${CHAT_GPT_PEER_ID}"
title="${CHAT_GPT_NAME}"
>
@@ -10523,7 +10524,7 @@ function ensureChatGPTConversationEntry() {
<small>Ask anything</small>
</span>
<span id="${CHAT_GPT_PEER_ID}_pMsgBadge" class="msger-chat-unread-badge hidden">0</span>
</button>
</div>
</div>
`;
@@ -10870,21 +10871,21 @@ async function msgerAddPeers(peers) {
const msgerPrivateDiv = `
<div id="${peer_id}_pMsgDiv" class="msger-private-chat-entry" data-peer-name="${peer_name.toLowerCase()}">
<button id="${peer_id}_pMsgBtn" class="msger-chat-item" type="button" value="${peer_name}" data-peer-id="${peer_id}" title="${peer_name}">
<div id="${peer_id}_pMsgBtn" class="msger-chat-item" role="button" tabindex="0" data-value="${peer_name}" data-peer-id="${peer_id}" title="${peer_name}">
<img id="${peer_id}_pMsgAvatar" class="msger-chat-avatar" src="${chatAvatar}" alt="${peer_name}" />
<span class="msger-chat-item-copy">
<strong>${peer_name}</strong>
<small>Open private conversation</small>
</span>
<span id="${peer_id}_pMsgBadge" class="msger-chat-unread-badge hidden">0</span>
</button>
<div id="${peer_id}_pDropdownMenu" class="dropdown-menu-custom msger-participant-dropdown">
<button id="${peer_id}_pDropdownToggle" class="dropdown-toggle" type="button">
<i class="fas fa-ellipsis-vertical"></i>
</button>
<ul id="${peer_id}_pDropdownMenuList" class="dropdown-menu-custom-list app-dropdown-menu msger-participant-dropdown-menu">
${dropdownOptions}
</ul>
<div id="${peer_id}_pDropdownMenu" class="dropdown-menu-custom msger-participant-dropdown">
<button id="${peer_id}_pDropdownToggle" class="dropdown-toggle" type="button">
<i class="fas fa-ellipsis-vertical"></i>
</button>
<ul id="${peer_id}_pDropdownMenuList" class="dropdown-menu-custom-list app-dropdown-menu msger-participant-dropdown-menu">
${dropdownOptions}
</ul>
</div>
</div>
</div>
`;
@@ -11014,12 +11015,13 @@ function addMsgerPrivateBtn(
// Send private message button
msgerPrivateBtn.addEventListener('click', (e) => {
e.preventDefault();
if (e.target.closest('.dropdown-menu-custom')) return;
if (msgerPrivateMsgInput) {
sendPrivateMessage();
return;
}
const selectedPeerId = msgerPrivateBtn.dataset.peerId || peerId;
setActiveConversation('private', msgerPrivateBtn.value, selectedPeerId);
setActiveConversation('private', msgerPrivateBtn.dataset.value, selectedPeerId);
msgerDraggable.classList.remove('msger-pinned-sidebar-open');
if (shouldDockParticipantsPanel()) {
msgerCPBtn.classList.remove('active');
@@ -11053,16 +11055,16 @@ function addMsgerPrivateBtn(
return;
}
// sanitization to prevent XSS
msgerPrivateBtn.value = filterXSS(msgerPrivateBtn.value);
msgerPrivateBtn.dataset.value = filterXSS(msgerPrivateBtn.dataset.value);
myPeerName = filterXSS(myPeerName);
if (isHtml(myPeerName) && isHtml(msgerPrivateBtn.value)) {
if (isHtml(myPeerName) && isHtml(msgerPrivateBtn.dataset.value)) {
msgerPrivateMsgInput.value = '';
isChatPasteTxt = false;
return;
}
const toPeerName = msgerPrivateBtn.value;
const toPeerName = msgerPrivateBtn.dataset.value;
emitMsg(myPeerName, myPeerAvatar, toPeerName, pMsg, true, myPeerId);
appendMessage(myPeerName, rightChatAvatar, 'right', pMsg, true, null, toPeerName);
msgerPrivateMsgInput.value = '';
@@ -14762,7 +14764,7 @@ function showAbout() {
Swal.fire({
background: swBg,
position: 'center',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.7.85',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.7.86',
imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
customClass: { image: 'img-about' },
html: `