2024-06-25 02:58:22 +00:00
|
|
|
// manipulates the post upvote "kudos" button behavior
|
2024-06-25 00:30:57 +00:00
|
|
|
|
2024-06-25 02:58:22 +00:00
|
|
|
window.onload = function() {
|
|
|
|
// get the button and text elements
|
|
|
|
var kudosButton = document.querySelector('.kudos-button');
|
|
|
|
var kudosText = document.querySelector('.kudos-text');
|
|
|
|
var emojiSpan = kudosButton.querySelector('.emoji');
|
2024-06-25 00:30:57 +00:00
|
|
|
|
2024-06-25 02:58:22 +00:00
|
|
|
kudosButton.addEventListener('click', function(event) {
|
|
|
|
// send the event to Cabin
|
2024-06-25 01:56:55 +00:00
|
|
|
cabin.event('kudos')
|
2024-06-25 02:58:22 +00:00
|
|
|
// disable the button
|
2024-06-25 00:30:57 +00:00
|
|
|
kudosButton.disabled = true;
|
|
|
|
kudosButton.classList.add('clicked');
|
2024-06-25 02:58:22 +00:00
|
|
|
// change the displayed text
|
2024-06-25 00:30:57 +00:00
|
|
|
kudosText.textContent = 'Thanks!';
|
|
|
|
kudosText.classList.add('thanks');
|
2024-06-25 02:58:22 +00:00
|
|
|
// spin the emoji
|
2024-06-25 00:30:57 +00:00
|
|
|
emojiSpan.style.transform = 'rotate(360deg)';
|
2024-06-25 02:58:22 +00:00
|
|
|
// change the emoji to celebrate
|
|
|
|
setTimeout(function() {
|
2024-06-25 00:30:57 +00:00
|
|
|
emojiSpan.textContent = '🎉';
|
2024-06-25 02:58:22 +00:00
|
|
|
}, 150); // half of the css transition time for a smooth mid-rotation change
|
2024-06-25 00:30:57 +00:00
|
|
|
});
|
2024-06-25 02:58:22 +00:00
|
|
|
}
|