查看“︁用户: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/300px-%E6%8F%92%E7%94%BB%E5%9B%BE%E6%A0%87.png"
                    width="300" height="300">
            </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>

<script>
    document.addEventListener('DOMContentLoaded', () => {
        const encodedUrl = 'https://rizwiki.cn/api.php?action=query%26titles=曲目列表%26prop=revisions%26rvprop=content%26format=json'

        const decodedUrl = decodeURIComponent(encodedUrl)
        fetch(decodedUrl)
            .then(r => r.json())
            .then(data => {
                console.log('解析后的数据:', data)

                if (data.query) {
                    if (data.query.pages) {
                        const pages = data.query.pages
                        const pageId = Object.keys(pages)[0]
                        const wikitext = pages[pageId].revisions[0]['*']
                        const songs = parseSongsFromWikitext(wikitext)

                        if (songs.length > 0) {
                            loadSongColors(songs[Math.floor(Math.random() * songs.length)])
                        } else {
                            useMockData()
                        }
                    } else {
                        console.error('数据格式不正确，缺少query.pages')
                        useMockData()
                    }
                } else {
                    console.error('数据格式不正确，缺少query')
                    useMockData()
                }
            })
            .catch(e => {
                console.error('获取曲目列表失败:', e)
                useMockData()
            })
    })

    function parseSongsFromWikitext(wikitext) {
        const songs = []
        console.log('wikitext内容:', wikitext)

        const rowRegex = /\|\s*\[\[文件:([^|\]]+)(?:\|[^]]*)?\]\]\s*\|\|\s*\[\[([^|\]]+)(?:\|[^]]*)?\]\]\s*\|\|\s*([^|]+)\s*\|\|\s*([^|]+)\s*\|\|\s*([^|]+)\s*\|\|\s*([^|]+)\s*\|\|\s*([^|]+)/g

        let match
        let matchCount = 0

        while ((match = rowRegex.exec(wikitext)) !== null) {
            matchCount++
            console.log(`匹配 ${matchCount}:`, match)

            const song = {
                image: match[1].trim(),
                title: match[2].trim(),
                author: match[3].trim(),
                duration: match[4].trim(),
                ez: match[5].trim(),
                hd: match[6].trim(),
                in: match[7].trim()
            }

            console.log('解析出的曲目:', song)

            if (song.title) {
                if (song.title !== '') {
                    if (song.title !== '?') {
                        songs.push(song);
                    }
                }
            }
        }

    function loadSongColors(song) {
        const encodedUrl = `https://rizwiki.cn/api.php?action=query%26titles=${encodeURIComponent(song.title)}%26prop=revisions%26rvprop=content%26format=json`
        const decodedUrl = decodeURIComponent(encodedUrl)

        fetch(decodedUrl)
            .then(r => r.json())
            .then(data => {
                try {
                    const pages = data.query.pages
                    const pageId = Object.keys(pages)[0]
                    if (!pages[pageId].revisions) {
                        throw new Error('页面不存在')
                    }
                    const wikitext = pages[pageId].revisions[0]['*']
                    const styles = parseStylesFromWikitext(wikitext)

                    updateSongInfo(song, {
                        titleStyle: styles.title || '#94E1FF',
                        headerStyle: styles.header || '#A3E5FF',
                        labelStyle: styles.label || '#B2E9FE',
                        imageUrl: `https://rizwiki.cn/images/thumb/${song.image.substring(0, 1)}/${song.image.substring(0, 2)}/${song.image}/300px-${song.image}`,
                        pageUrl: `https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`
                    })
                } catch (e) {
                    console.error('解析曲目数据失败:', e)
                    throw e
                }
            })
            .catch(e => {
                console.error('获取曲目颜色失败:', e)
                updateSongInfo(song, {
                    titleStyle: '#94E1FF',
                    headerStyle: '#A3E5FF',
                    labelStyle: '#B2E9FE',
                    imageUrl: `https://rizwiki.cn/images/thumb/${song.image.substring(0, 1)}/${song.image.substring(0, 2)}/${song.image}/300px-${song.image}`,
                    pageUrl: `https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`
                })
            })
    }

    function parseStylesFromWikitext(wikitext) {
        const styles = {}
        const titleMatch = wikitext.match(/infobox-title.*?background:(#[0-9a-fA-F]+)/)
        if (titleMatch) styles.title = titleMatch[1]

        const headerMatch = wikitext.match(/infobox-header.*?background:(#[0-9a-fA-F]+)/)
        if (headerMatch) styles.header = headerMatch[1]

        const labelMatch = wikitext.match(/infobox-label.*?background:(#[0-9a-fA-F]+)/)
        if (labelMatch) styles.label = labelMatch[1]

        return styles
    }

    function parseImageFromWikitext(wikitext) {
        const fileMatch = wikitext.match(/\[\[文件:(.*?)\]\]/)
        if (fileMatch) {
            const fileName = fileMatch[1]
            return `https://rizwiki.cn/images/thumb/${fileName.substring(0, 1)}/${fileName.substring(0, 2)}/${fileName}/300px-${fileName}`
        }
        return null
    }

    function updateSongInfo(song, data) {
        document.querySelector('.infobox-title th').textContent = song.title
        document.querySelector('.infobox-title th').style.background = data.titleStyle
        document.querySelector('.infobox-header th').style.background = data.headerStyle
        document.querySelectorAll('.infobox-label').forEach(label => label.style.background = data.labelStyle)

        const container = document.querySelector('.infobox td[colspan="2"]')
        container.innerHTML = `<a href="${data.pageUrl}" target="_blank">
        <img id="song-image" width="300" height="300" src="${data.imageUrl || '/images/thumb/4/41/插画图标.png/300px-插画图标.png'}">
    </a>`

        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:#53D6FF;padding:0 0.80em;margin:0.1em 0.50em">无限制</span>'
        ]

        generateRandomRestrictions()
    }

    function createDiffSpan(diff, level) {
        const 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:${colors[diff]};padding:0 0.80em;margin:0.1em 0.50em">${diff} ${level}</span>`
    }

    function generateRandomRestrictions() {
        const speeds = [...Array(40).fill("无限制"), ...Array.from({ length: 91 }, (_, i) => (i + 10) / 10)]
        const mods = ["无MOD", "镜像模式", "保护模式", "Bad保护模式", "特殊计量条", "隐藏计量条"]
        const others = ["无限制", "静音", "单手", "手持"]

        document.getElementById('difficulty-data').innerHTML = window.difficultyArray[Math.floor(Math.random() * window.difficultyArray.length)]

        document.getElementById('speed-data').textContent = speeds[Math.floor(Math.random() * speeds.length)]

        let selectedMods = []
        if (Math.random() < 0.3) {
            selectedMods = [mods[Math.floor(Math.random() * mods.length)]]
        } else {
            const count = Math.floor(Math.random() * 3) + 2
            const availableMods = mods.filter(m => m !== "无MOD")
            const shuffled = [...availableMods].sort(() => Math.random() - 0.5)
            selectedMods = shuffled.slice(0, Math.min(count, availableMods.length))

            const hasSpecial = selectedMods.includes("特殊计量条")
            if (hasSpecial) {
                const specialRates = ["特殊计量条100%", "特殊计量条110%", "特殊计量条120%"]
                selectedMods = selectedMods.filter(m => m !== "特殊计量条")
                selectedMods.push(specialRates[Math.floor(Math.random() * specialRates.length)])
            }
        }

        const modElement = document.getElementById('mod-data')
        if (selectedMods.length === 1) {
            modElement.textContent = selectedMods[0]
        } else {
            modElement.innerHTML = `<p>${selectedMods.join('<br>')}</p>`
        }

        let selectedOthers = []
        if (Math.random() < 0.8) {
            selectedOthers = [others[Math.floor(Math.random() * others.length)]]
        } else {
            const count = Math.floor(Math.random() * 2) + 2
            const availableOthers = others.filter(o => o !== "无限制")
            const shuffled = [...availableOthers].sort(() => Math.random() - 0.5)
            selectedOthers = shuffled.slice(0, Math.min(count, availableOthers.length))
        }

        const otherElement = document.getElementById('other-data')
        if (selectedOthers.length === 1) {
            otherElement.textContent = selectedOthers[0]
        } else {
            otherElement.innerHTML = `<p>${selectedOthers.join('<br>')}</p>`
        }
    }

    function useMockData() {
        updateSongInfo({
            title: "Pastel Lines",
            ez: "1",
            hd: "6",
            in: "11"
        }, {
            titleStyle: '#94E1FF',
            headerStyle: '#A3E5FF',
            labelStyle: '#B2E9FE'
        })
    }
</script>
</html>
神秘的随机挑战！


{{Infobox
|name         = 随机挑战
|title        = 曲目
|titlestyle   = background:#ccc
|image        = [[File:插画图标.png|200px]]
|imagestyle   = 
|headerstyle  = background:#ccf
|labelstyle   = background:#ddf

|header1 = 限制
|label2  = 难度
|data2   = a
|label3  = 流速
|data3   = b
|label4  = MOD
|data4   = c
|label5  = 其他
|data5   = d

}}
----
[[User:RedDragon/Test]]
[[User:RedDragon/Test1]]
[[User:RedDragon/Test2]]