“MediaWiki:Gadget-SettingsDialog.js”的版本间差异

2021年1月15日 (五) 23:46的版本

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

mw.SettingsDialog = function(config) {
    config.classes = [...(config.classes || []), 'settingsDialog']; // jshint ignore: line
    mw.SettingsDialog.super.call(this, 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]}) })); // 初始值不正确时会自动选取第一个选项
};
OO.inheritClass(mw.SettingsDialog, OO.ui.ProcessDialog);
mw.SettingsDialog.prototype.initialize = function() {
    mw.SettingsDialog.super.prototype.initialize.apply(this, arguments);
    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]}))
    ] );
};
mw.SettingsDialog.prototype.getActionProcess = function(action) {
    if (action == 'save') {
        mw.notify(wgULS('您的设置已保存！', '您的設置已保存！'), {type: 'success'});
        this.saveOptions();
    }
    this.close();
    return new OO.ui.Process();
};
mw.SettingsDialog.prototype.saveOptions = function() {
    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 );
};
mw.SettingsDialog.static = {
    name: 'settingsDialog',
    tagName: 'div',
    title: wgULS('小工具设置', '小工具設置'),
    actions: [
        {action: 'save', label: '保存', flags: ['primary', 'progressive']},
        {action: 'cancel', label: '取消', flags: 'safe'}
    ]
};