add contact form
This commit is contained in:
parent
d8e54c179d
commit
4b44632f2e
|
@ -67,20 +67,52 @@ TCP
|
|||
# Run ssh with (your domain, no port):
|
||||
ssh lucky-duck-42.telebit.cloud</code></pre>
|
||||
|
||||
<center>
|
||||
<p><footer>
|
||||
<h3>
|
||||
<li><a href="https://git.coolaj86.com/coolaj86/telebit.js" target="_blank">Read the Telebit docs</a></li>
|
||||
<li><a href="https://git.coolaj86.com/coolaj86/telebitd.js" target="_blank">Host your own Telebit Relay</a></li>
|
||||
</h3>
|
||||
|
||||
|
||||
<div class="alert alert-info js-list-thanks hidden" hidden>Thanks! We'll be in touch.</div>
|
||||
<div id="next">
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<form class="js-list-form">
|
||||
<div class="alert alert-info">
|
||||
<h2>Want to follow our progress?</h2>
|
||||
<div class="form-group">
|
||||
<label>Your name</label>
|
||||
<input class="js-list-comment form-control" placeholder="ex: John Doe" />
|
||||
<br>
|
||||
<small class="form-text text-muted">(optional, so we know what to call you other than <em>rubybelle99@gmail.com</em> or whatever...)</small>
|
||||
</div>
|
||||
<br>
|
||||
<div class="form-group">
|
||||
<label>Your email</label>
|
||||
<input class="js-list-address form-control" type="email" placeholder="ex: john@email.com" />
|
||||
<br>
|
||||
<small class="form-text text-muted">(non-optional, otherwise this doesn't even make any sense)</small>
|
||||
</div>
|
||||
<br>
|
||||
<div class="form-group">
|
||||
<button class="js-list-submit btn btn-primary form-control" type="button">Join us!</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<br>
|
||||
<br>
|
||||
|
||||
<center>
|
||||
<li>©2018 AJ ONeal</li>
|
||||
<li><a href="https://git.coolaj86.com/coolaj86/telebit.js" target="_blank">git</a></li>
|
||||
<li><a href="/legal/" target="_blank">License</a></li>
|
||||
<li><a href="/legal/" target="_blank">Terms</a></li>
|
||||
<li><a href="/legal/" target="_blank">Privacy</a></li>
|
||||
</footer></p>
|
||||
</center>
|
||||
</footer></p>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
@ -3,4 +3,61 @@
|
|||
|
||||
document.body.hidden = false;
|
||||
|
||||
function formSubmit() {
|
||||
var msg = {
|
||||
address: document.querySelector('.js-list-address').value
|
||||
, comment: 'telebit.cloud: ' + (document.querySelector('.js-list-comment').value || '')
|
||||
};
|
||||
|
||||
window.fetch('https://api.ppl.family/api/ppl.family/public/list', {
|
||||
method: 'POST'
|
||||
, cors: true
|
||||
, headers: new Headers({ 'Content-Type': 'application/json' })
|
||||
, body: JSON.stringify(msg)
|
||||
}).then(function (resp) {
|
||||
return resp.json().then(function (data) {
|
||||
if (data.error) {
|
||||
window.alert("Couldn't save your message. Email coolaj86@gmail.com instead.");
|
||||
return;
|
||||
}
|
||||
document.querySelector('.js-list-form').hidden = true;
|
||||
document.querySelector('.js-list-form').className += ' hidden';
|
||||
document.querySelector('.js-list-thanks').hidden = false;
|
||||
document.querySelector('.js-list-thanks').className = document.querySelector('.js-list-thanks').className.replace(/\s*hidden\b/, '');
|
||||
}, function () {
|
||||
window.alert("Couldn't save your message. Email coolaj86@gmail.com instead.");
|
||||
});
|
||||
}, function () {
|
||||
window.alert("Didn't get your message. Bad network connection? Email coolaj86@gmail.com instead.");
|
||||
});
|
||||
}
|
||||
document.body.addEventListener('submit', function (ev) {
|
||||
if (ev.target.matches('.js-list-form')) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
formSubmit();
|
||||
return;
|
||||
}
|
||||
});
|
||||
document.body.addEventListener('click', function (ev) {
|
||||
if (ev.target.matches('.js-list-submit')) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
formSubmit();
|
||||
return;
|
||||
}
|
||||
/*
|
||||
if (ev.target.closest('.js-navbar-toggle')) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
if (/show/.test(document.querySelector('.js-navbar-collapse').className)) {
|
||||
document.querySelector('.js-navbar-collapse').className = document.querySelector('.js-navbar-collapse').className.replace(/\s+show\b/, '');
|
||||
} else {
|
||||
document.querySelector('.js-navbar-collapse').className += ' show';
|
||||
}
|
||||
return;
|
||||
}
|
||||
*/
|
||||
});
|
||||
|
||||
}());
|
||||
|
|
Loading…
Reference in New Issue