120 lines
3.8 KiB
JavaScript
120 lines
3.8 KiB
JavaScript
import { characterGroupOverlay } from '../script.js';
|
|
import { BulkEditOverlay, BulkEditOverlayState } from './BulkEditOverlay.js';
|
|
|
|
|
|
let is_bulk_edit = false;
|
|
|
|
const enableBulkEdit = () => {
|
|
enableBulkSelect();
|
|
characterGroupOverlay.selectState();
|
|
// show the bulk edit option buttons
|
|
$('.bulkEditOptionElement').show();
|
|
is_bulk_edit = true;
|
|
characterGroupOverlay.updateSelectedCount(0);
|
|
};
|
|
|
|
const disableBulkEdit = () => {
|
|
disableBulkSelect();
|
|
characterGroupOverlay.browseState();
|
|
// hide the bulk edit option buttons
|
|
$('.bulkEditOptionElement').hide();
|
|
is_bulk_edit = false;
|
|
characterGroupOverlay.updateSelectedCount(0);
|
|
};
|
|
|
|
const toggleBulkEditMode = (isBulkEdit) => {
|
|
if (isBulkEdit) {
|
|
disableBulkEdit();
|
|
} else {
|
|
enableBulkEdit();
|
|
}
|
|
};
|
|
|
|
characterGroupOverlay.addStateChangeCallback((state) => {
|
|
if (state === BulkEditOverlayState.select) enableBulkEdit();
|
|
if (state === BulkEditOverlayState.browse) disableBulkEdit();
|
|
});
|
|
|
|
/**
|
|
* Toggles bulk edit mode on/off when the edit button is clicked.
|
|
*/
|
|
function onEditButtonClick() {
|
|
console.log('Edit button clicked');
|
|
toggleBulkEditMode(is_bulk_edit);
|
|
}
|
|
|
|
/**
|
|
* Toggles the select state of all characters in bulk edit mode to selected. If all are selected, they'll be deselected.
|
|
*/
|
|
function onSelectAllButtonClick() {
|
|
console.log('Bulk select all button clicked');
|
|
const characters = Array.from(document.querySelectorAll('#' + BulkEditOverlay.containerId + ' .' + BulkEditOverlay.characterClass));
|
|
let atLeastOneSelected = false;
|
|
for (const character of characters) {
|
|
const checked = $(character).find('.bulk_select_checkbox:checked').length > 0;
|
|
if (!checked && character instanceof HTMLElement) {
|
|
characterGroupOverlay.toggleSingleCharacter(character);
|
|
atLeastOneSelected = true;
|
|
}
|
|
}
|
|
|
|
if (!atLeastOneSelected) {
|
|
// If none was selected, trigger click on all to deselect all of them
|
|
for(const character of characters) {
|
|
const checked = $(character).find('.bulk_select_checkbox:checked') ?? false;
|
|
if (checked && character instanceof HTMLElement) {
|
|
characterGroupOverlay.toggleSingleCharacter(character);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/**
|
|
* Deletes all characters that have been selected via the bulk checkboxes.
|
|
*/
|
|
async function onDeleteButtonClick() {
|
|
console.log('Delete button clicked');
|
|
|
|
// We just let the button trigger the context menu delete option
|
|
await characterGroupOverlay.handleContextMenuDelete();
|
|
}
|
|
|
|
/**
|
|
* Enables bulk selection by adding a checkbox next to each character.
|
|
*/
|
|
function enableBulkSelect() {
|
|
$('#rm_print_characters_block .character_select').each((i, el) => {
|
|
// Prevent checkbox from adding multiple times (because of stage change callback)
|
|
if ($(el).find('.bulk_select_checkbox').length > 0) {
|
|
return;
|
|
}
|
|
const checkbox = $('<input type=\'checkbox\' class=\'bulk_select_checkbox\'>');
|
|
checkbox.on('change', () => {
|
|
// Do something when the checkbox is changed
|
|
});
|
|
$(el).prepend(checkbox);
|
|
});
|
|
$('#rm_print_characters_block').addClass('bulk_select');
|
|
// We also need to disable the default click event for the character_select divs
|
|
$(document).on('click', '.bulk_select_checkbox', function (event) {
|
|
event.stopImmediatePropagation();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Disables bulk selection by removing the checkboxes.
|
|
*/
|
|
function disableBulkSelect() {
|
|
$('.bulk_select_checkbox').remove();
|
|
$('#rm_print_characters_block').removeClass('bulk_select');
|
|
}
|
|
|
|
/**
|
|
* Entry point that runs on page load.
|
|
*/
|
|
jQuery(() => {
|
|
$('#bulkEditButton').on('click', onEditButtonClick);
|
|
$('#bulkSelectAllButton').on('click', onSelectAllButtonClick);
|
|
$('#bulkDeleteButton').on('click', onDeleteButtonClick);
|
|
});
|