mirror of
https://github.com/bookwyrm-social/bookwyrm.git
synced 2024-11-12 11:52:30 +00:00
[assets] Update interactions code:
This commit should address https://github.com/mouse-reeve/bookwyrm/pull/883#discussion_r609381969. - Disable the button being used to submit the form. - Rename variables based on @mouse-reeve’s explanations. Thanks! ✨
This commit is contained in:
parent
ad3e91db7d
commit
83bd417878
1 changed files with 22 additions and 20 deletions
|
@ -229,7 +229,7 @@ let BookWyrm = new class {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Make a request and update the UI accordingly.
|
* Make a request and update the UI accordingly.
|
||||||
* This function is used for boosts and favourites.
|
* This function is used for boosts, favourites, follows and unfollows.
|
||||||
*
|
*
|
||||||
* @param {Event} event
|
* @param {Event} event
|
||||||
* @return {undefined}
|
* @return {undefined}
|
||||||
|
@ -238,30 +238,32 @@ let BookWyrm = new class {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
const bookwyrm = this;
|
const bookwyrm = this;
|
||||||
|
const trigger = event.submitter;
|
||||||
let allTriggers = document.querySelectorAll(`.${event.target.dataset.id}`);
|
const target = event.currentTarget;
|
||||||
|
const forms = document.querySelectorAll(`.${target.dataset.id}`);
|
||||||
|
|
||||||
// Change icon to show ongoing activity on the current UI.
|
// Change icon to show ongoing activity on the current UI.
|
||||||
allTriggers.forEach(node => bookwyrm.addRemoveClass(
|
// Disable the element used to submit the form to prevent duplicated requests.
|
||||||
node,
|
// @todo Ideally, disable all potential ways to submit this specific form.
|
||||||
'is-processing',
|
forms.forEach(form => {
|
||||||
true
|
bookwyrm.addRemoveClass(form, 'is-processing', true);
|
||||||
));
|
trigger.setAttribute('disabled', null);
|
||||||
|
});
|
||||||
|
|
||||||
this.ajaxPost(event.target)
|
this.ajaxPost(target)
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
// Change icon to remove ongoing activity on the current UI.
|
// Change icon to remove ongoing activity on the current UI.
|
||||||
allTriggers.forEach(node => bookwyrm.addRemoveClass(
|
// Enable back the element used to submit the form.
|
||||||
node,
|
forms.forEach(form => {
|
||||||
'is-processing',
|
bookwyrm.addRemoveClass(form, 'is-processing', false);
|
||||||
false
|
trigger.removeAttribute('disabled');
|
||||||
));
|
});
|
||||||
})
|
})
|
||||||
.then(function() {
|
.then(function() {
|
||||||
allTriggers.forEach(node => bookwyrm.addRemoveClass(
|
forms.forEach(form => bookwyrm.addRemoveClass(
|
||||||
node,
|
form,
|
||||||
'is-hidden',
|
'is-hidden',
|
||||||
node.className.indexOf('is-hidden') == -1
|
form.className.indexOf('is-hidden') == -1
|
||||||
));
|
));
|
||||||
})
|
})
|
||||||
.catch(error => {
|
.catch(error => {
|
||||||
|
@ -269,10 +271,10 @@ let BookWyrm = new class {
|
||||||
// For now, the absence of change will be enough.
|
// For now, the absence of change will be enough.
|
||||||
console.warn('Request failed:', error);
|
console.warn('Request failed:', error);
|
||||||
|
|
||||||
allTriggers.forEach(node => bookwyrm.addRemoveClass(
|
forms.forEach(form => bookwyrm.addRemoveClass(
|
||||||
node,
|
form,
|
||||||
'has-error',
|
'has-error',
|
||||||
node.className.indexOf('is-hidden') == -1
|
form.className.indexOf('is-hidden') == -1
|
||||||
));
|
));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue