Commit 47cb5514 authored by Anton's avatar Anton

Only update video related cells when visible

parent 12c87dde
......@@ -7,7 +7,8 @@
:cell="cell",
:class="cellClasses",
:display="display",
:preview="preview")
:preview="preview",
:visible="inViewPort")
template(v-else)
div Empty cell
......
......@@ -60,6 +60,7 @@
},
async mounted () {
window.addEventListener('resize', this.updateGridDimensions)
this.$refs.gridContainer.addEventListener('scroll', this.onScroll)
// this.$root.$on('video-loaded', (/* origin */) => {
// // console.log('video loaded', origin.origin)
// })
......@@ -69,6 +70,9 @@
await this.loadGrid(this.$route.params.id)
},
methods: {
onScroll () {
this.activeArea = { x: this.$refs.gridContainer.scrollX, width: window.innerWidth }
},
async loadGrid (uuid) {
this.grid = await this.$store.dispatch('maps/get', uuid)
if (this.grid.stylesheet) {
......
......@@ -68,7 +68,7 @@ export default {
VideoTitle,
MarkdownDisplay
},
props: ['cell', 'display', 'preview'],
props: ['cell', 'display', 'preview', 'visible'],
data () {
return {
videoUuid: '',
......@@ -84,7 +84,8 @@ export default {
newAnnotationText: '',
staging: process.env.IS_STAGING,
activeTabIdx: 0,
playerTime: 0.0
playerTime: 0.0,
lastSignal: Date.now()
}
},
async mounted () {
......@@ -112,7 +113,7 @@ export default {
let idx = -1, annotation = this.annotations[0]
while (annotation && idx < this.annotations.length &&
this.baseSelector >= DateTime.fromISO(annotation.target.selector.value, { setZone: true })) {
this.baseSelector > DateTime.fromISO(annotation.target.selector.value, { setZone: true })) {
idx++
annotation = this.annotations[idx + 1]
}
......@@ -125,6 +126,9 @@ export default {
},
methods: {
onVideoTimeChanged (time, globalTime, origin = undefined) {
if (!this.visible) return
// if (Date.now() - this.lastSignal < 500) return
// this.lastSignal = Date.now()
if (!origin || (origin.type === 'Video' && this.video.target.id === origin.origin.target.id)) {
// console.debug('CellAnnotationList: received video-time-changed event', time, globalTime, origin)
this.playerTime = time
......@@ -138,6 +142,7 @@ export default {
}
},
onGridDateTime (datetime, origin = undefined) {
if (!this.visible) return
if (!origin || (origin.type === 'Video' && this.video.target.id === origin.origin.target.id)) {
console.debug('CellAnnotationList: received grid-datetime event', datetime, origin)
this.gridTime = datetime
......
......@@ -24,7 +24,7 @@
CellInfo,
VideoPlayer
},
props: ['cell', 'display', 'preview'],
props: ['cell', 'display', 'preview', 'visible'],
data () {
return {
video: undefined,
......@@ -46,6 +46,14 @@
}
}
},
watch: {
visible (val) {
if (!val && this.player) {
console.log('cell off', val)
this.player.pause()
}
}
},
async mounted () {
if (this.cell.sourceUuid) {
const
......@@ -65,6 +73,7 @@
_this.setPlayerTimeFromDateTime(datetime)
})
this.$root.$on('annotation-trigger', (annotation, annotationGlobalTime) => {
if (!_this.video) return
if (_this.video.target && annotation.target.id === _this.video.target.id) {
console.debug('CellVideo: received annotation-trigger', annotation.uuid, annotationGlobalTime.toISO())
_this.setPlayerTimeFromDateTime(annotationGlobalTime)
......@@ -89,6 +98,7 @@
}
},
setPlayerTimeFromDateTime (datetime) {
if (!this.visible) return
if (this.player && this.videoTime) {
try {
const movieTime = Interval.fromDateTimes(this.videoTime, datetime)
......@@ -110,6 +120,7 @@
this.$root.$emit('video-started-playing', this.getSignature())
},
handlePlayerTimeChange (localTime) {
if (!this.visible) return
if (this.cell.start && localTime < this.cell.start) return this.player.currentTime(this.cell.start)
if (this.cell.duration && localTime > this.cell.start + this.cell.duration) {
this.player.pause()
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment