cluster by clips, never cache
This commit is contained in:
parent
db6a2f25bd
commit
ade1177101
2 changed files with 19 additions and 9 deletions
|
@ -192,10 +192,11 @@ function showOverlay(event) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderAnnotation(config, video, ascroll, annotation) {
|
function renderAnnotation(config, video, ascroll, clip) {
|
||||||
var div = document.createElement('div')
|
var div = document.createElement('div')
|
||||||
div.classList.add('annotation')
|
div.classList.add('annotation')
|
||||||
|
|
||||||
|
var annotation = clip[0]
|
||||||
var color1 = `hsl(${annotation.color1.hue}, 60%, 15%)`
|
var color1 = `hsl(${annotation.color1.hue}, 60%, 15%)`
|
||||||
var color2 = `hsl(${annotation.color2.hue}, 60%, 15%)`
|
var color2 = `hsl(${annotation.color2.hue}, 60%, 15%)`
|
||||||
if (!config.first) {
|
if (!config.first) {
|
||||||
|
@ -209,7 +210,11 @@ function renderAnnotation(config, video, ascroll, annotation) {
|
||||||
var txt = `${title}`
|
var txt = `${title}`
|
||||||
figcaption = `<figcaption><a href="${pandoraURL}/${annotation.id}" target="_blank">${txt}</a></figcaption>`
|
figcaption = `<figcaption><a href="${pandoraURL}/${annotation.id}" target="_blank">${txt}</a></figcaption>`
|
||||||
}
|
}
|
||||||
annotation.value = annotation.value.replace(/src="\//g, `src="${pandoraURL}/`).replace(/href="\//g, `href="${pandoraURL}/`)
|
var values = []
|
||||||
|
clip.forEach(a => {
|
||||||
|
values.push(a.value.replace(/src="\//g, `src="${pandoraURL}/`).replace(/href="\//g, `href="${pandoraURL}/`))
|
||||||
|
})
|
||||||
|
values = values.join('<br><br>')
|
||||||
div.innerHTML = `
|
div.innerHTML = `
|
||||||
<div class="frame">
|
<div class="frame">
|
||||||
<figure>
|
<figure>
|
||||||
|
@ -217,7 +222,7 @@ function renderAnnotation(config, video, ascroll, annotation) {
|
||||||
${figcaption}
|
${figcaption}
|
||||||
</figure>
|
</figure>
|
||||||
</div>
|
</div>
|
||||||
<div class="text">${annotation.value}</div>
|
<div class="text">${values}</div>
|
||||||
`
|
`
|
||||||
ascroll.appendChild(div)
|
ascroll.appendChild(div)
|
||||||
var frame = div.querySelector('.frame')
|
var frame = div.querySelector('.frame')
|
||||||
|
@ -280,13 +285,17 @@ async function loadClips(annotations) {
|
||||||
'id', 'hue', 'saturation', 'lightness'
|
'id', 'hue', 'saturation', 'lightness'
|
||||||
]}).then(response => {
|
]}).then(response => {
|
||||||
var colors = {}
|
var colors = {}
|
||||||
|
var clips = {}
|
||||||
response.data.items.forEach(clip => {
|
response.data.items.forEach(clip => {
|
||||||
colors[clip.id] = clip
|
colors[clip.id] = clip
|
||||||
})
|
})
|
||||||
var previous
|
var previous
|
||||||
annotations.forEach(annotation => {
|
annotations.forEach(annotation => {
|
||||||
var clipId = annotation.id.split('/')[0] + '/' + annotation.in.toFixed(3) + '-'+ annotation.out.toFixed(3)
|
var clipId = annotation.id.split('/')[0] + '/' + annotation.in.toFixed(3) + '-'+ annotation.out.toFixed(3)
|
||||||
|
clips[clipId] = clips[clipId] || []
|
||||||
|
clips[clipId].push(annotation)
|
||||||
annotation.color1 = colors[clipId]
|
annotation.color1 = colors[clipId]
|
||||||
|
|
||||||
if(previous) {
|
if(previous) {
|
||||||
previous.color2 = annotation.color1
|
previous.color2 = annotation.color1
|
||||||
}
|
}
|
||||||
|
@ -295,7 +304,9 @@ async function loadClips(annotations) {
|
||||||
if (annotations.length) {
|
if (annotations.length) {
|
||||||
annotations[annotations.length - 1].color2 = annotations[0].color1
|
annotations[annotations.length - 1].color2 = annotations[0].color1
|
||||||
}
|
}
|
||||||
return annotations
|
//return annotations
|
||||||
|
console.log('WTF', Object.values(clips))
|
||||||
|
return Object.values(clips)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -326,7 +337,7 @@ function loadAnnotations(config) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
return annotation.value.slice(0, 2) != 'E:'
|
return annotation
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
renderAnnotations(config)
|
renderAnnotations(config)
|
||||||
|
@ -361,7 +372,7 @@ function loadAnnotations(config) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
})
|
||||||
})
|
})
|
||||||
loadClips(annotations).then(annotations => {
|
loadClips(annotations).then(annotations => {
|
||||||
config.annotations = annotations
|
config.annotations = annotations
|
||||||
|
@ -374,11 +385,10 @@ function loadAnnotations(config) {
|
||||||
|
|
||||||
config.layer = config.layer || layer
|
config.layer = config.layer || layer
|
||||||
|
|
||||||
if (config.annotations) {
|
if (false && config.annotations) {
|
||||||
renderAnnotations(config)
|
renderAnnotations(config)
|
||||||
} else {
|
} else {
|
||||||
loadAnnotations(config)
|
loadAnnotations(config)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
window.addEventListener('resize', resize, false);
|
window.addEventListener('resize', resize, false);
|
||||||
|
|
|
@ -174,7 +174,7 @@ class Text(models.Model):
|
||||||
if not item_id:
|
if not item_id:
|
||||||
item_id = self.data.get('item')
|
item_id = self.data.get('item')
|
||||||
if item_id:
|
if item_id:
|
||||||
item = Film.objects.filter(pandora_id=item_id).first()
|
item = Film.objects.filter(pandora_url=item_id).first()
|
||||||
if item:
|
if item:
|
||||||
for key in ('title', 'title_zh', 'director'):
|
for key in ('title', 'title_zh', 'director'):
|
||||||
data['item_' + key] = item.data[key]
|
data['item_' + key] = item.data[key]
|
||||||
|
|
Loading…
Reference in a new issue