Update Privacy dashboard, nuke %%

README.md

@@ -55,7 +55,6 @@ Some of them are listed in _Settings_ page and can be customized by end-user.
 | `open_new_tab`		| Tells whether clicking on a service will open it in new tab by default.																		|		✅		|
 | `blur`				| Tells whether card background blur is enabled by default.																						|		✅		|
 | `animations`			| Tells whether UI animations are enabled by default.																							|		✅		|
-| `https_importance`	| How important is HTTPS comparing to independence. If set to `0.25`, HTTPS will score maximum 25% in Privacy Panel. Total importance is `1`.	|		❌		|
 
 
 ### 🔗 Adding custom services

css/Pages/More/Privacy.css

@@ -56,7 +56,7 @@
 	display: flex;
 	align-items: center;
 	justify-content: space-between;
-	max-width: 600px;
+	max-width: 540px;
 	padding: 24px;
 	margin: 120px auto 80px;
 	text-align: right;
@@ -73,8 +73,3 @@
 .security #report {
 	opacity: .6;
 }
-
-.score::after {
-	content: "%";
-	font-size: 18px;
-}

js/UI/More/Privacy/Privacy.js

@@ -26,77 +26,57 @@ export default class Privacy {
 			stats.thirdParties += analysis.isThirdParty
 		}
 
-		let secure_pp = 100 * stats.secure / stats.total
+		let encryption = stats.secure / stats.total
-		let indepencence_pp = 100 * (stats.total - stats.thirdParties) / stats.total
+		let encryption_t
-		let https_importance = this.config.get("https_importance")
+		if (encryption == 1) encryption_t = "All"
-		let privacy_score = secure_pp * https_importance + indepencence_pp * (1 - https_importance)
+		else if (encryption >= 0.9) encryption_t = "Most"
+		else if (encryption > 0.5) encryption_t = "Many"
+		else if (encryption > 0.2) encryption_t = "Some"
+		else if (encryption > 0) encryption_t = "Few"
+		else encryption_t = "No"
+		encryption_t = `${encryption_t} listed services use secure connections.`
 
-		let privacy_report;
+		let indepencence = (stats.total - stats.thirdParties) / stats.total
-		if (privacy_score == 100) {
+		let indepencence_t
-			privacy_report = "Data is sent securely and no third-party services are involved."
+		if (indepencence == 1) indepencence_t = "no"
-		}
+		else if (indepencence > 0.7) indepencence_t = "some"
-		else if (privacy_score >= 85) {
+		else if (indepencence > 0.4) indepencence_t = "many"
-			privacy_report = "Great privacy overall, but at some point it could be better."
+		else if (indepencence > 0) indepencence_t = "a lot of"
-		}
+		else indepencence_t = "only"
-		else if (privacy_score >= 40) {
+		indepencence_t = `There are ${indepencence_t} 3rd-party services here.`
-			privacy_report = "Decent privacy. You should pay attention what you're doing."
-		}
-		else privacy_report = "Transferring data is insecure and vulnerable to various threats."
 
-		document.getElementById("report-score").innerText = Math.round(privacy_score)
+		let score = (encryption + indepencence) / 2
-		document.getElementById("report").innerText = privacy_report
+		score = 0.99
-
+		let score_t, score_d
-		const phrase = " of the listed services are using secure connections"
+		if (score == 1) {
-		privacyBox(secure_pp, "icon-https", [
+			score_t = "Superb"
-			{
+			score_d = "All data is sent securely and no 3rd-party services are involved."
-				"from": 0,
-				"name": "No encryption",
-				"desc": "None" + phrase
-			},
-			{
-				"from": 0.1,
-				"name": "Poor encryption",
-				"desc": "Only some" + phrase
-			},
-			{
-				"from": 60,
-				"name": "Fair encryption",
-				"desc": "Most" + phrase
-			},
-			{
-				"from": 90,
-				"name": "Good encryption",
-				"desc": "Nearly all" + phrase
-			},
-			{
-				"from": 100,
-				"name": "Full encryption",
-				"desc": "All" + phrase
 		}
-		])
+		else if (score >= 0.9) {
-
+			score_t = "Great"
-		privacyBox(indepencence_pp, "icon-rocket", [
+			score_d = "Awesome privacy practices, but still not perfect."
-			{
-				"from": 0,
-				"name": "Not independent",
-				"desc": "This server lists a lot of 3rd party services"
-			},
-			{
-				"from": 40,
-				"name": "Partially independent",
-				"desc": "This server lists many 3rd party services"
-			},
-			{
-				"from": 65,
-				"name": "Mostly independent",
-				"desc": "This server still lists some 3rd party services"
-			},
-			{
-				"from": 100,
-				"name": "Fully independent",
-				"desc": "This server is free of 3rd party services"
 		}
-		])
+		else if (score >= 0.6) {
+			score_t = "Good"
+			score_d = "Acceptable privacy practices, but still not perfect."
+		}
+		else if (score >= 0.3) {
+			score_t = "Fair"
+			score_d = "Definitely not a vault, but self-hosted at least."
+		}
+		else if (score > 0) {
+			score_t = "Dangerous"
+			score_d = "You should really pay attention what you're doing here."
+		}
+		else {
+			score_t = ":0"
+			score_d = "You're just testing, right?"
 		}
 
+		document.getElementById("report-score").innerText = score_t
+		document.getElementById("report").innerText = score_d
+
+		privacyBox("icon-https", "Encryption", encryption_t)
+		privacyBox("icon-rocket", "Independence", indepencence_t)
+	}
 }

js/UI/More/Privacy/tiles.js

@@ -1,27 +1,11 @@
-export function privacyBox(privacyScore, icon_class, levels) {
+export function privacyBox(icon, name, desc) {
-	let name, desc
-	levels = levels.reverse()
-
-	for (let i in levels) {
-		let item = levels[i]
-		if (item.from <= privacyScore) {
-			name = levels[i].name
-			desc = levels[i].desc
-			break
-		}
-	}
-
 	let item = document.createElement("div")
-	item.innerHTML = `<i class="${icon_class}"></i>
+	item.innerHTML = `<i class="${icon}"></i>
 		<div>
 			<div class="title">${name}</div>
 			<div class="subtitle">${desc}</div>
 		</div>`
 
-	if (privacyScore < 30) item.classList.add("error")
-	else if (privacyScore < 90) item.classList.add("warn")
-	else if (privacyScore < 100) item.classList.add("prewarn")
-
 	document.getElementById("report-boxes").appendChild(item)
 	return item
 }

public/config/config.json

@@ -8,8 +8,7 @@
 		"dark_mode": false,
 		"open_new_tab": false,
 		"blur": true,
-		"animations": true,
+		"animations": true
-		"https_importance": 0.5
 	},
 	"services": [
 		{