Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-09 04:57:09 +03:00
Code Issues Packages Projects Releases Wiki Activity

design fixes

Browse Source
This commit is contained in:
Áron Hegymegi-Kiss
2021-12-15 22:22:06 +01:00
parent 9a9e564dbf
commit 46e515b130
5 changed files with 137 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
src/options.ts
View File

@@ -236,23 +236,59 @@ async function init() {
}
// Tab interaction
if (location.hash != "") {
const substr = location.hash.substring(1);
let menuItem = document.querySelector(`[data-for='${substr}']`);
if (menuItem == null)
menuItem = document.querySelector(`[data-for='segment-options']`);
menuItem.classList.add("selected");
} else {
document.querySelector(`[data-for='segment-options']`).classList.add("selected");
}
const tabElements = document.getElementsByClassName("tab-heading");
for (let i = 0; i < tabElements.length; i++) {
const tabFor = tabElements[i].getAttribute("data-for");
if (tabElements[i].classList.contains("selected"))
document.getElementById(tabFor).classList.remove("hidden");
tabElements[i].addEventListener("click", () => {
location.hash = tabFor;
createStickyHeader();
document.querySelectorAll(".tab-heading").forEach(element => { element.classList.remove("selected"); });
optionsContainer.querySelectorAll(".option-group").forEach(element => { element.classList.add("hidden"); });
tabElements[i].classList.add("selected");
document.getElementById(tabElements[i].getAttribute("data-for")).classList.remove("hidden");
document.getElementById(tabFor).classList.remove("hidden");
});
}
document.getElementById("version").innerText = "v. " + chrome.runtime.getManifest().version;
window.onscroll = () => createStickyHeader();
optionsContainer.classList.remove("hidden");
optionsContainer.classList.add("animated");
}
function createStickyHeader() {
const container = document.getElementById("options-container");
const options = document.getElementById("options");
if (window.pageYOffset > 115) {
if (!container.classList.contains("sticky")) {
options.style.marginTop = options.offsetTop.toString()+"px";
container.classList.add("sticky");
}
} else {
options.style.marginTop = "unset";
container.classList.remove("sticky");
}
}
/**
* Handle special cases where an option shouldn't show
*
@@ -294,6 +330,10 @@ function updateDisplayElement(element: HTMLElement) {
switch (displayOption) {
case "invidiousInstances":
element.innerText = displayText.join(', ');
if (displayText.length > 1) {
const resetButton = element.parentElement.querySelector(".invidious-instance-reset");
resetButton.classList.remove("hidden");
}
break;
}
}
@@ -309,6 +349,8 @@ function invidiousInstanceAddInit(element: HTMLElement, option: string) {
const button = element.querySelector(".trigger-button");
const setButton = element.querySelector(".text-change-set");
const cancelButton = element.querySelector(".text-change-reset");
const resetButton = element.querySelector(".invidious-instance-reset");
setButton.addEventListener("click", async function() {
if (textBox.value == "" || textBox.value.includes("/") || textBox.value.includes("http")) {
alert(chrome.i18n.getMessage("addInvidiousInstanceError"));
@@ -326,19 +368,26 @@ function invidiousInstanceAddInit(element: HTMLElement, option: string) {
invidiousOnClick(checkbox, "supportInvidious");
textBox.value = "";
resetButton.classList.remove("hidden");
// Hide this section again
textBox.value = "";
element.querySelector(".option-hidden-section").classList.add("hidden");
button.classList.remove("disabled");
}
});
const resetButton = element.querySelector(".invidious-instance-reset");
cancelButton.addEventListener("click", async function() {
textBox.value = "";
element.querySelector(".option-hidden-section").classList.add("hidden");
button.classList.remove("disabled");
});
resetButton.addEventListener("click", function() {
if (confirm(chrome.i18n.getMessage("resetInvidiousInstanceAlert"))) {
// Set to a clone of the default
Config.config[option] = Config.defaults[option].slice(0);
resetButton.classList.add("hidden");
}
});
}