查看“︁用户:RedDragon/Test2”︁的源代码

<html>
<table class="infobox" cellspacing="3" style="border-collapse:separate;border-spacing:2px;float:right;">
<tbody>
<tr class="infobox-title"><th colspan="2" style="padding:8px;background:#ccc;">曲目</th></tr>
<tr><td colspan="2" style="text-align:center;">
<img id="song-image" src="/images/thumb/4/41/%E6%8F%92%E7%94%BB%E5%9B%BE%E6%A0%87.png/200px-%E6%8F%92%E7%94%BB%E5%9B%BE%E6%A0%87.png" width="200" height="200">
</td></tr>
<tr class="infobox-header"><th colspan="2" style="padding:8px;background:#ccf;">限制</th></tr>
<tr><th scope="row" class="infobox-label" style="width:90px;background:#ddf;">难度</th><td class="infobox-data" id="difficulty-data">a</td></tr>
<tr><th scope="row" class="infobox-label" style="width:90px;background:#ddf;">流速</th><td class="infobox-data" id="speed-data">b</td></tr>
<tr><th scope="row" class="infobox-label" style="width:90px;background:#ddf;">MOD</th><td class="infobox-data" id="mod-data">c</td></tr>
<tr><th scope="row" class="infobox-label" style="width:90px;background:#ddf;">其他</th><td class="infobox-data" id="other-data">d</td></tr>
</tbody></table>

<div id="debug-output" style="border:1px solid #ccc; padding:10px; margin-top:20px;"></div>

<script>
$(document).ready(function() {
    // 调试输出
    function debug(msg) {
        $('#debug-output').append('<div>' + msg + '</div>');
        console.log(msg);
    }
    
    debug('脚本开始执行...');
    
    // 首先测试默认颜色是否工作
    setTimeout(function() {
        debug('测试默认颜色...');
        $('.infobox-title th').css('background', '#94E1FF');
        $('.infobox-header th').css('background', '#A3E5FF');
        $('.infobox-label').css('background', '#B2E9FE');
        debug('默认颜色已应用');
    }, 1000);
    
    // 获取曲目列表
    debug('开始获取曲目列表...');
    $.ajax({
        url: mw.util.wikiScript('api'),
        data: {
            action: 'parse',
            page: '曲目列表',
            prop: 'text',
            format: 'json'
        },
        success: function(data) {
            debug('成功获取曲目列表API响应');
            console.log('API响应:', data);
            
            if (!data.parse || !data.parse.text) {
                debug('错误：API响应格式不正确');
                return;
            }
            
            var content = data.parse.text['*'];
            var $content = $('<div>').html(content);
            var songs = [];
            
            debug('开始解析表格...');
            
            // 尝试多种选择器
            var $tables = $content.find('table.wikitable, table, .wikitable');
            debug('找到表格数量: ' + $tables.length);
            
            if ($tables.length === 0) {
                debug('错误：未找到表格，尝试直接查找行...');
                $content.find('tr').each(function(index) {
                    if (index < 5) debug('行 ' + index + ' HTML: ' + $(this).html().substring(0, 100));
                });
            }
            
            $tables.first().find('tr').each(function(index) {
                if (index === 0) {
                    debug('表头: ' + $(this).text());
                    return;
                }
                
                var $cells = $(this).find('td, th');
                debug('行 ' + index + ' 单元格数量: ' + $cells.length);
                
                if ($cells.length >= 3) {
                    var song = {
                        image: extractImageUrl($cells.eq(0)),
                        title: $cells.eq(1).text().trim(),
                        ez: $cells.eq(4) ? $cells.eq(4).text().trim() : '?',
                        hd: $cells.eq(5) ? $cells.eq(5).text().trim() : '?',
                        in: $cells.eq(6) ? $cells.eq(6).text().trim() : '?'
                    };
                    
                    if (song.title && song.title !== '') {
                        songs.push(song);
                        debug('找到曲目: ' + song.title);
                    }
                }
            });
            
            debug('总共找到曲目: ' + songs.length);
            
            if (songs.length > 0) {
                var randomSong = songs[Math.floor(Math.random() * songs.length)];
                debug('随机选择曲目: ' + randomSong.title);
                loadSongDetails(randomSong);
            } else {
                debug('错误：未找到任何曲目，使用备用方案...');
                useFallbackData();
            }
        },
        error: function(xhr, status, error) {
            debug('获取曲目列表失败: ' + error);
            useFallbackData();
        }
    });
    
    function extractImageUrl($cell) {
        var $img = $cell.find('img');
        if ($img.length > 0) {
            var src = $img.attr('src') || $img.attr('data-src');
            debug('找到图片: ' + src);
            return src;
        }
        return $cell.text().trim();
    }
    
    function useFallbackData() {
        debug('使用备用数据...');
        var fallbackSong = {
            title: '测试曲目',
            image: '/images/thumb/4/41/%E6%8F%92%E7%94%BB%E5%9B%BE%E6%A0%87.png/200px-%E6%8F%92%E7%94%BB%E5%9B%BE%E6%A0%87.png',
            ez: '1',
            hd: '6',
            in: '11'
        };
        updateSongInfo(fallbackSong);
        updateStyles({
            titleStyle: '#94E1FF',
            headerStyle: '#A3E5FF',
            labelStyle: '#B2E9FE'
        });
    }
    
    function loadSongDetails(song) {
        debug('加载曲目详情: ' + song.title);
        updateSongInfo(song);
        
        $.ajax({
            url: mw.util.wikiScript('api'),
            data: {
                action: 'parse',
                page: song.title,
                prop: 'text',
                format: 'json'
            },
            success: function(data) {
                debug('成功获取曲目详情');
                var content = data.parse.text['*'];
                var $content = $('<div>').html(content);
                
                var titleStyle = getBackgroundColor($content.find('.infobox-title')) || '#94E1FF';
                var headerStyle = getBackgroundColor($content.find('.infobox-header')) || '#A3E5FF';
                var labelStyle = getBackgroundColor($content.find('.infobox-label')) || '#B2E9FE';
                
                debug('提取的颜色 - 标题: ' + titleStyle + ', 头部: ' + headerStyle + ', 标签: ' + labelStyle);
                updateStyles({ titleStyle: titleStyle, headerStyle: headerStyle, labelStyle: labelStyle });
            },
            error: function() {
                debug('获取曲目详情失败，使用默认颜色');
                updateStyles({
                    titleStyle: '#94E1FF',
                    headerStyle: '#A3E5FF',
                    labelStyle: '#B2E9FE'
                });
            }
        });
    }
    
    function getBackgroundColor($element) {
        if ($element.length === 0) {
            debug('未找到样式元素');
            return null;
        }
        var bgColor = $element.css('background-color');
        debug('原始背景色: ' + bgColor);
        
        if (bgColor && bgColor.startsWith('rgb')) {
            var rgb = bgColor.match(/\d+/g);
            if (rgb && rgb.length === 3) {
                var hex = '#' + 
                    ('0' + parseInt(rgb[0]).toString(16)).slice(-2) +
                    ('0' + parseInt(rgb[1]).toString(16)).slice(-2) +
                    ('0' + parseInt(rgb[2]).toString(16)).slice(-2);
                debug('转换后的HEX: ' + hex);
                return hex;
            }
        }
        return bgColor;
    }
    
    function updateSongInfo(song) {
        debug('更新曲目信息: ' + song.title);
        $('.infobox-title th').text(song.title);
        
        if (song.image) {
            $('#song-image').attr('src', song.image);
            debug('更新图片: ' + song.image);
        }
        
        window.difficultyArray = [
            createDiffSpan("EZ", song.ez),
            createDiffSpan("HD", song.hd),
            createDiffSpan("IN", song.in),
            '<span style="width: max-content;text-align:center;display:inline-block;border-radius:1em;color:white;background-color:#53D6FF;padding:0 0.80em;margin:0.1em 0.50em;">无限制</span>'
        ];
        
        debug('难度数组创建完成');
        generateRandomRestrictions();
    }
    
    function createDiffSpan(diff, level) {
        var colors = { EZ: '#57E4C4', HD: '#FDBA61', IN: '#FE8661' };
        return '<span style="width: max-content;text-align:center;display:inline-block;border-radius:1em;color:white;background-color:' + colors[diff] + ';padding:0 0.80em;margin:0.1em 0.50em;">' + diff + ' ' + level + '</span>';
    }
    
    function updateStyles(styles) {
        debug('更新样式...');
        $('.infobox-title th').css('background', styles.titleStyle);
        $('.infobox-header th').css('background', styles.headerStyle);
        $('.infobox-label').css('background', styles.labelStyle);
        debug('样式更新完成');
    }
    
    function generateRandomRestrictions() {
        debug('生成随机限制...');
        var randomDifficulty = window.difficultyArray[Math.floor(Math.random() * window.difficultyArray.length)];
        $('#difficulty-data').html(randomDifficulty);
        
        var speedOptions = ["无限制", "无限制", "无限制"].concat(Array.from({ length: 91 }, (_, i) => (i + 10) / 10.0));
        $('#speed-data').text(speedOptions[Math.floor(Math.random() * speedOptions.length)]);
        
        var modOptions = ["无MOD"];
        var otherOptions = ["无限制"];
        $('#mod-data').text(modOptions[Math.floor(Math.random() * modOptions.length)]);
        $('#other-data').text(otherOptions[Math.floor(Math.random() * otherOptions.length)]);
        
        debug('随机限制生成完成');
    }
});
</script>
</html>
神秘的随机挑战！
----
[[User:RedDragon/Test]]
[[User:RedDragon/Test1]]
[[User:RedDragon/Test2]]