95 lines
2.8 KiB
JavaScript
95 lines
2.8 KiB
JavaScript
import { updateExperienceLevel } from '../actionsPanel/actionsPanel';
|
|
|
|
/**
|
|
* A thumbsup reaction on a comment/article will invalidate a previous thumbsdown
|
|
* or vomit reaction (they will be deleted on the server by the reaction handler)
|
|
* and vice versa. This function updates the UI to match.
|
|
* @param {HTMLButtonElement} clickedBtn The reaction button that was clicked
|
|
*/
|
|
function toggleContradictoryReactions(clickedBtn) {
|
|
const contentActions = document.querySelector('#content-mod-actions');
|
|
|
|
if (clickedBtn.parentElement === contentActions) {
|
|
const upVote = contentActions.querySelector("[data-category='thumbsup']");
|
|
const downVote = contentActions.querySelector(
|
|
"[data-category='thumbsdown']",
|
|
);
|
|
const vomitVote = contentActions.querySelector("[data-category='vomit']");
|
|
|
|
if (clickedBtn.dataset.category === 'thumbsup') {
|
|
downVote.classList.remove('reacted');
|
|
vomitVote.classList.remove('reacted');
|
|
} else {
|
|
upVote.classList.remove('reacted');
|
|
}
|
|
}
|
|
}
|
|
|
|
async function updateMainReactions(clickedBtn) {
|
|
const { reactableType, category, reactableId } = clickedBtn.dataset;
|
|
try {
|
|
const response = await fetch('/reactions', {
|
|
method: 'POST',
|
|
headers: {
|
|
Accept: 'application/json',
|
|
'X-CSRF-Token': window.csrfToken,
|
|
'Content-Type': 'application/json',
|
|
},
|
|
credentials: 'same-origin',
|
|
body: JSON.stringify({
|
|
reactable_type: reactableType,
|
|
category,
|
|
reactable_id: reactableId,
|
|
}),
|
|
});
|
|
|
|
const outcome = await response.json();
|
|
|
|
if (outcome.result === 'create') {
|
|
toggleContradictoryReactions(clickedBtn);
|
|
clickedBtn.classList.add('reacted');
|
|
} else if (outcome.result === 'destroy') {
|
|
clickedBtn.classList.remove('reacted');
|
|
} else {
|
|
// eslint-disable-next-line no-alert
|
|
alert(`Error: ${outcome.error}`);
|
|
// eslint-disable-next-line no-console
|
|
console.error(`Error: ${outcome.error}`);
|
|
}
|
|
} catch (error) {
|
|
// eslint-disable-next-line no-alert
|
|
alert(`Error: ${error}`);
|
|
}
|
|
}
|
|
|
|
// Experience-Level JS
|
|
Array.from(document.getElementsByClassName('level-rating-button')).forEach(
|
|
(btn) => {
|
|
btn.addEventListener('click', () => {
|
|
updateExperienceLevel(
|
|
btn.dataset.userId,
|
|
btn.dataset.articleId,
|
|
btn.value,
|
|
btn.dataset.group,
|
|
);
|
|
});
|
|
},
|
|
);
|
|
|
|
document
|
|
.querySelectorAll('.reaction-button, .reaction-vomit-button')
|
|
.forEach((btn) => {
|
|
btn.addEventListener('click', async () => {
|
|
await updateMainReactions(btn);
|
|
});
|
|
});
|
|
|
|
const form = document.getElementsByClassName('button_to')[0];
|
|
if (form) {
|
|
form.addEventListener('submit', (e) => {
|
|
e.preventDefault();
|
|
if (confirm('Are you SURE you want to delete this comment?')) {
|
|
form.submit();
|
|
}
|
|
});
|
|
}
|