add style options

manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 2,
     "name": "nazeka",
-    "version": "0.2.6.0",
+    "version": "0.2.6.1",
     "author": "Wareya",
     "homepage_url": "https://github.com/wareya/nazeka",
     "description": "A rikai replacement.",

options.js

@@ -167,12 +167,15 @@ function defaults()
         default: false,
         label: "Fixed width"
     });
+    /*
+    // currently broken
     settings.push({
         id: "fixedwidthpositioning",
         kind: "checkbox",
         default: false,
         label: "Position as though fixed width (currently nonfunctional; will fix later)"
     });
+    */
     settings.push({
         id: "corner",
         kind: "combobox",
@@ -312,6 +315,49 @@ function defaults()
         label: "Reader autoscroll leeway (when \"insert at bottom\" is enabled) (0 disables)"
     });
     
+    settings.push({
+        id: "reader_bg",
+        kind: "color",
+        default: "#111111",
+        label: "Reader background color"
+    });
+    settings.push({
+        id: "reader_fg",
+        kind: "color",
+        default: "#CCCCCC",
+        label: "Reader text color"
+    });
+    settings.push({
+        id: "reader_font_size",
+        kind: "text",
+        default: "1.4em",
+        label: "Reader text size"
+    });
+    settings.push({
+        id: "reader_right_padding",
+        kind: "text",
+        default: "0px",
+        label: "Reader right padding (useful if you use 'sticky' mode)"
+    });
+    settings.push({
+        id: "reader_max_width",
+        kind: "text",
+        default: "1000px",
+        label: "Reader max width"
+    });
+    settings.push({
+        id: "reader_margin",
+        kind: "text",
+        default: "8px",
+        label: "Reader left/right margins"
+    });
+    settings.push({
+        id: "reader_font",
+        kind: "text",
+        default: "",
+        label: "Reader font override (without trailing comma)"
+    });
+    
     // hotkeys
     settings.push({
         kind: "dummy",

reader.html

@@ -7,7 +7,7 @@ body
 {
     background-color: #111;
     color: #CCC;
-    font-family: Verdana, Arial, IPAGothic, TakaoGothic, Noto Sans CJK JP Regular, Meiryo, sans-serif;
+    font-family: Verdana, Arial, IPAGothic, Noto Sans CJK JP Regular, TakaoGothic, Meiryo, sans-serif;
     font-size: 1.4em;
 }
 html

reader.js

@@ -2,14 +2,33 @@
 
 'use strict';
 
-// updated by a timer looping function, based on local storage set by the options page
 // we only use a tiny number of settings here
 
 let reader_settings = {
 reader_reverse: false,
-reader_leeway: 200
+reader_leeway: 200,
+reader_bg: "#111111",
+reader_fg: "#CCCCCC",
+reader_font_size: "1.4em",
+reader_right_padding: "0px",
+reader_max_width: "1000px",
+reader_margin: "8px",
+reader_font: "",
 };
 
+function update_styles()
+{
+    let target = document.body.style;
+    target.backgroundColor = reader_settings.reader_bg;
+    target.color = reader_settings.reader_fg;
+    target.fontSize = reader_settings.reader_font_size;
+    target.paddingRight = reader_settings.reader_right_padding;
+    target.maxWidth = reader_settings.reader_max_width;
+    target.marginLeft = reader_settings.reader_margin;
+    target.marginRight = reader_settings.reader_margin;
+    target.fontFamily = reader_settings.reader_font;
+}
+
 async function reader_settings_init()
 {
     try
@@ -23,6 +42,13 @@ async function reader_settings_init()
         }
         getvar("reader_reverse", false);
         getvar("reader_leeway", 200);
+        getvar("reader_bg", "#111111");
+        getvar("reader_fg", "#CCCCCC");
+        getvar("reader_font_size","1.4em");
+        getvar("reader_right_padding", "0px");
+        getvar("reader_max_width", "1000px");
+        getvar("reader_margin", "8px");
+        getvar("reader_font", "");
     } catch(err) {} // options not stored yet
 }
 
@@ -38,6 +64,7 @@ browser.storage.onChanged.addListener((updates, storageArea) =>
         if(Object.keys(reader_settings).includes(option))
             reader_settings[option] = value.newValue;
     }
+    update_styles();
 });
 
 // actual reder code
@@ -81,7 +108,10 @@ let reader_text_previous = "";
 function reader_cycle_text(text)
 {
     if(text != "" && text != reader_text_previous)
+    {
         reader_update(text);
+        update_styles();
+    }
     reader_text_previous = text;
 }
 
@@ -110,3 +140,5 @@ browser.runtime.onMessage.addListener((req, sender) =>
         reader_cycle_text(req.text);
     return Promise.resolve(undefined);
 });
+
+window.onload = update_styles;