[egui_web] Call prevent_default for arrow keys when entering text

Closes https://github.com/emilk/egui/issues/58
This commit is contained in:
Emil Ernerfeldt 2021-01-17 12:22:19 +01:00
parent 718eec4b89
commit b869db728b
3 changed files with 36 additions and 19 deletions

View file

@ -15,6 +15,10 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
* Slightly improved alpha-blending (work-around for non-existing linear-space blending).
### Fixed ⭐
* Call prevent_default for arrow keys when entering text
## 0.7.0 - 2021-01-04

View file

@ -154,6 +154,10 @@ impl AppRunner {
})
}
pub fn egui_ctx(&self) -> &egui::CtxRef {
&self.web_backend.ctx
}
pub fn auto_save(&mut self) {
let now = now_sec();
let time_since_last_save = now - self.last_save_time;

View file

@ -452,25 +452,34 @@ fn install_document_events(runner_ref: &AppRunnerRef) -> Result<(), JsValue> {
}
runner_lock.needs_repaint.set_true();
// So, shall we call prevent_default?
// YES:
// * Tab (move to next text field)
//
// SOMETIMES:
// * Backspace - when entering text we don't want to go back one page.
//
// NO:
// * F5 / cmd-R (refresh)
// * cmd-shift-C (debug tools)
// * ...
//
// NOTE: if we call prevent_default for cmd-c/v/x, we will prevent copy/paste/cut events.
// Let's do things manually for now:
if matches!(
let egui_wants_keyboard = runner_lock.egui_ctx().wants_keyboard_input();
let prevent_default = if matches!(event.key().as_str(), "Tab") {
// Always prevent moving cursor to url bar.
// Egui wants to use tab to move to the next text field.
true
} else if egui_wants_keyboard {
matches!(
event.key().as_str(),
"Backspace" // so we don't go back to previous page when deleting text
| "Tab" // so that e.g. tab doesn't move focus to url bar
) {
| "ArrowDown" | "ArrowLeft" | "ArrowRight" | "ArrowUp" // cmd-left is "back" on Mac (https://github.com/emilk/egui/issues/58)
)
} else {
// We never want to prevent:
// * F5 / cmd-R (refresh)
// * cmd-shift-C (debug tools)
// * cmd/ctrl-c/v/x (or we stop copy/past/cut events)
false
};
// console_log(format!(
// "On key-down {:?}, egui_wants_keyboard: {}, prevent_default: {}",
// event.key().as_str(),
// egui_wants_keyboard,
// prevent_default
// ));
if prevent_default {
event.prevent_default();
}
}) as Box<dyn FnMut(_)>);