in src/js/popup.js [802:892]
async prepare() {
const fragment = document.createDocumentFragment();
const identities = Logic.identities();
for (const identity of identities) {
const tr = document.createElement("tr");
tr.classList.add("menu-item", "hover-highlight", "keyboard-nav", "keyboard-right-arrow-override");
tr.setAttribute("tabindex", "0");
tr.setAttribute("data-cookie-store-id", identity.cookieStoreId);
const td = document.createElement("td");
const openTabs = identity.numberOfOpenTabs || "" ;
// TODO get UX and content decision on how to message and block clicks to containers with Mozilla VPN proxy configs
// when Mozilla VPN app is disconnected.
td.innerHTML = Utils.escaped`
<div data-moz-proxy-warning="" class="menu-item-name">
<div class="menu-icon">
<div class="usercontext-icon"
data-identity-icon="${identity.icon}"
data-identity-color="${identity.color}">
</div>
</div>
<span class="menu-text">${identity.name}</span>
</div>
<span class="menu-right-float">
<img alt="" class="always-open-in-flag flag-img" src="/img/flags/.png"/>
<span class="container-count">${openTabs}</span>
<span class="menu-arrow">
<img alt="Container Info" src="/img/arrow-icon-right.svg" />
</span>
</span>`;
fragment.appendChild(tr);
tr.appendChild(td);
const openInThisContainer = tr.querySelector(".menu-item-name");
Utils.addEnterHandler(openInThisContainer, (e) => {
e.preventDefault();
if (openInThisContainer.dataset.mozProxyWarning === "proxy-unavailable") {
return;
}
try {
browser.tabs.create({
cookieStoreId: identity.cookieStoreId
});
window.close();
} catch (e) {
window.close();
}
});
Utils.addEnterOnlyHandler(tr, () => {
try {
browser.tabs.create({
cookieStoreId: identity.cookieStoreId
});
window.close();
} catch (e) {
window.close();
}
});
// Select only the ">" from the container list
const showPanelButton = tr.querySelector(".menu-right-float");
Utils.addEnterHandler(showPanelButton, () => {
Logic.showPanel(P_CONTAINER_INFO, identity);
});
}
const list = document.querySelector("#identities-list");
list.innerHTML = "";
list.appendChild(fragment);
document.addEventListener("keydown", Logic.keyboardNavListener);
document.addEventListener("keydown", Logic.shortcutListener);
document.addEventListener("input", Logic.filterContainerList);
MozillaVPN.handleContainerList(identities);
// reset path
this._previousPanelPath = [];
return Promise.resolve();
},