78 lines
3.1 KiB
JavaScript
78 lines
3.1 KiB
JavaScript
((Drupal, once) => {
|
|
Drupal.behaviors.ginMediaLibrary = {
|
|
attach: function attach() {
|
|
Drupal.ginMediaLibrary.init();
|
|
},
|
|
};
|
|
|
|
Drupal.ginMediaLibrary = {
|
|
init: function () {
|
|
once('media-library-select-all', '.js-media-library-view[data-view-display-id="page"]').forEach(el => {
|
|
if (el.querySelectorAll('.js-media-library-item').length) {
|
|
const header = document.querySelector('.media-library-views-form');
|
|
const selectAll = document.createElement('label');
|
|
selectAll.className = 'media-library-select-all';
|
|
selectAll.innerHTML = Drupal.theme('checkbox') + Drupal.t('Select all media');
|
|
selectAll.children[0].addEventListener('click', e => {
|
|
const currentTarget = e.currentTarget;
|
|
const checkboxes = currentTarget
|
|
.closest('.js-media-library-view')
|
|
.querySelectorAll('.js-media-library-item .form-boolean');
|
|
|
|
checkboxes.forEach(checkbox => {
|
|
const stateChanged = checkbox.checked !== currentTarget.checked;
|
|
|
|
if (stateChanged) {
|
|
checkbox.checked = currentTarget.checked;
|
|
checkbox.dispatchEvent(new Event('change'));
|
|
}
|
|
});
|
|
|
|
const announcement = currentTarget.checked ? Drupal.t('All @count items selected', {
|
|
'@count': checkboxes.length
|
|
}) : Drupal.t('Zero items selected');
|
|
Drupal.announce(announcement);
|
|
|
|
this.bulkOperations();
|
|
});
|
|
header.prepend(selectAll);
|
|
}
|
|
|
|
this.itemSelect();
|
|
});
|
|
},
|
|
|
|
itemSelect: () => {
|
|
document.querySelectorAll('.media-library-view .js-click-to-select-trigger, .media-library-view .media-library-item .form-checkbox')
|
|
.forEach(trigger => {
|
|
trigger.addEventListener('click', () => {
|
|
const selectAll = document.querySelector('.media-library-select-all .form-boolean');
|
|
const checkboxes = document.querySelectorAll('.media-library-view .media-library-item .form-boolean');
|
|
const checkboxesChecked = document.querySelectorAll('.media-library-view .media-library-item .form-boolean:checked');
|
|
|
|
if (selectAll && selectAll.checked === true && checkboxes.length !== checkboxesChecked.length) {
|
|
selectAll.checked = false;
|
|
selectAll.dispatchEvent(new Event('change'));
|
|
} else if (checkboxes.length === Array.from(checkboxes).filter(el => el.checked === true).length) {
|
|
selectAll.checked = true;
|
|
selectAll.dispatchEvent(new Event('change'));
|
|
}
|
|
|
|
Drupal.ginMediaLibrary.bulkOperations();
|
|
});
|
|
});
|
|
},
|
|
|
|
bulkOperations: () => {
|
|
const bulkOperations = document.querySelector('.media-library-view [data-drupal-selector*="edit-header"]');
|
|
|
|
if (bulkOperations && document.querySelectorAll('.media-library-view .form-checkbox:checked').length > 0) {
|
|
bulkOperations.classList.add('is-sticky');
|
|
} else {
|
|
bulkOperations.classList.remove('is-sticky');
|
|
}
|
|
},
|
|
|
|
};
|
|
})(Drupal, once);
|