mirror of
https://github.com/johndoe6345789/AutoMetabuilder.git
synced 2026-04-24 13:54:59 +00:00
Add ChoicesManager plugin for enhanced dropdown handling:
- Introduce `choices_manager.js` for initializing and managing custom dropdowns with `Choices` library. - Implement options parsing and initialization with i18n support. - Provide methods for managing instances including init, destroy, and refresh.
This commit is contained in:
66
src/autometabuilder/web/static/js/plugins/choices_manager.js
Normal file
66
src/autometabuilder/web/static/js/plugins/choices_manager.js
Normal file
@@ -0,0 +1,66 @@
|
||||
/**
|
||||
* AutoMetabuilder - Choices Manager
|
||||
*/
|
||||
(() => {
|
||||
const i18n = (key, fallback = '') => window.AMBContext?.t?.(key, fallback) || fallback || key;
|
||||
|
||||
const ChoicesManager = {
|
||||
instances: [],
|
||||
|
||||
init() {
|
||||
this.initAll();
|
||||
},
|
||||
|
||||
initAll() {
|
||||
document.querySelectorAll('[data-choices]').forEach(el => {
|
||||
if (el.dataset.choicesInit === 'true') return;
|
||||
|
||||
const optionsStr = el.dataset.choicesOptions || '{}';
|
||||
let options = {};
|
||||
try {
|
||||
options = JSON.parse(optionsStr);
|
||||
} catch (error) {
|
||||
console.warn('Invalid choices options:', optionsStr);
|
||||
}
|
||||
|
||||
const instance = new Choices(el, {
|
||||
searchEnabled: true,
|
||||
shouldSort: false,
|
||||
allowHTML: false,
|
||||
removeItemButton: options.removeItemButton || false,
|
||||
placeholder: true,
|
||||
placeholderValue: el.dataset.placeholder || i18n('ui.common.select_placeholder', 'Select...'),
|
||||
searchPlaceholderValue: i18n('ui.choices.search_placeholder', 'Type to search...'),
|
||||
noResultsText: i18n('ui.choices.no_results', 'No results found'),
|
||||
noChoicesText: i18n('ui.choices.no_choices', 'No choices available'),
|
||||
...options
|
||||
});
|
||||
el.dataset.choicesInit = 'true';
|
||||
this.instances.push(instance);
|
||||
});
|
||||
},
|
||||
|
||||
destroy() {
|
||||
this.instances.forEach(instance => {
|
||||
try {
|
||||
const element = instance.passedElement?.element;
|
||||
if (element) {
|
||||
element.dataset.choicesInit = 'false';
|
||||
}
|
||||
instance.destroy();
|
||||
} catch (error) {
|
||||
// Ignore errors from already destroyed instances
|
||||
}
|
||||
});
|
||||
this.instances = [];
|
||||
},
|
||||
|
||||
refresh() {
|
||||
this.destroy();
|
||||
this.initAll();
|
||||
}
|
||||
};
|
||||
|
||||
window.ChoicesManager = ChoicesManager;
|
||||
window.AMBPlugins?.register('choices_manager', async () => ChoicesManager.init());
|
||||
})();
|
||||
Reference in New Issue
Block a user