scroll autoloaded target into view - kinda

1 files changed, 9 insertions, 1 deletions

diff --git a/src/js/main.js b/src/js/main.js
index 3a3f823..f7ad5f4 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -172,7 +172,15 @@ function presentTarget(targetName) {
     for (const el of document.querySelectorAll('.target.selected')) {
         el.classList.remove('selected');
     }
-    document.querySelector(`.target[data-name="${targetName.replace(/"/g, '\\"')}"]`).classList.add('selected');
+    const el = document.querySelector(`.target[data-name="${targetName.replace(/"/g, '\\"')}"]`);
+    el.classList.add('selected');
+    // XXX: this is a hack! we wait 100ms as a guard so that we _probably_ run scrollIntoView after
+    // any images have loaded. however, this doesn't work if the images don't load within that
+    // time, in which case the element will not properly be scrolled into view (the loaded images
+    // will push it out of the way). to deal with this, we should wait until all images positioned
+    // before this target's element have loaded (but we should also make sure to skip images that
+    // have already loaded).
+    setTimeout(() => el.scrollIntoView(), 100);
 
     clearChildren(scriptArea);
     if (target.scripts.length) {