A rewrite of Poly+, my quality-of-life browser extension for Polytoria. Built entirely fresh using the WXT extension framework, Typescript, and with added better overall code quality.
extension
1import config from "@/utils/config.json";
2import { preferences, cache } from "@/utils/storage";
3browser.devtools.panels.create("Poly+", "icon/128.png", "devtools.html");
4
5for (const src of [
6 "/css/polytoria.css",
7 "/css/preferences.css"
8]) {
9 const css = browser.runtime.getURL(src as any);
10 const link = document.createElement('link');
11 link.rel = 'stylesheet';
12 link.href = css;
13 document.head.appendChild(link);
14};
15
16const modal: HTMLDialogElement = document.getElementsByTagName('dialog')[0]!;
17const openModal = (title: string, description: string, body: any, json: boolean) => {
18 if (json) {
19 body = `
20 <div style="padding: 10px; background: #171717; font-family: monospace; color: orange; font-size: 0.8rem; border-radius: 10px; position: relative;">
21 ${JSON.stringify((body || []), null, 2)
22 .replaceAll('\n','<br>')
23 .replaceAll(' ', ' ')
24 .replaceAll('\t', ' ')}
25 </div>
26 `;
27 };
28
29 modal.getElementsByTagName('h5')[0]!.textContent = title;
30 modal.getElementsByTagName('span')[0]!.textContent = description;
31 modal.getElementsByClassName('modal-body')[0]!.innerHTML = body;
32
33 modal.showModal();
34};
35
36document.getElementById('view-preferences')!.addEventListener('click', async () => {
37 openModal(
38 "Preferences",
39 "The following values are the user's preferences.",
40 await preferences.getPreferences(),
41 true
42 );
43});
44
45document.getElementById('view-cache')!.addEventListener('click', async () => {
46 openModal(
47 "Cache",
48 "The following values are saved for a certain period of time, before being \"replenished\" when next requested.",
49 await cache.getValue(),
50 true
51 );
52});
53
54document.getElementById('expose-config')!.addEventListener('click', () => openModal(
55 "Configuration",
56 "The defining values for several features of the extension.",
57 config,
58 true
59));
60
61document.getElementById('modal-close')!.addEventListener('click', () => modal.close());