[mirotalk] - add support us section

This commit is contained in:
Miroslav Pejic
2025-11-10 19:41:19 +01:00
parent 00e0d9e270
commit 30197a05d6
8 changed files with 305 additions and 28 deletions
+1
View File
@@ -48,6 +48,7 @@ module.exports = {
poweredBy: true,
sponsors: true,
advertisers: true,
supportUs: true,
footer: true,
},
about: {
+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.6.29
* @version 1.6.30
*
*/
+32 -21
View File
@@ -1,17 +1,17 @@
{
"name": "mirotalk",
"version": "1.6.29",
"version": "1.6.30",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "mirotalk",
"version": "1.6.29",
"version": "1.6.30",
"license": "AGPL-3.0",
"dependencies": {
"@mattermost/client": "11.0.4",
"@ngrok/ngrok": "1.5.2",
"@sentry/node": "^10.23.0",
"@sentry/node": "^10.24.0",
"axios": "^1.13.2",
"chokidar": "^4.0.3",
"colors": "^1.4.0",
@@ -225,6 +225,7 @@
}
],
"license": "MIT",
"peer": true,
"engines": {
"node": ">=18"
},
@@ -266,6 +267,7 @@
}
],
"license": "MIT",
"peer": true,
"engines": {
"node": ">=18"
}
@@ -567,6 +569,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/api/-/api-1.9.0.tgz",
"integrity": "sha512-3giAOQvZiH5F9bMlMiv8+GSPMeqg0dbaeo58/0SlA9sxSqZhnUtxzX9/2FzyhS9sWQf5S0GJE0AKBrFqjpeYcg==",
"license": "Apache-2.0",
"peer": true,
"engines": {
"node": ">=8.0.0"
}
@@ -588,6 +591,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/context-async-hooks/-/context-async-hooks-2.2.0.tgz",
"integrity": "sha512-qRkLWiUEZNAmYapZ7KGS5C4OmBLcP/H2foXeOEaowYCR0wi89fHejrfYfbuLVCMLp/dWZXKvQusdbUEZjERfwQ==",
"license": "Apache-2.0",
"peer": true,
"engines": {
"node": "^18.19.0 || >=20.6.0"
},
@@ -600,6 +604,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.1.0.tgz",
"integrity": "sha512-RMEtHsxJs/GiHHxYT58IY57UXAQTuUnZVco6ymDEqTNlJKTimM4qPUPVe8InNFyBjhHBEAx4k3Q8LtNayBsbUQ==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"@opentelemetry/semantic-conventions": "^1.29.0"
},
@@ -615,6 +620,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/instrumentation/-/instrumentation-0.204.0.tgz",
"integrity": "sha512-vV5+WSxktzoMP8JoYWKeopChy6G3HKk4UQ2hESCRDUUTZqQ3+nM3u8noVG0LmNfRWwcFBnbZ71GKC7vaYYdJ1g==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"@opentelemetry/api-logs": "0.204.0",
"import-in-the-middle": "^1.8.1",
@@ -1007,6 +1013,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.2.0.tgz",
"integrity": "sha512-1pNQf/JazQTMA0BiO5NINUzH0cbLbbl7mntLa4aJNmCCXSj0q03T5ZXXL0zw4G55TjdL9Tz32cznGClf+8zr5A==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"@opentelemetry/core": "2.2.0",
"@opentelemetry/semantic-conventions": "^1.29.0"
@@ -1038,6 +1045,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/sdk-trace-base/-/sdk-trace-base-2.2.0.tgz",
"integrity": "sha512-xWQgL0Bmctsalg6PaXExmzdedSp3gyKV8mQBwK/j9VGdCDu2fmXIb2gAehBKbkXCpJ4HPkgv3QfoJWRT4dHWbw==",
"license": "Apache-2.0",
"peer": true,
"dependencies": {
"@opentelemetry/core": "2.2.0",
"@opentelemetry/resources": "2.2.0",
@@ -1070,6 +1078,7 @@
"resolved": "https://registry.npmjs.org/@opentelemetry/semantic-conventions/-/semantic-conventions-1.37.0.tgz",
"integrity": "sha512-JD6DerIKdJGmRp4jQyX5FlrQjA4tjOw1cvfsPAZXfOOEErMUHjPcPSICS+6WnM0nB0efSFARh0KAZss+bvExOA==",
"license": "Apache-2.0",
"peer": true,
"engines": {
"node": ">=14"
}
@@ -1161,18 +1170,18 @@
"license": "Apache-2.0"
},
"node_modules/@sentry/core": {
"version": "10.23.0",
"resolved": "https://registry.npmjs.org/@sentry/core/-/core-10.23.0.tgz",
"integrity": "sha512-4aZwu6VnSHWDplY5eFORcVymhfvS/P6BRfK81TPnG/ReELaeoykKjDwR+wC4lO7S0307Vib9JGpszjsEZw245g==",
"version": "10.24.0",
"resolved": "https://registry.npmjs.org/@sentry/core/-/core-10.24.0.tgz",
"integrity": "sha512-apJ1NtCK/Kt5uTytee+4rhhcTm4u3+z0bESH8GNMXMcuJ/A3Rvy3HUh+gqCx4BTOR0Sa44dbMvJcm/ewO+mzVg==",
"license": "MIT",
"engines": {
"node": ">=18"
}
},
"node_modules/@sentry/node": {
"version": "10.23.0",
"resolved": "https://registry.npmjs.org/@sentry/node/-/node-10.23.0.tgz",
"integrity": "sha512-5PwJJ1zZ89tB8hrjTVKNE4fIGtSXlR+Mdg2u1Nm2FJ2Vj1Ac6JArLiRzMqoq/pA7vwgZMoHwviDAA+PfpJ0Agg==",
"version": "10.24.0",
"resolved": "https://registry.npmjs.org/@sentry/node/-/node-10.24.0.tgz",
"integrity": "sha512-OsyMzemG+a1QHe9BXDduA0bL4r5dlViOpIocSL3atPNupYTxoSZqOP/wFwqTGE+M/2oIv0/VIIWoXJUd8BLUAg==",
"license": "MIT",
"dependencies": {
"@opentelemetry/api": "^1.9.0",
@@ -1205,9 +1214,9 @@
"@opentelemetry/sdk-trace-base": "^2.1.0",
"@opentelemetry/semantic-conventions": "^1.37.0",
"@prisma/instrumentation": "6.15.0",
"@sentry/core": "10.23.0",
"@sentry/node-core": "10.23.0",
"@sentry/opentelemetry": "10.23.0",
"@sentry/core": "10.24.0",
"@sentry/node-core": "10.24.0",
"@sentry/opentelemetry": "10.24.0",
"import-in-the-middle": "^1.14.2",
"minimatch": "^9.0.0"
},
@@ -1216,14 +1225,14 @@
}
},
"node_modules/@sentry/node-core": {
"version": "10.23.0",
"resolved": "https://registry.npmjs.org/@sentry/node-core/-/node-core-10.23.0.tgz",
"integrity": "sha512-3vhttO19pta7zIuecSrLoPTVN7NdjKtb/WK241H8znwKxukx3fj3M6+upN+JQtC6pERO3HfQwBpMMT9RMCUr3Q==",
"version": "10.24.0",
"resolved": "https://registry.npmjs.org/@sentry/node-core/-/node-core-10.24.0.tgz",
"integrity": "sha512-OTvJSrPstEc0NydMDpdmyYeuOcOQxZ0ZT8rmdKkrw4odYs56pYS4euMHNler8Tw9j8mZxqyI/wjzl//xGI+F0w==",
"license": "MIT",
"dependencies": {
"@apm-js-collab/tracing-hooks": "^0.3.1",
"@sentry/core": "10.23.0",
"@sentry/opentelemetry": "10.23.0",
"@sentry/core": "10.24.0",
"@sentry/opentelemetry": "10.24.0",
"import-in-the-middle": "^1.14.2"
},
"engines": {
@@ -1240,12 +1249,12 @@
}
},
"node_modules/@sentry/opentelemetry": {
"version": "10.23.0",
"resolved": "https://registry.npmjs.org/@sentry/opentelemetry/-/opentelemetry-10.23.0.tgz",
"integrity": "sha512-ZbSB5y8K8YXp5+sBp2w7xHsNLv9EglJRTRqWMi2ncovXy4jcvo+pSreiZu68nSGvxX25brYKDw19vl+tnmqZVg==",
"version": "10.24.0",
"resolved": "https://registry.npmjs.org/@sentry/opentelemetry/-/opentelemetry-10.24.0.tgz",
"integrity": "sha512-yOqeAUTnikx1eG8XMWvY4FWEU/aBp24sKlejxE0k7jmw5X2vCBd+4FUgDAwKsHwvEGOeD2XVfMqgLYjrNkm+Vg==",
"license": "MIT",
"dependencies": {
"@sentry/core": "10.23.0"
"@sentry/core": "10.24.0"
},
"engines": {
"node": ">=18"
@@ -1492,6 +1501,7 @@
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
"integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
"license": "MIT",
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@@ -2505,6 +2515,7 @@
"resolved": "https://registry.npmjs.org/express/-/express-5.1.0.tgz",
"integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
"license": "MIT",
"peer": true,
"dependencies": {
"accepts": "^2.0.0",
"body-parser": "^2.2.0",
+2 -2
View File
@@ -1,6 +1,6 @@
{
"name": "mirotalk",
"version": "1.6.29",
"version": "1.6.30",
"description": "A free WebRTC browser-based video call",
"main": "server.js",
"scripts": {
@@ -43,7 +43,7 @@
"dependencies": {
"@mattermost/client": "11.0.4",
"@ngrok/ngrok": "1.5.2",
"@sentry/node": "^10.23.0",
"@sentry/node": "^10.24.0",
"axios": "^1.13.2",
"chokidar": "^4.0.3",
"colors": "^1.4.0",
+140
View File
@@ -3844,3 +3844,143 @@ img.has-shadow {
text-align: center;
justify-content: center;
} */
/*--------------------------------------------------------------
# Support Section
--------------------------------------------------------------*/
#supportUs .cta-inner {
background: linear-gradient(135deg, rgba(0, 0, 0, 0.95) 60%, rgba(70, 120, 249, 0.25) 100%);
}
.support-us-content {
text-align: center;
padding: 32px 24px;
}
.support-icon {
margin-bottom: 24px;
}
.support-icon .fa-heart {
font-size: 48px;
color: #ff4757;
filter: drop-shadow(0 4px 8px rgba(255, 71, 87, 0.3));
}
@keyframes heartbeat {
0%,
100% {
transform: scale(1);
}
10%,
30% {
transform: scale(0.9);
}
20%,
40%,
60%,
80% {
transform: scale(1.1);
}
50%,
70% {
transform: scale(1.05);
}
}
.heartbeat {
animation: heartbeat 1.5s ease-in-out infinite;
}
.support-options {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
max-width: 900px;
margin: 0 auto;
}
.support-card {
display: flex;
flex-direction: column;
align-items: center;
padding: 24px 16px;
background: rgba(255, 255, 255, 0.05);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
text-decoration: none;
color: inherit;
transition: all 0.3s ease;
}
.support-card:hover {
background: rgba(30, 30, 40, 0.8);
border-color: rgba(255, 255, 255, 0.2);
transform: translateY(-4px);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}
.support-card-icon {
margin-bottom: 12px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.08);
border-radius: 50%;
transition: all 0.3s ease;
}
.support-card:hover .support-card-icon {
background: rgba(255, 255, 255, 0.15);
transform: scale(1.1);
}
.support-card-title-small {
margin: 0 0 8px 0;
font-size: 16px;
font-weight: 600;
color: #fff;
}
.support-card-description-small {
margin: 0;
font-size: 13px;
color: rgba(255, 255, 255, 0.7);
text-align: center;
}
.support-footer {
margin-top: 32px;
padding-top: 24px;
border-top: 1px solid rgba(70, 120, 249, 0.2);
}
@media (max-width: 768px) {
.support-options {
grid-template-columns: repeat(2, 1fr);
gap: 16px;
}
}
@media (max-width: 480px) {
.support-options {
grid-template-columns: 1fr;
gap: 16px;
}
.support-icon .fa-heart {
font-size: 36px;
}
.support-us-content {
padding: 24px 16px;
}
.support-card {
padding: 24px 16px;
min-height: 140px;
}
}
+27 -2
View File
@@ -32,6 +32,7 @@ const tryEasier = document.getElementById('tryEasier');
const poweredBy = document.getElementById('poweredBy');
const sponsors = document.getElementById('sponsors');
const advertisers = document.getElementById('advertisers');
const supportUs = document.getElementById('supportUs');
const footer = document.getElementById('footer');
//...
@@ -71,11 +72,12 @@ let brand = {
poweredBy: true,
sponsors: true,
advertisers: true,
supportUs: true,
footer: true,
},
about: {
imageUrl: '../images/mirotalk-logo.gif',
title: 'WebRTC P2P v1.6.29',
title: 'WebRTC P2P v1.6.30',
html: `
<button
id="support-button"
@@ -182,10 +184,32 @@ async function getBrand() {
* @param {object} data
*/
function setBrand(data) {
brand = data;
brand = mergeBrand(brand, data);
console.log('Set Brand done');
}
/**
* Deep merge two objects
* @param {object} target target object
* @param {object} source source object
* @returns {object} merged object
*/
function mergeBrand(target, source) {
if (typeof target !== 'object' || target === null) return source;
if (typeof source !== 'object' || source === null) return source;
const output = Array.isArray(target) ? target.slice() : { ...target };
for (const key of Object.keys(source)) {
const srcVal = source[key];
const tgtVal = output[key];
if (srcVal && typeof srcVal === 'object' && !Array.isArray(srcVal)) {
output[key] = mergeConfig(tgtVal || {}, srcVal);
} else {
output[key] = srcVal;
}
}
return output;
}
/**
* Handle Brand
*/
@@ -225,6 +249,7 @@ function handleBrand() {
[poweredBy, brand.html?.poweredBy],
[sponsors, brand.html?.sponsors],
[advertisers, brand.html?.advertisers],
[supportUs, brand.html?.supportUs],
[footer, brand.html?.footer],
]);
}
+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.6.29
* @version 1.6.30
*
*/
@@ -12256,7 +12256,7 @@ function showAbout() {
Swal.fire({
background: swBg,
position: 'center',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.29',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.6.30',
imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
customClass: { image: 'img-about' },
html: `
+100
View File
@@ -703,6 +703,106 @@
</div>
</div>
</section>
<section id="supportUs" class="cta section mt-24 mb-24">
<div class="container">
<div class="cta-inner section-inner br-12 has-animations">
<div class="support-us-content">
<div class="support-icon">
<i class="fas fa-heart heartbeat"></i>
</div>
<h2 class="section-title mt-0">Support MiroTalk P2P</h2>
<p class="section-paragraph mt-16">
MiroTalk P2P is a free, open-source project under AGPLv3 license. Your support helps
us maintain servers, add new features, and keep the service free for everyone. Every
contribution matters!
</p>
<!-- Support Options -->
<div class="support-options mt-24">
<!-- CodeCanyon -->
<a
href="https://codecanyon.net/user/miroslavpejic85"
target="_blank"
class="support-card reveal-from-bottom"
data-reveal-delay="150"
>
<div class="support-card-icon">
<svg height="28" width="28" viewBox="0 0 24 24" fill="#82B541">
<path
d="M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm5.5 16.5h-11v-9h11v9z"
/>
</svg>
</div>
<h5 class="support-card-title-small">CodeCanyon</h5>
<p class="support-card-description-small">Buy commercial license</p>
</a>
<!-- PayPal -->
<a
href="https://www.paypal.com/donate/?hosted_button_id=TW833WU7EUPHJ"
target="_blank"
class="support-card reveal-from-bottom"
data-reveal-delay="200"
>
<div class="support-card-icon">
<svg height="28" width="28" viewBox="0 0 24 24" fill="#00457C">
<path
d="M7.076 21.337H2.47a.641.641 0 0 1-.633-.74L4.944.901C5.026.382 5.474 0 5.998 0h7.46c2.57 0 4.578.543 5.69 1.81 1.01 1.15 1.304 2.42 1.012 4.287-.023.143-.047.288-.077.437-.983 5.05-4.349 6.797-8.647 6.797h-2.19c-.524 0-.968.382-1.05.9l-1.12 7.106zm14.146-14.42a3.35 3.35 0 0 0-.607-.541c-.013.076-.026.175-.041.254-.93 4.778-4.005 7.201-9.138 7.201h-2.19a.563.563 0 0 0-.556.479l-1.187 7.527h-.506l-.24 1.516a.56.56 0 0 0 .554.647h3.882c.46 0 .85-.334.922-.788.06-.26.76-4.852.76-4.852a.932.932 0 0 1 .923-.788h.58c3.76 0 6.705-1.528 7.565-5.946.36-1.847.174-3.388-.746-4.46z"
/>
</svg>
</div>
<h5 class="support-card-title-small">PayPal</h5>
<p class="support-card-description-small">One-time donation</p>
</a>
<!-- Stripe -->
<a
href="https://buy.stripe.com/9B614m93Lg4L4Ag3Eabsc02"
target="_blank"
class="support-card reveal-from-bottom"
data-reveal-delay="250"
>
<div class="support-card-icon">
<svg height="28" width="28" viewBox="0 0 24 24" fill="#635BFF">
<path
d="M13.976 9.15c-2.172-.806-3.356-1.426-3.356-2.409 0-.831.683-1.305 1.901-1.305 2.227 0 4.515.858 6.09 1.631l.89-5.494C18.252.975 15.697 0 12.165 0 9.667 0 7.589.654 6.104 1.872 4.56 3.147 3.757 4.992 3.757 7.218c0 4.039 2.467 5.76 6.476 7.219 2.585.92 3.445 1.574 3.445 2.583 0 .98-.84 1.545-2.354 1.545-1.875 0-4.965-.921-6.99-2.109l-.9 5.555C5.175 22.99 8.385 24 11.714 24c2.641 0 4.843-.624 6.328-1.813 1.664-1.305 2.525-3.236 2.525-5.732 0-4.128-2.524-5.851-6.594-7.305h.003z"
/>
</svg>
</div>
<h5 class="support-card-title-small">Stripe</h5>
<p class="support-card-description-small">Donate via credit card</p>
</a>
<!-- GitHub Sponsors -->
<a
href="https://github.com/sponsors/miroslavpejic85"
target="_blank"
class="support-card reveal-from-bottom"
data-reveal-delay="300"
>
<div class="support-card-icon">
<svg height="28" width="28" viewBox="0 0 16 16" fill="#ffffff">
<path
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"
/>
</svg>
</div>
<h5 class="support-card-title-small">GitHub Sponsors</h5>
<p class="support-card-description-small">Monthly recurring donation</p>
</a>
</div>
<div class="support-footer">
<p class="text-sm mb-0">
<strong>Other ways to help:</strong> Star us on GitHub ⭐, spread the word 📢,
or contribute code 💻
</p>
</div>
</div>
</div>
</div>
</section>
</main>
<footer id="footer" class="site-footer center-content-mobile">