Basic setup for an options page.

Nostore.xcodeproj/project.pbxproj

@@ -71,6 +71,14 @@
 		941B04342978CDF900CA291E /* Icon-16.png in Resources */ = {isa = PBXBuildFile; fileRef = 941B042F2978CDF900CA291E /* Icon-16.png */; };
 		941B04352978CDF900CA291E /* Icon-64.png in Resources */ = {isa = PBXBuildFile; fileRef = 941B04302978CDF900CA291E /* Icon-64.png */; };
 		941B04362978CDF900CA291E /* Icon-64.png in Resources */ = {isa = PBXBuildFile; fileRef = 941B04302978CDF900CA291E /* Icon-64.png */; };
+		948C69D9297F887600FB3574 /* options.html in Resources */ = {isa = PBXBuildFile; fileRef = 948C69D8297F887600FB3574 /* options.html */; };
+		948C69DA297F887600FB3574 /* options.html in Resources */ = {isa = PBXBuildFile; fileRef = 948C69D8297F887600FB3574 /* options.html */; };
+		948C69DD297F88A200FB3574 /* options.css in Resources */ = {isa = PBXBuildFile; fileRef = 948C69DB297F88A200FB3574 /* options.css */; };
+		948C69DE297F88A200FB3574 /* options.css in Resources */ = {isa = PBXBuildFile; fileRef = 948C69DB297F88A200FB3574 /* options.css */; };
+		948C69DF297F88A200FB3574 /* options.js in Resources */ = {isa = PBXBuildFile; fileRef = 948C69DC297F88A200FB3574 /* options.js */; };
+		948C69E0297F88A200FB3574 /* options.js in Resources */ = {isa = PBXBuildFile; fileRef = 948C69DC297F88A200FB3574 /* options.js */; };
+		948C69E2297F891F00FB3574 /* options.build.js in Resources */ = {isa = PBXBuildFile; fileRef = 948C69E1297F891F00FB3574 /* options.build.js */; };
+		948C69E3297F891F00FB3574 /* options.build.js in Resources */ = {isa = PBXBuildFile; fileRef = 948C69E1297F891F00FB3574 /* options.build.js */; };
 /* End PBXBuildFile section */
 
 /* Begin PBXContainerItemProxy section */
@@ -159,6 +167,10 @@
 		941B042E2978CDF900CA291E /* Icon-32.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "Icon-32.png"; sourceTree = "<group>"; };
 		941B042F2978CDF900CA291E /* Icon-16.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "Icon-16.png"; sourceTree = "<group>"; };
 		941B04302978CDF900CA291E /* Icon-64.png */ = {isa = PBXFileReference; lastKnownFileType = image.png; path = "Icon-64.png"; sourceTree = "<group>"; };
+		948C69D8297F887600FB3574 /* options.html */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.html; path = options.html; sourceTree = "<group>"; };
+		948C69DB297F88A200FB3574 /* options.css */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = text.css; path = options.css; sourceTree = "<group>"; };
+		948C69DC297F88A200FB3574 /* options.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.javascript; path = options.js; sourceTree = "<group>"; };
+		948C69E1297F891F00FB3574 /* options.build.js */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.javascript; path = options.build.js; sourceTree = "<group>"; };
 /* End PBXFileReference section */
 
 /* Begin PBXFrameworksBuildPhase section */
@@ -240,6 +252,10 @@
 		941B03A2296FA90400CA291E /* Resources */ = {
 			isa = PBXGroup;
 			children = (
+				948C69E1297F891F00FB3574 /* options.build.js */,
+				948C69DB297F88A200FB3574 /* options.css */,
+				948C69DC297F88A200FB3574 /* options.js */,
+				948C69D8297F887600FB3574 /* options.html */,
 				941B04162971138F00CA291E /* content.build.js */,
 				941B04152971138F00CA291E /* nostr.build.js */,
 				941B04172971138F00CA291E /* popup.build.js */,
@@ -475,7 +491,10 @@
 			buildActionMask = 2147483647;
 			files = (
 				941B0413297110F100CA291E /* background.build.js in Resources */,
+				948C69DF297F88A200FB3574 /* options.js in Resources */,
+				948C69DD297F88A200FB3574 /* options.css in Resources */,
 				941B03F2296FA90400CA291E /* background.js in Resources */,
+				948C69E2297F891F00FB3574 /* options.build.js in Resources */,
 				941B03F8296FA90400CA291E /* popup.css in Resources */,
 				941B04292977A28700CA291E /* Icon-128.png in Resources */,
 				941B04182971138F00CA291E /* nostr.build.js in Resources */,
@@ -489,6 +508,7 @@
 				941B041C2971139000CA291E /* popup.build.js in Resources */,
 				941B03EC296FA90400CA291E /* _locales in Resources */,
 				941B04222977A25700CA291E /* Icon-512.png in Resources */,
+				948C69D9297F887600FB3574 /* options.html in Resources */,
 				941B03F4296FA90400CA291E /* content.js in Resources */,
 				941B04262977A25700CA291E /* Icon-1024.png in Resources */,
 				941B04352978CDF900CA291E /* Icon-64.png in Resources */,
@@ -503,7 +523,10 @@
 			buildActionMask = 2147483647;
 			files = (
 				941B0414297110F100CA291E /* background.build.js in Resources */,
+				948C69E0297F88A200FB3574 /* options.js in Resources */,
+				948C69DE297F88A200FB3574 /* options.css in Resources */,
 				941B03F3296FA90400CA291E /* background.js in Resources */,
+				948C69E3297F891F00FB3574 /* options.build.js in Resources */,
 				941B03F9296FA90400CA291E /* popup.css in Resources */,
 				941B042A2977A28700CA291E /* Icon-128.png in Resources */,
 				941B04192971138F00CA291E /* nostr.build.js in Resources */,
@@ -517,6 +540,7 @@
 				941B041D2971139000CA291E /* popup.build.js in Resources */,
 				941B03ED296FA90400CA291E /* _locales in Resources */,
 				941B04232977A25700CA291E /* Icon-512.png in Resources */,
+				948C69DA297F887600FB3574 /* options.html in Resources */,
 				941B03F5296FA90400CA291E /* content.js in Resources */,
 				941B04272977A25700CA291E /* Icon-1024.png in Resources */,
 				941B04362978CDF900CA291E /* Icon-64.png in Resources */,

Shared (Extension)/Resources/manifest.json

@@ -36,6 +36,9 @@
             "72": "images/toolbar-72.png"
         }
     },
+    "options_ui": {
+        "page": "options.html"
+    },
     "permissions": [
         "storage"
     ],
@@ -58,4 +61,4 @@
             "strict_min_version": "15.4"
         }
     }
-}
+}

Shared (Extension)/Resources/options.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <script defer src="options.build.js"></script>
+</head>
+
+<body>
+  <h1>Settings</h1>
+</body>
+
+</html>

Shared (Extension)/Resources/popup.html

@@ -61,6 +61,7 @@
 
     <div class="help">
         <button @click='window.open("https://ursus.camp/nostore", "_blank")'>Get Help</button>
+        <button @click="browser.runtime.openOptionsPage()">Advanced</button>
     </div>
 
     <div class="disclaimer">

build.js

@@ -1,21 +1,27 @@
 #!/usr/bin/env node
 
-let watch = process.argv[2] === 'watch' ? {
+let watch =
-  onRebuild(error, result) {
+    process.argv[2] === 'watch'
-    if (error) console.error('watch rebuild failed: ', error)
+        ? {
-    else console.log('watch rebuild succeeded: ', result)
+              onRebuild(error, result) {
-  }
+                  if (error) console.error('watch rebuild failed: ', error);
-} : false;
+                  else console.log('watch rebuild succeeded: ', result);
+              },
+          }
+        : false;
 
-require('esbuild').build({
+require('esbuild')
-  entryPoints: {
+    .build({
-    'background.build': './Shared (Extension)/Resources/background.js',
+        entryPoints: {
-    'content.build': './Shared (Extension)/Resources/content.js',
+            'background.build': './Shared (Extension)/Resources/background.js',
-    'nostr.build': './Shared (Extension)/Resources/nostr.js',
+            'content.build': './Shared (Extension)/Resources/content.js',
-    'popup.build': './Shared (Extension)/Resources/popup.js',
+            'nostr.build': './Shared (Extension)/Resources/nostr.js',
-  },
+            'popup.build': './Shared (Extension)/Resources/popup.js',
-  outdir: './Shared (Extension)/Resources',
+            'options.build': './Shared (Extension)/Resources/options.js',
-  sourcemap: 'inline',
+        },
-  bundle: true,
+        outdir: './Shared (Extension)/Resources',
-  watch
+        sourcemap: 'inline',
-}).catch(() => process.exit(1))
+        bundle: true,
+        watch,
+    })
+    .catch(() => process.exit(1));