diff --git a/static/mobile/js/VideoPlayer.js b/static/mobile/js/VideoPlayer.js
index 93e4a2f22..af219c547 100644
--- a/static/mobile/js/VideoPlayer.js
+++ b/static/mobile/js/VideoPlayer.js
@@ -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()
}
})
diff --git a/static/mobile/js/edits.js b/static/mobile/js/edits.js
index cdf7df1fb..1d1487736 100644
--- a/static/mobile/js/edits.js
+++ b/static/mobile/js/edits.js
@@ -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) {
`)
})
- value.push('
' + html.join('\n') + '
')
+ var layerClass = ""
+ if (layerData.isSubtitles) {
+ layerClass = " is-subtitles"
+ }
+ value.push('' + html.join('\n') + '
')
})
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
diff --git a/static/mobile/js/item.js b/static/mobile/js/item.js
index 9e1a6d731..0cc3dcf1e 100644
--- a/static/mobile/js/item.js
+++ b/static/mobile/js/item.js
@@ -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) {
`)
})
- value.push('' + html.join('\n') + '
')
+ var layerClass = ""
+ if (layerData.isSubtitles) {
+ layerClass = " is-subtitles"
+ }
+ value.push('' + html.join('\n') + '
')
})
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
diff --git a/static/mobile/js/main.js b/static/mobile/js/main.js
index 9d0f3c42c..ebd9b8100 100644
--- a/static/mobile/js/main.js
+++ b/static/mobile/js/main.js
@@ -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 => {
diff --git a/static/mobile/js/render.js b/static/mobile/js/render.js
index 307c5d2fd..d8097f869 100644
--- a/static/mobile/js/render.js
+++ b/static/mobile/js/render.js
@@ -20,7 +20,6 @@ function renderItemInfo(data) {
}
function renderItem(data) {
- window.item = window.item || {}
if (data.error) {
return renderError(data)
}