[assets] Remove UI and behaviours for interactions:

This commit addresses https://github.com/mouse-reeve/bookwyrm/pull/883#discussion_r609739553.
This commit is contained in:
Fabien Basmaison 2021-04-08 17:37:29 +02:00
parent 2f90b4ce66
commit b92ff9752d
2 changed files with 12 additions and 65 deletions

View file

@ -235,34 +235,6 @@ html {
right: 0;
}
/** Animations and transitions
******************************************************************************/
@keyframes beating {
0% { font-size: 100%; }
25% { font-size: 125%; }
100% { font-size: 75%; }
}
@keyframes turning {
from { transform: rotateZ(0deg); }
to { transform: rotateZ(360deg); }
}
.is-processing .icon-heart::before {
animation: beating 0.5s infinite alternate ease-in-out;
}
.is-processing .icon-boost::before {
animation: turning 0.5s infinite ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
.is-processing .icon::before {
animation-duration: 1.5s;
}
}
/* States
******************************************************************************/

View file

@ -238,45 +238,20 @@ let BookWyrm = new class {
event.preventDefault();
const bookwyrm = this;
const trigger = event.submitter;
const target = event.currentTarget;
const forms = document.querySelectorAll(`.${target.dataset.id}`);
const form = event.currentTarget;
const relatedforms = document.querySelectorAll(`.${form.dataset.id}`);
// Change icon to show ongoing activity on the current UI.
// Disable the element used to submit the form to prevent duplicated requests.
// @todo Ideally, disable all potential ways to submit this specific form.
forms.forEach(form => {
bookwyrm.addRemoveClass(form, 'is-processing', true);
trigger.setAttribute('disabled', null);
// Toggle class on all related forms.
relatedforms.forEach(relatedForm => bookwyrm.addRemoveClass(
relatedForm,
'is-hidden',
relatedForm.className.indexOf('is-hidden') == -1
));
this.ajaxPost(form).catch(error => {
// @todo Display a notification in the UI instead.
console.warn('Request failed:', error);
});
this.ajaxPost(target)
.finally(() => {
// Change icon to remove ongoing activity on the current UI.
// Enable back the element used to submit the form.
forms.forEach(form => {
bookwyrm.addRemoveClass(form, 'is-processing', false);
trigger.removeAttribute('disabled');
});
})
.then(function() {
forms.forEach(form => bookwyrm.addRemoveClass(
form,
'is-hidden',
form.className.indexOf('is-hidden') == -1
));
})
.catch(error => {
// @todo Display a notification in the UI instead.
// For now, the absence of change will be enough.
console.warn('Request failed:', error);
forms.forEach(form => bookwyrm.addRemoveClass(
form,
'has-error',
form.className.indexOf('is-hidden') == -1
));
});
}
/**