Work on getting the scroll to work for Safari....

This commit is contained in:
Scott Idem
2025-06-26 16:56:00 -04:00
parent 71b2de27ce
commit 4ef2e7cd6b
2 changed files with 52 additions and 3 deletions

View File

@@ -218,7 +218,7 @@ if (browser && iframe == 'true') {
}
$effect(() => {
if ($ae_loc.iframe && $ae_loc.iframe_height && $ae_loc.iframe_height_modal_body) {
if ($ae_loc.iframe && $ae_loc.iframe_height && $ae_loc.iframe_height_modal_body) {
if (log_lvl > 1) {
console.log('Getting new dimensions for iframe with modal:', $ae_loc.iframe_height, $ae_loc.iframe_height_modal_body);
}
@@ -244,12 +244,24 @@ $effect(() => {
if (log_lvl > 1) {
console.log(`Suggested new iframe_height with modal: ${iframe_height}`);
}
if (iframe_height > 4096) {
console.warn('iframe_height is getting too large, setting to 4096px');
iframe_height = 4096; // Limit the height to a maximum of 4096px
}
window.parent.postMessage({'iframe_height': iframe_height}, "*"); // This should be in pixels
} else if ($ae_loc.iframe && $ae_loc.iframe_height) {
if (log_lvl > 1) {
console.log('Suggested new iframe_height:', $ae_loc.iframe_height);
}
window.parent.postMessage({'iframe_height': $ae_loc.iframe_height}, "*"); // This should be in pixels
let iframe_height = 0;
iframe_height = $ae_loc.iframe_height;
if (iframe_height > 4096) {
console.warn('iframe_height is getting too large, setting to 4096px');
iframe_height = 4096; // Limit the height to a maximum of 4096px
}
window.parent.postMessage({'iframe_height': iframe_height}, "*"); // This should be in pixels
}
});
@@ -363,12 +375,16 @@ $effect(() => {
if (is_safari) {
console.log('Safari detected, not using smooth scroll to top');
document.getElementById('ae_idaa')?.scrollTo(0, 0);
window.parent.postMessage({'scroll_to': 0}, "*"); // This should be in pixels
} else {
console.log('Not Safari, using smooth scroll to top');
document.getElementById('ae_idaa')?.scrollTo({
top: 0,
behavior: 'smooth'
});
window.parent.postMessage({'scroll_to': 0}, "*"); // This should be in pixels
}
}}
title="Scroll to top"

View File

@@ -71,8 +71,8 @@ window.addEventListener('message', function(event) {
if (event.data) {
if (event.data.iframe_height) {
// console.log(`Got iframe height: ${event.data.iframe_height}`);
idaa_ae_iframe_height = event.data.iframe_height;
// console.log(`Got iframe height: ${idaa_ae_iframe_height}`);
let idaa_ae_iframe_element = document.getElementById('ae_idaa_recovery_meetings_iframe');
@@ -80,6 +80,39 @@ window.addEventListener('message', function(event) {
idaa_ae_iframe_element.style.height = `${idaa_ae_iframe_height+50}px`;
}
if (event.data.scroll_to !== undefined) {
console.log(`Got scroll_to: ${event.data.scroll_to}`);
let idaa_ae_iframe_element = document.getElementById('ae_idaa_recovery_meetings_iframe');
if (idaa_ae_iframe_element) {
console.log(`Scrolling to: ${event.data.scroll_to}`);
// window.scrollTo(0, 0); // This works for all current browsers
window.scrollTo({
top: 0,
left: 0,
behavior: 'smooth'
});
// idaa_ae_iframe_element.scrollTo({x: 0, y: 0}); // Scroll to top
// document.body.scrollTo({x: 0, y: 0}); // Scroll to top
// document.body.scrollTo({
// top: 0,
// behavior: 'smooth'
// });
// document.body.scrollTop = 0;
// idaa_ae_iframe_element?.scrollTo(0, 0)
// idaa_ae_iframe_element.scrollTo({
// top: 0,
// behavior: 'smooth'
// });
// idaa_ae_iframe_element.scrollTo({
// top: event.data.scroll_to,
// behavior: 'smooth'
// });
} else {
console.warn(`Element with ID "ae_idaa_recovery_meetings_iframe" not found.`);
}
}
const url = new URL(location);
// Check if event_id is defined in the message