From cf0b18fa66fbcbab9a38dff0325fcc1d0d70989b Mon Sep 17 00:00:00 2001
From: Hangzhi Yu <hangzhi@protonmail.com>
Date: Wed, 25 Jan 2023 11:29:06 +0100
Subject: [PATCH] Use new IFrame height adaptation mechanism without
denpendence on postMessage
---
CHANGELOG.rst | 1 +
.../components/LegacyBaseTemplate.vue | 19 ++++++-------------
aleksis/core/templates/core/base.html | 7 -------
3 files changed, 7 insertions(+), 20 deletions(-)
diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index f8a3f7670..72e26deb9 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -42,6 +42,7 @@ Changed
Fixed
~~~~~
+* In some cases, the IFrame for legacy pages was not properly sized for its content.
* The system tried to send notifications for done background tasks
in addition to tasks started in the foreground.
* Invitations for existing short name did not work.
diff --git a/aleksis/core/frontend/components/LegacyBaseTemplate.vue b/aleksis/core/frontend/components/LegacyBaseTemplate.vue
index 3f620e7a0..bf0d83e8f 100644
--- a/aleksis/core/frontend/components/LegacyBaseTemplate.vue
+++ b/aleksis/core/frontend/components/LegacyBaseTemplate.vue
@@ -37,15 +37,6 @@ export default {
},
},
methods: {
- /** Receives a message from the legacy app inside the iframe */
- receiveMessage(event) {
- if (event.data.height) {
- // The iframe communicated us its render height
- // Set iframe to full height to prevent an inner scroll bar
- this.iFrameHeight = event.data.height;
- this.$root.contentLoading = false;
- }
- },
/** Handle iframe data after inner page loaded */
load() {
// Write new location of iframe back to Vue Router
@@ -69,12 +60,14 @@ export default {
// Write title of iframe to SPA window
const title = this.$refs.contentIFrame.contentWindow.document.title;
this.$root.$setPageTitle(title);
+
+ // Adapt height of IFrame according to the height of its contents once and listen to resize events
+ this.iFrameHeight = this.$refs.contentIFrame.contentDocument.body.scrollHeight;
+ this.$refs.contentIFrame.contentWindow.onresize = () => {this.iFrameHeight = this.$refs.contentIFrame.contentDocument.body.scrollHeight};
+
+ this.$root.contentLoading = false;
},
},
- mounted() {
- // Subscribe to message channel to receive height from iframe
- this.safeAddEventListener(window, "message", this.receiveMessage);
- },
watch: {
$route() {
// Show loading animation once route changes
diff --git a/aleksis/core/templates/core/base.html b/aleksis/core/templates/core/base.html
index 8adfdd6a0..6f4736024 100644
--- a/aleksis/core/templates/core/base.html
+++ b/aleksis/core/templates/core/base.html
@@ -76,13 +76,6 @@
<script type="text/javascript" src="{% static 'js/main.js' %}"></script>
<script>
$(document).ready(function () {
- window.parent.postMessage({height: $(document).height()});
-
- function documentResizePostMessage() {
- window.parent.postMessage({height: $(document).height()});
- };
- window.onresize = documentResizePostMessage;
-
function findLink(el) {
if (el.href) {
return el.href;
--
GitLab