Add 'Zoom with Scroll' input navigation scheme to preferences (#1021)

* Add use_scroll_as_zoom field to preference handler

* Add {Create,Delete}Mapping variants to message

* Revert "Add {Create,Delete}Mapping variants to message"

This reverts commit 0ba74754c9fb0c78d0b590c96e1d4fe2cfdd13e7.

* Revert "Add use_scroll_as_zoom field to preference handler"

This reverts commit d30f7c9edfa6d6e156939ca07f4db81f288975fd.

* Add basic scroll_as_zoom mapping

* Create overengineered mapping patch abstraction

* Add (for now passthrough) input layout manager

* Actually handle ModifyLayout messages (untested)

* Add backend preferences <-> layout manager comms

* Add scroll-as-zoom to actual preferences UI

* Rename LayoutManager -> KeyMapping

* Add Input section to preferences and title case

* Add scrollAsZoom frontend handling code (untested)

* Handle frontend <-> preferences comms

* (broken) Move scrollAsZoom persistence into state

* Fix scrollAsZoom having no effect on node graph

* Remove debugging helpers

* Fix confusion between horizontal and vertical

* Rename feature

* Move new message handler into folder

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
multisn8
2023-02-23 22:18:04 -08:00
committed by GitHub
co-authored by Keavon Chambers
parent 88e62b58e5
commit 065db23e87
19 changed files with 242 additions and 33 deletions
+15 -4
View File
@@ -513,9 +513,20 @@ export default defineComponent({
scroll(e: WheelEvent) {
const scrollX = e.deltaX;
const scrollY = e.deltaY;
const zoomWithScroll = this.nodeGraph.state.zoomWithScroll;
let zoom;
let horizontalPan;
if (zoomWithScroll) {
zoom = !(e.ctrlKey || e.shiftKey);
horizontalPan = e.ctrlKey;
} else {
zoom = e.ctrlKey;
horizontalPan = !(e.ctrlKey || e.shiftKey);
}
// Zoom
if (e.ctrlKey) {
if (zoom) {
let zoomFactor = 1 + Math.abs(scrollY) * WHEEL_RATE;
if (scrollY > 0) zoomFactor = 1 / zoomFactor;
@@ -541,11 +552,11 @@ export default defineComponent({
e.preventDefault();
}
// Pan
else if (!e.shiftKey) {
else if (horizontalPan) {
this.transform.x -= scrollY / this.transform.scale;
} else {
this.transform.x -= scrollX / this.transform.scale;
this.transform.y -= scrollY / this.transform.scale;
} else {
this.transform.x -= scrollY / this.transform.scale;
}
},
keydown(e: KeyboardEvent): void {