LLWiki正在建设中,欢迎加入我们!
“MediaWiki:Gadget-SettingsDialog.js”的版本间差异
跳转到导航
跳转到搜索
小 |
|||
/**
* @Function: 定义小工具设置对话框
* @Methods:
*
*
* addTab:添加小工具
saveOptions,将设置保存到localStorage▼
* removeTab:移除小工具
* clearOptions:还原设置
* @Author: [[User:Bhsd]]
*/
"use strict";
/* global OO, wgULS */
mw.messages.setting( wgULS({'gadget-sd-title': '小工具设置', 'gadget-sd-notify': '您的设置已保存!'},
const formalize = function(ele) { return {data: ele.data || ele[0], label: ele.label || ele[1]}; };▼
{'gadget-sd-title': '小工具偏好設定', 'gadget-sd-notify': '您的偏好設定已儲存!'}) );
mw.SettingsDialog = function(config) {▼
// constructor只添加一个CSS类,剩下的交给addTab方法逐一添加小工具或initialize方法生成html
config.classes = (config.classes || []).concat( 'settingsDialog' );
mw.gadgets = mw.gadgets || {};▼
this.
this.gadgets.forEach(function(gadget) {
gadget.panel = new OO.ui.TabPanelLayout( gadget.name, {label: gadget.label} );
new OO.ui.CheckboxInputWidget( {selected: settings[ option.data ] || ele.default || ele[2]} )▼
ele.widget = new OO.ui.CheckboxInputWidget();
});
});▼
▲ this.radios = (config.radios || []).map(function(ele) {
▲ new OO.ui.RadioSelectInputWidget({options: ele.options.map(formalize),
});
return new OO.ui.FieldLayout(ele.widget, {label: ele.label, align: 'inline'
helpinline: true}).$element;
return new OO.ui.FieldLayout(ele.widget, {label: ele.label, align: 'inline', help: ele.help,
helpinline: true, classes: ['multioptions-wrap']}).$element;
});
this.clearOptions();
this.content.addTabPanels( this.gadget.map(function(gadget) { return gadget.panel; }) );
};
▲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(function(ele) {
▲ return new OO.ui.FieldLayout(ele.widget, {label: ele.label, align: 'inline'}).$element;
▲ }).concat( '<hr>' ).concat( this.radios.map(function(ele) {
▲ }) ) );
▲};
▲mw.SettingsDialog.prototype.getActionProcess = function(action) {
if (action == 'save') {
mw.notify(
this.saveOptions();
}
else { this.clearOptions(); }
this.close();
return new OO.ui.Process();
};
const gadget = {name: params.name || params[0], label: params.label || params[1]};
▲ const settings = Object.fromEntries( this.checkboxes.map(function(ele) {
gadget.checkboxes = params.checkboxes.map(function(ele) {
return [ele.data, ele.widget.isSelected()];▼
▲ });
mw.gadgets[ this.name ] = settings;▼
gadget.radios = params.radios.map(function(ele) {
mw.storage.setObject('gadget-' + this.name, settings);▼
▲
mw.hook( 'settings.update' ).fire( this.name ); // 视情况根据新设置更新小工具,有些设置可能需要刷新页面才会生效▼
options: ele.options || ele[2]};
});
this.gadgets.push( gadget );
};
SettingsDialog.prototype.removeTab = function(index) {
this.gadgets.splice(index, 1);
};
SettingsDialog.prototype.clearOptions = function() {
this.gadgets.forEach(function(gadget) {
gadget.checkboxes.forEach(function(ele) {
▲
});
gadget.radios.forEach(function(ele) {
ele.widget.setValue( settings[ ele.data ] || ele.default );
});
});
};
SettingsDialog.prototype.saveOptions = function() {
this.gadgets.forEach(function(gadget) {
const settings = Object.fromEntries( gadget.checkboxes.map(function(ele) {
▲ return [ele.data, ele.widget.isSelected()];
}).conat( gadget.radios.map(function(ele) { return [ele.data, ele.widget.getValue()]; }) ) );
▲ mw.gadgets[ this.name ] = settings;
▲ mw.storage.setObject('gadget-' + this.name, settings);
▲ mw.hook( 'settings.update' ).fire( this.name ); // 视情况根据新设置更新小工具,有些设置可能需要刷新页面才会生效
});
};
actions: [{action: 'save', label: mw.msg('
{action: 'cancel', label: mw.msg('
};
mw.settingsDialog = new SettingsDialog();
if (!mw.windowManager) {
mw.windowManager = mw.windowmanager || new OO.ui.WindowManager();
mw.windowManager.$element.appendTo( 'body' );
}
mw.windowManager.addWindows( [mw.settingsDialog] );
//</nowiki>
// [[category:作为模块的小工具]] [[category:桌面版小工具]] [[category:手机版小工具]] [[category:系统工具]]
|