User:Bhsd/widget/songposition.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），然后隐私和安全 → 清除浏览数据 → 缓存的图片和文件。

//<nowiki>
// 用于[[Widget:Songposition]]，可以使用ES6语法
/**
 * @Function: 鼠标移动至歌曲站位图标上方时提示角色姓名
 * @Dependencies: oojs-ui-core, ext.gadget.site-lib
 * @Author: [[User:Bhsd]]
 */
"use strict";
/* global mw, $ */
(() => {
    const main = () => {
        mw.widget = mw.widget || {};
        if (mw.widget.songposition) { return; }
        const targets = ['.member-symbol', '.member-graph'],
        	target = targets.join(),
            map = new Map(),
            $body = $( '#bodyContent' );
        mw.hook( 'wikipage.content' ).add($content => { // 更新图片对应关系
            if ($content.find( '.member-symbol-image' ).length === 0) { return; }
            console.log('Hook: wikipage.content, 开始更新songposition的图片映射');
            $content.find( target ).each(function() { map.set(this, $(this).next().find( 'img' )); });
        });
        mw.loader.using(['oojs-ui-core', 'ext.gadget.site-lib']).then(() => {
            for (const t of targets) {
            	const $label = $('<div>', {html: '<div>'});
            	$body.on('mouseenter', t, function() {
		            $label.children( 'div' ).html( map.get(this) );
		        });
            	mw.tipsy($body, t, {id: `${t.slice(1)}-popup`}, $label);
            }
        });
        mw.widget.songposition = true;
    };
    if (window.jQuery) { main(); }
    else { window.addEventListener('jquery', main); }
}) ();
//</nowiki>
// [[category:jQuery小部件]] {{DEFAULTSORT:Songposition}}