simplify/generalize close-on-esc
This commit is contained in:
parent
b75e2cb56b
commit
5ff664f9b9
|
@ -213,7 +213,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<template data-id="keymapHelp">
|
<template data-id="keymapHelp">
|
||||||
<table class="keymap-list can-close-on-esc">
|
<table class="keymap-list">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th><input i18n="placeholder:helpKeyMapHotkey" type="search"></th>
|
<th><input i18n="placeholder:helpKeyMapHotkey" type="search"></th>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<div>
|
<div>
|
||||||
<fieldset class="style-settings can-close-on-esc">
|
<fieldset class="style-settings">
|
||||||
<div class="rel">
|
<div class="rel">
|
||||||
<input id="ss-updatable" type="checkbox">
|
<input id="ss-updatable" type="checkbox">
|
||||||
<svg class="svg-icon checked"><use xlink:href="#svg-icon-checked"/></svg>
|
<svg class="svg-icon checked"><use xlink:href="#svg-icon-checked"/></svg>
|
||||||
|
|
21
edit/util.js
21
edit/util.js
|
@ -29,35 +29,32 @@ const helpPopup = {
|
||||||
div.style.display = 'block';
|
div.style.display = 'block';
|
||||||
helpPopup.originalFocus = document.activeElement;
|
helpPopup.originalFocus = document.activeElement;
|
||||||
helpPopup.div = div;
|
helpPopup.div = div;
|
||||||
|
moveFocus(div, 0);
|
||||||
return div;
|
return div;
|
||||||
},
|
},
|
||||||
|
|
||||||
close(event) {
|
close(event) {
|
||||||
|
let el;
|
||||||
const canClose =
|
const canClose =
|
||||||
!event ||
|
!event ||
|
||||||
event.type === 'click' || (
|
event.type === 'click' ||
|
||||||
getEventKeyName(event) === 'Escape' &&
|
getEventKeyName(event) === 'Escape' && !$('.CodeMirror-hints, #message-box') && (
|
||||||
!$('.CodeMirror-hints, #message-box') && (
|
!(el = document.activeElement) ||
|
||||||
!document.activeElement ||
|
!el.closest('#search-replace-dialog')
|
||||||
!document.activeElement.closest('#search-replace-dialog') && (
|
|
||||||
document.activeElement.tagName !== 'INPUT' ||
|
|
||||||
document.activeElement.closest('.can-close-on-esc')
|
|
||||||
)
|
|
||||||
)
|
|
||||||
);
|
);
|
||||||
const {div} = helpPopup;
|
const {div} = helpPopup;
|
||||||
if (!canClose || !div) {
|
if (!canClose || !div) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (event && div.codebox && !div.codebox.options.readOnly && !div.codebox.isClean()) {
|
if (event && (el = div.codebox) && !el.options.readOnly && !el.isClean()) {
|
||||||
setTimeout(async () => {
|
setTimeout(async () => {
|
||||||
const ok = await messageBoxProxy.confirm(t('confirmDiscardChanges'));
|
const ok = await messageBoxProxy.confirm(t('confirmDiscardChanges'));
|
||||||
return ok && helpPopup.close();
|
return ok && helpPopup.close();
|
||||||
});
|
});
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (div.contains(document.activeElement) && helpPopup.originalFocus) {
|
if (div.contains(document.activeElement) && (el = helpPopup.originalFocus)) {
|
||||||
helpPopup.originalFocus.focus();
|
el.focus();
|
||||||
}
|
}
|
||||||
const contents = $('.contents', div);
|
const contents = $('.contents', div);
|
||||||
div.style.display = '';
|
div.style.display = '';
|
||||||
|
|
|
@ -64,10 +64,6 @@ messageBox.show = async ({
|
||||||
/config-dialog/.test(className)) {
|
/config-dialog/.test(className)) {
|
||||||
moveFocus(messageBox.element, 1);
|
moveFocus(messageBox.element, 1);
|
||||||
}
|
}
|
||||||
// suppress focus outline when invoked via click
|
|
||||||
if (focusAccessibility.lastFocusedViaClick && document.activeElement) {
|
|
||||||
document.activeElement.dataset.focusedViaClick = '';
|
|
||||||
}
|
|
||||||
if (document.activeElement === messageBox._originalFocus) {
|
if (document.activeElement === messageBox._originalFocus) {
|
||||||
document.body.focus();
|
document.body.focus();
|
||||||
}
|
}
|
||||||
|
|
|
@ -268,6 +268,8 @@ function moveFocus(rootElement, step) {
|
||||||
const el = elements[(activeIndex + i * step + num) % num];
|
const el = elements[(activeIndex + i * step + num) % num];
|
||||||
if (!el.disabled && el.tabIndex >= 0) {
|
if (!el.disabled && el.tabIndex >= 0) {
|
||||||
el.focus();
|
el.focus();
|
||||||
|
// suppress focus outline when invoked via click
|
||||||
|
toggleDataset(el, 'focusedViaClick', focusAccessibility.lastFocusedViaClick);
|
||||||
return activeEl !== el && el;
|
return activeEl !== el && el;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user