查看“︁用户: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>
        <tr class="infobox-below" style="display:none;">
            <td colspan="2" style="padding:0.5em;text-align:center;">e</td>
        </tr>
    </tbody>
</table>
<script>
    document.addEventListener('DOMContentLoaded', function () {
        initRandomChallenge()
    })

    function regenerateChallenge() {
        initRandomChallenge()
    }

    function useMockData() {
        updateSongInfo({
            title: "Pastel Lines",
            ez: "1",
            hd: "6",
            in: "11"
        }, {
            titleStyle: '#94E1FF',
            headerStyle: '#A3E5FF',
            labelStyle: '#B2E9FE'
        })
    }

    function initRandomChallenge() {
        var encodedUrl = 'https://rizwiki.cn/api.php?action=query%26titles=曲目列表%26prop=revisions%26rvprop=content%26format=json'
        var decodedUrl = decodeURIComponent(encodedUrl)

        fetch(decodedUrl)
            .then(function (r) { return r.json() })
            .then(function (data) {
                if (data.query) {
                    if (data.query.pages) {
                        var pages = data.query.pages
                        var pageId = Object.keys(pages)[0]
                        var wikitext = pages[pageId].revisions[0]['*']
                        var songs = parseSongsFromWikitext(wikitext)

                        if (songs.length > 0) {
                            loadSongColors(songs[Math.floor(Math.random() * songs.length)])
                        } else {
                            useMockData()
                        }
                    } else {
                        useMockData()
                    }
                } else {
                    useMockData()
                }
            })
            .catch(function (e) {
                console.error('获取曲目列表失败:', e)
                useMockData()
            })
    }

    function parseSongsFromWikitext(wikitext) {
        const songs = []
        const rows = wikitext.split('|-')

        for (const row of rows.slice(1)) {
            const columns = row.split('\n').filter(function (col) { return col.trim().startsWith('|') })

            if (columns.length >= 7) {
                const imageMatch = columns[0].match(/\[\[文件:([^|\]]+)/)
                const titleMatch = columns[1].match(/\[\[([^|\]]+)/)

                if (imageMatch) {
                    if (titleMatch) {
                        const song = {
                            image: imageMatch[1].trim(),
                            title: titleMatch[1].trim(),
                            author: columns[2].replace(/^\|/, '').trim(),
                            duration: columns[3].replace(/^\|/, '').trim(),
                        }
                        if (song.title === "BRAVE: ROAD") {
                            song.ez = ""
                            song.hd = columns[4].replace(/^\|/, '').trim()
                            song.in = columns[5].replace(/^\|/, '').trim()
                            song.at = columns[6].replace(/^\|/, '').trim()
                        } else {
                            song.ez = columns[4].replace(/^\|/, '').trim()
                            song.hd = columns[5].replace(/^\|/, '').trim()
                            song.in = columns[6].replace(/^\|/, '').trim()
                        }

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

        return songs
    }

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

        fetch(decodedUrl)
            .then(function (r) { return r.json() })
            .then(function (data) {
                const pages = data.query.pages
                const pageId = Object.keys(pages)[0]
                const pageData = pages[pageId]

                if (!pageData.revisions) {
                    throw new Error('页面不存在')
                }

                const wikitext = pageData.revisions[0]['*']
                const styles = parseStylesFromWikitext(wikitext)

                let imageUrl = null
                if (pageData.thumbnail) {
                    if (pageData.thumbnail.source) {
                        imageUrl = pageData.thumbnail.source
                    }
                }

                updateSongInfo(song, {
                    titleBg: styles.titleBg || '#94E1FF',
                    titleColor: styles.titleColor || '#000000',
                    headerBg: styles.headerBg || '#A3E5FF',
                    headerColor: styles.headerColor || '#000000',
                    labelBg: styles.labelBg || '#B2E9FE',
                    labelColor: styles.labelColor || '#000000',
                    imageUrl: imageUrl,
                    pageUrl: `https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`
                })
            })
            .catch(function (e) {
                console.error('获取曲目颜色失败:', e)
                updateSongInfo(song, {
                    titleBg: '#94E1FF',
                    titleColor: '#000000',
                    headerBg: '#A3E5FF',
                    headerColor: '#000000',
                    labelBg: '#B2E9FE',
                    labelColor: '#000000',
                    imageUrl: null,
                    pageUrl: `https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`
                })
            })
    }

    function parseStylesFromWikitext(wikitext) {
        var styles = {}
        var color1Match = wikitext.match(/\|color1\s*=\s*([^\n}]+)/)
        var color3Match = wikitext.match(/\|color3\s*=\s*([^\n}]+)/)
        var color4Match = wikitext.match(/\|color4\s*=\s*([^\n}]+)/)

        var textcolor1Match = wikitext.match(/\|textcolor1\s*=\s*([^\n}]+)/)
        var textcolor3Match = wikitext.match(/\|textcolor3\s*=\s*([^\n}]+)/)
        var textcolor4Match = wikitext.match(/\|textcolor4\s*=\s*([^\n}]+)/)

        if (color1Match) styles.titleBg = color1Match[1].trim()
        if (color3Match) styles.headerBg = color3Match[1].trim()
        if (color4Match) styles.labelBg = color4Match[1].trim()

        if (textcolor1Match) styles.titleColor = textcolor1Match[1].trim()
        if (textcolor3Match) styles.headerColor = textcolor3Match[1].trim()
        if (textcolor4Match) styles.labelColor = textcolor4Match[1].trim()

        return styles
    }

    function updateSongInfo(song, data) {
        var titleElement = document.querySelector('.infobox-title th')
        var headerElement = document.querySelector('.infobox-header th')
        var labelElements = document.querySelectorAll('.infobox-label')
        var belowElement = document.querySelector('.infobox-below')

        titleElement.textContent = song.title
        titleElement.style.background = data.titleBg || '#94E1FF'
        titleElement.style.color = data.titleColor || '#000000'

        headerElement.style.background = data.headerBg || '#A3E5FF'
        headerElement.style.color = data.headerColor || '#000000'

        for (var i = 0; i < labelElements.length; i++) {
            labelElements[i].style.background = data.labelBg || '#B2E9FE'
            labelElements[i].style.color = data.labelColor || '#000000'
        }

        belowElement.style.background = data.labelBg || '#B2E9FE'
        belowElement.style.color = data.labelColor || '#000000'

        // 更新图片
        var 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>`

        var availableDifficulties = []
        if (song.ez) availableDifficulties.push({ type: "EZ", value: song.ez })
        if (song.hd) availableDifficulties.push({ type: "HD", value: song.hd })
        if (song.in) availableDifficulties.push({ type: "IN", value: song.in })
        if (song.at) availableDifficulties.push({ type: "AT", value: song.at })
        window.difficultyArray = availableDifficulties.map(function (diff) {
            return createDiffSpan(diff.type, diff.value);
        });
        window.difficultyArray.push('<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) {
        var colors = {
            EZ: '#57E4C4', HD: '#FDBA61', IN: '#FE8661', AT: '#4C364B'
        }
        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() {
        // 流速选项
        var speeds = Array(40).fill("无限制").concat(Array.from({ length: 91 }, function (_, i) { return (i + 10) / 10 }))
        // 随机流速
        var selectedSpeed = speeds[Math.floor(Math.random() * speeds.length)]
        // 随机难度
        var selectedDifficulty = window.difficultyArray[Math.floor(Math.random() * window.difficultyArray.length)]

        // 流速难度显示
        document.getElementById('speed-data').textContent = selectedSpeed
        document.getElementById('difficulty-data').innerHTML = selectedDifficulty

        // MOD权重配置
        var modOptions = [
            { name: "无MOD", weight: 9 },
            { name: "无限制", weight: 9 },
            { name: "观赏模式", weight: 1 },

            { name: "镜像模式", weight: 4 },
            { name: "保护模式", weight: 4 },
            { name: "Bad保护模式", weight: 4 },
            { name: "特殊计量条", weight: 1, exclude: ["特殊计量条100%", "特殊计量条110%", "特殊计量条120%"] },
            { name: "特殊计量条100%", weight: 1, exclude: ["特殊计量条", "特殊计量条110%", "特殊计量条120%"] },
            { name: "特殊计量条110%", weight: 1, exclude: ["特殊计量条", "特殊计量条100%", "特殊计量条120%"] },
            { name: "特殊计量条120%", weight: 1, exclude: ["特殊计量条", "特殊计量条100%", "特殊计量条110%"] },
            { name: "隐藏计量条", weight: 4 }
        ]

        // 其他限制权重配置
        var otherOptions = [
            { name: "无限制", weight: 12 },
            { name: "静音", weight: 2 },
            { name: "单手", weight: 2, exclude: ["全拆打法", "全换打法", "禁止出张"] },
            { name: "手持", weight: 2 },
            { name: "Bad数比Hit数多", weight: 1 },
            { name: "Combo低于50", weight: 1 },
            { name: "全拆打法", weight: 2, exclude: ["单手", "全换打法"] },
            { name: "全换打法", weight: 2, exclude: ["单手", "全拆打法"] },
            { name: "禁止出张", weight: 2, exclude: ["单手"] },
            { name: "反色", weight: 1 }
        ]

        // 随机MOD
        var selectedMods = selectWeightedItemsWithExclude(modOptions, 0.3, ["无MOD", "无限制", "观赏模式"])

        // 随机其他限制
        var selectedOthers = selectWeightedItemsWithExclude(otherOptions, 0.8, ["无限制"])

        updateRestrictionElement('mod-data', selectedMods)
        updateRestrictionElement('other-data', selectedOthers)
        updateBelowText(selectedDifficulty, selectedSpeed, selectedMods, selectedOthers)
    }

    // 加权随机选择函数，逐个检查冲突
    // options: 选项数组
    // singleProbability: 只选择一个项的概率
    // excludeItem: 选择多个时要排除的项
    function selectWeightedItemsWithExclude(options, singleProbability, excludeItems) {
        var selectedItems = []

        if (Math.random() < singleProbability) {
            var weightedOptions = []
            for (var i = 0; i < options.length; i++) {
                for (var j = 0; j < options[i].weight; j++) {
                    weightedOptions.push(options[i].name)
                }
            }
            selectedItems = [weightedOptions[Math.floor(Math.random() * weightedOptions.length)]]
        } else {
            var availableOptions = options.filter(function (opt) {
                return !excludeItems.includes(opt.name)
            })

            var weightedOptions = []
            for (var i = 0; i < availableOptions.length; i++) {
                for (var j = 0; j < availableOptions[i].weight; j++) {
                    weightedOptions.push(availableOptions[i])
                }
            }

            var count = Math.floor(Math.random() * 3) + 2  // 2-4个项
            var maxAttempts = 20

            while (maxAttempts > 0) {
                if (selectedItems.length < count) {
                    if (weightedOptions.length > 0) {
                        maxAttempts--

                        var randomIndex = Math.floor(Math.random() * weightedOptions.length)
                        var candidate = weightedOptions[randomIndex]
                        var canAdd = true

                        for (var j = 0; j < selectedItems.length; j++) {
                            var selectedItem = selectedItems[j]
                            if (candidate.exclude) {
                                if (candidate.exclude.includes(selectedItem)) {
                                    canAdd = false
                                    break
                                }
                            }
                            var selectedOption = availableOptions.find(function (opt) { return opt.name === selectedItem })
                            if (selectedOption) {
                                if (selectedOption.exclude) {
                                    if (selectedOption.exclude.includes(candidate.name)) {
                                        canAdd = false
                                        break
                                    }
                                }
                            }
                        }

                        if (canAdd) {
                            selectedItems.push(candidate.name)
                            weightedOptions = weightedOptions.filter(function (opt) { return opt.name !== candidate.name })
                        } else {
                            weightedOptions.splice(randomIndex, 1)
                        }
                    } else {
                        break
                    }
                } else {
                    break
                }
            }
        }

        for (var i = 0; i < excludeItems.length; i++) {
            if (selectedItems.includes(excludeItems[i])) {
                selectedItems = [excludeItems[i]]
                break
            }
        }

        return selectedItems
    }

    function updateRestrictionElement(elementId, items) {
        var element = document.getElementById(elementId)
        if (items.length == 1) {
            element.textContent = items[0]
        } else {
            element.innerHTML = '<p>' + items.join('<br>') + '</p>'
        }
    }

    function updateBelowText(difficulty, speed, mods, others) {
        var belowElement = document.querySelector('.infobox-below')
        var belowText = ""

        if (mods[0] == "观赏模式") {
            belowText = "WOW奖励关！"
        } else if (difficulty.includes('EZ')) {
            if (speed == "无限制") {
                if (mods[0] == "无限制") {
                    if (others[0] == "无限制") {
                        belowText = "最简单的一集"
                    }
                }
            }
        } else if (difficulty.includes('无限制')) {
            if (speed == "无限制") {
                if (mods[0] == "无限制") {
                    if (others[0] == "无限制") {
                        belowText = "无限制！"
                    }
                }
            }
        } else if (difficulty.includes('AT')) {
            belowText = "这么强？！"
        }

        if (belowText) {
            belowElement.style.display = ""
            belowElement.querySelector('td').textContent = belowText
        } else {
            belowElement.style.display = "none"
        }
    }
</script>
</html>

神秘的随机挑战！

Ver.1.6

<html>
<button onclick="regenerateChallenge()"
    style="padding: 10px 20px; font-size: 16px; background-color: var(--background-color-interactive-subtle); border: var(--border-width-base) solid var(--border-color-base); border-radius: var(--border-radius-large); cursor: pointer; transition-duration: 100ms;"
    onmouseover="this.style.backgroundColor='var(--background-color-base)'"
    onmouseout="this.style.backgroundColor='var(--background-color-interactive-subtle)'">
    新挑战
</button>
</html>

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

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

|belowstyle = background:#ddf;
|below = e

}}
</pre>

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