用户:RedDragon/Test2:修订间差异
来自Rizline中文维基
更多操作
小 |
小 |
||
| 第20行: | 第20行: | ||
</tr> | </tr> | ||
<tr> | <tr> | ||
<th | <th sc document.addEventListener('DOMContentLoaded', function () { | ||
fetch('https://rizwiki.cn/wiki/%E6%9B%B2%E7%9B%AE%E5%88%97%E8%A1%A8') | |||
.then(response => { | .then(response => { | ||
if (!response.ok) { | if (!response.ok) { | ||
throw new Error(' | throw new Error('网络响应不正常') | ||
} | } | ||
return response. | return response.text() | ||
}) | }) | ||
.then( | .then(html => { | ||
const parser = new DOMParser() | const parser = new DOMParser() | ||
const doc = parser.parseFromString( | const doc = parser.parseFromString(html, 'text/html') | ||
const songs = [] | const songs = [] | ||
const | const tables = doc.querySelectorAll('.wikitable') | ||
let targetTable = null | |||
const | tables.forEach(table => { | ||
const headers = table.querySelectorAll('th') | |||
const | let hasRequiredHeaders = false | ||
headers.forEach(header => { | |||
const text = header.textContent.trim() | |||
if (text.includes('标题') || text.includes('曲目') || text.includes('名称')) { | |||
hasRequiredHeaders = true | |||
} | } | ||
}) | |||
if (hasRequiredHeaders) { | |||
targetTable = table | |||
} | } | ||
}) | }) | ||
if (targetTable) { | |||
const rows = targetTable.querySelectorAll('tr') | |||
rows.forEach((row, index) => { | |||
if (index === 0) return | |||
const cells = row.querySelectorAll('td, th') | |||
if (cells.length >= 4) { | |||
let titleCell, ezCell, hdCell, inCell | |||
if (cells.length >= 7) { | |||
titleCell = cells[1] | |||
ezCell = cells[4] | |||
hdCell = cells[5] | |||
inCell = cells[6] | |||
} else if (cells.length >= 4) { | |||
titleCell = cells[0] | |||
ezCell = cells[1] | |||
hdCell = cells[2] | |||
inCell = cells[3] | |||
} | |||
if (titleCell) { | |||
const song = { | |||
title: titleCell.textContent.trim(), | |||
ez: ezCell ? ezCell.textContent.trim() : '?', | |||
hd: hdCell ? hdCell.textContent.trim() : '?', | |||
in: inCell ? inCell.textContent.trim() : '?' | |||
} | |||
const img = titleCell.querySelector('img') | |||
if (img) { | |||
song.image = img.src || img.getAttribute('data-src') | |||
} | |||
if (song.title && song.title !== '?' && song.title !== '') { | |||
songs.push(song) | |||
} | |||
} | |||
} | |||
}) | |||
} | |||
console.log('找到曲目:', songs) | |||
if (songs.length > 0) { | if (songs.length > 0) { | ||
const randomSong = songs[Math.floor(Math.random() * songs.length)] | const randomSong = songs[Math.floor(Math.random() * songs.length)] | ||
console.log('随机选择:', randomSong) | |||
loadSongColors(randomSong) | |||
} else { | } else { | ||
useMockData() | useMockData() | ||
| 第80行: | 第107行: | ||
}) | }) | ||
function | function loadSongColors(song) { | ||
console.log('正在获取曲目颜色:', song.title) | |||
fetch(`https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`) | |||
.then(response => { | |||
if (!response.ok) { | |||
throw new Error('曲目页面不存在') | |||
} | |||
return response.text() | |||
}) | |||
.then(html => { | |||
const parser = new DOMParser() | |||
const doc = parser.parseFromString(html, 'text/html') | |||
const titleElem = doc.querySelector('.infobox-title') | |||
const headerElem = doc.querySelector('.infobox-header') | |||
const labelElem = doc.querySelector('.infobox-label') | |||
const titleStyle = titleElem ? getComputedColor(titleElem) : null | |||
const headerStyle = headerElem ? getComputedColor(headerElem) : null | |||
const labelStyle = labelElem ? getComputedColor(labelElem) : null | |||
const | |||
const | |||
console.log('获取到的颜色:', { titleStyle, headerStyle, labelStyle }) | |||
updateSongInfo(song, { | |||
titleStyle: titleStyle || '#94E1FF', | titleStyle: titleStyle || '#94E1FF', | ||
headerStyle: headerStyle || '#A3E5FF', | headerStyle: headerStyle || '#A3E5FF', | ||
| 第109行: | 第137行: | ||
}) | }) | ||
}) | }) | ||
.catch( | .catch(error => { | ||
console.error('获取曲目颜色失败:', error) | |||
updateSongInfo(song, { | |||
titleStyle: '#94E1FF', | titleStyle: '#94E1FF', | ||
headerStyle: '#A3E5FF', | headerStyle: '#A3E5FF', | ||
| 第118行: | 第147行: | ||
} | } | ||
function | function getComputedColor(element) { | ||
const tempDiv = document.createElement('div') | |||
const bgColor = | tempDiv.style.cssText = element.style.cssText | ||
document.body.appendChild(tempDiv) | |||
const computedStyle = window.getComputedStyle(tempDiv) | |||
const bgColor = computedStyle.backgroundColor | |||
document.body.removeChild(tempDiv) | |||
if (bgColor.startsWith('rgb')) { | |||
const rgb = bgColor.match(/\d+/g) | |||
if (rgb && rgb.length === 3) { | |||
return '#' + | |||
('0' + parseInt(rgb[0]).toString(16)).slice(-2) + | |||
('0' + parseInt(rgb[1]).toString(16)).slice(-2) + | |||
('0' + parseInt(rgb[2]).toString(16)).slice(-2) | |||
} | } | ||
} | } | ||
| 第137行: | 第167行: | ||
} | } | ||
function updateSongInfo(song) { | function updateSongInfo(song, styles) { | ||
const titleElement = document.querySelector('.infobox-title th') | const titleElement = document.querySelector('.infobox-title th') | ||
titleElement.textContent = song.title | titleElement.textContent = song.title | ||
titleElement.style.background = styles.titleStyle | |||
const imageElement = document.getElementById('song-image') | const imageElement = document.getElementById('song-image') | ||
if (song.image) imageElement.src = song.image | if (song.image) { | ||
imageElement.src = song.image | |||
} | |||
document.querySelector('.infobox-header th').style.background = styles.headerStyle | |||
const labelElements = document.querySelectorAll('.infobox-label') | |||
labelElements.forEach(label => { | |||
label.style.background = styles.labelStyle | |||
}) | |||
window.difficultyArray = [ | window.difficultyArray = [ | ||
| 第157行: | 第196行: | ||
const colors = { EZ: '#57E4C4', HD: '#FDBA61', IN: '#FE8661' } | 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-color:${colors[diff]};padding:0 0.80em;margin:0.1em 0.50em;">${diff} ${level}</span>` | 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>` | ||
} | } | ||
| 第183行: | 第214行: | ||
function useMockData() { | function useMockData() { | ||
console.log('使用模拟数据') | |||
const mockSong = { | const mockSong = { | ||
title: "Pastel Lines", | title: "Pastel Lines", | ||
ez: "1", | ez: "1", | ||
hd: "6", | hd: "6", | ||
in: "11" | in: "11" | ||
} | } | ||
updateSongInfo(mockSong | updateSongInfo(mockSong, { | ||
titleStyle: '#94E1FF', | titleStyle: '#94E1FF', | ||
headerStyle: '#A3E5FF', | headerStyle: '#A3E5FF', | ||
labelStyle: '#B2E9FE' | labelStyle: '#B2E9FE' | ||
}) | }) | ||
} | |||
function regenerateChallenge() { | |||
location.reload() | |||
} | } | ||
</script> | </script> | ||
2025年10月19日 (日) 17:25的版本
| 曲目 | |
|---|---|
|
|
|
| 限制 | |
| 难度 | a |
| {
if (!response.ok) {
throw new Error('网络响应不正常')
}
return response.text()
})
.then(html => {
const parser = new DOMParser()
const doc = parser.parseFromString(html, 'text/html')
const songs = []
const tables = doc.querySelectorAll('.wikitable')
let targetTable = null
tables.forEach(table => {
const headers = table.querySelectorAll('th')
let hasRequiredHeaders = false
headers.forEach(header => {
const text = header.textContent.trim()
if (text.includes('标题') || text.includes('曲目') || text.includes('名称')) {
hasRequiredHeaders = true
}
})
if (hasRequiredHeaders) {
targetTable = table
}
})
if (targetTable) {
const rows = targetTable.querySelectorAll('tr')
rows.forEach((row, index) => {
if (index === 0) return
const cells = row.querySelectorAll('td, th')
if (cells.length >= 4) {
let titleCell, ezCell, hdCell, inCell
if (cells.length >= 7) {
titleCell = cells[1]
ezCell = cells[4]
hdCell = cells[5]
inCell = cells[6]
} else if (cells.length >= 4) {
titleCell = cells[0]
ezCell = cells[1]
hdCell = cells[2]
inCell = cells[3]
}
if (titleCell) {
const song = {
title: titleCell.textContent.trim(),
ez: ezCell ? ezCell.textContent.trim() : '?',
hd: hdCell ? hdCell.textContent.trim() : '?',
in: inCell ? inCell.textContent.trim() : '?'
}
const img = titleCell.querySelector('img')
if (img) {
song.image = img.src || img.getAttribute('data-src')
}
if (song.title && song.title !== '?' && song.title !== '') {
songs.push(song)
}
}
}
})
}
console.log('找到曲目:', songs)
if (songs.length > 0) {
const randomSong = songs[Math.floor(Math.random() * songs.length)]
console.log('随机选择:', randomSong)
loadSongColors(randomSong)
} else {
useMockData()
}
})
.catch(error => {
console.error('获取曲目列表失败:', error)
useMockData()
})
})
function loadSongColors(song) {
console.log('正在获取曲目颜色:', song.title)
fetch(`https://rizwiki.cn/wiki/${encodeURIComponent(song.title)}`)
.then(response => {
if (!response.ok) {
throw new Error('曲目页面不存在')
}
return response.text()
})
.then(html => {
const parser = new DOMParser()
const doc = parser.parseFromString(html, 'text/html')
const titleElem = doc.querySelector('.infobox-title')
const headerElem = doc.querySelector('.infobox-header')
const labelElem = doc.querySelector('.infobox-label')
const titleStyle = titleElem ? getComputedColor(titleElem) : null
const headerStyle = headerElem ? getComputedColor(headerElem) : null
const labelStyle = labelElem ? getComputedColor(labelElem) : null
console.log('获取到的颜色:', { titleStyle, headerStyle, labelStyle })
updateSongInfo(song, {
titleStyle: titleStyle || '#94E1FF',
headerStyle: headerStyle || '#A3E5FF',
labelStyle: labelStyle || '#B2E9FE'
})
})
.catch(error => {
console.error('获取曲目颜色失败:', error)
updateSongInfo(song, {
titleStyle: '#94E1FF',
headerStyle: '#A3E5FF',
labelStyle: '#B2E9FE'
})
})
}
function getComputedColor(element) {
const tempDiv = document.createElement('div')
tempDiv.style.cssText = element.style.cssText
document.body.appendChild(tempDiv)
const computedStyle = window.getComputedStyle(tempDiv)
const bgColor = computedStyle.backgroundColor
document.body.removeChild(tempDiv)
if (bgColor.startsWith('rgb')) {
const rgb = bgColor.match(/\d+/g)
if (rgb && rgb.length === 3) {
return '#' +
('0' + parseInt(rgb[0]).toString(16)).slice(-2) +
('0' + parseInt(rgb[1]).toString(16)).slice(-2) +
('0' + parseInt(rgb[2]).toString(16)).slice(-2)
}
}
return bgColor
}
function updateSongInfo(song, styles) {
const titleElement = document.querySelector('.infobox-title th')
titleElement.textContent = song.title
titleElement.style.background = styles.titleStyle
const imageElement = document.getElementById('song-image')
if (song.image) {
imageElement.src = song.image
}
document.querySelector('.infobox-header th').style.background = styles.headerStyle
const labelElements = document.querySelectorAll('.infobox-label')
labelElements.forEach(label => {
label.style.background = styles.labelStyle
})
window.difficultyArray = [
createDiffSpan("EZ", song.ez),
createDiffSpan("HD", song.hd),
createDiffSpan("IN", song.in),
'无限制'
]
generateRandomRestrictions()
}
function createDiffSpan(diff, level) {
const colors = { EZ: '#57E4C4', HD: '#FDBA61', IN: '#FE8661' }
return `${diff} ${level}`
}
function generateRandomRestrictions() {
const difficultyElement = document.getElementById('difficulty-data')
const randomDifficulty = window.difficultyArray[Math.floor(Math.random() * window.difficultyArray.length)]
difficultyElement.innerHTML = randomDifficulty
const speedOptions = ["无限制", "无限制", "无限制"]
for (let i = 10; i <= 100; i++) speedOptions.push((i / 10).toFixed(1))
document.getElementById('speed-data').textContent = speedOptions[Math.floor(Math.random() * speedOptions.length)]
const modOptions = ["无MOD"]
const otherOptions = ["无限制"]
document.getElementById('mod-data').textContent = modOptions[Math.floor(Math.random() * modOptions.length)]
document.getElementById('other-data').textContent = otherOptions[Math.floor(Math.random() * otherOptions.length)]
}
function useMockData() {
console.log('使用模拟数据')
const mockSong = {
title: "Pastel Lines",
ez: "1",
hd: "6",
in: "11"
}
updateSongInfo(mockSong, {
titleStyle: '#94E1FF',
headerStyle: '#A3E5FF',
labelStyle: '#B2E9FE'
})
}
function regenerateChallenge() {
location.reload()
}
神秘的随机挑战!
User:RedDragon/Test User:RedDragon/Test1 User:RedDragon/Test2 | |