Add Options page for aria2 settings with connection test; wire into manifest
This commit is contained in:
		
					parent
					
						
							
								8eeb1d3b20
							
						
					
				
			
			
				commit
				
					
						a7966ebebe
					
				
			
		
					 5 changed files with 117 additions and 1 deletions
				
			
		| 
						 | 
				
			
			@ -7,6 +7,10 @@
 | 
			
		|||
    "default_title": "Archive.org Link Grabber",
 | 
			
		||||
    "default_popup": "src/popup/index.html"
 | 
			
		||||
  },
 | 
			
		||||
  "options_ui": {
 | 
			
		||||
    "page": "src/options/index.html",
 | 
			
		||||
    "open_in_tab": true
 | 
			
		||||
  },
 | 
			
		||||
  "permissions": [
 | 
			
		||||
    "storage",
 | 
			
		||||
    "clipboardWrite",
 | 
			
		||||
| 
						 | 
				
			
			@ -28,4 +32,3 @@
 | 
			
		|||
    }
 | 
			
		||||
  ]
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -34,3 +34,21 @@ export async function addUrisBatch({ endpoint, secret, uris, options = {} }) {
 | 
			
		|||
  return results;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function getVersion({ endpoint, secret }) {
 | 
			
		||||
  const body = {
 | 
			
		||||
    jsonrpc: "2.0",
 | 
			
		||||
    id: "archive-org-link-grabber:getVersion:" + Date.now(),
 | 
			
		||||
    method: "aria2.getVersion",
 | 
			
		||||
    params: [secret ? `token:${secret}` : undefined].filter(Boolean)
 | 
			
		||||
  };
 | 
			
		||||
  const res = await fetch(endpoint, {
 | 
			
		||||
    method: 'POST',
 | 
			
		||||
    headers: { 'Content-Type': 'application/json' },
 | 
			
		||||
    body: JSON.stringify(body)
 | 
			
		||||
  });
 | 
			
		||||
  if (!res.ok) {
 | 
			
		||||
    const text = await res.text().catch(() => String(res.status));
 | 
			
		||||
    throw new Error(`aria2 RPC error ${res.status}: ${text}`);
 | 
			
		||||
  }
 | 
			
		||||
  return res.json();
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
							
								
								
									
										34
									
								
								src/options/index.html
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										34
									
								
								src/options/index.html
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,34 @@
 | 
			
		|||
<!doctype html>
 | 
			
		||||
<html>
 | 
			
		||||
  <head>
 | 
			
		||||
    <meta charset="utf-8" />
 | 
			
		||||
    <title>Archive.org Link Grabber — Options</title>
 | 
			
		||||
    <link rel="stylesheet" href="styles.css" />
 | 
			
		||||
  </head>
 | 
			
		||||
  <body>
 | 
			
		||||
    <header>
 | 
			
		||||
      <h1>Options</h1>
 | 
			
		||||
    </header>
 | 
			
		||||
    <main>
 | 
			
		||||
      <section>
 | 
			
		||||
        <h2>aria2 RPC</h2>
 | 
			
		||||
        <div class="row">
 | 
			
		||||
          <label>Endpoint <input id="rpc-endpoint" placeholder="http://localhost:6800/jsonrpc" /></label>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="row">
 | 
			
		||||
          <label>Secret <input id="rpc-secret" type="password" placeholder="your-token" /></label>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="row actions">
 | 
			
		||||
          <button id="btn-save">Save</button>
 | 
			
		||||
          <button id="btn-reset">Reset</button>
 | 
			
		||||
          <button id="btn-test">Test Connection</button>
 | 
			
		||||
        </div>
 | 
			
		||||
        <div class="row">
 | 
			
		||||
          <output id="status"></output>
 | 
			
		||||
        </div>
 | 
			
		||||
      </section>
 | 
			
		||||
    </main>
 | 
			
		||||
    <script type="module" src="index.js"></script>
 | 
			
		||||
  </body>
 | 
			
		||||
  </html>
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										52
									
								
								src/options/index.js
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										52
									
								
								src/options/index.js
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,52 @@
 | 
			
		|||
import { getVersion } from "../lib/aria2.js";
 | 
			
		||||
 | 
			
		||||
const els = {
 | 
			
		||||
  endpoint: document.getElementById('rpc-endpoint'),
 | 
			
		||||
  secret: document.getElementById('rpc-secret'),
 | 
			
		||||
  btnSave: document.getElementById('btn-save'),
 | 
			
		||||
  btnReset: document.getElementById('btn-reset'),
 | 
			
		||||
  btnTest: document.getElementById('btn-test'),
 | 
			
		||||
  status: document.getElementById('status'),
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
async function restore() {
 | 
			
		||||
  const { aria2 } = await browser.storage.local.get('aria2');
 | 
			
		||||
  els.endpoint.value = aria2?.endpoint || 'http://localhost:6800/jsonrpc';
 | 
			
		||||
  els.secret.value = aria2?.secret || '';
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
async function save() {
 | 
			
		||||
  const endpoint = els.endpoint.value.trim();
 | 
			
		||||
  const secret = els.secret.value.trim();
 | 
			
		||||
  await browser.storage.local.set({ aria2: { endpoint, secret } });
 | 
			
		||||
  els.status.textContent = 'Saved.';
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
async function reset() {
 | 
			
		||||
  await browser.storage.local.remove('aria2');
 | 
			
		||||
  await restore();
 | 
			
		||||
  els.status.textContent = 'Reset to defaults.';
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
async function testConnection() {
 | 
			
		||||
  els.status.textContent = 'Testing…';
 | 
			
		||||
  try {
 | 
			
		||||
    const res = await getVersion({ endpoint: els.endpoint.value.trim(), secret: els.secret.value.trim() });
 | 
			
		||||
    const version = res?.result?.version || JSON.stringify(res?.result || res);
 | 
			
		||||
    els.status.textContent = `OK: aria2 version ${version}`;
 | 
			
		||||
  } catch (e) {
 | 
			
		||||
    els.status.textContent = `Error: ${e?.message || e}`;
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function wire() {
 | 
			
		||||
  els.btnSave.addEventListener('click', save);
 | 
			
		||||
  els.btnReset.addEventListener('click', reset);
 | 
			
		||||
  els.btnTest.addEventListener('click', testConnection);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
document.addEventListener('DOMContentLoaded', async () => {
 | 
			
		||||
  wire();
 | 
			
		||||
  await restore();
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										9
									
								
								src/options/styles.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										9
									
								
								src/options/styles.css
									
										
									
									
									
										Normal file
									
								
							| 
						 | 
				
			
			@ -0,0 +1,9 @@
 | 
			
		|||
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; margin: 16px; }
 | 
			
		||||
header h1 { margin: 0 0 12px; font-size: 18px; }
 | 
			
		||||
section { margin: 12px 0; }
 | 
			
		||||
.row { display: flex; align-items: center; gap: 8px; margin: 8px 0; flex-wrap: wrap; }
 | 
			
		||||
label { font-size: 14px; }
 | 
			
		||||
label input { margin-left: 6px; min-width: 360px; }
 | 
			
		||||
button { font-size: 13px; padding: 6px 12px; }
 | 
			
		||||
#status { font-size: 13px; white-space: pre-wrap; }
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue