diff --git a/ui/media/js/image-modifiers.js b/ui/media/js/image-modifiers.js index 2443064f..e1c31a53 100644 --- a/ui/media/js/image-modifiers.js +++ b/ui/media/js/image-modifiers.js @@ -91,7 +91,7 @@ function createModifierGroup(modifierGroup, initiallyExpanded) { if (activeTags.map(x => trimModifiers(x.name)).includes(trimmedName)) { // remove modifier from active array activeTags = activeTags.filter(x => trimModifiers(x.name) != trimmedName) - toggleCardState(modifierCard, false) + toggleCardState(trimmedName, false) } else { // add modifier to active array activeTags.push({ @@ -100,7 +100,7 @@ function createModifierGroup(modifierGroup, initiallyExpanded) { 'originElement': modifierCard, 'previews': modifierPreviews }) - toggleCardState(modifierCard, true) + toggleCardState(trimmedName, true) } refreshTagsList() @@ -221,8 +221,8 @@ function refreshTagsList() { tag.element.addEventListener('click', () => { let idx = activeTags.indexOf(tag) - if (idx !== -1 && activeTags[idx].originElement !== undefined) { - toggleCardState(activeTags[idx].originElement, false) + if (idx !== -1) { + toggleCardState(activeTags[idx].name, false) activeTags.splice(idx, 1) refreshTagsList() @@ -235,14 +235,20 @@ function refreshTagsList() { editorModifierTagsList.appendChild(brk) } -function toggleCardState(card, makeActive) { - if (makeActive) { - card.classList.add(activeCardClass) - card.querySelector('.modifier-card-image-overlay').innerText = '-' - } else { - card.classList.remove(activeCardClass) - card.querySelector('.modifier-card-image-overlay').innerText = '+' - } +function toggleCardState(modifierName, makeActive) { + document.querySelector('#editor-modifiers').querySelectorAll('.modifier-card').forEach(card => { + const name = card.querySelector('.modifier-card-label').innerText + if (trimModifiers(modifierName) == trimModifiers(name)) { + if(makeActive) { + card.classList.add(activeCardClass) + card.querySelector('.modifier-card-image-overlay').innerText = '-' + } + else{ + card.classList.remove(activeCardClass) + card.querySelector('.modifier-card-image-overlay').innerText = '+' + } + } + }) } function changePreviewImages(val) {