LLWiki正在建设中,欢迎加入我们!
“User:Bhsd/widget/list.js”的版本间差异
跳转到导航
跳转到搜索
小 |
小 (转移GitHub repository) |
||
(未显示同一用户的20个中间版本) | |||
第1行: | 第1行: | ||
//<nowiki> |
|||
// 代码迁移自[https://github.com/bhsd-harry/list] |
|||
// 用于[[Widget:歌曲数据库]],可以使用ES6语法 |
|||
function main($) { |
|||
/** |
|||
$.getJSON('/zh?title=user:bhsd/list.json&action=raw&ctype=application/json', function(data) { |
|||
* @Function: 用于筛选[[LoveLive!学园偶像祭歌曲列表]]中出现的歌曲,并自动生成相应的Wiki代码 |
|||
$('.widget-test').html('<a href="/zh/User:Bhsd/list.js" title="User:Bhsd/list.js">User:Bhsd/list.js</a>' + |
|||
* @Dependencies: oojs-ui-core |
|||
data.list.length ? '' : '由于JSON未' + |
|||
* @Author: [[User:Bhsd]] |
|||
⚫ | |||
*/ |
|||
⚫ | |||
"use strict"; |
|||
} |
|||
/* global mw, $, OO */ |
|||
(() => { |
|||
var jqueryTimer = setInterval(function() { |
|||
let sifdata, $output; |
|||
⚫ | |||
const attr = ['s', 'p', 'c'], // 依次为Smile/Pure/Cool属性 |
|||
clearInterval(jqueryTimer); |
|||
diff = ['easy', 'normal', 'hard', 'expert', 'exran', 'master'], |
|||
⚫ | |||
// 以m:ss的格式输出歌曲时长 |
|||
⚫ | |||
convertTime = (t) => `${Math.floor(t / 60)}:${ (t % 60).toString().padStart(2, 0) }`, |
|||
⚫ | |||
// 从数组生成下拉菜单的选项 |
|||
buildOptions = (list, key) => list.map(ele => ele[key]).filter(ele => ele) |
|||
.map(ele => new OO.ui.MenuOptionWidget({data: ele, label: ele})), |
|||
// 根据选中的歌曲修改输出的Wiki代码。这个函数需要sifdata。 |
|||
change = (value) => { |
|||
const term = sifdata.find(ele => ele.j == value || ele.c == value), |
|||
⚫ | |||
if (!term) { return; } // 不用清空上一次的输出 |
|||
$output.text( `{{sif-song-tablerow|${ term.j }|${ attr[term.a] }|${ convertTime( term.t ) }` + |
|||
term.s.map(ele => { |
|||
const swing = ele.is ? 'swing' : ''; |
|||
let level = `${ele.k || ''}${ele.ia ? 'ac' : ''}${ diff[ele.d - 1] }`; // 判定5键或是AC |
|||
if (array.includes( level )) { level += 'melo'; } // 无法直接判定歌melo |
|||
array.push( level ); |
|||
return `|d-${ level }=${ ele.s }${ swing }|c-${ level }=${ ele.c }${ swing }`; |
|||
}).join( '' ) + '|条件=}}' |
|||
); |
|||
⚫ | |||
// 分团体建立ComboBox。这个函数需要sifdata。 |
|||
buildSelect = (group) => { |
|||
const list = sifdata.filter(ele => ele.g == group), |
|||
optionsJa = buildOptions(list, 'j'), |
|||
optionsZh = buildOptions(list, 'c'), |
|||
select = new OO.ui.ComboBoxInputWidget({ menu: {items: [ |
|||
new OO.ui.MenuSectionOptionWidget({label: '原名'}), ...optionsJa, |
|||
new OO.ui.MenuSectionOptionWidget({label: '中文名'}), ...optionsZh |
|||
], width: '100%', filterFromInput: true, filterMode: 'substring'} }).on('change', change); |
|||
optionsJa.forEach(ele => { ele.$element.attr('lang', 'ja'); }); |
|||
// 添加清空按钮 |
|||
return select.$element.append( $('<i>', {class: 'fas fa-backspace'}).click(() => { select.setValue(''); }) ); |
|||
}, |
|||
⚫ | |||
sifdata = data[0]; |
|||
const selectSet = [1, 2, 3, 4].map( buildSelect ); |
|||
mw.hook( 'wikipage.content' ).add($content => { |
|||
console.log('Hook: wikipage.content, 开始建立歌曲数据库UI'); |
|||
$output = $content.find( '#sif-song-tablerow' ); |
|||
// 前4个三级标题固定为输入项,输出项未来可能会添加更多 |
|||
$content.find( 'h3' ).slice(0, 4).after(i => selectSet[i]); |
|||
}); |
|||
}, |
|||
init = () => { |
|||
mw.widget = mw.widget || {}; |
|||
if (mw.widget.list) { return; } |
|||
Promise.all([ $.ajax({ dataType: 'json', cache: true, |
|||
url: '//raw.githubusercontent.com/LLWiki/FrontEnd/main/json/list.json' |
|||
}), mw.loader.using( 'oojs-ui-core' ) ]).then( main ); |
|||
mw.widget.list = true; |
|||
⚫ | |||
⚫ | |||
else { window.addEventListener('jquery', init); } |
|||
⚫ | |||
//</nowiki> |
|||
// [[category:jQuery小部件]] {{DEFAULTSORT:list}} |
2023年3月10日 (五) 02:23的最新版本
//<nowiki> // 用于[[Widget:歌曲数据库]],可以使用ES6语法 /** * @Function: 用于筛选[[LoveLive!学园偶像祭歌曲列表]]中出现的歌曲,并自动生成相应的Wiki代码 * @Dependencies: oojs-ui-core * @Author: [[User:Bhsd]] */ "use strict"; /* global mw, $, OO */ (() => { let sifdata, $output; const attr = ['s', 'p', 'c'], // 依次为Smile/Pure/Cool属性 diff = ['easy', 'normal', 'hard', 'expert', 'exran', 'master'], // 以m:ss的格式输出歌曲时长 convertTime = (t) => `${Math.floor(t / 60)}:${ (t % 60).toString().padStart(2, 0) }`, // 从数组生成下拉菜单的选项 buildOptions = (list, key) => list.map(ele => ele[key]).filter(ele => ele) .map(ele => new OO.ui.MenuOptionWidget({data: ele, label: ele})), // 根据选中的歌曲修改输出的Wiki代码。这个函数需要sifdata。 change = (value) => { const term = sifdata.find(ele => ele.j == value || ele.c == value), array = []; if (!term) { return; } // 不用清空上一次的输出 $output.text( `{{sif-song-tablerow|${ term.j }|${ attr[term.a] }|${ convertTime( term.t ) }` + term.s.map(ele => { const swing = ele.is ? 'swing' : ''; let level = `${ele.k || ''}${ele.ia ? 'ac' : ''}${ diff[ele.d - 1] }`; // 判定5键或是AC if (array.includes( level )) { level += 'melo'; } // 无法直接判定歌melo array.push( level ); return `|d-${ level }=${ ele.s }${ swing }|c-${ level }=${ ele.c }${ swing }`; }).join( '' ) + '|条件=}}' ); }, // 分团体建立ComboBox。这个函数需要sifdata。 buildSelect = (group) => { const list = sifdata.filter(ele => ele.g == group), optionsJa = buildOptions(list, 'j'), optionsZh = buildOptions(list, 'c'), select = new OO.ui.ComboBoxInputWidget({ menu: {items: [ new OO.ui.MenuSectionOptionWidget({label: '原名'}), ...optionsJa, new OO.ui.MenuSectionOptionWidget({label: '中文名'}), ...optionsZh ], width: '100%', filterFromInput: true, filterMode: 'substring'} }).on('change', change); optionsJa.forEach(ele => { ele.$element.attr('lang', 'ja'); }); // 添加清空按钮 return select.$element.append( $('<i>', {class: 'fas fa-backspace'}).click(() => { select.setValue(''); }) ); }, main = (data) => { sifdata = data[0]; const selectSet = [1, 2, 3, 4].map( buildSelect ); mw.hook( 'wikipage.content' ).add($content => { console.log('Hook: wikipage.content, 开始建立歌曲数据库UI'); $output = $content.find( '#sif-song-tablerow' ); // 前4个三级标题固定为输入项,输出项未来可能会添加更多 $content.find( 'h3' ).slice(0, 4).after(i => selectSet[i]); }); }, init = () => { mw.widget = mw.widget || {}; if (mw.widget.list) { return; } Promise.all([ $.ajax({ dataType: 'json', cache: true, url: '//raw.githubusercontent.com/LLWiki/FrontEnd/main/json/list.json' }), mw.loader.using( 'oojs-ui-core' ) ]).then( main ); mw.widget.list = true; }; if (window.jQuery) { init(); } else { window.addEventListener('jquery', init); } }) (); //</nowiki> // [[category:jQuery小部件]] {{DEFAULTSORT:list}}