Added setting presets

Fixes #376

.vscode/settings.json

@@ -33,6 +33,7 @@
 		"ignorelist",
 		"micrococo",
 		"monero",
+		"onedrive",
 		"onloaded",
 		"oscpu",
 		"prefs",

_locales/de/messages.json

@@ -43,6 +43,10 @@
 		"message": "OK",
 		"description": ""
 	},
+	"apply": {
+		"message": "Anwenden",
+		"description": ""
+	},
 	"cancel": {
 		"message": "Abbrechen",
 		"description": ""
@@ -1195,6 +1199,10 @@
 		"message": "Öffnen",
 		"description": ""
 	},
+	"openSettingPresets_label": {
+		"message": "Voreinstellungen",
+		"description": ""
+	},
 	"inspectSettings_label": {
 		"message": "Anzeigen",
 		"description": ""
@@ -1366,5 +1374,53 @@
 	"whitelist_all_apis": {
 		"message": "Alle APIs",
 		"description": ""
+	},
+	"presets": {
+		"message": "Voreinstellungen",
+		"description": ""
+	},
+	"presets_title": {
+		"message": "CanvasBlocker Voreinstellungen",
+		"description": ""
+	},
+	"presets_installNotice": {
+		"message": "{image:../icons/icon.svg}Danke, dass Sie CanvasBlocker installiert haben. Um ihn an Ihre Bedürfnisse anzupassen können Sie ein paar Voreinstellungen anwenden. In den {link:Optionen:options.html} können Sie CanvasBlocker noch weiter anpassen. Dort können Sie auch diese Voreinstellungsseite später wieder öffnen.",
+		"description": ""
+	},
+	"presets_introduction": {
+		"message": "Dies sind ein paar Voreinstellungen für verschiedene Bedürfnisse. Die Werte in Klammern sind die aktuellen Einstellungen. Sie können mehrere Voreinstellungen hintereinander anwenden, aber ein paar Einstellungen können dabei von der später angewandten Voreinstellung überschrieben werden.",
+		"description": ""
+	},
+	"preset_default_title": {
+		"message": "Standard Einstellungen",
+		"description": ""
+	},
+	"preset_default_description": {
+		"message": "Keine speziellen Einstellungen werden gesetzt.",
+		"description": ""
+	},
+	"preset_convenience_title": {
+		"message": "Praktische Einstellungen",
+		"description": ""
+	},
+	"preset_convenience_description": {
+		"message": "Setzt einige Einstellungen so, dass CanvasBlocker die Browsererfahrung so wenig wie möglichst beeinträchtigt. Dies beinhaltet, dass die Benutzung mancher APIs für ein paar Seiten erlaubt wird.",
+		"description": ""
+	},
+	"preset_stealth_title": {
+		"message": "Schwer zu detektieren",
+		"description": ""
+	},
+	"preset_stealth_description": {
+		"message": "Stellt CanvasBlocker so ein, dass er schwer zu detektieren ist. Dies kann zu hoher CPU Auslastung führen und kann den Browser verlangsamen.",
+		"description": ""
+	},
+	"preset_max_protection_title": {
+		"message": "Maximaler Schutz",
+		"description": ""
+	},
+	"preset_max_protection_description": {
+		"message": "Maximiert den Schutz gegen die Fingerprint-Extraktion. Diese Einstellungen werden einige Seiten unbenutzbar machen, können den Browser etwas verlangsamen und können es Seiten ermöglichen die Verwendung von CanvasBlocker zu detektieren.",
+		"description": ""
 	}
 }

_locales/en/messages.json

@@ -45,6 +45,10 @@
 		"message": "OK",
 		"description": ""
 	},
+	"apply": {
+		"message": "Apply",
+		"description": ""
+	},
 	"cancel": {
 		"message": "Cancel",
 		"description": ""
@@ -1249,6 +1253,10 @@
 		"description": ""
 	},
 	
+	"openSettingPresets_label": {
+		"message": "Presets",
+		"description": ""
+	},
 	"inspectSettings_label": {
 		"message": "Inspect",
 		"description": ""
@@ -1424,5 +1432,55 @@
 	"whitelist_all_apis": {
 		"message": "All APIs",
 		"description": ""
+	},
+	
+	"presets": {
+		"message": "Presets",
+		"description": ""
+	},
+	"presets_title": {
+		"message": "CanvasBlocker presets",
+		"description": ""
+	},
+	"presets_installNotice": {
+		"message": "{image:../icons/icon.svg}Thanks for installing CanvasBlocker. To adjust it to your needs you can apply some presets. For further customization you can open the {link:options:options.html} page. There you can also open this preset page later.",
+		"description": ""
+	},
+	"presets_introduction": {
+		"message": "These are some setting presets to fit different people's needs. The values in brackets are the current state of the setting. You can apply multiple presets after each other but some settings might be overwritten by the later applied one.",
+		"description": ""
+	},
+	
+	"preset_default_title": {
+		"message": "Default settings",
+		"description": ""
+	},
+	"preset_default_description": {
+		"message": "No special settings are applied.",
+		"description": ""
+	},
+	"preset_convenience_title": {
+		"message": "Convenient settings",
+		"description": ""
+	},
+	"preset_convenience_description": {
+		"message": "Apply some settings to make the browsing experience as convenient as possible. This includes whitelisting some sites.",
+		"description": ""
+	},
+	"preset_stealth_title": {
+		"message": "Stealth settings",
+		"description": ""
+	},
+	"preset_stealth_description": {
+		"message": "Configures CanvasBlocker to be hard to detect. This might lead to high CPU usage and might slow down the browser.",
+		"description": ""
+	},
+	"preset_max_protection_title": {
+		"message": "Maximum protection",
+		"description": ""
+	},
+	"preset_max_protection_description": {
+		"message": "Maximizes the protection against fingerprint extraction. This settings will break some pages, might slow down the browser a little bit and might enable sites to detect that CanvasBlocker is used.",
+		"description": ""
 	}
 }

lib/main.js

@@ -167,6 +167,9 @@
 			case "install":
 				message("CanvasBlocker installed");
 				openOptions(details.reason);
+				browser.tabs.create({
+					url: browser.extension.getURL("options/presets.html?notice=" + details.reason)
+				});
 				break;
 			case "update":
 				settings.onloaded(function(){

options/options.js

@@ -57,6 +57,10 @@
 			logging.verbose("open settings sanitation");
 			window.open("sanitize.html", "_blank");
 		},
+		openSettingPresets: function(){
+			logging.verbose("open setting presets");
+			window.open("presets.html", "_blank");
+		},
 		saveSettings: function(){
 			logging.verbose("save settings");
 			const data = {};

options/presets.css

@@ -0,0 +1,11 @@
+.notice {
+	font-size: 125%;
+	font-weight: 125%;
+	margin: 0.5em;
+	padding: 0.5em;
+}
+
+.notice .noticeImage {
+	float: left;
+	margin: 0 0.5em 0.5em 0;
+}

options/presets.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>CanvasBlocker presets</title>
+		<link href="presets.css" rel="stylesheet" type="text/css">
+		<link href="../icons/icon.svg" type="image/svg" rel="icon">
+		<link href="../icons/icon.svg" type="image/svg" rel="shortcut icon">
+		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+	</head>
+	<body>
+		<script src="../lib/require.js"></script>
+		<script src="../lib/extension.js"></script>
+		<script src="../lib/logging.js"></script>
+		<script src="../lib/settingDefinitions.js"></script>
+		<script src="../lib/settingContainers.js"></script>
+		<script src="../lib/settings.js"></script>
+		<script src="../lib/theme.js"></script>
+		<script src="presets.js"></script>
+	</body>
+</html>

options/presets.js

@@ -0,0 +1,155 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+(function(){
+	"use strict";
+	
+	const extension = require("../lib/extension");
+	const logging = require("../lib/logging");
+	logging.setPrefix("preset page");
+	
+	const settings = require("../lib/settings");
+	const searchParameters = new URLSearchParams(window.location.search);
+	require("./theme").init("presets");
+	
+	Promise.all([
+		settings.loaded,
+		fetch("presets.json").then(function(data){
+			return data.json();
+		})
+	]).then(function([settingsLoaded, presets]){
+		Object.keys(presets).map(function(presetName){
+			const preset = presets[presetName];
+			const container = document.createElement("div");
+			container.className = "preset " + presetName;
+			const title = document.createElement("h1");
+			title.className = "title";
+			title.textContent = extension.getTranslation(`preset_${presetName}_title`);
+			container.appendChild(title);
+			
+			const description = document.createElement("div");
+			description.className = "description";
+			description.textContent = extension.getTranslation(`preset_${presetName}_description`);
+			container.appendChild(description);
+			
+			const settingsList = document.createElement("ul");
+			settingsList.className = "settings";
+			container.appendChild(settingsList);
+			
+			Object.keys(preset).map(function(settingName){
+				function valueToText(value){
+					switch (typeof value){
+						case "string":
+							return extension.getTranslation(`${settingName}_options.${value}`);
+						case "boolean":
+							return value? "\u2713": "\u00D7";
+						default:
+							return value.toString();
+					}
+				}
+				
+				const value = preset[settingName];
+				const container = document.createElement("li");
+				container.textContent = extension.getTranslation(`${settingName}_title`) + ": ";
+				if ((typeof value) === "object"){
+					const urlValues = document.createElement("ul");
+					Object.keys(value).map(function(url){
+						var container = document.createElement("li");
+						container.className = "urlValue";
+						container.textContent = url + ": " +
+							valueToText(value[url]) +
+							" (" + valueToText(settings.get(settingName, url)) +")";
+						return container;
+						
+					}).forEach(function(node){
+						urlValues.appendChild(node);
+					});
+					container.appendChild(urlValues);
+				}
+				else {
+					container.appendChild(document.createTextNode(
+						`${valueToText(value)} (${valueToText(settings.get(settingName))})`
+					));
+				}
+				
+				return container;
+			}).forEach(function(node){
+				settingsList.appendChild(node);
+			});
+			
+			if (settingsList.childNodes.length){
+				const button = document.createElement("button");
+				button.textContent = extension.getTranslation("apply");
+				button.addEventListener("click", function(){
+					Promise.all(Object.keys(preset).map(function(settingName){
+						const value = preset[settingName];
+						if ((typeof value) === "object"){
+							return Promise.all(Object.keys(value).map(function(url){
+								return settings.set(settingName, value[url], url);
+							}));
+						}
+						else {
+							return settings.set(settingName, value);
+						}
+					})).then(function(){
+						window.location.reload();
+					});
+				});
+				container.appendChild(button);
+			}
+			
+			return container;
+		}).forEach(function(node){
+			document.body.appendChild(node);
+		});
+	});
+	
+	document.querySelector("head title").textContent = extension.getTranslation("presets_title");
+	let head = document.createElement("header");
+	document.body.insertBefore(head, document.body.firstChild);
+	
+	let heading = document.createElement("h1");
+	heading.textContent = extension.getTranslation("presets");
+	head.appendChild(heading);
+		
+	if (searchParameters.has("notice")){
+		const noticeName = `presets_${searchParameters.get("notice")}Notice`;
+		const noticeText = extension.getTranslation(noticeName);
+		if (noticeText){
+			const notice = document.createElement("div");
+			notice.className = noticeName + " notice";
+			noticeText.split(/(\{[^}]+\})/).forEach(function(part){
+				if (part.startsWith("{") && part.endsWith("}")){
+					part = part.substring(1, part.length - 1);
+					const args = part.split(":");
+					switch (args[0]){
+						case "image": {
+							const image = document.createElement("img");
+							image.className = "noticeImage";
+							image.src = args[1];
+							notice.appendChild(image);
+							break;
+						}
+						case "link": {
+							const link = document.createElement("a");
+							link.target = "_blank";
+							link.textContent = args[1];
+							link.href = args[2];
+							notice.appendChild(link);
+							break;
+						}
+					}
+				}
+				else {
+					notice.appendChild(document.createTextNode(part));
+				}
+			});
+			
+			head.appendChild(notice);
+		}
+	}
+	
+	let introduction = document.createElement("div");
+	introduction.textContent = extension.getTranslation("presets_introduction");
+	head.appendChild(introduction);
+}());

options/presets.json

@@ -0,0 +1,23 @@
+{
+	"convenience": {
+		"maxFakeSize": 1000000,
+		"protectDOMRect": {
+			"onedrive.live.com": false
+		}
+	},
+	"stealth": {
+		"minFakeSize": 10,
+		"protectedCanvasPart": "input",
+		"rng": "persistent",
+		"ignoreFrequentColors": 3,
+		"minColors": 3,
+		"storePersistentRnd": true
+	},
+	"max_protection": {
+		"minFakeSize": 0,
+		"maxFakeSize": 0,
+		"audioFakeRate": "0.1%",
+		"audioNoiseLevel": "low",
+		"protectWindow": true
+	}
+}

options/settingsDisplay.js

@@ -269,7 +269,10 @@
 						},
 						{
 							"name": "exportSettings",
-							"actions": ["inspectSettings", "inspectWhitelist", "saveSettings", "loadSettings"]
+							"actions": [
+								"openSettingPresets", "inspectSettings", "inspectWhitelist",
+								"saveSettings", "loadSettings"
+							]
 						},
 						{
 							"name": "resetSettings"

releaseNotes.txt

@@ -3,7 +3,7 @@ Version 0.5.13:
 		- 
 	
 	new features:
-		- 
+		- added setting presets
 	
 	fixes:
 		- display of url specific settings did not work properly

versions/updates.json

@@ -45,6 +45,10 @@
 				{
 					"version": "0.5.13Alpha20190706",
 					"update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.13Alpha20190706-an+fx.xpi"
+				},
+				{
+					"version": "0.5.13Alpha20190716",
+					"update_link": "https://canvasblocker.kkapsner.de/versions/canvasblocker_beta-0.5.13Alpha20190716-an+fx.xpi"
 				}
 			]
 		}