diff --git a/keepassxc-browser/popups/popup.js b/keepassxc-browser/popups/popup.js
index 28232843..b40e274d 100644
--- a/keepassxc-browser/popups/popup.js
+++ b/keepassxc-browser/popups/popup.js
@@ -1,16 +1,10 @@
'use strict';
+const POLLING_INTERVAL = 1000; // ms
+let previousStatus;
let reloadCount = 0;
-HTMLElement.prototype.show = function() {
- this.style.display = 'block';
-};
-
-HTMLElement.prototype.hide = function() {
- this.style.display = 'none';
-};
-
-function statusResponse(r) {
+function hideAll() {
$('#initial-state').hide();
$('#error-encountered').hide();
$('#need-reconfigure').hide();
@@ -20,49 +14,79 @@ function statusResponse(r) {
$('#lock-database-button').hide();
$('#getting-started-guide').hide();
$('#database-not-opened').hide();
+ $('#credentials-list').hide();
+ $('#http-auth-credentials-list').hide();
+}
+
+function handleStatusResponse(response) {
+ hideAll();
- if (!r.keePassXCAvailable) {
- $('#error-message').textContent = r.error;
+ // Error situations
+ if (!response.keePassXCAvailable) {
+ $('#error-message').textContent = response.error;
$('#error-encountered').show();
- if (r.showGettingStartedGuideAlert) {
+ if (response.showGettingStartedGuideAlert) {
$('#getting-started-guide').show();
}
- if (r.showTroubleshootingGuideAlert && reloadCount >= 2) {
+ if (response.showTroubleshootingGuideAlert && reloadCount >= 2) {
$('#troubleshooting-guide').show();
} else {
$('#troubleshooting-guide').hide();
}
- } else if (r.keePassXCAvailable && r.databaseClosed) {
- $('#database-error-message').textContent = r.error;
+ return;
+ } else if (response.keePassXCAvailable && response.databaseClosed) {
+ $('#database-error-message').textContent = response.error;
$('#database-not-opened').show();
- } else if (!r.configured) {
+ return;
+ } else if (!response.configured) {
$('#not-configured').show();
- } else if (r.encryptionKeyUnrecognized) {
+ return;
+ } else if (response.encryptionKeyUnrecognized) {
$('#need-reconfigure').show();
- $('#need-reconfigure-message').textContent = r.error;
- } else if (!r.associated) {
+ $('#need-reconfigure-message').textContent = response.error;
+ return;
+ } else if (!response.associated) {
$('#need-reconfigure').show();
- $('#need-reconfigure-message').textContent = r.error;
- } else if (r.error) {
+ $('#need-reconfigure-message').textContent = response.error;
+ return;
+ } else if (response.error) {
$('#error-encountered').show();
- $('#error-message').textContent = r.error;
+ $('#error-message').textContent = response.error;
+ return;
+ }
+
+ // Show the popup content based on status
+ if (response?.popupData?.popup === PopupState.LOGIN) {
+ $('#credentials-list').show();
+ $('#configured-and-associated').hide();
+ initializeLoginList();
+ } else if (response?.popupData?.popup === PopupState.HTTP_AUTH) {
+ $('#http-auth-credentials-list').show();
+ $('#configured-and-associated').hide();
+ initializeHttpAuthLoginList();
} else {
+ // PopupState.DEFAULT
+ $('#credentials-list').hide();
+ $('#http-auth-credentials-list').hide();
$('#configured-and-associated').show();
- $('#associated-identifier').textContent = r.identifier;
- $('#lock-database-button').show();
+ $('#associated-identifier').textContent = response.identifier;
+ }
- if (r.usernameFieldDetected) {
- $('#username-field-detected').show();
- }
+ $('#lock-database-button').show();
- if (r.iframeDetected) {
- $('#iframe-detected').show();
- }
+ // Show button for adding Username-Only Detection for the site
+ if (response.usernameFieldDetected) {
+ $('#username-field-detected').show();
+ }
- reloadCount = 0;
+ // Show button for allowing Cross-Origin IFrames for the site
+ if (response.iframeDetected) {
+ $('#iframe-detected').show();
}
+
+ reloadCount = 0;
}
const sendMessageToTab = async function(message) {
@@ -99,7 +123,7 @@ const sendMessageToTab = async function(message) {
});
$('#reload-status-button').addEventListener('click', async () => {
- statusResponse(await browser.runtime.sendMessage({
+ handleStatusResponse(await browser.runtime.sendMessage({
action: 'reconnect'
}));
@@ -111,7 +135,7 @@ const sendMessageToTab = async function(message) {
});
$('#reopen-database-button').addEventListener('click', async () => {
- statusResponse(await browser.runtime.sendMessage({
+ handleStatusResponse(await browser.runtime.sendMessage({
action: 'get_status',
args: [ false, true ] // Set forcePopup to true
}));
@@ -124,13 +148,13 @@ const sendMessageToTab = async function(message) {
return;
}
- statusResponse(await browser.runtime.sendMessage({
+ handleStatusResponse(await browser.runtime.sendMessage({
action: 'get_status'
}));
});
$('#lock-database-button').addEventListener('click', async () => {
- statusResponse(await browser.runtime.sendMessage({
+ handleStatusResponse(await browser.runtime.sendMessage({
action: 'lock_database'
}));
});
@@ -159,9 +183,37 @@ const sendMessageToTab = async function(message) {
});
});
- statusResponse(await browser.runtime.sendMessage({
- action: 'get_status'
- }).catch((err) => {
- logError('Could not get status: ' + err);
- }));
+ // For HTTP Basic Auth
+ $('#btn-dismiss').addEventListener('click', async () => {
+ // Return empty credentials
+ browser.runtime.sendMessage({
+ action: 'fill_http_auth',
+ args: { login: '', password: '' }
+ });
+
+ close();
+ });
+
+ async function getNewStatus() {
+ return await browser.runtime.sendMessage({
+ action: 'get_status'
+ }).catch((err) => {
+ logError('Could not get status: ' + err);
+ });
+ }
+
+ // Get status right after popup has been opened
+ handleStatusResponse(await getNewStatus());
+
+ // Poll status
+ setInterval(async () => {
+ // Check if the popup state has been changed or database has been opened/closed
+ const currentStatus = await getNewStatus();
+ if (previousStatus?.popupData?.popup !== currentStatus?.popupData?.popup
+ || previousStatus?.databaseClosed !== currentStatus?.databaseClosed
+ || previousStatus?.keePassXCAvailable !== currentStatus?.keePassXCAvailable) {
+ previousStatus = currentStatus;
+ handleStatusResponse(currentStatus);
+ }
+ }, POLLING_INTERVAL);
})();
diff --git a/keepassxc-browser/popups/popup_functions.js b/keepassxc-browser/popups/popup_functions.js
index 82ad4543..4760340d 100644
--- a/keepassxc-browser/popups/popup_functions.js
+++ b/keepassxc-browser/popups/popup_functions.js
@@ -53,8 +53,103 @@ async function getLoginData() {
return logins;
}
+// Initializes the default login list
+async function initializeLoginList() {
+ const tab = await getCurrentTab();
+ if (!tab) {
+ return [];
+ }
+
+ const logins = await getLoginData();
+ const loginList = document.getElementById('login-list');
+
+ // Empty any existing values
+ removeAllChildren(loginList);
+
+ for (const [ i, login ] of logins.entries()) {
+ const a = document.createElement('a');
+ a.textContent = login.text;
+ a.setAttribute('class', 'list-group-item');
+ a.setAttribute('id', '' + i);
+
+ a.addEventListener('click', (e) => {
+ if (!e.isTrusted) {
+ return;
+ }
+
+ const id = e.target.id;
+ browser.tabs.sendMessage(tab?.id, {
+ action: 'fill_user_pass_with_specific_login',
+ id: Number(id),
+ uuid: login?.uuid
+ });
+
+ close();
+ });
+
+ loginList.appendChild(a);
+ }
+
+ if (logins.length > 1) {
+ $('#filter-block').show();
+ const filter = document.getElementById('login-filter');
+ filter.addEventListener('keyup', (e) => {
+ if (!e.isTrusted) {
+ return;
+ }
+
+ const val = filter.value;
+ const re = new RegExp(val, 'i');
+ const links = loginList.getElementsByTagName('a');
+ for (const i in links) {
+ if (links.hasOwnProperty(i)) {
+ const found = String(links[i].textContent).match(re) !== null;
+ links[i].style = found ? '' : 'display: none;';
+ }
+ }
+ });
+
+ filter.focus();
+ }
+}
+
+// Intitializes the login list for HTTP Basic Auth
+async function initializeHttpAuthLoginList() {
+ const data = await getLoginData();
+ const loginList = document.getElementById('http-auth-login-list');
+
+ // Empty any existing values
+ removeAllChildren(loginList);
+
+ for (const [ i, login ] of data.logins.entries()) {
+ const a = document.createElement('a');
+ a.textContent = login.login + ' (' + login.name + ')';
+ a.setAttribute('class', 'list-group-item');
+ a.setAttribute('id', '' + i);
+
+ a.addEventListener('click', (e) => {
+ if (!e.isTrusted) {
+ return;
+ }
+
+ const credentials = data.logins[Number(e.target.id)];
+ browser.runtime.sendMessage({
+ action: 'fill_http_auth',
+ args: credentials
+ });
+
+ close();
+ });
+
+ loginList.appendChild(a);
+ }
+}
+
(async () => {
- if (document.readyState === 'complete' || (document.readyState !== 'loading' && !document.documentElement.doScroll)) {
+ if (
+ document.readyState === 'complete' ||
+ (document.readyState !== 'loading' && !document.documentElement.doScroll)
+ ) {
await initSettings();
} else {
document.addEventListener('DOMContentLoaded', initSettings);
diff --git a/keepassxc-browser/popups/popup_httpauth.html b/keepassxc-browser/popups/popup_httpauth.html
deleted file mode 100644
index c494a0d8..00000000
--- a/keepassxc-browser/popups/popup_httpauth.html
+++ /dev/null
@@ -1,65 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/keepassxc-browser/popups/popup_httpauth.js b/keepassxc-browser/popups/popup_httpauth.js
deleted file mode 100644
index 3369f857..00000000
--- a/keepassxc-browser/popups/popup_httpauth.js
+++ /dev/null
@@ -1,54 +0,0 @@
-'use strict';
-
-(async () => {
- await initColorTheme();
-
- $('#lock-database-button').show();
-
- const data = await getLoginData();
- const ll = document.getElementById('login-list');
-
- for (const [ i, login ] of data.logins.entries()) {
- const a = document.createElement('a');
- a.setAttribute('class', 'list-group-item');
- a.textContent = login.login + ' (' + login.name + ')';
- a.setAttribute('id', '' + i);
-
- a.addEventListener('click', (e) => {
- if (!e.isTrusted) {
- return;
- }
-
- const credentials = data.logins[Number(e.target.id)];
- browser.runtime.sendMessage({
- action: 'fill_http_auth',
- args: credentials
- });
-
- close();
- });
- ll.appendChild(a);
- }
-
- $('#lock-database-button').addEventListener('click', function() {
- browser.runtime.sendMessage({
- action: 'lock_database'
- });
-
- $('.credentials').hide();
- $('#btn-dismiss').hide();
- $('#database-not-opened').show();
- $('#lock-database-button').hide();
- $('#database-error-message').textContent = tr('errorMessageDatabaseNotOpened');
- });
-
- $('#btn-dismiss').addEventListener('click', async () => {
- // Return empty credentials
- browser.runtime.sendMessage({
- action: 'fill_http_auth',
- args: { login: '', password: '' }
- });
-
- close();
- });
-})();
diff --git a/keepassxc-browser/popups/popup_login.html b/keepassxc-browser/popups/popup_login.html
deleted file mode 100644
index 57dad2f2..00000000
--- a/keepassxc-browser/popups/popup_login.html
+++ /dev/null
@@ -1,63 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/keepassxc-browser/popups/popup_login.js b/keepassxc-browser/popups/popup_login.js
deleted file mode 100644
index 4703b9a1..00000000
--- a/keepassxc-browser/popups/popup_login.js
+++ /dev/null
@@ -1,80 +0,0 @@
-'use strict';
-
-(async () => {
- await initColorTheme();
-
- $('#lock-database-button').show();
-
- const tab = await getCurrentTab();
- if (!tab) {
- return [];
- }
-
- const logins = await getLoginData();
- const ll = document.getElementById('login-list');
-
- for (const [ i, login ] of logins.entries()) {
- const uuid = login.uuid;
- const a = document.createElement('a');
- a.textContent = login.text;
- a.setAttribute('class', 'list-group-item');
- a.setAttribute('id', '' + i);
-
- a.addEventListener('click', (e) => {
- if (!e.isTrusted) {
- return;
- }
-
- const id = e.target.id;
- browser.tabs.sendMessage(tab?.id, {
- action: 'fill_user_pass_with_specific_login',
- id: Number(id),
- uuid: uuid
- });
-
- close();
- });
-
- ll.appendChild(a);
- }
-
- if (logins.length > 1) {
- $('#filter-block').show();
- const filter = document.getElementById('login-filter');
- filter.addEventListener('keyup', (e) => {
- if (!e.isTrusted) {
- return;
- }
-
- const val = filter.value;
- const re = new RegExp(val, 'i');
- const links = ll.getElementsByTagName('a');
- for (const i in links) {
- if (links.hasOwnProperty(i)) {
- const found = String(links[i].textContent).match(re) !== null;
- links[i].style = found ? '' : 'display: none;';
- }
- }
- });
-
- filter.focus();
- }
-
- $('#lock-database-button').addEventListener('click', (e) => {
- browser.runtime.sendMessage({
- action: 'lock_database'
- });
-
- $('#credentialsList').hide();
- $('#database-not-opened').show();
- $('#lock-database-button').hide();
- $('#database-error-message').textContent = tr('errorMessageDatabaseNotOpened');
- });
-
- $('#reopen-database-button').addEventListener('click', (e) => {
- browser.runtime.sendMessage({
- action: 'get_status',
- args: [ false, true ] // Set forcePopup to true
- });
- });
-})();