Merge pull request #1524 from dnahol/1009-arrows

added right and left arrow shortcuts for container submenu tabs
This commit is contained in:
luke crouch 2019-10-25 10:42:57 -05:00 committed by GitHub
commit 3e5334e9b0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -289,7 +289,13 @@ const Logic = {
}
}
});
document.querySelector(this.getPanelSelector(this._panels[panel])).classList.remove("hide");
const panelEl = document.querySelector(this.getPanelSelector(this._panels[panel]));
panelEl.classList.remove("hide");
const focusEl = panelEl.querySelector(".firstTabindex");
if(focusEl) {
focusEl.focus();
}
},
showPreviousPanel() {
@ -550,6 +556,22 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
case 38:
previous();
break;
case 39:
{
const showTabs = element.parentNode.querySelector(".show-tabs");
if(showTabs) {
showTabs.click();
}
break;
}
case 37:
{
const hideTabs = document.querySelector(".panel-back-arrow");
if(hideTabs) {
hideTabs.click();
}
break;
}
default:
if ((e.keyCode >= 49 && e.keyCode <= 57) &&
Logic._currentPanel === "containersList") {
@ -635,7 +657,7 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
tr.classList.add("container-panel-row");
context.classList.add("userContext-wrapper", "open-newtab", "clickable");
context.classList.add("userContext-wrapper", "open-newtab", "clickable", "firstTabindex");
manage.classList.add("show-tabs", "pop-button");
manage.setAttribute("title", `View ${identity.name} container`);
context.setAttribute("tabindex", "0");
@ -713,11 +735,15 @@ Logic.registerPanel(P_CONTAINER_INFO, {
// This method is called when the object is registered.
async initialize() {
Logic.addEnterHandler(document.querySelector("#close-container-info-panel"), () => {
const closeContEl = document.querySelector("#close-container-info-panel");
closeContEl.setAttribute("tabindex", "0");
closeContEl.classList.add("firstTabindex");
Logic.addEnterHandler(closeContEl, () => {
Logic.showPreviousPanel();
});
Logic.addEnterHandler(document.querySelector("#container-info-hideorshow"), async () => {
const hideContEl = document.querySelector("#container-info-hideorshow");
hideContEl.setAttribute("tabindex", "0");
Logic.addEnterHandler(hideContEl, async () => {
const identity = Logic.currentIdentity();
try {
browser.runtime.sendMessage({
@ -741,6 +767,7 @@ Logic.registerPanel(P_CONTAINER_INFO, {
throw new Error("Could not check for incompatible add-ons.");
}
const moveTabsEl = document.querySelector("#container-info-movetabs");
moveTabsEl.setAttribute("tabindex","0");
const numTabs = await Logic.numTabs();
if (incompatible) {
Logic._disableMoveTabs("Moving container tabs is incompatible with Pulse, PageShot, and SnoozeTabs.");
@ -807,6 +834,7 @@ Logic.registerPanel(P_CONTAINER_INFO, {
<td></td>
<td class="container-info-tab-title truncate-text" title="${tab.url}" ><div class="container-tab-title">${tab.title}</div></td>`;
tr.querySelector("td").appendChild(Utils.createFavIconElement(tab.favIconUrl));
tr.setAttribute("tabindex", "0");
document.getElementById("container-info-table").appendChild(fragment);
// On click, we activate this tab. But only if this tab is active.
@ -1154,4 +1182,4 @@ window.addEventListener("resize", function () {
root.style.setProperty("--overflow-size", difference + "px");
root.style.setProperty("--icon-fit", "12");
}
});
});