From a46c23b10f972ee235e282e7d79de2e9e7a91d68 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Fri, 5 May 2023 22:48:27 -0600 Subject: [PATCH 1/5] Make gamepad navigation optional --- javascript/imageviewerGamepad.js | 61 +++++++++++++++----------------- modules/shared.py | 1 + 2 files changed, 30 insertions(+), 32 deletions(-) diff --git a/javascript/imageviewerGamepad.js b/javascript/imageviewerGamepad.js index 29bd7140..db932bca 100644 --- a/javascript/imageviewerGamepad.js +++ b/javascript/imageviewerGamepad.js @@ -1,36 +1,33 @@ - let delay = 350//ms - window.addEventListener('gamepadconnected', (e) => { - console.log("Gamepad connected!") - const gamepad = e.gamepad; - setInterval(() => { - const xValue = gamepad.axes[0].toFixed(2); - if (xValue < -0.3) { - modalPrevImage(e); - } else if (xValue > 0.3) { - modalNextImage(e); - } - - }, delay); - }); - - - /* - Primarily for vr controller type pointer devices. - I use the wheel event because there's currently no way to do it properly with web xr. - */ - - let isScrolling = false; - window.addEventListener('wheel', (e) => { - if (isScrolling) return; - isScrolling = true; - - if (e.deltaX <= -0.6) { +const delay = 250//ms +window.addEventListener('gamepadconnected', (e) => { + setInterval(() => { + if (!opts.js_modal_lightbox_gamepad) return; + const gamepad = navigator.getGamepads()[0]; + const xValue = gamepad.axes[0]; + if (xValue < -0.3) { modalPrevImage(e); - } else if (e.deltaX >= 0.6) { + } else if (xValue > 0.3) { modalNextImage(e); } + }, delay); +}); - setTimeout(() => { - isScrolling = false; - }, delay); - }); \ No newline at end of file +/* +Primarily for vr controller type pointer devices. +I use the wheel event because there's currently no way to do it properly with web xr. + */ +let isScrolling = false; +window.addEventListener('wheel', (e) => { + if (!opts.js_modal_lightbox_gamepad || isScrolling) return; + isScrolling = true; + + if (e.deltaX <= -0.6) { + modalPrevImage(e); + } else if (e.deltaX >= 0.6) { + modalNextImage(e); + } + + setTimeout(() => { + isScrolling = false; + }, delay); +}); diff --git a/modules/shared.py b/modules/shared.py index 6a2b3c2b..977ff16b 100644 --- a/modules/shared.py +++ b/modules/shared.py @@ -399,6 +399,7 @@ options_templates.update(options_section(('ui', "User interface"), { "font": OptionInfo("", "Font for image grids that have text"), "js_modal_lightbox": OptionInfo(True, "Enable full page image viewer"), "js_modal_lightbox_initially_zoomed": OptionInfo(True, "Show images zoomed in by default in full page image viewer"), + "js_modal_lightbox_gamepad": OptionInfo(True, "Navagete image viewer with gamepad"), "show_progress_in_title": OptionInfo(True, "Show generation progress in window title."), "samplers_in_dropdown": OptionInfo(True, "Use dropdown for sampler selection instead of radio group"), "dimensions_and_batch_together": OptionInfo(True, "Show Width/Height and Batch sliders in same row"), From 5cbc1c5d438e9ca7384a26eab28a09f44c5162f2 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Fri, 5 May 2023 23:03:32 -0600 Subject: [PATCH 2/5] Fix spelling --- modules/shared.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/shared.py b/modules/shared.py index 977ff16b..b3ca8401 100644 --- a/modules/shared.py +++ b/modules/shared.py @@ -399,7 +399,7 @@ options_templates.update(options_section(('ui', "User interface"), { "font": OptionInfo("", "Font for image grids that have text"), "js_modal_lightbox": OptionInfo(True, "Enable full page image viewer"), "js_modal_lightbox_initially_zoomed": OptionInfo(True, "Show images zoomed in by default in full page image viewer"), - "js_modal_lightbox_gamepad": OptionInfo(True, "Navagete image viewer with gamepad"), + "js_modal_lightbox_gamepad": OptionInfo(True, "Navigate image viewer with gamepad"), "show_progress_in_title": OptionInfo(True, "Show generation progress in window title."), "samplers_in_dropdown": OptionInfo(True, "Use dropdown for sampler selection instead of radio group"), "dimensions_and_batch_together": OptionInfo(True, "Show Width/Height and Batch sliders in same row"), From cca5782d183c389e46a822a6e0abc4f8fd2d8df8 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Sat, 6 May 2023 22:00:13 -0600 Subject: [PATCH 3/5] Improve joypad performance --- javascript/imageviewerGamepad.js | 36 ++++++++++++++++++++++++++------ 1 file changed, 30 insertions(+), 6 deletions(-) diff --git a/javascript/imageviewerGamepad.js b/javascript/imageviewerGamepad.js index db932bca..f25f0857 100644 --- a/javascript/imageviewerGamepad.js +++ b/javascript/imageviewerGamepad.js @@ -1,15 +1,27 @@ -const delay = 250//ms +const delay = 350//ms +let isWaiting = false; window.addEventListener('gamepadconnected', (e) => { - setInterval(() => { - if (!opts.js_modal_lightbox_gamepad) return; + setInterval(async () => { + if (!opts.js_modal_lightbox_gamepad || isWaiting) return; const gamepad = navigator.getGamepads()[0]; const xValue = gamepad.axes[0]; - if (xValue < -0.3) { + if (xValue <= -0.3) { modalPrevImage(e); - } else if (xValue > 0.3) { + isWaiting = true; + } else if (xValue >= 0.3) { modalNextImage(e); + isWaiting = true; } - }, delay); + if (isWaiting) { + await sleepUntil(() => { + const xValue = navigator.getGamepads()[0].axes[0] + if (xValue < 0.3 && xValue > -0.3) { + return true; + } + }, delay); + isWaiting = false; + } + }, 10); }); /* @@ -31,3 +43,15 @@ window.addEventListener('wheel', (e) => { isScrolling = false; }, delay); }); + +function sleepUntil(f, timeout) { + return new Promise((resolve) => { + const timeStart = new Date(); + const wait = setInterval(function() { + if (f() || new Date() - timeStart > timeout) { + clearInterval(wait); + resolve(); + } + }, 20); + }); +} From 99f3bf07d2976211eed81a9293a447c7ead2d893 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Sat, 6 May 2023 22:16:51 -0600 Subject: [PATCH 4/5] gamepad repeat option --- javascript/imageviewerGamepad.js | 5 ++--- modules/shared.py | 1 + 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/javascript/imageviewerGamepad.js b/javascript/imageviewerGamepad.js index f25f0857..d24b7b97 100644 --- a/javascript/imageviewerGamepad.js +++ b/javascript/imageviewerGamepad.js @@ -1,4 +1,3 @@ -const delay = 350//ms let isWaiting = false; window.addEventListener('gamepadconnected', (e) => { setInterval(async () => { @@ -18,7 +17,7 @@ window.addEventListener('gamepadconnected', (e) => { if (xValue < 0.3 && xValue > -0.3) { return true; } - }, delay); + }, opts.js_modal_lightbox_gamepad_repeat); isWaiting = false; } }, 10); @@ -41,7 +40,7 @@ window.addEventListener('wheel', (e) => { setTimeout(() => { isScrolling = false; - }, delay); + }, opts.js_modal_lightbox_gamepad_repeat); }); function sleepUntil(f, timeout) { diff --git a/modules/shared.py b/modules/shared.py index b3ca8401..d8d2bc78 100644 --- a/modules/shared.py +++ b/modules/shared.py @@ -400,6 +400,7 @@ options_templates.update(options_section(('ui', "User interface"), { "js_modal_lightbox": OptionInfo(True, "Enable full page image viewer"), "js_modal_lightbox_initially_zoomed": OptionInfo(True, "Show images zoomed in by default in full page image viewer"), "js_modal_lightbox_gamepad": OptionInfo(True, "Navigate image viewer with gamepad"), + "js_modal_lightbox_gamepad_repeat": OptionInfo(250, "Gamepad repeat period, in milliseconds"), "show_progress_in_title": OptionInfo(True, "Show generation progress in window title."), "samplers_in_dropdown": OptionInfo(True, "Use dropdown for sampler selection instead of radio group"), "dimensions_and_batch_together": OptionInfo(True, "Show Width/Height and Batch sliders in same row"), From 85bd9b3d31474c0bb4b209519f3f4179ccda2539 Mon Sep 17 00:00:00 2001 From: missionfloyd Date: Sat, 6 May 2023 22:47:35 -0600 Subject: [PATCH 5/5] Work with multiple gamepads --- javascript/imageviewerGamepad.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/javascript/imageviewerGamepad.js b/javascript/imageviewerGamepad.js index d24b7b97..6297a12b 100644 --- a/javascript/imageviewerGamepad.js +++ b/javascript/imageviewerGamepad.js @@ -1,8 +1,9 @@ -let isWaiting = false; window.addEventListener('gamepadconnected', (e) => { + const index = e.gamepad.index; + let isWaiting = false; setInterval(async () => { if (!opts.js_modal_lightbox_gamepad || isWaiting) return; - const gamepad = navigator.getGamepads()[0]; + const gamepad = navigator.getGamepads()[index]; const xValue = gamepad.axes[0]; if (xValue <= -0.3) { modalPrevImage(e); @@ -13,7 +14,7 @@ window.addEventListener('gamepadconnected', (e) => { } if (isWaiting) { await sleepUntil(() => { - const xValue = navigator.getGamepads()[0].axes[0] + const xValue = navigator.getGamepads()[index].axes[0] if (xValue < 0.3 && xValue > -0.3) { return true; }