[Update] v4.2リリース

_locales/en/messages.json

@@ -9,6 +9,7 @@
 	"setting_privacy_unlisted": { "message": "Unlisted" },
 	"setting_privacy_private": { "message": "Private" },
 	"setting_privacy_limited": { "message": "Limited(Only for implemented instances)" },
+	"setting_privacy_direct": { "message": "Direct" },
 	"setting_save": { "message": "Save the changes" },
-	"setting_close": { "message": "Discard this change and close" }
+	"setting_close": { "message": "Discard the changes" }
 }

_locales/ja/messages.json

@@ -9,6 +9,7 @@
 	"setting_privacy_unlisted": { "message": "未収載" },
 	"setting_privacy_private": { "message": "非公開" },
 	"setting_privacy_limited": { "message": "限定公開(※一部のインスタンスのみ)" },
+	"setting_privacy_direct": { "message": "ダイレクト" },
 	"setting_save": { "message": "変更を保存" },
-	"setting_close": { "message": "変更を破棄して閉じる" }
+	"setting_close": { "message": "変更を破棄" }
 }

background.js

@@ -24,28 +24,37 @@ const notifyListeningInfo = (tabId) => {
 	chrome.storage.local.get(["enabled"], items => {
 		const { enabled } = items;
 
-		if (enabled) {
-			(function looper (tabId) {
-				chrome.tabs.get(tabId, tabInfo => {
-					const { status, title, url } = tabInfo;
-
-					if (status === "loading") {
-						setTimeout(looper(tabId), 200);
-						return;
-					}
-
-					chrome.notifications.create(null, {
-						type: chrome.notifications.TemplateType.BASIC,
-
-						title,
-						message: url,
-						iconUrl: "icons/icon48.png"
-					});
+		if (!enabled) return;
+
+		(function looper (tabId) {
+			chrome.tabs.get(tabId, tabInfo => {
+				const { status, title, url } = tabInfo;
+
+				if (status === "loading") {
+					setTimeout(looper(tabId), 200);
+					return;
+				}
+
+				chrome.notifications.create(null, {
+					type: chrome.notifications.TemplateType.BASIC,
 
-					tootListeningInfo(title, url);
+					title,
+					message: url,
+					iconUrl: "icons/icon48.png"
+				}, currentId => {
+					chrome.notifications.onClicked.addListener(notificationId => {
+						if (notificationId === currentId) {
+							chrome.tabs.highlight({ windowId: tabInfo.windowId, tabs: tabInfo.index });
+							chrome.notifications.clear(currentId);
+						}
+
+						chrome.notifications.onClicked.removeListener(event);
+					});
 				});
-			})(tabId);
-		}
+
+				tootListeningInfo(title, url);
+			});
+		})(tabId);
 	});
 };
 
@@ -58,33 +67,32 @@ const notifyListeningInfo = (tabId) => {
 const tootListeningInfo = (title, url) => {
 	chrome.storage.local.get(["enabled", "instance", "token", "privacy"], items => {
 		const { enabled, instance, token, privacy } = items;
-
+
+		if (!enabled) return;
 		if (!instance) throw new TypeError("A config, 'instance' is invalid.");
 		if (!token) throw new TypeError("A config, 'token' is invalid.");
 		if (!privacy) throw new TypeError("A config, 'privacy' is invalid.");
 
-		if (enabled) {
-			return fetch(`${instance}/api/v1/statuses`, {
-				method: "POST",
-
-				headers: {
-					"Content-Type": "application/json",
-					"Authorization": `Bearer ${token}`
-				},
-
-				body: JSON.stringify({
-					status: [
-						"#WhatYouarePlaying",
-						"Now playing🎶",
-						"",
-						`【${title}】`,
-						url
-					].join("\n"),
-
-					visibility: privacy
-				})
-			});
-		}
+		return fetch(`${instance}/api/v1/statuses`, {
+			method: "POST",
+
+			headers: {
+				"Content-Type": "application/json",
+				"Authorization": `Bearer ${token}`
+			},
+
+			body: JSON.stringify({
+				status: [
+					"#WhatYouarePlaying",
+					"Now playing🎶",
+					"",
+					`【${title}】`,
+					url
+				].join("\n"),
+
+				visibility: privacy
+			})
+		});
 	});
 };
 
@@ -159,4 +167,12 @@ chrome.webNavigation.onHistoryStateUpdated.addListener(
 			URLMatchers.YouTube
 		]
 	}
-);
+);
+
+chrome.storage.local.get(["enabled", "instance", "token"], items => {
+	let { enabled } = items;
+	const { instance, token } = items;
+
+	if (!instance || !token) enabled = false;
+	chrome.browserAction.setBadgeText({ text: enabled ? "ON" : "OFF" });
+});

manifest.json

@@ -3,8 +3,8 @@
 
 	"name": "What You're Playing",
 	"description": "__MSG_app_description__",
-	"version": "4.1",
-	"version_name": "v4.1",
+	"version": "4.2",
+	"version_name": "v4.2",
 	"default_locale": "en",
 
 	"icons": {
@@ -36,7 +36,7 @@
 			"128": "icons/icon128.png"
 		},
 
-		"default_title": "Settings | What You're Playing",
+		"default_title": "What You're Playing",
 		"default_popup": "views/settings/index.html"
 	},
 

views/settings/index.html

@@ -18,7 +18,10 @@
 		<Header Class = "navbar-fixed">
 			<Nav>
 				<Div Class = "nav-wrapper">
-					<Span Class = "brand-logo center">What You're Playing</Span>
+					<Span Class = "brand-logo center">
+						<Img Class = "logo-icon" Src = "/icons/icon128.png" />
+						What You're Playing
+					</Span>
 
 					<UL Class = "right">
 						<Li Class = "switch">
@@ -52,6 +55,7 @@
 					<Option Name = "privacy.unlisted" Value = "unlisted" Locale-Message = "setting_privacy_unlisted">Unlisted</Option>
 					<Option Name = "privacy.private" Value = "private" Locale-Message = "setting_privacy_private">Private</Option>
 					<Option Name = "privacy.limited" Value = "limited" Locale-Message = "setting_privacy_limited">Limited(Only for implemented instances)</Option>
+					<Option Name = "privacy.direct" Value = "direct" Locale-Message = "setting_privacy_direct">Direct</Option>
 				</Select>
 
 				<Label Locale-Message = "setting_privacy">Privacy</Label>
@@ -65,7 +69,7 @@
 
 				<Button ID = "btns_close" Class = "btn red waves-effect waves-light">
 					<I Class = "material-icons left">close</I>
-					<Locale Message = "setting_close">Discard this change and close</Locale>
+					<Locale Message = "setting_close">Discard the changes</Locale>
 				</Button>
 			</Div>
 		</Main>

views/settings/settings.css

@@ -4,4 +4,9 @@
 
 Main {
 	Padding: 1rem;
+}
+
+.logo-icon {
+	Height: 1em;
+	Vertical-Align: Middle;
 }

views/settings/settings.js

@@ -21,9 +21,10 @@ window.addEventListener("DOMContentLoaded", () => {
 	});
 
 	enabledSwitch.addEventListener("change", event => {
-		chrome.storage.local.set({
-			enabled: event.target.checked
-		});
+		const enabled = event.target.checked;
+
+		chrome.storage.local.set({ enabled });
+		chrome.browserAction.setBadgeText({ text: enabled ? "ON" : "OFF" });
 	});
 
 	saveBtn.addEventListener("click", () => {
@@ -32,6 +33,8 @@ window.addEventListener("DOMContentLoaded", () => {
 			token: tokenInputter.value,
 			privacy: pricacySelector.value
 		});
+
+		window.close();
 	});
 
 	closeBtn.addEventListener("click", () => {