mirror of
https://github.com/simplex-chat/simplex-chat.git
synced 2026-09-10 15:58:28 +00:00
deploy: e8fd58bc59
This commit is contained in:
@@ -281,6 +281,7 @@ main .section-bg {
|
||||
|
||||
.register-card input[type="submit"] {
|
||||
height: 52px;
|
||||
min-width: 164px;
|
||||
padding: 0 34px;
|
||||
border: none;
|
||||
border-radius: 9999px;
|
||||
@@ -297,6 +298,16 @@ main .section-bg {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.register-card .register-note {
|
||||
margin-top: 10px;
|
||||
font-size: 16px;
|
||||
color: #6b7478;
|
||||
}
|
||||
|
||||
.dark .register-card .register-note {
|
||||
color: #9fb2c9;
|
||||
}
|
||||
|
||||
.register-card .channel-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -344,3 +355,34 @@ main .section-bg {
|
||||
.dark .register-card .close-register svg {
|
||||
fill: #ffffff;
|
||||
}
|
||||
|
||||
.mc-frame {
|
||||
position: absolute;
|
||||
left: -5000px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.mc-frame-card {
|
||||
max-width: 640px;
|
||||
padding: 44px 0 0;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.dark .mc-frame-card {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.mc-frame-card .close-register svg,
|
||||
.dark .mc-frame-card .close-register svg {
|
||||
fill: #023789;
|
||||
}
|
||||
|
||||
#subscribe-failed.open .mc-frame {
|
||||
position: static;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: min(520px, calc(100svh - 140px));
|
||||
}
|
||||
|
||||
+8
-1
@@ -79,7 +79,14 @@ function setupRegisterOverlay() {
|
||||
}
|
||||
|
||||
openBtn.addEventListener('click', openOverlay);
|
||||
form.addEventListener('submit', closeOverlay);
|
||||
form.addEventListener('submit', () => {
|
||||
const submit = form.querySelector('[type="submit"]');
|
||||
if (!submit) return;
|
||||
setTimeout(() => {
|
||||
submit.disabled = true;
|
||||
submit.value = 'Submitting...';
|
||||
}, 0);
|
||||
});
|
||||
overlay.addEventListener('click', (e) => {
|
||||
if (e.target === overlay || e.target.closest('.close-register')) closeOverlay();
|
||||
});
|
||||
|
||||
@@ -576,6 +576,42 @@ window.addEventListener('click',(e)=>{
|
||||
|
||||
<a class="channel-link" href="https://simplex.chat/crowdfunding-news/" target="_blank" rel="noopener">Or join our SimpleX Crowdfunding News channel<svg viewBox="0 0 100 100" aria-hidden="true"><path d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a>
|
||||
|
||||
<p class="register-note">We use Mailchimp to deliver updates via email</p>
|
||||
|
||||
<button type="button" class="close-register" aria-label="Close">
|
||||
<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="subscribed" class="register-overlay">
|
||||
<div class="register-card" role="dialog" aria-labelledby="subscribed-title">
|
||||
<h2 id="subscribed-title">Thank you for subscribing</h2>
|
||||
<p>Please confirm your subscription by clicking the link in the email we just sent you.</p>
|
||||
<button type="button" class="close-register" aria-label="Close">
|
||||
<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="already-subscribed" class="register-overlay">
|
||||
<div class="register-card" role="dialog" aria-labelledby="already-subscribed-title">
|
||||
<h2 id="already-subscribed-title">You are already subscribed</h2>
|
||||
<p>This address is on our list — we will send you the updates about the event.</p>
|
||||
<button type="button" class="close-register" aria-label="Close">
|
||||
<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="subscribe-failed" class="register-overlay">
|
||||
<div class="register-card mc-frame-card mc-frame-host" role="dialog" aria-label="Subscription result">
|
||||
<button type="button" class="close-register" aria-label="Close">
|
||||
<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12.7973 11.5525L7.59762 6.49833L12.7947 1.44675C13.055 1.19371 13.0658 0.771991 12.8188 0.505331C12.5718 0.238674 12.1602 0.227644 11.8999 0.480681L6.65343 5.58028L1.09979 0.182228C0.839522 -0.070157 0.427909 -0.059127 0.18094 0.207531C-0.0660305 0.474191 -0.0552645 0.895911 0.205003 1.14894L5.70862 6.49833L0.20247 11.851C-0.0577975 12.104 -0.0685635 12.5257 0.178407 12.7924C0.306324 12.9306 0.477936 13 0.650181 13C0.811033 13 0.971873 12.9397 1.09726 12.817L6.65343 7.41639L11.9025 12.5186C12.0285 12.6406 12.1893 12.7015 12.3495 12.7015C12.5218 12.7015 12.6934 12.6321 12.8213 12.4939C13.0689 12.2273 13.0582 11.8062 12.7973 11.5525Z"/>
|
||||
@@ -585,6 +621,126 @@ window.addEventListener('click',(e)=>{
|
||||
</div>
|
||||
|
||||
<script src="/js/livestream.js"></script>
|
||||
<script>(function () {
|
||||
var LANDINGS = [
|
||||
{ path: '/subscribe/thankyou', status: 'subscribed' },
|
||||
{ path: '/subscribe/confirmed', status: 'confirmed' }
|
||||
];
|
||||
var MESSAGES = {
|
||||
'mc:subscribed': 'subscribed',
|
||||
'mc:confirmed': 'confirmed',
|
||||
'mc:failed': 'failed'
|
||||
};
|
||||
var TIMEOUT = 12000;
|
||||
var REDIRECT_GRACE = 5000;
|
||||
|
||||
function init() {
|
||||
var forms = document.querySelectorAll('form[action*="list-manage.com"]');
|
||||
if (!forms.length) return;
|
||||
|
||||
var frame = document.createElement('iframe');
|
||||
frame.name = 'mc-target';
|
||||
frame.title = 'Subscription result';
|
||||
frame.className = 'mc-frame';
|
||||
(document.querySelector('.mc-frame-host') || document.body).appendChild(frame);
|
||||
|
||||
var pending = false;
|
||||
var timer = null;
|
||||
|
||||
function done(status) {
|
||||
if (!pending) return;
|
||||
pending = false;
|
||||
clearTimeout(timer);
|
||||
document.dispatchEvent(new CustomEvent('mc:result', {
|
||||
detail: { ok: status !== 'failed', status: status }
|
||||
}));
|
||||
}
|
||||
|
||||
function landedStatus() {
|
||||
var path;
|
||||
try {
|
||||
path = frame.contentWindow.location.pathname;
|
||||
} catch (e) {
|
||||
return null;
|
||||
}
|
||||
for (var i = 0; i < LANDINGS.length; i++) {
|
||||
if (path.indexOf(LANDINGS[i].path) === 0) return LANDINGS[i].status;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
window.addEventListener('message', function (e) {
|
||||
if (!pending || e.source !== frame.contentWindow) return;
|
||||
var status = MESSAGES[e.data];
|
||||
if (status) done(status);
|
||||
});
|
||||
|
||||
frame.addEventListener('load', function () {
|
||||
if (!pending) return;
|
||||
var status = landedStatus();
|
||||
if (status) {
|
||||
done(status);
|
||||
return;
|
||||
}
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(function () { done('failed'); }, REDIRECT_GRACE);
|
||||
});
|
||||
|
||||
forms.forEach(function (form) {
|
||||
form.target = 'mc-target';
|
||||
form.addEventListener('submit', function () {
|
||||
pending = true;
|
||||
clearTimeout(timer);
|
||||
timer = setTimeout(function () { done('failed'); }, TIMEOUT);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', init);
|
||||
} else {
|
||||
init();
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
|
||||
<script>
|
||||
(function livestreamSubscribe() {
|
||||
var register = document.getElementById('register');
|
||||
var byStatus = {
|
||||
subscribed: document.getElementById('subscribed'),
|
||||
confirmed: document.getElementById('already-subscribed'),
|
||||
failed: document.getElementById('subscribe-failed')
|
||||
};
|
||||
var results = Object.keys(byStatus).map(function (k) { return byStatus[k]; });
|
||||
|
||||
function close(overlay) {
|
||||
overlay.classList.remove('open');
|
||||
document.documentElement.classList.remove('lock-scroll');
|
||||
}
|
||||
|
||||
document.addEventListener('mc:result', function (e) {
|
||||
var submit = register.querySelector('[type="submit"]');
|
||||
if (submit) {
|
||||
submit.disabled = false;
|
||||
submit.value = 'Register';
|
||||
}
|
||||
register.classList.remove('open');
|
||||
(byStatus[e.detail.status] || byStatus.failed).classList.add('open');
|
||||
document.documentElement.classList.add('lock-scroll');
|
||||
});
|
||||
|
||||
results.forEach(function (overlay) {
|
||||
overlay.addEventListener('click', function (e) {
|
||||
if (e.target === overlay || e.target.closest('.close-register')) close(overlay);
|
||||
});
|
||||
});
|
||||
|
||||
document.addEventListener('keydown', function (e) {
|
||||
if (e.key === 'Escape') results.forEach(close);
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user