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) => {
const selectables = [...document.querySelectorAll("[tabindex='0'], [tabindex='-1']")];
const element = document.activeElement;
@ -701,8 +731,12 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
browser.tabs.onUpdated.removeListener(this.tabUpdateHandler);
},
getAssignmentCheckbox() {
return document.getElementById("container-page-assigned");
},
setupAssignmentCheckbox(siteSettings, currentUserContextId) {
const assignmentCheckboxElement = document.getElementById("container-page-assigned");
const assignmentCheckboxElement = this.getAssignmentCheckbox();
let checked = false;
if (siteSettings && Number(siteSettings.userContextId) === currentUserContextId) {
checked = true;
@ -715,33 +749,33 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
assignmentCheckboxElement.disabled = disabled;
},
getRecordButton() {
return document.getElementById("record-link");
},
isRecordingEnabled() {
const recordLinkElement = document.getElementById("record-link");
if (recordLinkElement.classList.contains("disabled")) { return false; }
return true;
return !this.getRecordButton().classList.contains("disabled");
},
isRecordingActive() {
const recordLinkElement = document.getElementById("record-link");
if (recordLinkElement.classList.contains("active")) { return true; }
return false;
return this.getRecordButton().classList.contains("active");
},
setRecordingActiveAndEnabled(isActive, isEnabled) {
const recordLinkElement = document.getElementById("record-link");
const recordIconElement = recordLinkElement.querySelector(".icon");
const recordButton = this.getRecordButton();
const recordButtonIcon = recordButton.querySelector(".icon");
if (!isEnabled) {
recordIconElement.src = CONTAINER_RECORD_DISABLED_SRC;
recordLinkElement.classList.remove("active");
recordLinkElement.classList.add("disabled");
recordButtonIcon.src = CONTAINER_RECORD_DISABLED_SRC;
recordButton.classList.remove("active");
recordButton.classList.add("disabled");
} else {
recordIconElement.src = CONTAINER_RECORD_ENABLED_SRC;
recordLinkElement.classList.remove("disabled");
recordButtonIcon.src = CONTAINER_RECORD_ENABLED_SRC;
recordButton.classList.remove("disabled");
if (isActive) {
recordLinkElement.classList.add("active");
recordButton.classList.add("active");
} else {
recordLinkElement.classList.remove("active");
recordButton.classList.remove("active");
}
}
},
@ -749,34 +783,7 @@ Logic.registerPanel(P_CONTAINERS_LIST, {
async prepareCurrentTabHeader() {
const currentTab = await Logic.currentTab();
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);
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;
this.setupAssignmentCheckbox(false, currentTabUserContextId);
this.setRecordingActiveAndEnabled(false, false);