rowan/multi-account-containers
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Recording - fix adding duplicate event listeners when re-showing main container list panel in popup.

Browse source
This commit is contained in:
Francis McKenzie 2021-02-15 16:54:42 +01:00
parent f15d1984a9
commit 914b1a1c19
1 changed files with 64 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

93
src/js/popup.js
View file

@ -623,6 +623,36 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
} }
}); });
this.getAssignmentCheckbox().addEventListener("change", async () => {
const currentTab = await Logic.currentTab();
if (!currentTab || !currentTab.cookieStoreId) { return; }
const currentTabUserContextId = Logic.userContextId(currentTab.cookieStoreId);
Logic.setOrRemoveAssignment(currentTab.id, currentTab.url, currentTabUserContextId, !this.getAssignmentCheckbox().checked);
});
Logic.addEnterHandler(this.getRecordButton(), async () => {
const currentTab = await Logic.currentTab();
if (!currentTab || !currentTab.cookieStoreId) { return; }
if (!this.isRecordingEnabled()) { return; }
const newRecordingTab = this.isRecordingActive() ? null : currentTab;
let showingPanel;
try {
// Show new recording started/stopped status
this.setRecordingActiveAndEnabled(!!newRecordingTab, true);
// Show recording panel
if (newRecordingTab) { showingPanel = Logic.showPanel(P_CONTAINER_RECORD); }
// Start/stop recording
await Logic.setRecordingTab(newRecordingTab);
} catch (e) {
// Failed - revert recording started/stopped status
this.setRecordingActiveAndEnabled(!newRecordingTab, true);
try { await showingPanel; } catch (e) { /* Ignore show error, as we're immediately going to change panel */ }
Logic.showPanel(P_CONTAINERS_LIST);
throw new Error("Failed to " + (newRecordingTab ? "start" : "stop") + " recording: " + e.message);
}
});
document.addEventListener("keydown", (e) => { document.addEventListener("keydown", (e) => {
const selectables = [...document.querySelectorAll("[tabindex='0'], [tabindex='-1']")]; const selectables = [...document.querySelectorAll("[tabindex='0'], [tabindex='-1']")];
const element = document.activeElement; const element = document.activeElement;
@ -701,8 +731,12 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
browser.tabs.onUpdated.removeListener(this.tabUpdateHandler); browser.tabs.onUpdated.removeListener(this.tabUpdateHandler);
}, },
getAssignmentCheckbox() {
return document.getElementById("container-page-assigned");
},
setupAssignmentCheckbox(siteSettings, currentUserContextId) { setupAssignmentCheckbox(siteSettings, currentUserContextId) {
const assignmentCheckboxElement = document.getElementById("container-page-assigned"); const assignmentCheckboxElement = this.getAssignmentCheckbox();
let checked = false; let checked = false;
if (siteSettings && Number(siteSettings.userContextId) === currentUserContextId) { if (siteSettings && Number(siteSettings.userContextId) === currentUserContextId) {
checked = true; checked = true;
@ -715,33 +749,33 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
assignmentCheckboxElement.disabled = disabled; assignmentCheckboxElement.disabled = disabled;
}, },
getRecordButton() {
return document.getElementById("record-link");
},
isRecordingEnabled() { isRecordingEnabled() {
const recordLinkElement = document.getElementById("record-link"); return !this.getRecordButton().classList.contains("disabled");
if (recordLinkElement.classList.contains("disabled")) { return false; }
return true;
}, },
isRecordingActive() { isRecordingActive() {
const recordLinkElement = document.getElementById("record-link"); return this.getRecordButton().classList.contains("active");
if (recordLinkElement.classList.contains("active")) { return true; }
return false;
}, },
setRecordingActiveAndEnabled(isActive, isEnabled) { setRecordingActiveAndEnabled(isActive, isEnabled) {
const recordLinkElement = document.getElementById("record-link"); const recordButton = this.getRecordButton();
const recordIconElement = recordLinkElement.querySelector(".icon"); const recordButtonIcon = recordButton.querySelector(".icon");
if (!isEnabled) { if (!isEnabled) {
recordIconElement.src = CONTAINER_RECORD_DISABLED_SRC; recordButtonIcon.src = CONTAINER_RECORD_DISABLED_SRC;
recordLinkElement.classList.remove("active"); recordButton.classList.remove("active");
recordLinkElement.classList.add("disabled"); recordButton.classList.add("disabled");
} else { } else {
recordIconElement.src = CONTAINER_RECORD_ENABLED_SRC; recordButtonIcon.src = CONTAINER_RECORD_ENABLED_SRC;
recordLinkElement.classList.remove("disabled"); recordButton.classList.remove("disabled");
if (isActive) { if (isActive) {
recordLinkElement.classList.add("active"); recordButton.classList.add("active");
} else { } else {
recordLinkElement.classList.remove("active"); recordButton.classList.remove("active");
} }
} }
}, },
@ -749,34 +783,7 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
async prepareCurrentTabHeader() { async prepareCurrentTabHeader() {
const currentTab = await Logic.currentTab(); const currentTab = await Logic.currentTab();
const currentTabElement = document.getElementById("current-tab"); const currentTabElement = document.getElementById("current-tab");
const assignmentCheckboxElement = document.getElementById("container-page-assigned");
const recordLinkElement = document.getElementById("record-link");
const currentTabUserContextId = Logic.userContextId(currentTab.cookieStoreId); const currentTabUserContextId = Logic.userContextId(currentTab.cookieStoreId);
assignmentCheckboxElement.addEventListener("change", () => {
Logic.setOrRemoveAssignment(currentTab.id, currentTab.url, currentTabUserContextId, !assignmentCheckboxElement.checked);
});
Logic.addEnterHandler(recordLinkElement, async () => {
const currentTab = await Logic.currentTab();
if (!currentTab) { return; }
if (!this.isRecordingEnabled()) { return; }
const newRecordingTab = this.isRecordingActive() ? null : currentTab;
let showingPanel;
try {
// Show new recording started/stopped status
this.setRecordingActiveAndEnabled(!!newRecordingTab, true);
// Show recording panel
if (newRecordingTab) { showingPanel = Logic.showPanel(P_CONTAINER_RECORD); }
// Start/stop recording
await Logic.setRecordingTab(newRecordingTab);
} catch (e) {
// Failed - revert recording started/stopped status
this.setRecordingActiveAndEnabled(!newRecordingTab, true);
try { await showingPanel; } catch (e) { /* Ignore show error, as we're immediately going to change panel */ }
Logic.showPanel(P_CONTAINERS_LIST);
throw new Error("Failed to " + (newRecordingTab ? "start" : "stop") + " recording: " + e.message);
}
});
currentTabElement.hidden = !currentTab; currentTabElement.hidden = !currentTab;
this.setupAssignmentCheckbox(false, currentTabUserContextId); this.setupAssignmentCheckbox(false, currentTabUserContextId);
this.setRecordingActiveAndEnabled(false, false); this.setRecordingActiveAndEnabled(false, false);