Bilibili-Evolved/utils/gui-settings/gui-settings.js
2019-02-20 14:22:55 +08:00

228 lines
6.7 KiB
JavaScript

import { ThemeColors } from "./theme-colors";
import { SettingsSearch } from "./settings-search";
import { Validator } from "./text-validate";
function getCategoryItems(category)
{
let element = category.nextElementSibling;
const elements = [];
while (element !== null && !element.classList.contains("category"))
{
elements.push(element);
element = element.nextElementSibling;
}
return elements;
}
function settingsChange(key, value)
{
$(`input[type='checkbox'][key='${key}']`)
.prop("checked", value);
$(`input[type='text'][key='${key}']`).val(value);
}
function syncGui()
{
for (const [key, value] of Object.entries(settings))
{
settingsChange(key, value);
}
}
function setupEvents()
{
$(".gui-settings-mask").on("click", () =>
{
$(".gui-settings-widgets-box,.gui-settings-box,.gui-settings-mask").removeClass("opened");
});
$("input[type='text'][key]").each((_, element) =>
{
$(element).attr("placeholder", settings[$(element).attr("key")]);
});
$(".gui-settings-content ul li.category").on("click", e =>
{
const searchBox = document.querySelector(".gui-settings-search");
if (searchBox.value !== "")
{
searchBox.value = "";
raiseEvent(searchBox, "input");
}
e.currentTarget.classList.toggle("folded");
getCategoryItems(e.currentTarget).forEach(it => it.classList.toggle("folded"));
});
$(".gui-settings-dropdown>input").on("click", e =>
{
$(e.currentTarget).parent().toggleClass("opened");
});
onSettingsChange((key, _, value) =>
{
if (settings[key] !== value)
{
settings[key] = value;
$(`input[type='checkbox'][key='${key}']`)
.prop("checked", value).change();
$(`input[type='text'][key='${key}']`).val(value).change();
}
});
}
function listenSettingsChange()
{
const reloadChanges = (key) =>
{
// const reloadableKey = Resource.reloadables[key];
// if (reloadableKey)
// {
// resources.fetchByKey(reloadableKey);
// }
};
$("input[type='checkbox'][key]").each((_, element) =>
{
$(element).on("change", () =>
{
const key = element.getAttribute("key");
const value = element.checked;
settings[key] = value;
reloadChanges(key);
saveSettings(settings);
});
});
$("input[type='text'][key]").each((_, element) =>
{
$(element).on("change", () =>
{
const key = element.getAttribute("key");
const value = Validator.getValidator(key).validate(element.value);
settings[key] = value;
element.value = value;
reloadChanges(key);
saveSettings(settings);
});
});
}
function listenDependencies()
{
const dependencies = {};
$(`input[dependencies]`).each((_, element) =>
{
const dep = $(element).attr("dependencies");
if (dep)
{
dependencies[$(element).attr("key")] = dep;
}
});
const checkBoxChange = element =>
{
const checked = element.prop("checked");
for (const key in dependencies)
{
const dependency = dependencies[key].split(" ");
if (dependency.indexOf(element.attr("key")) !== -1)
{
let disable = true;
if (checked && dependency.every(k => $(`input[key='${k}']`).prop("checked")))
{
disable = false;
}
const li = $(`li:has(input[key='${key}'])`);
const action = disable ? "addClass" : "removeClass";
li[action]("disabled");
$(`input[key='${key}'][type='text']`).parent()[action]("disabled");
}
}
};
$(`input[type='checkbox'][key]`)
.on("change", e => checkBoxChange($(e.target)))
.each((_, e) => checkBoxChange($(e)));
}
function checkOfflineData()
{
if (typeof offlineData !== "undefined")
{
$("li:has(input[key=useCache])").addClass("disabled");
$("input[key=useCache]").prop("disabled", true);
}
}
function foldAllCategories()
{
$(".gui-settings-content ul li.category").each((_, e) =>
{
$(e).click();
});
}
function checkCompatibility()
{
if (!CSS.supports("backdrop-filter", "blur(24px)")
&& !CSS.supports("-webkit-backdrop-filter", "blur(24px)"))
{
$("input[key=blurVideoControl]").prop("disabled", true);
settings.blurVideoControl = false;
saveSettings(settings);
}
if (window.devicePixelRatio === 1)
{
$("input[key=harunaScale]").prop("disabled", true);
settings.harunaScale = false;
saveSettings(settings);
}
if (settings.defaultPlayerLayout === "旧版")
{
const navbarOption = $("input[key=overrideNavBar]");
navbarOption.prop("disabled", true).change();
if (settings.overrideNavBar)
{
navbarOption.prop("checked", false).change();
settings.overrideNavBar = false;
saveSettings(settings);
}
}
}
function setDisplayNames()
{
for (const [key, name] of Object.entries(Resource.displayNames))
{
const input = document.querySelector(`input[key=${key}]`);
if (!input)
{
continue;
}
switch (input.type)
{
case "checkbox":
input.nextElementSibling.nextElementSibling.innerHTML = name;
break;
case "text":
const parent = input.parentElement;
if (parent.classList.contains("gui-settings-textbox-container"))
{
input.previousElementSibling.innerHTML = name;
}
else if (parent.classList.contains("gui-settings-dropdown"))
{
parent.previousElementSibling.innerHTML = name;
}
break;
default:
break;
}
}
}
(async () =>
{
resources.applyStyle("guiSettingsStyle");
const settingsBox = (resources.data.guiSettingsDom || resources.data.guiSettingsHtml).text;
$("body").append(settingsBox);
new SpinQuery(
() => $("body"),
it => it.length > 0 && !(unsafeWindow.parent.window === unsafeWindow),
_ => $(".gui-settings-icon-panel").css("display", "none")
).start();
setupEvents();
checkOfflineData();
syncGui();
listenDependencies();
listenSettingsChange();
foldAllCategories();
checkCompatibility();
setDisplayNames();
new ThemeColors().setupDom();
new SettingsSearch();
})();