mirror of
https://github.com/zombieFox/nightTab.git
synced 2025-03-14 14:48:13 +01:00
[refactor] improve modal focus
This commit is contained in:
parent
65e84f4470
commit
3e6084b9ea
@ -1,31 +1,5 @@
|
||||
var menu = (function() {
|
||||
|
||||
var bind = {};
|
||||
|
||||
bind.focus = {
|
||||
loop: function(event) {
|
||||
var firstElement = helper.e(".control-menu-layout");
|
||||
var lastElement = helper.e(".menu-close-tab");
|
||||
if (event.keyCode == 9 && event.shiftKey) {
|
||||
if (document.activeElement === firstElement) {
|
||||
lastElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
} else if (event.keyCode == 9) {
|
||||
if (document.activeElement === lastElement) {
|
||||
firstElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
},
|
||||
add: function() {
|
||||
window.addEventListener("keydown", bind.focus.loop, false);
|
||||
},
|
||||
remove: function() {
|
||||
window.removeEventListener("keydown", bind.focus.loop, false);
|
||||
}
|
||||
};
|
||||
|
||||
var mod = {};
|
||||
|
||||
mod.open = function() {
|
||||
@ -64,6 +38,32 @@ var menu = (function() {
|
||||
}
|
||||
};
|
||||
|
||||
var bind = {};
|
||||
|
||||
bind.focus = {
|
||||
loop: function(event) {
|
||||
var firstElement = helper.e(".control-menu-layout");
|
||||
var lastElement = helper.e(".menu-close-tab");
|
||||
if (event.keyCode == 9 && event.shiftKey) {
|
||||
if (document.activeElement === firstElement) {
|
||||
lastElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
} else if (event.keyCode == 9) {
|
||||
if (document.activeElement === lastElement) {
|
||||
firstElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
},
|
||||
add: function() {
|
||||
window.addEventListener("keydown", bind.focus.loop, false);
|
||||
},
|
||||
remove: function() {
|
||||
window.removeEventListener("keydown", bind.focus.loop, false);
|
||||
}
|
||||
};
|
||||
|
||||
render = {};
|
||||
|
||||
render.panel = function() {
|
||||
@ -257,6 +257,7 @@ var menu = (function() {
|
||||
return {
|
||||
init: init,
|
||||
mod: mod,
|
||||
bind: bind,
|
||||
render: render,
|
||||
open: open,
|
||||
close: close,
|
||||
|
@ -20,6 +20,33 @@ var modal = (function() {
|
||||
});
|
||||
};
|
||||
|
||||
var bind = {};
|
||||
|
||||
bind.focus = {
|
||||
loop: function(event) {
|
||||
var allElements = helper.e(".modal").querySelectorAll("[tabindex]");
|
||||
var firstElement = allElements[0];
|
||||
var lastElement = allElements[allElements.length - 1];
|
||||
if (event.keyCode == 9 && event.shiftKey) {
|
||||
if (document.activeElement === firstElement) {
|
||||
lastElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
} else if (event.keyCode == 9) {
|
||||
if (document.activeElement === lastElement) {
|
||||
firstElement.focus();
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
},
|
||||
add: function() {
|
||||
window.addEventListener("keydown", bind.focus.loop, false);
|
||||
},
|
||||
remove: function() {
|
||||
window.removeEventListener("keydown", bind.focus.loop, false);
|
||||
}
|
||||
};
|
||||
|
||||
var render = {};
|
||||
|
||||
render.toggle = function(override) {
|
||||
@ -144,11 +171,13 @@ var modal = (function() {
|
||||
var open = function(override) {
|
||||
mod.open();
|
||||
render.open(override);
|
||||
bind.focus.add();
|
||||
};
|
||||
|
||||
var close = function() {
|
||||
mod.close();
|
||||
render.close();
|
||||
bind.focus.remove();
|
||||
};
|
||||
|
||||
var init = function() {
|
||||
@ -160,6 +189,7 @@ var modal = (function() {
|
||||
return {
|
||||
init: init,
|
||||
mod: mod,
|
||||
bind: bind,
|
||||
render: render,
|
||||
open: open,
|
||||
close: close
|
||||
|
Loading…
Reference in New Issue
Block a user