add angular-round selector

background.js

@@ -1,18 +1,33 @@
 (function (root) {
   "use strict";
 
+  const FONT_STYLE_KEY = "glagolifyFontStyle";
+  const FONT_STYLES = new Set(["round", "angular"]);
+  const DEFAULT_FONT_STYLE = "round";
+
   function createBackgroundController(api) {
     const tabStates = new Map();
+    let fontStyle = DEFAULT_FONT_STYLE;
+    const fontStyleReady = Promise.resolve(api.storage.local.get(FONT_STYLE_KEY))
+      .then((stored) => {
+        if (stored && FONT_STYLES.has(stored[FONT_STYLE_KEY])) {
+          fontStyle = stored[FONT_STYLE_KEY];
+        }
+        return fontStyle;
+      })
+      .catch(() => fontStyle);
 
     function validTabId(tabId) {
       return Number.isInteger(tabId) && tabId >= 0;
     }
 
     async function broadcast(tabId, enabled) {
+      await fontStyleReady;
       try {
         await api.tabs.sendMessage(tabId, {
           type: "glagolify:set-enabled",
-          enabled
+          enabled,
+          fontStyle
         });
         return true;
       } catch (error) {
@@ -27,32 +42,61 @@
 
       if (message.type === "glagolify:document-ready") {
         const tabId = sender && sender.tab && sender.tab.id;
-        return Promise.resolve({
-          enabled: validTabId(tabId) && tabStates.get(tabId) === true
-        });
+        return fontStyleReady.then(() => ({
+          enabled: validTabId(tabId) && tabStates.get(tabId) === true,
+          fontStyle
+        }));
       }
 
       if (message.type === "glagolify:get-tab-state") {
         const tabId = message.tabId;
-        if (!validTabId(tabId)) {
-          return Promise.resolve({ enabled: false, available: false });
-        }
+        return fontStyleReady.then(async () => {
+          if (!validTabId(tabId)) {
+            return { enabled: false, available: false, fontStyle };
+          }
 
-        const enabled = tabStates.get(tabId) === true;
-        return broadcast(tabId, enabled).then((available) => ({ enabled, available }));
+          const enabled = tabStates.get(tabId) === true;
+          const available = await broadcast(tabId, enabled);
+          return { enabled, available, fontStyle };
+        });
       }
 
       if (message.type === "glagolify:set-tab-enabled") {
         const tabId = message.tabId;
         if (!validTabId(tabId) || typeof message.enabled !== "boolean") {
-          return Promise.resolve({ enabled: false, available: false });
+          return fontStyleReady.then(() => ({
+            enabled: false,
+            available: false,
+            fontStyle
+          }));
         }
 
-        tabStates.set(tabId, message.enabled);
-        return broadcast(tabId, message.enabled).then((available) => ({
-          enabled: message.enabled,
-          available
-        }));
+        return fontStyleReady.then(async () => {
+          tabStates.set(tabId, message.enabled);
+          const available = await broadcast(tabId, message.enabled);
+          return {
+            enabled: message.enabled,
+            available,
+            fontStyle
+          };
+        });
+      }
+
+      if (message.type === "glagolify:set-font-style") {
+        if (!FONT_STYLES.has(message.fontStyle)) {
+          return fontStyleReady.then(() => ({ fontStyle, accepted: false }));
+        }
+
+        return fontStyleReady.then(async () => {
+          await api.storage.local.set({ [FONT_STYLE_KEY]: message.fontStyle });
+          fontStyle = message.fontStyle;
+          await Promise.all(
+            [...tabStates]
+              .filter(([, tabEnabled]) => tabEnabled)
+              .map(([tabId]) => broadcast(tabId, true))
+          );
+          return { fontStyle, accepted: true };
+        });
       }
 
       return undefined;
@@ -62,7 +106,12 @@
       tabStates.delete(tabId);
     });
 
-    return { tabStates, broadcast };
+    return {
+      tabStates,
+      broadcast,
+      fontStyleReady,
+      getFontStyle: () => fontStyle
+    };
   }
 
   const exported = Object.freeze({ createBackgroundController });