PR#39: Add permanent reload button in the popup UI (in the "whole site" information line). - librejs

librejs

#39 Add permanent reload button in the popup UI (in the "whole site" information line).

Merged 4 years ago by quidam. Opened 5 years ago by gioma1.

gioma1/librejs feature/reload-button into master

Add permanent reload button in the popup UI (in the "whole site" information line).

hackademix • 5 years ago

f128d86

html/display_panel/content/display-panel.html

file modified

+2 -1

		`@@ -64,12 +64,13 @@`
		`<button class="whitelist" name="*">Whitelist</button>`
		`<button class="blacklist" name="*">Blacklist</button>`
		`<button class="forget" name="*">Forget</button>`
		`+ <button id="reload" class="reload">Reload</button>`
		`</div>`
		`</div>`
		`<div id="unknown" class="unknown-js">`
		`<h2></h2>`
		`<p id="must-reload">`
		`- LibreJS will decide whether blocking these scripts next time this page is loaded. <button id="reload">Reload it now</button>`
		`+ LibreJS will decide whether blocking these scripts next time this page is loaded. <button class="reload" id="reload-now">Reload it now</button>`
		`</p>`
		`<ul>`
		`<li id="li-template">`

html/display_panel/content/main_panel.js

file modified

+3 -2

		`@@ -94,13 +94,14 @@`
		`close();`
		`}`

		`- document.querySelector("#reload").onclick = async e => {`
		`+ document.body.addEventListener("click", async e => {`
		`+ if (!e.target.matches(".reload")) return;`
		`let {tabId} = currentReport;`
		`if (tabId) {`
		`await browser.tabs.reload(tabId);`
		`myPort.postMessage({"update": true, tabId});`
		`}`
		`- };`
		`+ });`

		`/*`
		`* Takes in the [[file_id, reason],...] array and the group name for one group`

gioma1 commented 5 years ago

As requested by Ruben, here we add to the popup UI a permanent reload button, other than the one showing up when LibreJS cannot determine the status of a script which has just been removed either by the whitelist or the blacklist until the page is actually reloaded.
The best place I could think of has been the buttons line on the "whole site" section (first report line), but since the event handler is wired quite flexibly, moving around and/or restyling the button is really easy, provided that the "reload" CSS class is retained.