From 0746a2ab6c03bc420b32cd3c2a974b16bc1aef93 Mon Sep 17 00:00:00 2001 From: j Date: Mon, 26 Sep 2022 22:03:59 +0100 Subject: [PATCH 1/3] update height on display --- app/static/js/ascroll.js | 5 +++++ app/static/js/pandora-scroll.js | 12 ++++++++++++ 2 files changed, 17 insertions(+) diff --git a/app/static/js/ascroll.js b/app/static/js/ascroll.js index 8f02a34..b69620e 100644 --- a/app/static/js/ascroll.js +++ b/app/static/js/ascroll.js @@ -141,6 +141,11 @@ function formatInfo(config, ascroll) { } title.onclick = event => { section.style.display = section.style.display == "none" ? "block" : "none" + if (section.style.display == "block") { + section.querySelectorAll("pandora-scroll").forEach(ps => { + ps.updateAnnotationHeight() + }) + } div.querySelectorAll("h3.toggle").forEach(other => { if (other != title) { var osection = other.nextElementSibling diff --git a/app/static/js/pandora-scroll.js b/app/static/js/pandora-scroll.js index 3892b98..3ddab24 100644 --- a/app/static/js/pandora-scroll.js +++ b/app/static/js/pandora-scroll.js @@ -29,6 +29,18 @@ class PandoraScroll extends HTMLElement { video.muted = true }) } + this.updateAnnotationHeight = function() { + var height = 0 + var text = shadow.querySelector('.text') + text.querySelectorAll('.annotation.single').forEach(annotation => { + var rect = annotation.getBoundingClientRect() + console.log(annotation, rect.height) + if (rect.height > height) { + height = rect.height + } + }) + text.style.height = height + 'px'; + } } From 405cb1029da82cb498d1ed6ed0033b4236d1b192 Mon Sep 17 00:00:00 2001 From: j Date: Mon, 26 Sep 2022 21:56:33 +0100 Subject: [PATCH 2/3] fix italic urls --- app/static/css/partials/_text.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/static/css/partials/_text.scss b/app/static/css/partials/_text.scss index 5712c32..9f810e2 100755 --- a/app/static/css/partials/_text.scss +++ b/app/static/css/partials/_text.scss @@ -39,15 +39,15 @@ } @font-face { font-family: 'noto_sans'; - src: url('noto-sans-bold-italic-webfont.woff2') format('woff2'), - url('noto-sans-bold-italic-webfont.woff') format('woff'); + src: url('../../static/fonts/noto-sans/noto-sans-bold-italic-webfont.woff2') format('woff2'), + url('../../static/fonts/noto-sans/noto-sans-bold-italic-webfont.woff') format('woff'); font-weight: 700; font-style: italic; } @font-face { font-family: 'noto_sans'; - src: url('noto-sans-bold-italic-webfont.woff2') format('woff2'), - url('noto-sans-bold-italic-webfont.woff') format('woff'); + src: url('../../static/fonts/noto-sans/noto-sans-bold-italic-webfont.woff2') format('woff2'), + url('../../static/fonts/noto-sans/noto-sans-bold-italic-webfont.woff') format('woff'); font-weight: 700; font-style: bold italic; } From 4cd85603127574836eef93400d0f846d0e2f733e Mon Sep 17 00:00:00 2001 From: j Date: Mon, 26 Sep 2022 22:08:29 +0100 Subject: [PATCH 3/3] revert annotation max height calculation --- app/static/js/ascroll.js | 35 +++------------------------------ app/static/js/pandora-scroll.js | 12 ----------- 2 files changed, 3 insertions(+), 44 deletions(-) diff --git a/app/static/js/ascroll.js b/app/static/js/ascroll.js index b69620e..0e30230 100644 --- a/app/static/js/ascroll.js +++ b/app/static/js/ascroll.js @@ -71,17 +71,9 @@ function timeupdate(event) { var ain = parseFloat(annot.dataset.in) var aout = parseFloat(annot.dataset.out) if (ain <= currentTime && aout > currentTime) { - if (annot.classList.contains('single')) { - annot.style.opacity = '1' - } else { - annot.style.display = '' - } + annot.style.display = '' } else { - if (annot.classList.contains('single')) { - annot.style.opacity = '0' - } else { - annot.style.display = 'none' - } + annot.style.display = 'none' } }) @@ -141,11 +133,6 @@ function formatInfo(config, ascroll) { } title.onclick = event => { section.style.display = section.style.display == "none" ? "block" : "none" - if (section.style.display == "block") { - section.querySelectorAll("pandora-scroll").forEach(ps => { - ps.updateAnnotationHeight() - }) - } div.querySelectorAll("h3.toggle").forEach(other => { if (other != title) { var osection = other.nextElementSibling @@ -422,7 +409,6 @@ function renderSingleMode(config) { config.root.appendChild(div) var frame = div.querySelector('.frame') var text = div.querySelector('.text') - text.style.position = 'relative' var first = config.annotations[0] if (text && first) { var color1 = `hsl(${first.color1.hue}, 60%, 15%)` @@ -441,28 +427,13 @@ function renderSingleMode(config) { values = values.join('

') var annot = document.createElement('div') annot.classList.add('annotation') - annot.classList.add('single') annot.innerHTML = values //console.log(clip) annot.dataset['in'] = clip.annotations[0]['in'] annot.dataset['out'] = clip.annotations[0]['out'] - annot.style.opacity = '0' - annot.style.position = 'absolute' + annot.style.display = 'none' text.appendChild(annot) }) - if (config.annotations.length) { - text.style.height = '72px'; - } - setTimeout(() => { - var height = 0 - text.querySelectorAll('.annotation.single').forEach(annotation => { - var rect = annotation.getBoundingClientRect() - if (rect.height > height) { - height = rect.height - } - }) - text.style.height = height + 'px'; - }, 50) if (frame) { updatePlayer(config.video, frame, config['in'], config['out'], src, config) } diff --git a/app/static/js/pandora-scroll.js b/app/static/js/pandora-scroll.js index 3ddab24..3892b98 100644 --- a/app/static/js/pandora-scroll.js +++ b/app/static/js/pandora-scroll.js @@ -29,18 +29,6 @@ class PandoraScroll extends HTMLElement { video.muted = true }) } - this.updateAnnotationHeight = function() { - var height = 0 - var text = shadow.querySelector('.text') - text.querySelectorAll('.annotation.single').forEach(annotation => { - var rect = annotation.getBoundingClientRect() - console.log(annotation, rect.height) - if (rect.height > height) { - height = rect.height - } - }) - text.style.height = height + 'px'; - } }