cosmo/dh-feartrackerplus
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: add dynamic icon preview to the custom icon setting input

Browse source
This commit is contained in:
CPTN Cosmo 2025-12-19 02:14:54 +01:00
parent caece67ba4
commit 49b5404008
1 changed files with 31 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

31
scripts/module.js
View file

@ -238,6 +238,37 @@ Hooks.on('renderSettingsConfig', (app, html, data) => {
iconTypeSelect.on('change', updateVisibility);
themeSelect.on('change', updateVisibility);
updateVisibility();
// Icon Preview Logic
const customIconGroup = findGroup('customIcon');
if (customIconGroup) {
const input = customIconGroup.find(`input[name="${MODULE_ID}.customIcon"]`);
if (input.length) {
// Create Preview Element
const previewSpan = $(`<span class="icon-preview" style="margin-left: 10px; font-size: 1.5em; width: 30px; text-align: center; display: inline-block;"></span>`);
const icon = $(`<i></i>`);
previewSpan.append(icon);
// Append to container
input.after(previewSpan);
// Update Function
const updatePreview = () => {
const val = input.val();
// Reset classes
icon.attr('class', '');
if (val) {
icon.addClass(val);
}
};
// Listeners
input.on('input', updatePreview);
// Initial update
updatePreview();
}
}
}
});