aheh/mirotalk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[mirotalk] - improve UI - add empty-state icon for participants panel, update dep

Browse Source
This commit is contained in:
Miroslav Pejic
2026-04-20 13:26:52 +02:00
parent b17212e9c3
commit 13cbe0562d
9 changed files with 53 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.template
+1 -1
View File
@@ -1,5 +1,5 @@
# ====================================================
# MiroTalk P2P v.1.8.06 - Environment Configuration
# MiroTalk P2P v.1.8.07 - Environment Configuration
# ====================================================
# App environment
app/src/config.template.js
+1 -1
View File
@@ -2,7 +2,7 @@
/**
* ==============================================
* MiroTalk P2P v.1.8.06 - Configuration File
* MiroTalk P2P v.1.8.07 - Configuration File
* ==============================================
*
* This file is the central configuration source.
app/src/server.js
+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.8.06
* @version 1.8.07
*
*/
package-lock.json
Generated
+10 -10
View File
@@ -1,18 +1,18 @@
{
"name": "mirotalk",
"version": "1.8.06",
"version": "1.8.07",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "mirotalk",
"version": "1.8.06",
"version": "1.8.07",
"license": "AGPL-3.0",
"dependencies": {
"@mattermost/client": "11.6.0",
"@ngrok/ngrok": "1.7.0",
"@sentry/node": "^10.49.0",
"axios": "^1.15.0",
"axios": "^1.15.1",
"chokidar": "^5.0.0",
"colors": "^1.4.0",
"compression": "^1.8.1",
@@ -34,7 +34,7 @@
"qs": "^6.15.1",
"socket.io": "^4.8.3",
"swagger-ui-express": "^5.0.1",
"uuid": "13.0.0"
"uuid": "14.0.0"
},
"devDependencies": {
"mocha": "^11.7.5",
@@ -1725,9 +1725,9 @@
}
},
"node_modules/axios": {
"version": "1.15.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.15.0.tgz",
"integrity": "sha512-wWyJDlAatxk30ZJer+GeCWS209sA42X+N5jU2jy6oHTp7ufw8uzUTVFBX9+wTfAlhiJXGS0Bq7X6efruWjuK9Q==",
"version": "1.15.1",
"resolved": "https://registry.npmjs.org/axios/-/axios-1.15.1.tgz",
"integrity": "sha512-WOG+Jj8ZOvR0a3rAn+Tuf1UQJRxw5venr6DgdbJzngJE3qG7X0kL83CZGpdHMxEm+ZK3seAbvFsw4FfOfP9vxg==",
"license": "MIT",
"dependencies": {
"follow-redirects": "^1.15.11",
@@ -6767,9 +6767,9 @@
}
},
"node_modules/uuid": {
"version": "13.0.0",
"resolved": "https://registry.npmjs.org/uuid/-/uuid-13.0.0.tgz",
"integrity": "sha512-XQegIaBTVUjSHliKqcnFqYypAd4S+WCYt5NIeRs6w/UAry7z8Y9j5ZwRRL4kzq9U3sD6v+85er9FvkEaBpji2w==",
"version": "14.0.0",
"resolved": "https://registry.npmjs.org/uuid/-/uuid-14.0.0.tgz",
"integrity": "sha512-Qo+uWgilfSmAhXCMav1uYFynlQO7fMFiMVZsQqZRMIXp0O7rR7qjkj+cPvBHLgBqi960QCoo/PH2/6ZtVqKvrg==",
"funding": [
"https://github.com/sponsors/broofa",
"https://github.com/sponsors/ctavan"
package.json
+3 -3
View File
@@ -1,6 +1,6 @@
{
"name": "mirotalk",
"version": "1.8.06",
"version": "1.8.07",
"description": "A free WebRTC browser-based video call",
"main": "server.js",
"scripts": {
@@ -47,7 +47,7 @@
"@mattermost/client": "11.6.0",
"@ngrok/ngrok": "1.7.0",
"@sentry/node": "^10.49.0",
"axios": "^1.15.0",
"axios": "^1.15.1",
"chokidar": "^5.0.0",
"colors": "^1.4.0",
"compression": "^1.8.1",
@@ -69,7 +69,7 @@
"qs": "^6.15.1",
"socket.io": "^4.8.3",
"swagger-ui-express": "^5.0.1",
"uuid": "13.0.0"
"uuid": "14.0.0"
},
"devDependencies": {
"mocha": "^11.7.5",
public/css/client.css
+16 -3
View File
@@ -1103,15 +1103,28 @@ body {
}
.msger-sidebar-empty {
padding: 12px 14px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 8px;
padding: 20px 16px;
border: var(--border);
border-radius: 16px;
font-size: 0.9rem;
font-size: 0.85rem;
line-height: 1.5;
color: rgba(214, 234, 238, 0.72);
color: rgba(214, 234, 238, 0.5);
background: var(--body-bg);
}
.msger-sidebar-empty-icon {
width: 36px;
height: 36px;
flex-shrink: 0;
opacity: 0.4;
}
.msger-chat-list {
display: flex;
flex-direction: column;
public/js/brand.js
+1 -1
View File
@@ -109,7 +109,7 @@ let brand = {
},
about: {
imageUrl: '../images/mirotalk-logo.gif',
title: 'WebRTC P2P v1.8.06',
title: 'WebRTC P2P v1.8.07',
html: `
<button
id="support-button"
public/js/client.js
+2 -2
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.8.06
* @version 1.8.07
*
*/
@@ -15002,7 +15002,7 @@ function showAbout() {
Swal.fire({
background: swBg,
position: 'center',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.06',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.07',
imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
customClass: { image: 'img-about' },
html: `
public/views/client.html
+18 -1
View File
@@ -421,7 +421,24 @@ access to use this app.
</label>
</div>
<div id="msgerPrivateChatsEmpty" class="msger-sidebar-empty">
Participants will appear here when other people join the room.
<svg
class="msger-sidebar-empty-icon"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
>
<circle cx="12" cy="7" r="3" />
<path d="M5.5 21c0-3.59 2.91-6.5 6.5-6.5s6.5 2.91 6.5 6.5" />
<circle cx="4" cy="11" r="2" />
<path d="M1 21c0-2.21 1.34-4 3-4" />
<circle cx="20" cy="11" r="2" />
<path d="M23 21c0-2.21-1.34-4-3-4" />
</svg>
<span>Participants will appear here when other people join the room.</span>
</div>
<div id="msgerCPList" class="msger-chat-list msger-private-chat-list"></div>
</section>