Greasy Fork is available in English.

$Config

Allows users to configure scripts

此脚本不应直接安装,它是一个供其他脚本使用的外部库。如果您需要使用该库,请在脚本元属性加入:// @require https://update.greasyfork.org/scripts/446506/1538382/%24Config.js


作者
ctl2
版本
0.0.1.20250215220929
创建于
2022-06-15
更新于
2025-02-15
大小
339.5 KB
许可证
暂无

Example instance hosted here. Source code available here.

Usage
// @require     https://update.greasyfork.org/scripts/446506/1537901/%24Config.js
// @grant       GM.setValue
// @grant       GM.getValue
// @grant       GM.deleteValue
// Define a config
const $config = new $Config(
'STORAGE_KEY',
{
get: (_, configs) => ({data: Object.assign(...configs)}),
children: [
{label: 'a', value: 0, get: ({value: a}) => ({a})},
{label: 'b', value: 1, get: ({value: b}) => ({b})},
{label: 'c', value: 2, get: ({value: c}) => ({c})}
]
},
);
// Await config load & handle problems
try {
await $config.ready;
} catch (error) {
if (!$config.reset) {
// There's a problem with the arguments passed to the $Config constructor
throw error;
}
// There's a problem with the user's data (could be from manual editing or a script update)
if (!window.confirm(`${error.message}\n\nWould you like to erase your data?`)) {
return;
}
$config.reset();
}
// Apply the user's config
function useConfig() {
const {a, b, c} = $config.get().data;
// ...
}
useConfig();
// Set up config editing
const button = document.createElement('button');
button.addEventListener('click', async () => {
await $config.edit();
useConfig();
});

Constructor arguments
  1. [string] An identifier used to store data
  2. [Root] A schema for user config data
  3. [DefaultStyle*] Instructions for customizing the UI's appearance
  4. [object*] CSS to apply to the UI's root element
* = optional

Examples