94255217e9
after user click delete branch, there is no processing indication, and user can click many times till. It seems flaw in UX. this will fix it fix bug in branch deletion link
35 lines
1.2 KiB
JavaScript
35 lines
1.2 KiB
JavaScript
class AjaxLoadingSpinner {
|
|
static init() {
|
|
const $elements = $('.js-ajax-loading-spinner');
|
|
|
|
$elements.on('ajax:beforeSend', AjaxLoadingSpinner.ajaxBeforeSend);
|
|
$elements.on('ajax:complete', AjaxLoadingSpinner.ajaxComplete);
|
|
}
|
|
|
|
static ajaxBeforeSend(e) {
|
|
e.target.setAttribute('disabled', '');
|
|
const iconElement = e.target.querySelector('i');
|
|
// get first fa- icon
|
|
const originalIcon = iconElement.className.match(/(fa-)([^\s]+)/g).first();
|
|
iconElement.dataset.icon = originalIcon;
|
|
AjaxLoadingSpinner.toggleLoadingIcon(iconElement);
|
|
$(e.target).off('ajax:beforeSend', AjaxLoadingSpinner.ajaxBeforeSend);
|
|
}
|
|
|
|
static ajaxComplete(e) {
|
|
e.target.removeAttribute('disabled');
|
|
const iconElement = e.target.querySelector('i');
|
|
AjaxLoadingSpinner.toggleLoadingIcon(iconElement);
|
|
$(e.target).off('ajax:complete', AjaxLoadingSpinner.ajaxComplete);
|
|
}
|
|
|
|
static toggleLoadingIcon(iconElement) {
|
|
const classList = iconElement.classList;
|
|
classList.toggle(iconElement.dataset.icon);
|
|
classList.toggle('fa-spinner');
|
|
classList.toggle('fa-spin');
|
|
}
|
|
}
|
|
|
|
window.gl = window.gl || {};
|
|
gl.AjaxLoadingSpinner = AjaxLoadingSpinner;
|