LLWiki正在建设中,欢迎加入我们!
“MediaWiki:Gadget-SettingsDialog.js”的版本间差异
跳转到导航
跳转到搜索
小 (Bhsd移动页面MediaWiki:Gadget-site-lib-es6.js至MediaWiki:Gadget-SettingsDialog.js,不留重定向:更直观的命名) |
小 |
||
第1行: | 第1行: | ||
//<nowiki> |
|||
// 由ResourceLoader直接调用,不可使用ES6语法 |
|||
/** |
|||
* @Function: 定义小工具设置对话框 |
|||
* @Methods: constructor,构建mw.SettingsDialog对象 |
|||
initialize,打开窗口时初始化html |
|||
getActionProcess,点击按钮时执行动作 |
|||
saveOptions,将设置保存到localStorage |
|||
* @Author: [[User:Bhsd]] |
|||
*/ |
|||
"use strict"; |
"use strict"; |
||
/* global OO, wgULS */ |
/* global OO, wgULS */ |
||
const formalize = function( |
const formalize = function(ele) { return {data: ele.data || ele[0], label: ele.label || ele[1]}; }; |
||
return options.map(ele => ({data: ele[0], label: ele[1]})); |
|||
}; |
|||
mw.SettingsDialog = function(config) { |
mw.SettingsDialog = function(config) { |
||
config.classes = |
config.classes = (config.classes || []).concat( 'settingsDialog' ); |
||
mw.SettingsDialog.super.call(this, config); |
mw.SettingsDialog.super.call(this, config); |
||
this.name = config.name; |
this.name = config.name; |
||
mw.gadgets = mw.gadgets || {}; |
mw.gadgets = mw.gadgets || {}; |
||
const settings = mw.gadgets[ this.name ] || {}; |
const settings = mw.gadgets[ this.name ] || {}; // 这里不更新mw.gadgets[ this.name ],因为原则上小工具执行时已经更新过了 |
||
// checkbox输入:[data, label],输出:{data, label, widget} |
// checkbox输入:[data, label, default],输出:{data, label, widget} |
||
this.checkboxes = (config.checkboxes || []).map(ele |
this.checkboxes = (config.checkboxes || []).map(function(ele) { |
||
const option = formalize(ele); |
|||
⚫ | |||
return $.extend(option, {widget: |
|||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
⚫ | |||
const option = formalize(ele); |
|||
return $.extend(option, {widget: |
|||
⚫ | |||
⚫ | |||
⚫ | |||
}); |
|||
}; |
}; |
||
OO.inheritClass(mw.SettingsDialog, OO.ui.ProcessDialog); |
OO.inheritClass(mw.SettingsDialog, OO.ui.ProcessDialog); |
||
mw.SettingsDialog.prototype.initialize = function() { |
mw.SettingsDialog.prototype.initialize = function() { |
||
mw.SettingsDialog.super.prototype.initialize.apply(this, arguments); |
mw.SettingsDialog.super.prototype.initialize.apply(this, arguments); |
||
this.$body.append( |
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) { |
|||
.$element), |
|||
⚫ | |||
⚫ | |||
}) ) ); |
|||
...this.radios.map(ele => $('<div>', {class: 'multioptions-wrap', |
|||
⚫ | |||
⚫ | |||
}; |
}; |
||
mw.SettingsDialog.prototype.getActionProcess = function(action) { |
mw.SettingsDialog.prototype.getActionProcess = function(action) { |
||
第39行: | 第52行: | ||
}; |
}; |
||
mw.SettingsDialog.prototype.saveOptions = function() { |
mw.SettingsDialog.prototype.saveOptions = function() { |
||
const settings = Object.fromEntries( |
const settings = Object.fromEntries( this.checkboxes.map(function(ele) { |
||
return [ele.data, ele.widget.isSelected()]; |
|||
}).conat( this.radios.map(function(ele) { return [ele.data, ele.widget.getValue()]; }) ) ); |
|||
mw.gadgets[ this.name ] = settings; |
mw.gadgets[ this.name ] = settings; |
||
mw.storage.setObject( |
mw.storage.setObject('gadget-' + this.name, settings); |
||
mw.hook( 'settings.update' ).fire( this.name ); |
mw.hook( 'settings.update' ).fire( this.name ); // 视情况根据新设置更新小工具,有些设置可能需要刷新页面才会生效 |
||
}; |
}; |
||
mw.SettingsDialog.static = { |
mw.SettingsDialog.static = {name: 'settingsDialog', tagName: 'div', title: wgULS('小工具设置', '小工具設置'), |
||
⚫ | |||
name: 'settingsDialog', |
|||
⚫ | |||
tagName: 'div', |
|||
title: wgULS('小工具设置', '小工具設置'), |
|||
actions: [ |
|||
⚫ | |||
⚫ | |||
⚫ | |||
}; |
}; |
||
//</nowiki> |
|||
// [[category:作为模块的小工具]] [[category:桌面版小工具]] [[category:手机版小工具]] [[category:系统工具]] |
|||
// {{DEFAULTSORT:SettingsDialog.js}} |
2021年1月16日 (六) 00:54的版本
//<nowiki> // 由ResourceLoader直接调用,不可使用ES6语法 /** * @Function: 定义小工具设置对话框 * @Methods: constructor,构建mw.SettingsDialog对象 initialize,打开窗口时初始化html getActionProcess,点击按钮时执行动作 saveOptions,将设置保存到localStorage * @Author: [[User:Bhsd]] */ "use strict"; /* global OO, wgULS */ const formalize = function(ele) { return {data: ele.data || ele[0], label: ele.label || ele[1]}; }; mw.SettingsDialog = function(config) { config.classes = (config.classes || []).concat( 'settingsDialog' ); mw.SettingsDialog.super.call(this, config); this.name = config.name; mw.gadgets = mw.gadgets || {}; const settings = mw.gadgets[ this.name ] || {}; // 这里不更新mw.gadgets[ this.name ],因为原则上小工具执行时已经更新过了 // checkbox输入:[data, label, default],输出:{data, label, widget} this.checkboxes = (config.checkboxes || []).map(function(ele) { const option = formalize(ele); return $.extend(option, {widget: new OO.ui.CheckboxInputWidget( {selected: settings[ option.data ] || ele.default || ele[2]} ) }); }); // radio输入:{0: data, 1: label, 2: default, options},输出:{data, label, widget} this.radios = (config.radios || []).map(function(ele) { const option = formalize(ele); return $.extend(option, {widget: new OO.ui.RadioSelectInputWidget({options: ele.options.map(formalize), value: settings[ option.data ] || ele.default || 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(function(ele) { return new OO.ui.FieldLayout(ele.widget, {label: ele.label, align: 'inline'}).$element; }).concat( '<hr>' ).concat( this.radios.map(function(ele) { return $('<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(function(ele) { return [ele.data, ele.widget.isSelected()]; }).conat( this.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 ); // 视情况根据新设置更新小工具,有些设置可能需要刷新页面才会生效 }; mw.SettingsDialog.static = {name: 'settingsDialog', tagName: 'div', title: wgULS('小工具设置', '小工具設置'), actions: [{action: 'save', label: '保存', flags: ['primary', 'progressive']}, {action: 'cancel', label: '取消', flags: 'safe'}] }; //</nowiki> // [[category:作为模块的小工具]] [[category:桌面版小工具]] [[category:手机版小工具]] [[category:系统工具]] // {{DEFAULTSORT:SettingsDialog.js}}