summaryrefslogtreecommitdiff
path: root/ext
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2021-01-25 19:21:02 -0500
committerGitHub <noreply@github.com>2021-01-25 19:21:02 -0500
commitea1d40f94b2e3d43cc73805018cc5d2ba24a6822 (patch)
tree2f2a03024d39ad36275bdcbda6405481b68b1f6c /ext
parent5215c6b8b476d491f324ad3a285bdf6b66a5de41 (diff)
Defer load of iframe on the settings page (#1313)
Diffstat (limited to 'ext')
-rw-r--r--ext/bg/js/settings2/settings-display-controller.js33
-rw-r--r--ext/bg/settings2.html2
2 files changed, 34 insertions, 1 deletions
diff --git a/ext/bg/js/settings2/settings-display-controller.js b/ext/bg/js/settings2/settings-display-controller.js
index 6f0a8276..4dee0fab 100644
--- a/ext/bg/js/settings2/settings-display-controller.js
+++ b/ext/bg/js/settings2/settings-display-controller.js
@@ -54,6 +54,10 @@ class SettingsDisplayController {
node.addEventListener('keydown', onInputTabActionKeyDown, false);
}
+ for (const node of document.querySelectorAll('.defer-load-iframe')) {
+ this._setupDeferLoadIframe(node);
+ }
+
this._onMoreToggleClickBind = this._onMoreToggleClick.bind(this);
const moreSelectorObserver = new SelectorObserver({
selector: '.more-toggle',
@@ -305,4 +309,33 @@ class SettingsDisplayController {
return false;
}
}
+
+ _setupDeferLoadIframe(element) {
+ const parent = this._getMoreContainer(element);
+ if (parent === null) { return; }
+
+ let mutationObserver = null;
+ const callback = () => {
+ if (!this._isElementVisible(element)) { return false; }
+
+ const src = element.dataset.src;
+ delete element.dataset.src;
+ element.src = src;
+
+ if (mutationObserver === null) { return true; }
+
+ mutationObserver.disconnect();
+ mutationObserver = null;
+ return true;
+ };
+
+ if (callback()) { return; }
+
+ mutationObserver = new MutationObserver(callback);
+ mutationObserver.observe(parent, {attributes: true});
+ }
+
+ _isElementVisible(element) {
+ return (element.offsetParent !== null);
+ }
}
diff --git a/ext/bg/settings2.html b/ext/bg/settings2.html
index 3bad1217..98274277 100644
--- a/ext/bg/settings2.html
+++ b/ext/bg/settings2.html
@@ -720,7 +720,7 @@
Pitch accents for terms and expressions can be shown if a dictionary supporting pitch accents is installed.
There are currently three different ways that pitch accents can be presented:
</p>
- <iframe src="/bg/pitch-accents-preview.html" id="pitch-accents-preview-frame"></iframe>
+ <iframe data-src="/bg/pitch-accents-preview.html" id="pitch-accents-preview-frame" class="defer-load-iframe" data-parent-distance="1"></iframe>
<p>
<a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
</p>