merge changes from phantasma
This commit is contained in:
parent
1b7ee7b275
commit
7ad121d912
5 changed files with 79 additions and 5 deletions
|
@ -18,6 +18,9 @@ window.VideoPlayer = function(options) {
|
|||
|
||||
self.controls = document.createElement('div')
|
||||
self.controls.classList.add('mx-controls')
|
||||
if (options.poster) {
|
||||
self.controls.classList.add('poster')
|
||||
}
|
||||
//self.controls.style.display = "none"
|
||||
if (self.options.controls) {
|
||||
var ratio = `aspect-ratio: ${self.options.aspectratio};`
|
||||
|
@ -45,6 +48,13 @@ window.VideoPlayer = function(options) {
|
|||
margin: auto;
|
||||
}
|
||||
|
||||
.mx-controls.poster {
|
||||
background-image: url(${self.options.poster});
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-blend-mode: overlay;
|
||||
}
|
||||
|
||||
.mx-controls .toggle {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
|
@ -160,6 +170,7 @@ window.VideoPlayer = function(options) {
|
|||
event.preventDefault()
|
||||
event.stopPropagation()
|
||||
if (that.paused) {
|
||||
self.controls.classList.remove('poster')
|
||||
that.play()
|
||||
} else {
|
||||
that.pause()
|
||||
|
@ -193,6 +204,7 @@ window.VideoPlayer = function(options) {
|
|||
})
|
||||
}
|
||||
if (that.paused && !failed) {
|
||||
self.controls.classList.remove('poster')
|
||||
that.play()
|
||||
}
|
||||
} else {
|
||||
|
@ -314,6 +326,7 @@ window.VideoPlayer = function(options) {
|
|||
toggle.querySelector('div').innerHTML = icon.pause
|
||||
self.controls.style.opacity = '0'
|
||||
unblock.remove()
|
||||
self.controls.classList.remove('poster')
|
||||
that.play()
|
||||
}
|
||||
})
|
||||
|
|
|
@ -90,6 +90,21 @@ async function sortClips(edit, sort) {
|
|||
}
|
||||
}
|
||||
|
||||
function getClip(edit, position) {
|
||||
const response = {}
|
||||
let pos = 0
|
||||
edit.clips.forEach(function(clip) {
|
||||
if (clip.position < position && clip.position + clip.duration > position) {
|
||||
response.item = clip.item
|
||||
response.position = position - clip.position
|
||||
if (clip['in']) {
|
||||
response.position += clip['in']
|
||||
}
|
||||
}
|
||||
});
|
||||
return response
|
||||
}
|
||||
|
||||
async function loadEdit(id, args) {
|
||||
var data = window.data = {}
|
||||
data.id = id
|
||||
|
@ -107,7 +122,7 @@ async function loadEdit(id, args) {
|
|||
}
|
||||
}
|
||||
data.edit = response['data']
|
||||
if (['public', 'featured'].indexOf(data.edit) == -1) {
|
||||
if (data.edit.status !== 'public') {
|
||||
return {
|
||||
site: data.site,
|
||||
error: {
|
||||
|
@ -197,6 +212,15 @@ async function loadEdit(id, args) {
|
|||
})
|
||||
})
|
||||
})
|
||||
if (data.layers[pandora.subtitleLayer]) {
|
||||
var previous;
|
||||
data.layers[pandora.subtitleLayer].forEach(annotation => {
|
||||
if (previous) {
|
||||
previous.out = annotation['in']
|
||||
}
|
||||
previous = annotation
|
||||
})
|
||||
}
|
||||
var value = []
|
||||
pandora.layerKeys.forEach(layer => {
|
||||
if (!data.layers[layer]) {
|
||||
|
@ -215,14 +239,26 @@ async function loadEdit(id, args) {
|
|||
</div>
|
||||
`)
|
||||
})
|
||||
value.push('<div class="layer">' + html.join('\n') + '</div>')
|
||||
var layerClass = ""
|
||||
if (layerData.isSubtitles) {
|
||||
layerClass = " is-subtitles"
|
||||
}
|
||||
value.push('<div class="layer'+layerClass+'">' + html.join('\n') + '</div>')
|
||||
})
|
||||
data.value = value.join('\n')
|
||||
|
||||
data.title = data.edit.name
|
||||
data.byline = data.edit.description
|
||||
data.link = `${pandora.proto}://${data.site}/edits/${data.edit.id}`
|
||||
data.poster = data.videos[0].src.split('/' + pandora.resolution)[0] + `/${pandora.resolution}p${data.videos[0].in}.jpg`
|
||||
let poster = data.edit.posterFrames[0]
|
||||
if (args.parts[2] && args.parts[2].indexOf(':') > -1) {
|
||||
poster = getClip(data.edit, parseDuration(args.parts[2]))
|
||||
}
|
||||
if (poster && poster.item) {
|
||||
data.poster = `${pandora.proto}://${data.site}/${poster.item}/${pandora.resolution}${poster.position.toFixed(3)}.jpg`
|
||||
} else {
|
||||
data.poster = data.videos[0].src.split('/48')[0] + `/${pandora.resolution}p${data.videos[0].in.toFixed(3)}.jpg`
|
||||
}
|
||||
data.aspectratio = data.edit.clips[0].videoRatio
|
||||
data.duration = data.edit.duration
|
||||
return data
|
||||
|
|
|
@ -10,6 +10,8 @@ async function loadData(id, args) {
|
|||
"id",
|
||||
"title",
|
||||
"director",
|
||||
"year",
|
||||
"date",
|
||||
"source",
|
||||
"summary",
|
||||
"streams",
|
||||
|
@ -45,6 +47,11 @@ async function loadData(id, args) {
|
|||
} else {
|
||||
data.byline = data.item.director ? data.item.director.join(', ') : ''
|
||||
}
|
||||
if (data.item.year) {
|
||||
data.byline += ' (' + data.item.year + ')'
|
||||
} else if (data.item.date) {
|
||||
data.byline += ' (' + data.item.date.split('-')[0] + ')'
|
||||
}
|
||||
data.link = `${pandora.proto}://${data.site}/${data.item.id}/info`
|
||||
let poster = pandora.site.user.ui.icons == 'posters' ? 'poster' : 'icon'
|
||||
data.icon = `${pandora.proto}://${data.site}/${data.item.id}/${poster}.jpg`
|
||||
|
@ -105,6 +112,15 @@ async function loadData(id, args) {
|
|||
duration: duration
|
||||
})
|
||||
})
|
||||
if (data.layers[pandora.subtitleLayer]) {
|
||||
var previous;
|
||||
data.layers[pandora.subtitleLayer].forEach(annotation => {
|
||||
if (previous) {
|
||||
previous.out = annotation['in']
|
||||
}
|
||||
previous = annotation
|
||||
})
|
||||
}
|
||||
var value = []
|
||||
Object.keys(data.layers).forEach(layer => {
|
||||
var html = []
|
||||
|
@ -127,7 +143,11 @@ async function loadData(id, args) {
|
|||
</div>
|
||||
`)
|
||||
})
|
||||
value.push('<div class="layer">' + html.join('\n') + '</div>')
|
||||
var layerClass = ""
|
||||
if (layerData.isSubtitles) {
|
||||
layerClass = " is-subtitles"
|
||||
}
|
||||
value.push('<div class="layer'+layerClass+'">' + html.join('\n') + '</div>')
|
||||
})
|
||||
data.value = value.join('\n')
|
||||
|
||||
|
@ -137,6 +157,11 @@ async function loadData(id, args) {
|
|||
} else {
|
||||
data.byline = data.item.director ? data.item.director.join(', ') : ''
|
||||
}
|
||||
if (data.item.year) {
|
||||
data.byline += ' (' + data.item.year + ')'
|
||||
} else if (data.item.date) {
|
||||
data.byline += ' (' + data.item.date.split('-')[0] + ')'
|
||||
}
|
||||
data.link = `${pandora.proto}://${data.site}/${data.item.id}/${data["in"]},${data.out}`
|
||||
data.poster = `${pandora.proto}://${data.site}/${data.item.id}/${pandora.resolution}p${data["in"]}.jpg`
|
||||
data.aspectratio = data.item.videoRatio
|
||||
|
|
|
@ -109,6 +109,7 @@ pandoraAPI("init").then(response => {
|
|||
if (subtitleLayer) {
|
||||
layerKeys.push(subtitleLayer.id)
|
||||
}
|
||||
pandora.subtitleLayer = subtitleLayer.id
|
||||
pandora.site.layers.map(layer => {
|
||||
return layer.id
|
||||
}).filter(layer => {
|
||||
|
|
|
@ -20,7 +20,6 @@ function renderItemInfo(data) {
|
|||
}
|
||||
|
||||
function renderItem(data) {
|
||||
window.item = window.item || {}
|
||||
if (data.error) {
|
||||
return renderError(data)
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue