Allow to configure multiple Part-DB instances one can chose between.

Author: jbtronics

PRIVACY.md

@@ -15,10 +15,10 @@ The extension stores the following data in your browser using the standard WebEx
 
 | Storage | Key | Contents |
 |---|---|---|
-| `storage.sync` | `partdbUrl` | The URL of your Part-DB server |
-| `storage.sync` | `partdbLocale` | Your preferred Part-DB interface language |
-| `storage.local` | `infoCache` | A short-lived cache (5 minutes) of the provider list fetched from your Part-DB server |
-| `storage.local` | `lastProvider` | The last info-provider you selected in the popup |
+| `storage.sync` | `hosts` | The list of Part-DB instances you configured, each with a name, URL, and interface language |
+| `storage.local` | `lastHostId` | The instance you last selected in the popup, so it is remembered next time |
+| `storage.local` | `infoCacheByHost` | A short-lived cache (5 minutes), per instance, of the provider list fetched from your Part-DB server |
+| `storage.local` | `lastProviderByHost` | The last info-provider you selected in the popup, per instance |
 
 `storage.sync` data is synced across your browser profile by your browser vendor (e.g., Google or Mozilla) if you have browser sync enabled. This is subject to your browser vendor's own privacy policy. The extension itself has no control over or visibility into this sync.
 
@@ -49,12 +49,12 @@ The extension does not:
 
 | Permission | Type | Why it is needed |
 |---|---|---|
-| `storage` | Required | Save your server URL and locale preference |
+| `storage` | Required | Save your configured server URL(s) and locale preference(s) |
 | `activeTab` | Required | Read the page HTML on demand when you click Submit |
 | `scripting` | Required | Execute the page-reading code in the active tab when you click Submit |
-| Host access to your Part-DB URL | Optional — granted when you save your server URL | Allows the extension to make requests to your Part-DB server; scoped to exactly the URL you configure |
+| Host access to your Part-DB URL(s) | Optional — granted when you save a server URL | Allows the extension to make requests to your Part-DB server; scoped to exactly the URL(s) you configure |
 
-The extension requests no host permissions at install time. When you save your Part-DB server URL in the settings, the browser will ask you to grant access to that specific address only.
+The extension requests no host permissions at install time. When you save a Part-DB server URL in the settings, the browser will ask you to grant access to that specific address only.
 
 ## Contact
 

README.md

@@ -55,23 +55,26 @@ Then load the `src/` directory as an unpacked extension (see above).
 
 ## Configuration
 
-After installing, click the extension icon and then **Open Settings** (or right-click the icon → *Options*):
+After installing, click the extension icon and then **Open Settings** (or right-click the icon → *Options*). You can configure one or more Part-DB instances; click **+ Add instance** to add another.
 
 | Setting | Description |
 |---------|-------------|
+| **Name** | Optional label to tell instances apart, e.g. `Production`. Defaults to the hostname if left blank. |
 | **Part-DB base URL** | Root URL of your Part-DB instance, e.g. `https://partdb.example.com` |
 | **Interface locale** | Language code used in Part-DB URLs, e.g. `en`, `de`, `fr`. Check your browser's address bar when using Part-DB. |
 
-Use the **Test Connection** button to verify the URL is reachable and you are logged in.
+Use the **Test Connection** button on an instance to verify its URL is reachable and you are logged in.
+
+If you configure more than one instance, the popup shows an **Instance** dropdown to pick which one to submit to — it remembers your last choice for next time.
 
 ## Permissions
 
 | Permission | Type | Reason |
 |------------|------|--------|
-| `storage` | Required | Saves your Part-DB URL and locale setting |
+| `storage` | Required | Saves your configured Part-DB instances and settings |
 | `activeTab` | Required | Reads the page HTML on demand when you click Submit |
 | `scripting` | Required | Executes the page-reading code in the active tab |
-| Host access to your Part-DB URL | Optional — granted when you save your server URL | Required to reach your Part-DB instance; scoped to exactly the URL you configure |
+| Host access to your Part-DB URL(s) | Optional — granted when you save a server URL | Required to reach your Part-DB instance(s); scoped to exactly the URLs you configure |
 
 No host permissions are requested at install time. The extension has no passive presence on web pages — it reads page content only at the moment you click Submit.
 

src/_locales/de/messages.json

@@ -21,6 +21,9 @@
   "popup_connected_to": {
     "message": "Verbunden mit"
   },
+  "popup_host_label": {
+    "message": "Instanz"
+  },
   "popup_loading": {
     "message": "Wird geladen …"
   },
@@ -119,7 +122,19 @@
     "message": "Einstellungen"
   },
   "options_connection_title": {
-    "message": "Verbindung"
+    "message": "Part-DB-Instanzen"
+  },
+  "options_add_host_btn": {
+    "message": "+ Instanz hinzufügen"
+  },
+  "options_no_hosts_hint": {
+    "message": "Noch keine Instanzen konfiguriert. Klicken Sie auf „Instanz hinzufügen“, um zu starten."
+  },
+  "options_host_name_placeholder": {
+    "message": "z. B. Produktiv"
+  },
+  "options_remove_host": {
+    "message": "Instanz entfernen"
   },
   "options_url_label": {
     "message": "Part-DB Basis-URL"

src/_locales/en/messages.json

@@ -21,6 +21,9 @@
   "popup_connected_to": {
     "message": "Connected to"
   },
+  "popup_host_label": {
+    "message": "Instance"
+  },
   "popup_loading": {
     "message": "Loading…"
   },
@@ -119,7 +122,19 @@
     "message": "Settings"
   },
   "options_connection_title": {
-    "message": "Connection"
+    "message": "Part-DB Instances"
+  },
+  "options_add_host_btn": {
+    "message": "+ Add instance"
+  },
+  "options_no_hosts_hint": {
+    "message": "No instances configured yet. Click \"Add instance\" to get started."
+  },
+  "options_host_name_placeholder": {
+    "message": "e.g. Production"
+  },
+  "options_remove_host": {
+    "message": "Remove instance"
   },
   "options_url_label": {
     "message": "Part-DB base URL"

src/background/service-worker.js

@@ -1,33 +1,31 @@
+if (typeof importScripts === 'function') {
+    importScripts('../shared/host-storage.js');
+}
+
 chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
     if (message.action === 'submit') {
-        handleSubmit(message.html, message.url, message.title, message.provider).then(sendResponse);
+        handleSubmit(message.hostId, message.html, message.url, message.title, message.provider).then(sendResponse);
         return true;
     }
     if (message.action === 'getInfo') {
-        handleGetInfo().then(sendResponse);
+        handleGetInfo(message.hostId).then(sendResponse);
         return true;
     }
 });
 
-async function getConfig() {
-    const { partdbUrl, partdbLocale } = await chrome.storage.sync.get({
-        partdbUrl: '',
-        partdbLocale: 'en',
-    });
-    const baseUrl = (partdbUrl || '').replace(/\/$/, '');
-    const locale = partdbLocale || 'en';
-    return { baseUrl, locale };
-}
-
 const INFO_CACHE_TTL = 5 * 60 * 1000; // 5 minutes
 
-async function handleGetInfo() {
-    const { baseUrl, locale } = await getConfig();
-    if (!baseUrl) return { success: false, error: 'no_config' };
+async function handleGetInfo(hostId) {
+    const host = await getHostById(hostId);
+    if (!host) return { success: false, error: 'no_config' };
 
-    const { infoCache } = await chrome.storage.local.get({ infoCache: null });
-    if (infoCache && infoCache.baseUrl === baseUrl && Date.now() - infoCache.ts < INFO_CACHE_TTL) {
-        return { success: true, data: infoCache.data };
+    const baseUrl = host.url;
+    const locale = host.locale || 'en';
+
+    const { infoCacheByHost } = await chrome.storage.local.get({ infoCacheByHost: {} });
+    const cached = infoCacheByHost[hostId];
+    if (cached && cached.baseUrl === baseUrl && Date.now() - cached.ts < INFO_CACHE_TTL) {
+        return { success: true, data: cached.data };
     }
 
     const endpoint = `${baseUrl}/${locale}/tools/info_providers/browser_info`;
@@ -49,20 +47,23 @@ async function handleGetInfo() {
             return { success: false, error: 'not_logged_in', loginUrl: `${baseUrl}/${locale}/login` };
         }
         const data = await response.json();
-        await chrome.storage.local.set({ infoCache: { baseUrl, data, ts: Date.now() } });
+        infoCacheByHost[hostId] = { baseUrl, data, ts: Date.now() };
+        await chrome.storage.local.set({ infoCacheByHost });
         return { success: true, data };
     } catch (err) {
         return { success: false, error: 'network_error', message: err.message };
     }
 }
 
-async function handleSubmit(html, url, title, provider) {
-    const { baseUrl, locale } = await getConfig();
-
-    if (!baseUrl) {
+async function handleSubmit(hostId, html, url, title, provider) {
+    const host = await getHostById(hostId);
+    if (!host) {
         return { success: false, error: 'no_config' };
     }
 
+    const baseUrl = host.url;
+    const locale = host.locale || 'en';
+
     const endpoint = `${baseUrl}/${locale}/tools/info_providers/browser_html`;
 
     try {

src/i18n.js

@@ -1,17 +1,21 @@
-function applyI18n() {
-    for (const el of document.querySelectorAll('[data-i18n]')) {
+function applyI18n(root = document) {
+    for (const el of root.querySelectorAll('[data-i18n]')) {
         const msg = chrome.i18n.getMessage(el.dataset.i18n);
         if (msg) el.textContent = msg;
     }
-    for (const el of document.querySelectorAll('[data-i18n-html]')) {
+    for (const el of root.querySelectorAll('[data-i18n-html]')) {
         const msg = chrome.i18n.getMessage(el.dataset.i18nHtml);
         if (msg) {
             const doc = new DOMParser().parseFromString(msg, 'text/html');
             el.replaceChildren(...doc.body.childNodes);
         }
     }
-    for (const el of document.querySelectorAll('[data-i18n-placeholder]')) {
+    for (const el of root.querySelectorAll('[data-i18n-placeholder]')) {
         const msg = chrome.i18n.getMessage(el.dataset.i18nPlaceholder);
         if (msg) el.placeholder = msg;
     }
+    for (const el of root.querySelectorAll('[data-i18n-title]')) {
+        const msg = chrome.i18n.getMessage(el.dataset.i18nTitle);
+        if (msg) el.title = msg;
+    }
 }

src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "__MSG_ext_name__",
-  "version": "1.1.1",
+  "version": "1.2.0",
   "description": "__MSG_ext_description__",
   "default_locale": "en",
   "permissions": ["storage", "activeTab", "scripting"],
@@ -18,7 +18,7 @@
   },
   "background": {
     "service_worker": "background/service-worker.js",
-    "scripts": ["background/service-worker.js"]
+    "scripts": ["shared/host-storage.js", "background/service-worker.js"]
   },
   "options_ui": {
     "page": "options/options.html",

src/options/options.css

@@ -58,6 +58,71 @@ body {
     padding-bottom: 10px;
 }
 
+.card-title-row {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    border-bottom: 1px solid #e9ecef;
+    padding-bottom: 10px;
+}
+
+.card-title-row .card-title {
+    border-bottom: none;
+    padding-bottom: 0;
+}
+
+/* Host list */
+#hosts-list {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+}
+
+.host-row {
+    border: 1px solid #e9ecef;
+    border-radius: 8px;
+    padding: 16px;
+    display: flex;
+    flex-direction: column;
+    gap: 14px;
+}
+
+.host-row-header {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.host-name {
+    flex: 1;
+    font-weight: 600;
+}
+
+.host-row-actions {
+    display: flex;
+}
+
+.icon-btn {
+    flex-shrink: 0;
+    width: 30px;
+    height: 30px;
+    border: 1px solid #ced4da;
+    border-radius: 6px;
+    background: #fff;
+    color: #6c757d;
+    cursor: pointer;
+    font-size: 13px;
+    line-height: 1;
+    transition: background 0.15s, border-color 0.15s, color 0.15s;
+}
+
+.icon-btn:hover {
+    background: #f8d7da;
+    border-color: #f5c6cb;
+    color: #721c24;
+}
+
 /* Form */
 .form-group {
     display: flex;
@@ -154,6 +219,11 @@ input:invalid:not(:placeholder-shown) {
     background: #dee2e6;
 }
 
+.btn-sm {
+    padding: 6px 12px;
+    font-size: 13px;
+}
+
 .save-status {
     font-size: 13px;
     font-weight: 500;