MediaWiki:Gadget-SettingsDialog.js

注意：在保存之后，您可能需要清除浏览器缓存才能看到所作出的变更的影响。

• Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
• Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
• Internet Explorer：按住Ctrl的同时单击刷新，或按Ctrl-F5
• Opera：前往菜单 → 设置（Mac为Opera → Preferences），然后隐私和安全 → 清除浏览数据 → 缓存的图片和文件。

"use strict";
/* jshint jquery:true */
/* global mw, OO, wgULS */
function formalize(options) {
    return options.map(ele => ({data: ele[0], label: ele[1]}));
}

class SettingsDialog extends OO.ui.ProcessDialog {
    constructor(config) {
        config.classes = [...(config.classes || []), 'settingsDialog'];
        super(config);
        this.name = config.name;
        mw.gadgets = mw.gadgets || {};
        const settings = mw.gadgets[ this.name ] || {};
        // checkbox输入：[data, label]，输出：{data, label, widget}
        this.checkboxes = (config.checkboxes || []).map(ele => ({data: ele[0], label: ele[1],
            widget: new OO.ui.CheckboxInputWidget( {selected: settings[ ele[0] ] || ele[2]} )}));
        // radio输入：[data, label, options]，输出：{data, label, widget}
        this.radios = (config.radios || []).map(ele => ({ data: ele[0], label: ele[1],
            widget: new OO.ui.RadioSelectInputWidget({options: formalize(ele.options),
                value: settings[ ele[0] ] || ele[2]}) })); // 初始值不正确时会自动选取第一个选项
    }
    initialize() {
        super.initialize();
        this.$body.append( [
            ...this.checkboxes.map(ele => new OO.ui.FieldLayout(ele.widget, {label: ele.label, align: 'inline'}))
                .$element,
            '<hr>',
            ...this.radios.map(ele => $('<div>', {class: 'multioptions-wrap',
                html: [$('<b>', {text: ele.label}), ele.widget.$element]}))
        ] );
    }
    getActionProcess(action) {
        if (action == 'save') {
            mw.notify(wgULS('您的设置已保存！', '您的設置已保存！'), {type: 'success'});
            this.saveOptions();
        }
        this.close();
        return new OO.ui.Process();
    }
    saveOptions() {
        const settings = Object.fromEntries( [...this.checkboxes.map(ele => [ele.data, ele.widget.isSelected()]),
            ...this.radios.map(ele => [ele.data, ele.widget.getValue()])] );
        mw.gadgets[ this.name ] = settings;
        mw.storage.setObject(`gadget-${this.name}`, settings);
        mw.hook( 'settings.update' ).fire( this.name );
    }
}
// Safari不支持static属性
SettingsDialog.static = {
    name: 'settingsDialog',
    tagName: 'div',
    title: wgULS('小工具设置', '小工具設置'),
    actions: [
        {action: 'save', label: '保存', flags: ['primary', 'progressive']},
        {action: 'cancel', label: '取消', flags: 'safe'}
    ]
};