SillyTavern/public/scripts/bulk-edit.js

125 lines
4.2 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.group_overlay_mode_select .bogus_folder_select, #rm_print_characters_block.group_overlay_mode_select .group_select')
.addClass('disabled');
$('#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.group_overlay_mode_select .bogus_folder_select, #rm_print_characters_block.group_overlay_mode_select .group_select')
.removeClass('disabled');
$('#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);
});