An easy fix for mouse wheel scrolling

Relates to #116

Signed-off-by: Victor Seiji Hariki <victorseijih@gmail.com>
This commit is contained in:
Victor Seiji Hariki 2022-12-25 23:29:03 -03:00
parent 8c86de7f8c
commit 3d298473b7
4 changed files with 36 additions and 7 deletions

View file

@ -317,6 +317,9 @@
src="js/initalize/layers.populate.js" src="js/initalize/layers.populate.js"
type="text/javascript"></script> type="text/javascript"></script>
<!-- Configuration -->
<script src="js/config.js" type="text/javascript"></script>
<!-- Content --> <!-- Content -->
<script src="js/global.js" type="text/javascript"></script> <script src="js/global.js" type="text/javascript"></script>
<script src="js/prompt.js" type="text/javascript"></script> <script src="js/prompt.js" type="text/javascript"></script>

9
js/config.js Normal file
View file

@ -0,0 +1,9 @@
/**
* This is a file for static unchanging global configurations.
*
* Do NOT confuse with settings, which are modifiable by either the settings menu, or in the application itself.
*/
const config = {
// Scroll Tick Limit (How much must scroll to reach next tick)
wheelTickSize: 50,
};

View file

@ -440,6 +440,12 @@ window.addEventListener(
window.addEventListener( window.addEventListener(
"wheel", "wheel",
(evn) => { (evn) => {
// For firefox, we need to read a delta before deltaMode to force a PIXEL deltaMode read.
// If we read deltaMode before a delta read, deltaMode will be LINE.
// ref: https://bugzilla.mozilla.org/show_bug.cgi?id=1392460
let _discard = evn.deltaY;
_discard = evn.deltaMode;
mouse._contexts.forEach(({name, target, validate}) => { mouse._contexts.forEach(({name, target, validate}) => {
if (!target || (target === evn.target && (!validate || validate(evn)))) { if (!target || (target === evn.target && (!validate || validate(evn)))) {
mouse.listen[name].onwheel.emit({ mouse.listen[name].onwheel.emit({

View file

@ -1053,18 +1053,29 @@ const dream_img2img_callback = (bb, resolution, state) => {
/** /**
* Generic wheel handler * Generic wheel handler
*/ */
let _dream_wheel_accum = 0;
const _dream_onwheel = (evn, state) => { const _dream_onwheel = (evn, state) => {
if (!evn.evn.ctrlKey) { if (!evn.evn.ctrlKey) {
// Seems mouse wheel scroll is very different between different browsers. if (evn.mode !== WheelEvent.DOM_DELTA_PIXEL) {
// Will use scroll as just an event to go to the next cursor snap position instead. // We don't really handle non-pixel scrolling
// return;
// TODO: Someone that has a smooth scrolling mouse should verify if this works with them. }
const v = state.cursorSize - 128 * (evn.delta / Math.abs(evn.delta)); // A simple but (I hope) effective fix for mouse wheel behavior
_dream_wheel_accum += evn.delta;
state.cursorSize = state.setCursorSize(v + snap(v, 0, 128)); if (Math.abs(_dream_wheel_accum) > config.wheelTickSize) {
state.mousemovecb(evn); // Snap to next or previous position
const v =
state.cursorSize -
128 * (_dream_wheel_accum / Math.abs(_dream_wheel_accum));
state.cursorSize = state.setCursorSize(v + snap(v, 0, 128));
state.mousemovecb(evn);
_dream_wheel_accum = 0; // Zero accumulation
}
} }
}; };