Added showCanvasWhileAsking

Fixes #175

_locales/de/messages.json

@@ -153,6 +153,20 @@
 		"message": "vortäuschen",
 		"description": ""
 	},
+	
+	"showCanvasWhileAsking_title":{
+		"message": "Canvas-Inhalt anzeigen",
+		"description": ""
+	},
+	"showCanvasWhileAsking_description":{
+		"message": "Wenn möglich wird der Inhalt des Canvas angezeigt, bei dem um Erlaubnis gefragt wird.",
+		"description": ""
+	},
+	"showCanvasWhileAsking_message":{
+		"message": "Die Webseite will den Inhalt des folgenden Canvas auslesen:",
+		"description": ""
+	},
+	
 	"blackList_description": {
 		"message": "Domänen oder URLs, die die <canvas>-API niemals verwenden dürfen. Mehrere Einträge müssen durch ein Komma getrennt werden.",
 		"description": ""

_locales/en/messages.json

@@ -153,6 +153,20 @@
 		"message": "fake",
 		"description": ""
 	},
+	
+	"showCanvasWhileAsking_title":{
+		"message": "Show canvas content",
+		"description": ""
+	},
+	"showCanvasWhileAsking_description":{
+		"message": "Shows the content of the canvas for which the permission is asked if possible.",
+		"description": ""
+	},
+	"showCanvasWhileAsking_message":{
+		"message": "The web page wants to read the content of the following canvas:",
+		"description": ""
+	},
+	
 	"blackList_description": {
 		"message": "Domains or URLs where the <canvas>-API should always be blocked. To add multiple entries, separate them by commas.",
 		"description": ""

lib/askForPermission.js

@@ -131,12 +131,53 @@
 			return askStatus.answer[appearance.askCategory];
 		}
 		else {
+			let imgContainer = null;
+			if (type === "readout" && prefs("showCanvasWhileAsking") && canvas){
+				try {
+					let content = canvas.toDataURL();
+					let document = window.top.document;
+					imgContainer = document.createElement("div");
+					imgContainer.style.cssText = `
+						position: fixed;
+						top: 0;
+						left: 0;
+						right: 0;
+						bottom: 0;
+						background-color: rgba(0, 0, 0, 0.7);
+						color: white;
+						text-align: center;
+						z-index: 100000000000000;
+						padding: 1em;`;
+					
+					let heading = document.createElement("h1");
+					heading.textContent = "CanvasBlocker";
+					imgContainer.appendChild(heading);
+					
+					let text = document.createElement("div");
+					text.style.margin = "0.5em auto";
+					text.textContent = browser.i18n.getMessage("showCanvasWhileAsking_message");
+					imgContainer.appendChild(text);
+					
+					let img = document.createElement("img");
+					img.style.backgroundColor = "white";
+					img.style.border = "2px solid lightgray";
+					img.src = HTMLCanvasElement.prototype.toDataURL.call(canvas);
+					imgContainer.appendChild(img);
+					document.body.appendChild(imgContainer);
+				}
+				catch (e){
+					// unable to read the canvas
+				}
+			}
 			// asking
 			var msg = askMode.askText[appearance.text];
 			if (prefs("showCallingFile")){
 				msg += parseErrorStack(errorStack).toString(_);
 			}
 			answer = window.top.confirm(msg)? "allow": prefs("askDenyMode");
+			if (imgContainer && imgContainer.parentNode){
+				imgContainer.parentNode.removeChild(imgContainer);
+			}
 
 			if (prefs("askOnlyOnce") === "combined"){
 				["context", "readout", "input"].forEach(function(type){

lib/intercept.js

@@ -232,7 +232,13 @@
 												funcStatus.mode = ask({
 													window: window,
 													type: changedFunction.type,
-													canvas: this,
+													canvas: this instanceof HTMLCanvasElement?
+														this:
+														(
+															this.canvas instanceof HTMLCanvasElement?
+																this.canvas:
+																false
+														),
 													errorStack: error.stack
 												});
 											}

lib/settingDefinitions.js

@@ -106,6 +106,10 @@
 			defaultValue: "block",
 			options: ["block", "fake"]
 		},
+		{
+			name: "showCanvasWhileAsking",
+			defaultValue: true
+		},
 		{
 			name: "showNotifications",
 			defaultValue: true,

options/settingsDisplay.js

@@ -27,6 +27,13 @@
 				"displayAdvancedSettings": [true]
 			}
 		},
+		{
+			"name": "showCanvasWhileAsking",
+			"displayDependencies": {
+				"blockMode": ["askReadout", "ask"],
+				"displayAdvancedSettings": [true]
+			}
+		},
 		"faking",
 		{
 			"name": "minFakeSize",

releaseNotes.txt

@@ -3,7 +3,7 @@ Version 0.4.5:
 		-
 	
 	new features:
-		-
+		- Added way to inspect canvas content in ask mode while being asked
 	
 	fixes:
 		- prevent possible double faking