Fix videoshot bug (fix #1399)

This commit is contained in:
the1812 2021-01-24 15:21:51 +08:00
parent a3ccc3f3ca
commit ea1b5ee7d7
2 changed files with 38 additions and 39 deletions

File diff suppressed because one or more lines are too long

View File

@ -226,17 +226,8 @@ class VideoShot {
this.cidData = null this.cidData = null
this.supportWebp = VideoShot.supportWebp this.supportWebp = VideoShot.supportWebp
} }
getVideoshot (currentTime, done) { async getStyle(currentTime) {
if (!(this.aid && this.cid)) { const data = await this.cidData
return
}
if (!this.cidData) {
Ajax.getText(`https://api.bilibili.com/x/player/videoshot?aid=${this.aid}&cid=${this.cid}&index=1`).then(response => {
this.cidData = JSON.parse(response).data
this.getVideoshot(currentTime, done)
})
} else {
const data = this.cidData
const indexData = data.index const indexData = data.index
let shotIndex = 0 let shotIndex = 0
for (let index = 0; index < indexData.length - 2; index++) { for (let index = 0; index < indexData.length - 2; index++) {
@ -248,8 +239,8 @@ class VideoShot {
} }
let imageData = data.image let imageData = data.image
if (imageData === null) { if (!imageData) {
return return {}
} }
if (this.supportWebp) { if (this.supportWebp) {
imageData = imageData.map(url => url.replace('.jpg', '.jpg@.webp')) imageData = imageData.map(url => url.replace('.jpg', '.jpg@.webp'))
@ -260,14 +251,22 @@ class VideoShot {
const ySize = parseInt(data.pv_y_size) || 90 const ySize = parseInt(data.pv_y_size) || 90
const x = -(shotIndex % 100 % xLength) * xSize const x = -(shotIndex % 100 % xLength) * xSize
const y = -Math.floor(shotIndex % 100 / yLength) * ySize const y = -Math.floor(shotIndex % 100 / yLength) * ySize
done({ return {
width: xSize, width: xSize,
height: ySize, height: ySize,
backgroundImage: `url(${imageData[Math.floor(shotIndex / 100)]})`, backgroundImage: `url(${imageData[Math.floor(shotIndex / 100)]})`,
backgroundPosition: `${x}px ${y}px` backgroundPosition: `${x}px ${y}px`
})
} }
} }
async getVideoshot (currentTime) {
if (!(this.aid && this.cid)) {
return {}
}
if (!this.cidData) {
this.cidData = Ajax.getText(`https://api.bilibili.com/x/player/videoshot?aid=${this.aid}&cid=${this.cid}&index=1`).then(response => JSON.parse(response).data)
}
return this.getStyle(currentTime)
}
static get supportWebp () { static get supportWebp () {
try { try {
const canvas = document.createElement('canvas') const canvas = document.createElement('canvas')
@ -381,7 +380,7 @@ function setupTouchPlayer (player) {
text.querySelector('.touch-speed').innerHTML = `${speed}` text.querySelector('.touch-speed').innerHTML = `${speed}`
text.querySelector('.touch-info').innerHTML = `进度: ${sec > 0 ? '+' : '-'}${secondsToTime(change)}` text.querySelector('.touch-info').innerHTML = `进度: ${sec > 0 ? '+' : '-'}${secondsToTime(change)}`
text.querySelector('.touch-result').innerHTML = result text.querySelector('.touch-result').innerHTML = result
videoshot.getVideoshot(finalTime, style => $('.videoshot').css(style)) videoshot.getVideoshot(finalTime).then(style => $('.videoshot').css(style))
$('.touch-progress').css('width', `${finalPercent}%`) $('.touch-progress').css('width', `${finalPercent}%`)
} }
} }