Merge pull request #563 from patriceac/Mouse-wheel-behavior-fixes

Improved Mouse Wheel UX with Image Modifiers
This commit is contained in:
cmdr2 2022-11-30 16:24:05 +05:30 committed by GitHub
commit ee66c799e0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 39 additions and 33 deletions

View File

@ -86,7 +86,7 @@
</div>
<div id="editor-inputs-tags-container" class="row">
<label>Image Modifiers: <small>(click an Image Modifier to remove it)</small></label>
<label>Image Modifiers: <small>(click an Image Modifier to remove it, use Ctrl+Mouse Wheel to adjust its weight)</small></label>
<div id="editor-inputs-tags-list"></div>
</div>

View File

@ -87,9 +87,9 @@ function createModifierGroup(modifierGroup, initiallyExpanded) {
modifiersEl.appendChild(modifierCard)
modifierCard.addEventListener('click', () => {
if (activeTags.map(x => x.name).includes(modifierName)) {
if (activeTags.map(x => trimModifiers(x.name)).includes(trimModifiers(modifierName))) {
// remove modifier from active array
activeTags = activeTags.filter(x => x.name != modifierName)
activeTags = activeTags.filter(x => trimModifiers(x.name) != trimModifiers(modifierName))
toggleCardState(modifierCard, false)
} else {
// add modifier to active array
@ -120,6 +120,10 @@ function createModifierGroup(modifierGroup, initiallyExpanded) {
return e
}
function trimModifiers(tag) {
return tag.replace(/^\(+|\)+$/g, '').replace(/^\[+|\]+$/g, '')
}
async function loadModifiers() {
try {
let res = await fetch('/get/modifiers')

View File

@ -18,6 +18,7 @@
let overlays = document.querySelector('#editor-inputs-tags-list').querySelectorAll('.modifier-card-overlay')
overlays.forEach (i => {
i.onwheel = (e) => {
if (e.ctrlKey == true) {
e.preventDefault()
const delta = Math.sign(event.deltaY)
@ -55,6 +56,7 @@
}
}
}
}
})
}
})()