Add legal checkboxes under comment replies

This commit is contained in:
Kuba Orlik 2023-07-18 15:55:57 +02:00
parent dcfec55a2a
commit 3d5e34ddb6
2 changed files with 78 additions and 57 deletions

76
partials/isso-scripts.hbs Normal file
View File

@ -0,0 +1,76 @@
<script>
function addCheckbox(container = document) {
const original_submit = container.querySelector(
".post-action input[type='submit']"
);
original_submit.style.setProperty("display", "none");
const faux_submit = document.createElement("input");
faux_submit.value = "Wyślij";
faux_submit.type = "submit";
const comment_checkbox_id = "comment-checkbox";
const checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.id = comment_checkbox_id;
checkbox.required = true;
const label = document.createElement("label");
label.style.setProperty("line-height", 1);
label.style.setProperty("margin", "1em 0");
label.for = comment_checkbox_id;
label.appendChild(checkbox);
label.id = comment_checkbox_id + "__label";
const label_text = document.createElement("span");
label_text.innerHTML = `Zapoznałam/em się z <a href="/regulamin-komentarzy">Regulaminem publikowania komentarzy</a> i&nbsp;akceptuję jego treść.`;
label.appendChild(label_text);
container
.querySelector("#isso-thread .auth-section")
.insertBefore(
label,
container.querySelector(".auth-section .post-action")
);
const legal = document.createElement("p");
legal.classList.add("legal");
legal.innerHTML = `Współadministratorami danych osobowych są Arkadiusz Wieczorek oraz Jan Orlik. Dane osobowe podane w formularzu są przetwarzane w celu realizacji usługi publikowania komentarzy na stronie internetowej współadministratorów, jak również w celu ustalenia, dochodzenia lub obrony roszczeń. Masz w szczególności prawo dostępu do swoich danych osobowych, ich usunięcia oraz wniesienia sprzeciwu wobec przetwarzania danych. Szczegóły dotyczące przetwarzania danych osobowych i przysługujących Ci praw znajdują się w <a href="/polityka-prywatnosci">Polityce prywatności</a>.`;
legal.style.setProperty("hyphens", "auto");
legal.style.setProperty("text-align", "justify");
legal.style.setProperty("font-style", "italic");
legal.style.setProperty("font-size", "1.333rem");
legal.style.setProperty("line-height", "150%");
container
.querySelector("#isso-thread .auth-section")
.insertBefore(
legal,
container.querySelector(".auth-section .post-action")
);
const email_input = container.querySelector(`input[type="email"]`);
email_input.placeholder = "adres E-mail";
email_input.required = true;
faux_submit.addEventListener("click", () => {
if (!email_input.validity.valid) {
email_input.reportValidity();
} else if (!checkbox.checked) {
checkbox.reportValidity();
} else {
original_submit.click();
}
});
original_submit.parentElement.appendChild(faux_submit);
}
(async function () {
for (let i = 0; i <= 20; i++) {
await addCheckbox(document.querySelector("#isso-thread"));
if (document.querySelector(".post-action input[type='submit']")) {
continue;
}
await new Promise((resolve) => setTimeout(resolve, 200));
}
addCheckbox(document.querySelector("#isso-thread"));
document.querySelectorAll(".isso-comment-footer a.reply").forEach((el) =>
el.addEventListener("click", (e) =>
setTimeout(() => {
addCheckbox(e.target.parentNode.nextSibling);
}, 20)
)
);
})();
</script>

View File

@ -203,61 +203,7 @@
></script>
<section id="isso-thread"></section>
<script>
(async function () {
function addCheckbox() {
const original_submit = document.querySelector(".post-action input[type='submit']");
original_submit.style.setProperty("display", "none")
const faux_submit = document.createElement("input")
faux_submit.value = "Wyślij"
faux_submit.type = "submit"
const comment_checkbox_id = "comment-checkbox"
const checkbox = document.createElement("input")
checkbox.type = "checkbox"
checkbox.id = comment_checkbox_id
checkbox.required = true
const label = document.createElement("label")
label.style.setProperty("line-height", 1);
label.style.setProperty("margin", "1em 0");
label.for = comment_checkbox_id;
label.appendChild(checkbox)
label.id = comment_checkbox_id + "__label"
const label_text = document.createElement("span")
label_text.innerHTML = `Zapoznałam/em się z <a href="/regulamin-komentarzy">Regulaminem publikowania komentarzy</a> i&nbsp;akceptuję jego treść.`
label.appendChild(label_text)
document.querySelector("#isso-thread .auth-section").insertBefore(label, document.querySelector(".auth-section .post-action"))
const legal = document.createElement("p");
legal.classList.add("legal");
legal.innerHTML = `Współadministratorami danych osobowych są Arkadiusz Wieczorek oraz Jan Orlik. Dane osobowe podane w formularzu są przetwarzane w celu realizacji usługi publikowania komentarzy na stronie internetowej współadministratorów, jak również w celu ustalenia, dochodzenia lub obrony roszczeń. Masz w szczególności prawo dostępu do swoich danych osobowych, ich usunięcia oraz wniesienia sprzeciwu wobec przetwarzania danych. Szczegóły dotyczące przetwarzania danych osobowych i przysługujących Ci praw znajdują się w <a href="/polityka-prywatnosci">Polityce prywatności</a>.`
legal.style.setProperty("hyphens", "auto")
legal.style.setProperty("text-align", "justify")
legal.style.setProperty("font-style", "italic")
legal.style.setProperty("font-size", "1.333rem")
legal.style.setProperty("line-height", "150%")
document.querySelector("#isso-thread .auth-section").insertBefore(legal, document.querySelector(".auth-section .post-action"))
const email_input = document.querySelector("#isso-thread").querySelector(`input[type="email"]`)
email_input.placeholder = "adres E-mail";
email_input.required = true;
faux_submit.addEventListener("click", ()=>{
if(!email_input.validity.valid){
email_input.reportValidity()
}else if(!checkbox.checked){
checkbox.reportValidity()
}else {
original_submit.click()
}
})
original_submit.parentElement.appendChild(faux_submit)
}
for (let i = 0; i <= 20; i++) {
if (document.querySelector(".post-action input[type='submit']")) {
continue
}
await new Promise((resolve) => setTimeout(resolve, 200));
}
addCheckbox();
})()
</script>
{{> isso-scripts }}
</div>
</main>
@ -326,7 +272,6 @@
var $postContent = $(".post-full-content");
$postContent.fitVids();
// FitVids - end
// Replace nav with title on scroll - start
Casper.stickyNavTitle({
navSelector: '.site-nav-main',
@ -354,4 +299,4 @@
});
});
</script>
{{/contentFor}}
{{/contentFor}}