You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
70 lines
2.0 KiB
70 lines
2.0 KiB
<!-- THE RULES
|
|
DO NOT style the "js-" classes, CREATE AND ADD YOUR OWN!!
|
|
Leave the classes that start with "js-" EXACTLY WHERE THEY ARE!
|
|
The script tag MUST go just above the closing </body>
|
|
(or below the form)
|
|
|
|
DO NOT move the 'js-contant-thanks' div inside of the 'js-contact-form' form
|
|
DO NOT do the reverse
|
|
|
|
Email is required as an email
|
|
Name is optional and could be anything (it's just a text field for comments)
|
|
-->
|
|
|
|
<div class="js-contact-thanks" hidden>
|
|
Thanks! We'll be in touch soon!
|
|
</div>
|
|
<form class="js-contact-form" action="#">
|
|
<label>Name:</label>
|
|
<input class="js-contact-name" type="text">
|
|
|
|
<br>
|
|
|
|
<label>Email:</label>
|
|
<input class="js-contact-email" type="email" required>
|
|
|
|
<br>
|
|
|
|
<button type="submit">Take my money!</button>
|
|
</form>
|
|
|
|
<script>
|
|
'use strict';
|
|
|
|
// to be used for good, not evil
|
|
function saveContact(name, email) {
|
|
email = email.toLowerCase().trim();
|
|
name = (name || '').trim();
|
|
|
|
return 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({ address: email, comment: 'Broccoli: ' + name })
|
|
}).then(function (resp) {
|
|
return resp.json().then(function (data) {
|
|
/*
|
|
if (data.error) {
|
|
window.alert("Couldn't save your contact. Email coolaj86@gmail.com instead.");
|
|
return;
|
|
}
|
|
*/
|
|
});
|
|
}, function () {
|
|
/*
|
|
window.alert("Didn't get your contact. Bad network connection? Email coolaj86@gmail.com instead.");
|
|
*/
|
|
});
|
|
}
|
|
|
|
window.document
|
|
.querySelector('.js-contact-form')
|
|
.addEventListener('submit', function (ev) {
|
|
ev.preventDefault();
|
|
var name = window.document.querySelector('.js-contact-name').value;
|
|
var email = window.document.querySelector('.js-contact-email').value;
|
|
window.document.querySelector('.js-contact-form').hidden = true;
|
|
window.document.querySelector('.js-contact-thanks').hidden = false;
|
|
saveContact(name, email);
|
|
});
|
|
</script>
|