Add simple blur redaction.

This commit is contained in:
Herbert Wolverson 2024-07-02 14:34:01 -05:00
parent e46d792458
commit db0325bc2d
8 changed files with 80 additions and 2 deletions

View File

@ -2,6 +2,7 @@ import {BaseDashlet} from "./base_dashlet";
import {RttHistogram} from "../graphs/rtt_histo";
import {clearDashDiv, theading} from "../helpers/builders";
import {scaleNumber, rttCircleSpan} from "../helpers/scaling";
import {redactCell} from "../helpers/redact";
export class Top10Downloaders extends BaseDashlet {
constructor(slot) {
@ -54,6 +55,7 @@ export class Top10Downloaders extends BaseDashlet {
let ip = document.createElement("td");
ip.innerText = r.ip_address;
redactCell(ip);
row.append(ip);
let dl = document.createElement("td");

View File

@ -1,6 +1,7 @@
import {BaseDashlet} from "./base_dashlet";
import {clearDashDiv, simpleRow, theading} from "../helpers/builders";
import {scaleNumber, scaleNanos} from "../helpers/scaling";
import {redactCell} from "../helpers/redact";
export class TopTreeSummary extends BaseDashlet {
constructor(slot) {
@ -42,7 +43,9 @@ export class TopTreeSummary extends BaseDashlet {
let tbody = document.createElement("tbody");
msg.data.forEach((r) => {
let row = document.createElement("tr");
row.appendChild(simpleRow(r[1].name));
let name = simpleRow(r[1].name);
redactCell(name);
row.appendChild(simpleRow(name));
row.appendChild(simpleRow(scaleNumber(r[1].current_throughput[0])));
row.appendChild(simpleRow(scaleNumber(r[1].current_throughput[1])));
t.appendChild(row);

View File

@ -2,6 +2,7 @@ import {BaseDashlet} from "./base_dashlet";
import {RttHistogram} from "../graphs/rtt_histo";
import {clearDashDiv, theading} from "../helpers/builders";
import {scaleNumber, rttCircleSpan} from "../helpers/scaling";
import {redactCell} from "../helpers/redact";
export class Worst10Downloaders extends BaseDashlet {
constructor(slot) {
@ -54,6 +55,7 @@ export class Worst10Downloaders extends BaseDashlet {
let ip = document.createElement("td");
ip.innerText = r.ip_address;
redactCell(ip);
row.append(ip);
let dl = document.createElement("td");

View File

@ -2,6 +2,7 @@ import {BaseDashlet} from "./base_dashlet";
import {RttHistogram} from "../graphs/rtt_histo";
import {clearDashDiv, theading} from "../helpers/builders";
import {scaleNumber, rttCircleSpan} from "../helpers/scaling";
import {redactCell} from "../helpers/redact";
export class Worst10Retransmits extends BaseDashlet {
constructor(slot) {
@ -54,6 +55,7 @@ export class Worst10Retransmits extends BaseDashlet {
let ip = document.createElement("td");
ip.innerText = r.ip_address;
redactCell(ip);
row.append(ip);
let dl = document.createElement("td");

View File

@ -0,0 +1,59 @@
export function initRedact() {
let modeSwitch = document.getElementById("redactSwitch");
modeSwitch.checked = isRedacted();
modeSwitch.onclick = () => {
let modeSwitch = document.getElementById("redactSwitch");
if (modeSwitch.checked) {
localStorage.setItem("redact", "true");
} else {
localStorage.setItem("redact", "false");
}
cssRedact();
};
cssRedact();
}
export function redactCell(cell) {
cell.classList.add("redactable");
}
function cssRedact() {
if (isRedacted()) {
let css = css_getclass(".redactable");
css.style.filter = "blur(4px)";
} else {
let css = css_getclass(".redactable");
css.style.filter = "";
}
}
function isRedacted() {
let prefs = localStorage.getItem("redact");
if (prefs === null) {
localStorage.setItem("redact", "false");
return false;
}
if (prefs === "false") {
return false;
}
if (prefs === "true") {
return true;
}
}
function cssrules() {
var rules = {};
for (var i = 0; i < document.styleSheets.length; ++i) {
var cssRules = document.styleSheets[i].cssRules;
for (var j = 0; j < cssRules.length; ++j)
rules[cssRules[j].selectorText] = cssRules[j];
}
return rules;
}
function css_getclass(name) {
var rules = cssrules();
if (!rules.hasOwnProperty(name))
throw 'TODO: deal_with_notfound_case';
return rules[name];
}

View File

@ -1,6 +1,8 @@
import {Dashboard} from "./dashlets/dashboard";
import {checkForUpgrades} from "./toasts/version_check";
import {initRedact} from "./helpers/redact";
initRedact();
checkForUpgrades("toasts");
const dashboard = new Dashboard("dashboard");
dashboard.build();

View File

@ -78,4 +78,5 @@ body.dark-mode {
min-width: 500px;
min-height: 500px;
}
.dashEditButton { }
.dashEditButton { }
.redactable { }

View File

@ -80,6 +80,13 @@
<label class="form-check-label" for="darkModeSwitch"><i class="fa fa-moon-o"></i> Day/Night</label>
</div>
</li>
<!-- Redact switch -->
<li class="nav-item">
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="redactSwitch">
<label class="form-check-label" for="redactSwitch"><i class="fa fa-user-secret"></i> Redact</label>
</div>
</li>
<hr />
<!-- User Info -->
<li class="nav-item">