Created
April 10, 2021 20:42
-
-
Save creativecreatorormaybenot/8c9b0c993768800ad27085c926acf6d3 to your computer and use it in GitHub Desktop.
Flutter web keyboard & mouse utilities
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // https://editor.rive.app | |
| <body> | |
| <script> | |
| document.body.addEventListener("contextmenu", function (event) { | |
| event.preventDefault(); | |
| }); | |
| </script> | |
| <!-- Handle keyboard input events --> | |
| <script> | |
| window.addEventListener("keydown", function (event) { | |
| if (event.metaKey || event.ctrlKey) { | |
| // When ctrl or meta is pressed we want to suppress some default bound | |
| // browser actions (like CMD+Plus/Minus to zoom). | |
| switch (event.keyCode) { | |
| case 68: // 'd' for duplication | |
| case 71: // 'g' for grouping | |
| case 187: // '=' for zoom in | |
| case 189: // '-' for zoom out | |
| case 90: // 'z' for preventing opening a previous tab in Safari | |
| case 221: // ']' for changing draw order | |
| case 219: // '[' for changing draw order | |
| case 37: // left arrow for moving keys: #1786 | |
| case 39: // right arrow for moving keys: #1786 | |
| case 188: // , #1835 | |
| // Needs to be removed as it kills text copy | |
| // case 67: // 'c' for preventing negative beep on Safari | |
| event.preventDefault(); | |
| break; | |
| // default: | |
| // console.log('Keycode pressed: ' + event.keyCode); | |
| } | |
| } | |
| // Suppress backspace triggering a navigate back action. | |
| if (event.keyCode == 8 && event.target == document.body) { | |
| event.preventDefault(); | |
| } | |
| }); | |
| </script> | |
| <!-- Disable mousewheel zoom scrolling on Windows --> | |
| <script> | |
| document.addEventListener("wheel", (e) => (e.ctrlKey) | |
| && e.preventDefault(), { passive: false }); | |
| </script> | |
| </body> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // https://editor.rive.app/assets/assets/web/mouse-wheel.js | |
| var PIXEL_STEP = 10; | |
| var LINE_HEIGHT = 4; | |
| var PAGE_HEIGHT = 800; | |
| function platform() { | |
| var name="Unknown OS"; | |
| if (navigator.appVersion.indexOf("Win")!=-1) name="Windows"; | |
| else if (navigator.appVersion.indexOf("Mac")!=-1) name="MacOS"; | |
| else if (navigator.appVersion.indexOf("X11")!=-1) name="UNIX"; | |
| else if (navigator.appVersion.indexOf("Linux")!=-1) name="Linux"; | |
| return name; | |
| } | |
| window.addEventListener('wheel', function (event) { | |
| // var propValue; | |
| // for(var propName in event) { | |
| // propValue = event[propName]; | |
| // console.log(propName,propValue); | |
| // } | |
| var sX = 0, | |
| sY = 0, // spinX, spinY | |
| pX = 0, | |
| pY = 0; // pixelX, pixelY | |
| // Legacy | |
| if ('detail' in event) { | |
| sY = event.detail; | |
| } | |
| if ('wheelDelta' in event) { | |
| sY = -event.wheelDelta / 120; | |
| } | |
| if ('wheelDeltaY' in event) { | |
| sY = -event.wheelDeltaY / 120; | |
| } | |
| if ('wheelDeltaX' in event) { | |
| sX = -event.wheelDeltaX / 120; | |
| } | |
| // side scrolling on FF with DOMMouseScroll | |
| // also force side scrolling when shift is held down | |
| if (('axis' in event && event.axis === event.HORIZONTAL_AXIS) || event.shiftKey) { | |
| sX = sY; | |
| sY = 0; | |
| } | |
| pX = sX * PIXEL_STEP; | |
| pY = sY * PIXEL_STEP; | |
| // On Windows browsers, the default appears to have deltas in 100 increments, | |
| // and there's no acceleration (i.e. always 100 increments). | |
| // So for Windows, we will reduce the increments to 10 as a hackity hack hack | |
| if ('deltaY' in event) { | |
| const delta = (platform() === "Windows" && event.deltaY !== 0) | |
| ? 10 * (event.deltaY >= 0 ? 1 : -1) | |
| : event.deltaY; | |
| if (!event.shiftKey) { | |
| pY = delta; | |
| } else { | |
| pX = delta; | |
| } | |
| } | |
| if ('deltaX' in event) { | |
| const delta = (platform() === "Windows" && event.deltaX !== 0) | |
| ? 10 * (event.deltaX >= 0 ? 1 : -1) | |
| : event.deltaX; | |
| if (!event.shiftKey || event.deltaX !== 0) { | |
| pX = delta; | |
| } | |
| } | |
| if ((pX || pY) && event.deltaMode) { | |
| if (event.deltaMode == 1) { // delta in LINE units | |
| pX *= LINE_HEIGHT; | |
| pY *= LINE_HEIGHT; | |
| } else { // delta in PAGE units | |
| pX *= PAGE_HEIGHT; | |
| pY *= PAGE_HEIGHT; | |
| } | |
| } | |
| // Fall-back if spin cannot be determined | |
| if (pX && !sX) { | |
| sX = (pX < 1) ? -1 : 1; | |
| } | |
| if (pY && !sY) { | |
| sY = (pY < 1) ? -1 : 1; | |
| } | |
| var normalized = { | |
| spinX: sX, | |
| spinY: sY, | |
| pixelX: pX, | |
| pixelY: pY | |
| }; | |
| if (typeof scrolledMouseWheel != 'undefined') { | |
| scrolledMouseWheel(pX, pY, event.ctrlKey); | |
| } | |
| }, false); | |
| var lastScale = 1; | |
| window.addEventListener("gesturestart", function (e) { | |
| e.preventDefault(); | |
| lastScale = e.scale; | |
| }); | |
| window.addEventListener("gesturechange", function (e) { | |
| e.preventDefault(); | |
| var scaleDelta = e.scale - lastScale; | |
| lastScale = e.scale; | |
| if (typeof scrolledMouseWheel != 'undefined') { | |
| scrolledMouseWheel(0, -scaleDelta * 100, true); | |
| } | |
| }); | |
| window.addEventListener("gestureend", function (e) { | |
| e.preventDefault(); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment