mirror of
https://github.com/easydiffusion/easydiffusion.git
synced 2025-04-15 23:18:38 +02:00
Merge pull request #563 from patriceac/Mouse-wheel-behavior-fixes
Improved Mouse Wheel UX with Image Modifiers
This commit is contained in:
commit
ee66c799e0
@ -86,7 +86,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="editor-inputs-tags-container" class="row">
|
<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 id="editor-inputs-tags-list"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -87,9 +87,9 @@ function createModifierGroup(modifierGroup, initiallyExpanded) {
|
|||||||
modifiersEl.appendChild(modifierCard)
|
modifiersEl.appendChild(modifierCard)
|
||||||
|
|
||||||
modifierCard.addEventListener('click', () => {
|
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
|
// remove modifier from active array
|
||||||
activeTags = activeTags.filter(x => x.name != modifierName)
|
activeTags = activeTags.filter(x => trimModifiers(x.name) != trimModifiers(modifierName))
|
||||||
toggleCardState(modifierCard, false)
|
toggleCardState(modifierCard, false)
|
||||||
} else {
|
} else {
|
||||||
// add modifier to active array
|
// add modifier to active array
|
||||||
@ -120,6 +120,10 @@ function createModifierGroup(modifierGroup, initiallyExpanded) {
|
|||||||
return e
|
return e
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function trimModifiers(tag) {
|
||||||
|
return tag.replace(/^\(+|\)+$/g, '').replace(/^\[+|\]+$/g, '')
|
||||||
|
}
|
||||||
|
|
||||||
async function loadModifiers() {
|
async function loadModifiers() {
|
||||||
try {
|
try {
|
||||||
let res = await fetch('/get/modifiers')
|
let res = await fetch('/get/modifiers')
|
||||||
|
@ -18,6 +18,7 @@
|
|||||||
let overlays = document.querySelector('#editor-inputs-tags-list').querySelectorAll('.modifier-card-overlay')
|
let overlays = document.querySelector('#editor-inputs-tags-list').querySelectorAll('.modifier-card-overlay')
|
||||||
overlays.forEach (i => {
|
overlays.forEach (i => {
|
||||||
i.onwheel = (e) => {
|
i.onwheel = (e) => {
|
||||||
|
if (e.ctrlKey == true) {
|
||||||
e.preventDefault()
|
e.preventDefault()
|
||||||
|
|
||||||
const delta = Math.sign(event.deltaY)
|
const delta = Math.sign(event.deltaY)
|
||||||
@ -55,6 +56,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})()
|
})()
|
||||||
|
Loading…
Reference in New Issue
Block a user