380 lines
18 KiB
JavaScript
380 lines
18 KiB
JavaScript
const DEFAULT_LIGHT_THEME = "vendor/highlightjs/styles/github.min.css";
|
|
const DEFAULT_DARK_THEME = "vendor/highlightjs/styles/github-dark.min.css";
|
|
|
|
const THEME_FILES = [
|
|
"vendor/highlightjs/styles/1c-light.min.css",
|
|
"vendor/highlightjs/styles/a11y-dark.min.css",
|
|
"vendor/highlightjs/styles/a11y-light.min.css",
|
|
"vendor/highlightjs/styles/agate.min.css",
|
|
"vendor/highlightjs/styles/androidstudio.min.css",
|
|
"vendor/highlightjs/styles/an-old-hope.min.css",
|
|
"vendor/highlightjs/styles/arduino-light.min.css",
|
|
"vendor/highlightjs/styles/arta.min.css",
|
|
"vendor/highlightjs/styles/ascetic.min.css",
|
|
"vendor/highlightjs/styles/atom-one-dark-reasonable.min.css",
|
|
"vendor/highlightjs/styles/atom-one-dark.min.css",
|
|
"vendor/highlightjs/styles/atom-one-light.min.css",
|
|
"vendor/highlightjs/styles/brown-paper.min.css",
|
|
"vendor/highlightjs/styles/codepen-embed.min.css",
|
|
"vendor/highlightjs/styles/color-brewer.min.css",
|
|
"vendor/highlightjs/styles/cybertopia-cherry.min.css",
|
|
"vendor/highlightjs/styles/cybertopia-dimmer.min.css",
|
|
"vendor/highlightjs/styles/cybertopia-icecap.min.css",
|
|
"vendor/highlightjs/styles/cybertopia-saturated.min.css",
|
|
"vendor/highlightjs/styles/dark.min.css",
|
|
"vendor/highlightjs/styles/default.min.css",
|
|
"vendor/highlightjs/styles/devibeans.min.css",
|
|
"vendor/highlightjs/styles/docco.min.css",
|
|
"vendor/highlightjs/styles/far.min.css",
|
|
"vendor/highlightjs/styles/felipec.min.css",
|
|
"vendor/highlightjs/styles/foundation.min.css",
|
|
"vendor/highlightjs/styles/github-dark-dimmed.min.css",
|
|
"vendor/highlightjs/styles/github-dark.min.css",
|
|
"vendor/highlightjs/styles/github.min.css",
|
|
"vendor/highlightjs/styles/gml.min.css",
|
|
"vendor/highlightjs/styles/googlecode.min.css",
|
|
"vendor/highlightjs/styles/gradient-dark.min.css",
|
|
"vendor/highlightjs/styles/gradient-light.min.css",
|
|
"vendor/highlightjs/styles/grayscale.min.css",
|
|
"vendor/highlightjs/styles/hybrid.min.css",
|
|
"vendor/highlightjs/styles/idea.min.css",
|
|
"vendor/highlightjs/styles/intellij-light.min.css",
|
|
"vendor/highlightjs/styles/ir-black.min.css",
|
|
"vendor/highlightjs/styles/isbl-editor-dark.min.css",
|
|
"vendor/highlightjs/styles/isbl-editor-light.min.css",
|
|
"vendor/highlightjs/styles/kimbie-dark.min.css",
|
|
"vendor/highlightjs/styles/kimbie-light.min.css",
|
|
"vendor/highlightjs/styles/lightfair.min.css",
|
|
"vendor/highlightjs/styles/lioshi.min.css",
|
|
"vendor/highlightjs/styles/magula.min.css",
|
|
"vendor/highlightjs/styles/mono-blue.min.css",
|
|
"vendor/highlightjs/styles/monokai-sublime.min.css",
|
|
"vendor/highlightjs/styles/monokai.min.css",
|
|
"vendor/highlightjs/styles/night-owl.min.css",
|
|
"vendor/highlightjs/styles/nnfx-dark.min.css",
|
|
"vendor/highlightjs/styles/nnfx-light.min.css",
|
|
"vendor/highlightjs/styles/nord.min.css",
|
|
"vendor/highlightjs/styles/obsidian.min.css",
|
|
"vendor/highlightjs/styles/panda-syntax-dark.min.css",
|
|
"vendor/highlightjs/styles/panda-syntax-light.min.css",
|
|
"vendor/highlightjs/styles/paraiso-dark.min.css",
|
|
"vendor/highlightjs/styles/paraiso-light.min.css",
|
|
"vendor/highlightjs/styles/pojoaque.min.css",
|
|
"vendor/highlightjs/styles/purebasic.min.css",
|
|
"vendor/highlightjs/styles/qtcreator-dark.min.css",
|
|
"vendor/highlightjs/styles/qtcreator-light.min.css",
|
|
"vendor/highlightjs/styles/rainbow.min.css",
|
|
"vendor/highlightjs/styles/rose-pine-dawn.min.css",
|
|
"vendor/highlightjs/styles/rose-pine-moon.min.css",
|
|
"vendor/highlightjs/styles/rose-pine.min.css",
|
|
"vendor/highlightjs/styles/routeros.min.css",
|
|
"vendor/highlightjs/styles/school-book.min.css",
|
|
"vendor/highlightjs/styles/shades-of-purple.min.css",
|
|
"vendor/highlightjs/styles/srcery.min.css",
|
|
"vendor/highlightjs/styles/stackoverflow-dark.min.css",
|
|
"vendor/highlightjs/styles/stackoverflow-light.min.css",
|
|
"vendor/highlightjs/styles/sunburst.min.css",
|
|
"vendor/highlightjs/styles/tokyo-night-dark.min.css",
|
|
"vendor/highlightjs/styles/tokyo-night-light.min.css",
|
|
"vendor/highlightjs/styles/tomorrow-night-blue.min.css",
|
|
"vendor/highlightjs/styles/tomorrow-night-bright.min.css",
|
|
"vendor/highlightjs/styles/vs.min.css",
|
|
"vendor/highlightjs/styles/vs2015.min.css",
|
|
"vendor/highlightjs/styles/xcode.min.css",
|
|
"vendor/highlightjs/styles/xt256.min.css",
|
|
"vendor/highlightjs/styles/base16/3024.min.css",
|
|
"vendor/highlightjs/styles/base16/apathy.min.css",
|
|
"vendor/highlightjs/styles/base16/apprentice.min.css",
|
|
"vendor/highlightjs/styles/base16/ashes.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-cave-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-cave.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-dune-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-dune.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-estuary-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-estuary.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-forest-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-forest.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-heath-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-heath.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-lakeside-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-lakeside.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-plateau-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-plateau.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-savanna-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-savanna.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-seaside-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-seaside.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-sulphurpool-light.min.css",
|
|
"vendor/highlightjs/styles/base16/atelier-sulphurpool.min.css",
|
|
"vendor/highlightjs/styles/base16/atlas.min.css",
|
|
"vendor/highlightjs/styles/base16/bespin.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-bathory.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-burzum.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-dark-funeral.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-gorgoroth.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-immortal.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-khold.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-marduk.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-mayhem.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-nile.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal-venom.min.css",
|
|
"vendor/highlightjs/styles/base16/black-metal.min.css",
|
|
"vendor/highlightjs/styles/base16/bright.min.css",
|
|
"vendor/highlightjs/styles/base16/brewer.min.css",
|
|
"vendor/highlightjs/styles/base16/brogrammer.min.css",
|
|
"vendor/highlightjs/styles/base16/brush-trees-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/brush-trees.min.css",
|
|
"vendor/highlightjs/styles/base16/chalk.min.css",
|
|
"vendor/highlightjs/styles/base16/circus.min.css",
|
|
"vendor/highlightjs/styles/base16/classic-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/classic-light.min.css",
|
|
"vendor/highlightjs/styles/base16/codeschool.min.css",
|
|
"vendor/highlightjs/styles/base16/colors.min.css",
|
|
"vendor/highlightjs/styles/base16/cupcake.min.css",
|
|
"vendor/highlightjs/styles/base16/cupertino.min.css",
|
|
"vendor/highlightjs/styles/base16/danqing.min.css",
|
|
"vendor/highlightjs/styles/base16/darcula.min.css",
|
|
"vendor/highlightjs/styles/base16/dark-violet.min.css",
|
|
"vendor/highlightjs/styles/base16/darkmoss.min.css",
|
|
"vendor/highlightjs/styles/base16/darktooth.min.css",
|
|
"vendor/highlightjs/styles/base16/decaf.min.css",
|
|
"vendor/highlightjs/styles/base16/default-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/default-light.min.css",
|
|
"vendor/highlightjs/styles/base16/dirtysea.min.css",
|
|
"vendor/highlightjs/styles/base16/dracula.min.css",
|
|
"vendor/highlightjs/styles/base16/edge-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/edge-light.min.css",
|
|
"vendor/highlightjs/styles/base16/eighties.min.css",
|
|
"vendor/highlightjs/styles/base16/embers.min.css",
|
|
"vendor/highlightjs/styles/base16/equilibrium-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/equilibrium-gray-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/equilibrium-gray-light.min.css",
|
|
"vendor/highlightjs/styles/base16/equilibrium-light.min.css",
|
|
"vendor/highlightjs/styles/base16/espresso.min.css",
|
|
"vendor/highlightjs/styles/base16/eva-dim.min.css",
|
|
"vendor/highlightjs/styles/base16/eva.min.css",
|
|
"vendor/highlightjs/styles/base16/flat.min.css",
|
|
"vendor/highlightjs/styles/base16/framer.min.css",
|
|
"vendor/highlightjs/styles/base16/fruit-soda.min.css",
|
|
"vendor/highlightjs/styles/base16/gigavolt.min.css",
|
|
"vendor/highlightjs/styles/base16/google-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/google-light.min.css",
|
|
"vendor/highlightjs/styles/base16/green-screen.min.css",
|
|
"vendor/highlightjs/styles/base16/grayscale-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/grayscale-light.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-dark-hard.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-dark-medium.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-dark-pale.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-dark-soft.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-light-hard.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-light-medium.min.css",
|
|
"vendor/highlightjs/styles/base16/gruvbox-light-soft.min.css",
|
|
"vendor/highlightjs/styles/base16/hardcore.min.css",
|
|
"vendor/highlightjs/styles/base16/harmonic16-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/harmonic16-light.min.css",
|
|
"vendor/highlightjs/styles/base16/heetch-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/heetch-light.min.css",
|
|
"vendor/highlightjs/styles/base16/helios.min.css",
|
|
"vendor/highlightjs/styles/base16/hopscotch.min.css",
|
|
"vendor/highlightjs/styles/base16/horizon-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/horizon-light.min.css",
|
|
"vendor/highlightjs/styles/base16/humanoid-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/humanoid-light.min.css",
|
|
"vendor/highlightjs/styles/base16/ia-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/ia-light.min.css",
|
|
"vendor/highlightjs/styles/base16/icy-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/ir-black.min.css",
|
|
"vendor/highlightjs/styles/base16/isotope.min.css",
|
|
"vendor/highlightjs/styles/base16/kimber.min.css",
|
|
"vendor/highlightjs/styles/base16/london-tube.min.css",
|
|
"vendor/highlightjs/styles/base16/macintosh.min.css",
|
|
"vendor/highlightjs/styles/base16/marrakesh.min.css",
|
|
"vendor/highlightjs/styles/base16/material-darker.min.css",
|
|
"vendor/highlightjs/styles/base16/material-lighter.min.css",
|
|
"vendor/highlightjs/styles/base16/material-palenight.min.css",
|
|
"vendor/highlightjs/styles/base16/material-vivid.min.css",
|
|
"vendor/highlightjs/styles/base16/material.min.css",
|
|
"vendor/highlightjs/styles/base16/materia.min.css",
|
|
"vendor/highlightjs/styles/base16/mellow-purple.min.css",
|
|
"vendor/highlightjs/styles/base16/mexico-light.min.css",
|
|
"vendor/highlightjs/styles/base16/mocha.min.css",
|
|
"vendor/highlightjs/styles/base16/monokai.min.css",
|
|
"vendor/highlightjs/styles/base16/nebula.min.css",
|
|
"vendor/highlightjs/styles/base16/nord.min.css",
|
|
"vendor/highlightjs/styles/base16/nova.min.css",
|
|
"vendor/highlightjs/styles/base16/ocean.min.css",
|
|
"vendor/highlightjs/styles/base16/oceanicnext.min.css",
|
|
"vendor/highlightjs/styles/base16/onedark.min.css",
|
|
"vendor/highlightjs/styles/base16/one-light.min.css",
|
|
"vendor/highlightjs/styles/base16/outrun-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/papercolor-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/papercolor-light.min.css",
|
|
"vendor/highlightjs/styles/base16/paraiso.min.css",
|
|
"vendor/highlightjs/styles/base16/pasque.min.css",
|
|
"vendor/highlightjs/styles/base16/phd.min.css",
|
|
"vendor/highlightjs/styles/base16/pico.min.css",
|
|
"vendor/highlightjs/styles/base16/pop.min.css",
|
|
"vendor/highlightjs/styles/base16/porple.min.css",
|
|
"vendor/highlightjs/styles/base16/qualia.min.css",
|
|
"vendor/highlightjs/styles/base16/railscasts.min.css",
|
|
"vendor/highlightjs/styles/base16/rebecca.min.css",
|
|
"vendor/highlightjs/styles/base16/ros-pine-dawn.min.css",
|
|
"vendor/highlightjs/styles/base16/ros-pine-moon.min.css",
|
|
"vendor/highlightjs/styles/base16/ros-pine.min.css",
|
|
"vendor/highlightjs/styles/base16/sagelight.min.css",
|
|
"vendor/highlightjs/styles/base16/sandcastle.min.css",
|
|
"vendor/highlightjs/styles/base16/seti-ui.min.css",
|
|
"vendor/highlightjs/styles/base16/shapeshifter.min.css",
|
|
"vendor/highlightjs/styles/base16/silk-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/silk-light.min.css",
|
|
"vendor/highlightjs/styles/base16/snazzy.min.css",
|
|
"vendor/highlightjs/styles/base16/solar-flare-light.min.css",
|
|
"vendor/highlightjs/styles/base16/solar-flare.min.css",
|
|
"vendor/highlightjs/styles/base16/solarized-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/solarized-light.min.css",
|
|
"vendor/highlightjs/styles/base16/spacemacs.min.css",
|
|
"vendor/highlightjs/styles/base16/summercamp.min.css",
|
|
"vendor/highlightjs/styles/base16/summerfruit-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/summerfruit-light.min.css",
|
|
"vendor/highlightjs/styles/base16/synth-midnight-terminal-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/synth-midnight-terminal-light.min.css",
|
|
"vendor/highlightjs/styles/base16/tango.min.css",
|
|
"vendor/highlightjs/styles/base16/tender.min.css",
|
|
"vendor/highlightjs/styles/base16/tomorrow-night.min.css",
|
|
"vendor/highlightjs/styles/base16/tomorrow.min.css",
|
|
"vendor/highlightjs/styles/base16/twilight.min.css",
|
|
"vendor/highlightjs/styles/base16/unikitty-dark.min.css",
|
|
"vendor/highlightjs/styles/base16/unikitty-light.min.css",
|
|
"vendor/highlightjs/styles/base16/vulcan.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-10-light.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-10.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-95-light.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-95.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-high-contrast-light.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-high-contrast.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-nt-light.min.css",
|
|
"vendor/highlightjs/styles/base16/windows-nt.min.css",
|
|
"vendor/highlightjs/styles/base16/woodland.min.css",
|
|
"vendor/highlightjs/styles/base16/xcode-dusk.min.css",
|
|
"vendor/highlightjs/styles/base16/zenburn.min.css"
|
|
];
|
|
|
|
const input = document.getElementById("autoFormat");
|
|
const lineNumbersInput = document.getElementById("lineNumbers");
|
|
const langJsonInput = document.getElementById("langJson");
|
|
const langMarkdownInput = document.getElementById("langMarkdown");
|
|
const langPlaintextInput = document.getElementById("langPlaintext");
|
|
const langXmlInput = document.getElementById("langXml");
|
|
const langYamlInput = document.getElementById("langYaml");
|
|
const themeModeSelect = document.getElementById("themeMode");
|
|
const lightThemeSelect = document.getElementById("lightTheme");
|
|
const darkThemeSelect = document.getElementById("darkTheme");
|
|
const saveBtn = document.getElementById("save");
|
|
|
|
function themeLabel(file) {
|
|
const trimmed = file
|
|
.replace(/^vendor\/highlightjs\/styles\//, "")
|
|
.replace(/\.min\.css$/, "")
|
|
.replace(/\.css$/, "");
|
|
const parts = trimmed.split("/");
|
|
const name = parts.pop() || trimmed;
|
|
const base = name
|
|
.split("-")
|
|
.map((chunk) =>
|
|
chunk.length ? chunk[0].toUpperCase() + chunk.slice(1) : chunk
|
|
)
|
|
.join(" ");
|
|
if (parts[0] === "base16") return `Base16: ${base}`;
|
|
return base;
|
|
}
|
|
|
|
function populateThemeSelect(select, selected) {
|
|
const entries = THEME_FILES.map((file) => ({
|
|
file,
|
|
label: themeLabel(file)
|
|
})).sort((a, b) => a.label.localeCompare(b.label));
|
|
|
|
select.innerHTML = "";
|
|
entries.forEach((entry) => {
|
|
const option = document.createElement("option");
|
|
option.value = entry.file;
|
|
option.textContent = entry.label;
|
|
select.appendChild(option);
|
|
});
|
|
|
|
select.value = selected;
|
|
if (!select.value && entries.length) {
|
|
select.value = entries[0].file;
|
|
}
|
|
}
|
|
|
|
chrome.storage.sync.get(
|
|
{
|
|
autoFormat: false,
|
|
themeMode: null,
|
|
theme: null,
|
|
lightTheme: DEFAULT_LIGHT_THEME,
|
|
darkTheme: DEFAULT_DARK_THEME,
|
|
lineNumbers: false,
|
|
langJson: true,
|
|
langMarkdown: false,
|
|
langPlaintext: false,
|
|
langXml: false,
|
|
langYaml: false
|
|
},
|
|
(data) => {
|
|
const mode = data.themeMode || data.theme || "system";
|
|
input.checked = data.autoFormat;
|
|
themeModeSelect.value = mode;
|
|
populateThemeSelect(lightThemeSelect, data.lightTheme || DEFAULT_LIGHT_THEME);
|
|
populateThemeSelect(darkThemeSelect, data.darkTheme || DEFAULT_DARK_THEME);
|
|
lineNumbersInput.checked = Boolean(data.lineNumbers);
|
|
langJsonInput.checked = Boolean(data.langJson);
|
|
langMarkdownInput.checked = Boolean(data.langMarkdown);
|
|
langPlaintextInput.checked = Boolean(data.langPlaintext);
|
|
langXmlInput.checked = Boolean(data.langXml);
|
|
langYamlInput.checked = Boolean(data.langYaml);
|
|
}
|
|
);
|
|
|
|
saveBtn.addEventListener("click", async () => {
|
|
const wantAuto = input.checked;
|
|
const themeMode = themeModeSelect.value;
|
|
const lightTheme = lightThemeSelect.value;
|
|
const darkTheme = darkThemeSelect.value;
|
|
const lineNumbers = lineNumbersInput.checked;
|
|
const langJson = langJsonInput.checked;
|
|
const langMarkdown = langMarkdownInput.checked;
|
|
const langPlaintext = langPlaintextInput.checked;
|
|
const langXml = langXmlInput.checked;
|
|
const langYaml = langYamlInput.checked;
|
|
|
|
if (wantAuto) {
|
|
const granted = await chrome.permissions.request({ origins: ["<all_urls>"] });
|
|
if (!granted) {
|
|
alert("Auto-Format benötigt Seitenzugriff (Host-Permission). Wurde abgelehnt.");
|
|
input.checked = false;
|
|
return;
|
|
}
|
|
} else {
|
|
// Optional: Permissions wieder zurückgeben
|
|
// Achtung: Entfernt ALLE origins in diesem Satz.
|
|
await chrome.permissions.remove({ origins: ["<all_urls>"] }).catch(() => {});
|
|
}
|
|
|
|
await chrome.storage.sync.set({
|
|
autoFormat: wantAuto,
|
|
themeMode,
|
|
lightTheme,
|
|
darkTheme,
|
|
lineNumbers,
|
|
langJson,
|
|
langMarkdown,
|
|
langPlaintext,
|
|
langXml,
|
|
langYaml
|
|
});
|
|
saveBtn.textContent = "Gespeichert!";
|
|
setTimeout(() => (saveBtn.textContent = "Speichern"), 1200);
|
|
});
|