This commit is contained in:
ポール ウェッブ 2018-10-10 14:04:16 -05:00
parent 20c90187cb
commit 38567045ad
4 changed files with 90 additions and 60 deletions

View file

@ -59,10 +59,23 @@ document.querySelectorAll("a[href^='#']").forEach(anchor => {
});
// Newsletter
document.querySelector("[data-action='subscribe to newsletter']").onclick = () => {
const email = document.getElementById("emailAddress").value;
document.getElementById("emailAddress").addEventListener("keyup", event => {
const key = event.keyCode ? event.keyCode : event.which;
if (!validateEmail(email)) return;
if (key === 13)
document.querySelector("[data-action='subscribe to newsletter']").click();
});
document.querySelector("[data-action='subscribe to newsletter']").onclick = () => {
const email = document.getElementById("emailAddress").value.trim();
if (!validateEmail(email)) {
document.getElementById("emailMessage").classList.add("error");
document.getElementById("emailMessage").innerHTML = "Your email address is invalid";
return;
}
document.getElementById("emailMessage").classList.remove("error");
send(JSON.stringify({
email: email,

View file

@ -50,8 +50,14 @@ function initializeWebSocketConnection() {
case data.message === "updated html":
document.querySelector(data.selector).innerHTML = data.html;
document.getElementById("emailAddress").value = "";
document.getElementById("emailMessage").innerHTML = "";
if (data.class)
document.querySelector(data.selector).classList.add(data.class);
if (data.selector !== "#emailMessage") {
document.getElementById("emailAddress").value = "";
document.getElementById("emailMessage").innerHTML = "";
}
if (data.example === 2) {
detectLanguageAndUpdate(); // eslint-disable-line

View file

@ -117,12 +117,21 @@
.newsletter-cta__message {
@include clearfix;
background-color: $teal;
color: $white;
font-size: 1rem;
cursor: default;
display: inline-block;
font-size: 0.8rem;
text-align: center;
&:not(:empty) {
padding: 1rem;
margin: 0.5rem auto 0; padding: 0.25rem 1rem;
}
&:not(.error) {
background-color: $teal;
}
&.error {
background-color: $red;
}
}

View file

@ -327,68 +327,70 @@ function newsletterSubscribe(data, socket) {
const email = data.email;
if (!validateEmail(email)) return socket.send(JSON.stringify({
html: "Your email is invalid",
class: "error",
html: "Your email address is invalid",
message: "updated html",
selector: "#emailMessage"
}));
return new Promise((resolve, reject) => {
request({
method: "POST",
url: `https://api.lbry.io/list/subscribe?email=${email}&tag=developer`
}).then(body => {
if (!body || !JSON.parse(body)) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```¯\\_(ツ)_/¯ This should be an unreachable error```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
return resolve(socket.send(JSON.stringify({
html: "Something is terribly wrong",
message: "updated html",
selector: "#emailMessage"
})));
}
body = JSON.parse(body);
if (!body.success) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```" + JSON.parse(JSON.stringify(body.error)) + "```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
return reject(socket.send(JSON.stringify({
html: body.error,
message: "updated html",
selector: "#emailMessage"
})));
}
return new Promise((resolve, reject) => request({
method: "POST",
url: `https://api.lbry.io/list/subscribe?email=${encodeURIComponent(email)}&tag=developer`
}).then(body => {
if (!body || !JSON.parse(body)) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```¯\\_(ツ)_/¯ This should be an unreachable error```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
return resolve(socket.send(JSON.stringify({
html: "Thank you! Please confirm subscription in your inbox.",
class: "error",
html: "Something is terribly wrong",
message: "updated html",
selector: "#emailMessage"
})));
})
.catch(welp => {
if (welp.statusCode === 409) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```" + JSON.parse(JSON.stringify(welp.error)) + "```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
}
return resolve(socket.send(JSON.stringify({
html: "You have already subscribed!",
message: "updated html",
selector: "#emailMessage"
})));
}
});
});
body = JSON.parse(body);
if (!body.success) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```" + JSON.parse(JSON.stringify(body.error)) + "```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
return reject(socket.send(JSON.stringify({
class: "error",
html: body.error,
message: "updated html",
selector: "#emailMessage"
})));
}
return resolve(socket.send(JSON.stringify({
html: "Thank you! Please confirm subscription in your inbox.",
message: "updated html",
selector: "#emailMessage"
})));
})
.catch(welp => {
if (welp.statusCode === 409) {
logSlackError(
"\n" +
"> *NEWSLETTER ERROR:* ```" + JSON.parse(JSON.stringify(welp.error)) + "```" + "\n" +
`> _Cause: ${email} interacted with the form_\n`
);
return resolve(socket.send(JSON.stringify({
class: "error",
html: "You have already subscribed!",
message: "updated html",
selector: "#emailMessage"
})));
}
}));
}
function validateEmail(email) {