Added badge

First draft for #233.

_locales/de/messages.json

@@ -564,10 +564,6 @@
 		"message": "Page-Action Icon hervorheben",
 		"description": ""
 	},
-	"highlightBrowserAction_description": {
-		"message": "",
-		"description": ""
-	},
 	"highlightPageAction_options.none": {
 		"message": "nicht hervorheben",
 		"description": ""
@@ -580,6 +576,18 @@
 		"message": "blinken",
 		"description": ""
 	},
+	"displayBadge_description": {
+		"message": "",
+		"description": ""
+	},
+	"displayBadge_title": {
+		"message": "Badge anzeigen",
+		"description": ""
+	},
+	"highlightBrowserAction_description": {
+		"message": "",
+		"description": ""
+	},
 	"highlightBrowserAction_title": {
 		"message": "Toolbar Icon bei Benachrichtigung ändern",
 		"description": ""

_locales/en/messages.json

@@ -576,6 +576,14 @@
 		"message": "blink",
 		"description": ""
 	},
+	"displayBadge_description": {
+		"message": "",
+		"description": ""
+	},
+	"displayBadge_title": {
+		"message": "Display badge",
+		"description": ""
+	},
 	"highlightBrowserAction_description": {
 		"message": "",
 		"description": ""

lib/main.js

@@ -62,7 +62,7 @@
 			var url = new URL(port.sender.url);
 			port.onMessage.addListener(function(data){
 				if (data.hasOwnProperty("canvasBlocker-notify")){
-					notification.show(port.sender.tab.id, url);
+					notification.show(port.sender.tab.id, url, data["canvasBlocker-notify"].api);
 				}
 				if (data.hasOwnProperty("canvasBlocker-clear-page-action")){
 					notification.hide(port.sender.tab.id);

lib/notification.js

@@ -30,7 +30,12 @@
 		}
 	};
 	
-	scope.show = function showNotification(tabId, url){
+	browser.browserAction.setBadgeBackgroundColor({
+		color: "rgba(255, 0, 0, 0.6)"
+	});
+	
+	const apiMap = new Map();
+	scope.show = function showNotification(tabId, url, api){
 		logging.notice("Show notification for tab", tabId);
 		if (
 			settings.get("showNotifications", url) &&
@@ -46,10 +51,33 @@
 			tabId: tabId,
 			path: paths.browserAction[settings.highlightBrowserAction]
 		});
+		
+		let apis = apiMap.get(tabId);
+		if (!apis){
+			apis = new Set();
+		}
+		apis.add(api);
+		apiMap.set(tabId, apis);
+		if (settings.get("displayBadge", url)){
+			browser.browserAction.setBadgeText({
+				tabId: tabId,
+				text: apis.size > 1? apis.size.toString(): api.charAt(0).toUpperCase()
+			});
+		}
+		
+		let apiList = "";
+		apis.forEach(function(api){
+			apiList += "\n  \u00B7 " + api;
+		});
+		browser.browserAction.setTitle({
+			tabId: tabId,
+			title: "CanvasBlocker" + apiList
+		});
 	};
 	
 	scope.hide = function hideNotification(tabId){
 		logging.notice("Hide page action for tab", tabId);
+		apiMap.delete(tabId);
 		browser.pageAction.hide(tabId);
 		browser.pageAction.setIcon({
 			tabId: tabId,
@@ -59,6 +87,14 @@
 			tabId: tabId,
 			path: paths.browserAction.none
 		});
+		browser.browserAction.setBadgeText({
+			tabId: tabId,
+			text: ""
+		});
+		browser.browserAction.setTitle({
+			tabId: tabId,
+			title: "CanvasBlocker"
+		});
 	};
 	
 	settings.on("showNotifications", function({newValue}){
@@ -71,4 +107,21 @@
 			});
 		}
 	});
+	
+	browser.tabs.onRemoved.addListener(function(tabId){
+		apiMap.delete(tabId);
+	});
+	settings.on("displayBadge", function({newValue}){
+		if (!newValue){
+			logging.message("badge was disabled -> hide all badges");
+			browser.tabs.query({}).then(function(tabs){
+				tabs.forEach(function(tab){
+					browser.browserAction.setBadgeText({
+						tabId: tab.id,
+						text: ""
+					});
+				});
+			});
+		}
+	});
 }());

lib/settingDefinitions.js

@@ -166,6 +166,10 @@
 			options: ["none", "color", "blink"],
 			urlSpecific: true
 		},
+		{
+			name: "displayBadge",
+			defaultValue: true
+		},
 		{
 			name: "storeImageForInspection",
 			defaultValue: false

options/settingsDisplay.js

@@ -202,6 +202,9 @@
 				}
 			]
 		},
+		{
+			"name": "displayBadge"
+		},
 		{
 			"name": "highlightBrowserAction"
 		},

releaseNotes.txt

@@ -9,6 +9,7 @@ Version 0.5.3:
 		- added option to highlight page action icon
 		- added option to control browser action icon on notifications
 		- added theme for browser action popup
+		- added badge
 	
 	fixes:
 		- CSP did not work properly for worker-src