From daf970496d8b84c0bbca4b7a1aeb10f683f2c2c7 Mon Sep 17 00:00:00 2001 From: Mohamed Gamal Eldin Date: Tue, 14 Sep 2021 06:45:33 +0200 Subject: [PATCH] Add new feature (Hide on mouseover) --- Resources/CSS/popup.css | 2 +- Resources/HTML/options.html | 3 +++ Resources/HTML/popup.html | 3 +++ Resources/JavaScript/content.js | 8 ++++++++ Resources/JavaScript/library.js | 2 ++ Resources/JavaScript/options.js | 10 +++++++++- _locales/en/messages.json | 8 ++++++++ manifest.json | 2 +- 8 files changed, 35 insertions(+), 3 deletions(-) diff --git a/Resources/CSS/popup.css b/Resources/CSS/popup.css index c5058af..27e831f 100644 --- a/Resources/CSS/popup.css +++ b/Resources/CSS/popup.css @@ -39,7 +39,7 @@ nav { flex: 1; vertical-align: middle; text-align: right; - padding: 8px 8px 0 0; + padding: 9px 9px 0 0; } .title { diff --git a/Resources/HTML/options.html b/Resources/HTML/options.html index bad1b1e..b08103b 100644 --- a/Resources/HTML/options.html +++ b/Resources/HTML/options.html @@ -87,6 +87,9 @@ seconds + + + Set it 0 or leave it empty to disable
diff --git a/Resources/HTML/popup.html b/Resources/HTML/popup.html index 1c09062..5780137 100644 --- a/Resources/HTML/popup.html +++ b/Resources/HTML/popup.html @@ -77,6 +77,9 @@

Options

seconds
+ + + Set it 0 or leave it empty to disable
diff --git a/Resources/JavaScript/content.js b/Resources/JavaScript/content.js index a6ff5ab..e1bde96 100644 --- a/Resources/JavaScript/content.js +++ b/Resources/JavaScript/content.js @@ -374,6 +374,14 @@ chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) { break; } } + if(options.hideonhover != "" && options.hideonhover){ + document.getElementById(containerId).addEventListener("mouseover", function(event){ + document.getElementById(containerId).style.display = 'none'; + setTimeout(function() { + document.getElementById(containerId).style.display = 'block'; + }, options.hideonhover * 1000); + }); + } requestIds.forEach(function(requestId) { // Render a request only once. diff --git a/Resources/JavaScript/library.js b/Resources/JavaScript/library.js index 0559761..f43687c 100644 --- a/Resources/JavaScript/library.js +++ b/Resources/JavaScript/library.js @@ -660,6 +660,7 @@ function restoreOptions() { timeout: result.timeout ? result.timeout : 3, hidePanelAfterTimeout: isDefined(result.hidePanelAfterTimeout) ? result.hidePanelAfterTimeout : true, renderMode: result.renderMode ? result.renderMode : 'microMode', + hideonhover: result.hideonhover ?? null, hiddenRequestHeaders: result.hiddenRequestHeaders ? result.hiddenRequestHeaders.map(item => item.toLowerCase()) : [], hiddenResponseHeaders: result.hiddenResponseHeaders ? result.hiddenResponseHeaders.map(item => item.toLowerCase()) : [], shownResponseHeaders: result.shownResponseHeaders ? result.shownResponseHeaders.map(item => item.toLowerCase()) : ['^server$'], @@ -681,6 +682,7 @@ function restoreOptions() { timeout: localStorage.timeout ? localStorage.timeout : 3, hidePanelAfterTimeout: isDefined(localStorage.hidePanelAfterTimeout) ? localStorage.hidePanelAfterTimeout : true, renderMode: localStorage.renderMode ? localStorage.renderMode : 'microMode', + hideonhover: localStorage.hideonhover ?? null, hiddenRequestHeaders: isDefined(localStorage.hiddenRequestHeaders) ? JSON.parse(localStorage.hiddenRequestHeaders).map(item => item.toLowerCase()) : [], hiddenResponseHeaders: isDefined(localStorage.hiddenResponseHeaders) ? JSON.parse(localStorage.hiddenResponseHeaders).map(item => item.toLowerCase()) : [], shownResponseHeaders: isDefined(localStorage.shownResponseHeaders) ? JSON.parse(localStorage.shownResponseHeaders).map(item => item.toLowerCase()) : ['^Server$'], diff --git a/Resources/JavaScript/options.js b/Resources/JavaScript/options.js index 33fd94a..642c185 100644 --- a/Resources/JavaScript/options.js +++ b/Resources/JavaScript/options.js @@ -13,7 +13,8 @@ document.addEventListener('DOMContentLoaded', function() { timeout: document.getElementById('timeout').value, hidePanelAfterTimeout: parseInt(document.getElementById('hidePanelAfterTimeout').value, 10) === 1, renderMode: document.getElementById('renderMode').value, - theme: document.getElementById('theme').value + theme: document.getElementById('theme').value, + hideonhover: document.getElementById('hideonhover').value }; multiSelectFields.forEach(function(fieldId) { @@ -37,6 +38,7 @@ document.addEventListener('DOMContentLoaded', function() { localStorage.hidePanelAfterTimeout = parseInt(document.getElementById('hidePanelAfterTimeout').value, 10) === 1; localStorage.renderMode = document.getElementById('renderMode').value; localStorage.theme = document.getElementById('theme').value; + localStorage.hideonhover = document.getElementById('hideonhover').value; multiSelectFields.forEach(function(fieldId) { localStorage[fieldId] = JSON.stringify(updatedValues[fieldId]); @@ -91,6 +93,7 @@ document.addEventListener('DOMContentLoaded', function() { theme: result.theme ? result.theme : 'light', tabRequestLimit: result.tabRequestLimit ? result.tabRequestLimit : 25, timeout: result.timeout ? result.timeout : 3, + hideonhover: result.hideonhover ?? null, hidePanelAfterTimeout: isDefined(result.hidePanelAfterTimeout) ? result.hidePanelAfterTimeout : true, renderMode: result.renderMode ? result.renderMode : 'microMode', hiddenRequestHeaders: result.hiddenRequestHeaders ? result.hiddenRequestHeaders : [], @@ -106,6 +109,7 @@ document.addEventListener('DOMContentLoaded', function() { theme: localStorage.theme ? localStorage.theme : 'light', tabRequestLimit: localStorage.tabRequestLimit ? localStorage.tabRequestLimit : 25, timeout: localStorage.timeout ? localStorage.timeout : 3, + hideonhover: localStorage.hideonhover ?? null, hidePanelAfterTimeout: isDefined(localStorage.hidePanelAfterTimeout) ? localStorage.hidePanelAfterTimeout : true, renderMode: localStorage.renderMode ? localStorage.renderMode : 'microMode', hiddenRequestHeaders: isDefined(localStorage.hiddenRequestHeaders) ? JSON.parse(localStorage.hiddenRequestHeaders) : [], @@ -124,6 +128,7 @@ document.addEventListener('DOMContentLoaded', function() { document.getElementById('hidePanelAfterTimeout').value = options.hidePanelAfterTimeout ? 1 : 0; document.getElementById('renderMode').value = options.renderMode; document.getElementById('theme').value = options.theme; + document.getElementById('hideonhover').value = options.hideonhover; options.hiddenRequestHeaders.forEach(function(element) { addElement(element, 'newHiddenRequestHeader', 'hiddenRequestHeaders'); @@ -157,6 +162,9 @@ document.addEventListener('DOMContentLoaded', function() { document.getElementById('theme').addEventListener('change', function() { saveOptions(); }); + document.getElementById('hideonhover').addEventListener('keyup', function() { + saveOptions(); + }); let multiSelectFields = { 'hiddenRequestHeaders': {addId: 'addHiddenRequestHeader', newId: 'newHiddenRequestHeader'}, diff --git a/_locales/en/messages.json b/_locales/en/messages.json index dc3dd93..045ec7b 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -386,5 +386,13 @@ "contentMessagesProEnableResponseTimes": { "description": "enable response times", "message": "enable response times" + }, + "hideonhover": { + "description": "Hide on hover for", + "message": "Hide on hover for" + }, + "hideonhovernote": { + "description": "leave it empty to disable", + "message": "leave it empty to disable" } } diff --git a/manifest.json b/manifest.json index 11ca46a..ab1803e 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "__MSG_extensionName__", "short_name": "__MSG_extensionNameShort__", - "version": "2.0.49", + "version": "2.0.50", "manifest_version": 2, "minimum_chrome_version": "18", "description": "__MSG_extensionDescription__",