Scott.Idem/OSIT-AE-App-Svelte
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: system bar hide logic for iframe and menu param overrides (IDAA embed reliability)

Browse Source
This commit is contained in:
Scott Idem
2026-03-25 15:49:41 -04:00
parent fd244720a7
commit 0ad36a74b2
6 changed files with 113 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/app_components/e_app_sys_bar.svelte
View File

@@ -229,6 +229,9 @@ const theme_options = [
OUTER WRAPPER — fixed bottom-right, hidden on print
Visibility when in iframe is controlled by +layout.svelte (trusted_access gate)
══════════════════════════════════════════════════════════════════════════ -->
<!-- {#if disable} -->
<!-- Hidden state: render nothing (not even the bar) -->
<!-- {:else} -->
<div
class="
ae_sys_bar
@@ -237,6 +240,7 @@ const theme_options = [
flex
flex-col items-end gap-1 print:hidden
"
class:d-none={hide}
class:hidden={hide}>
<!-- ── EXPANDED PANEL ──────────────────────────────────────────────────── -->
{#if expand}
@@ -723,6 +727,10 @@ const theme_options = [
<!-- END: Compact bar -->
</div>
<!-- {/if} -->
<style>
/*
* Strip blue backgrounds and fixed widths from sub-components when

0
src/lib/app_components/e_app_sys_menu.svelte → src/lib/app_components/e_app_sys_menu_legacy.svelte
View File

20
src/routes/+layout.svelte
View File

@@ -276,6 +276,8 @@ $effect(() => {
// Iframe Detection
let iframe = data.url.searchParams.get('iframe');
// let iframe = $derived(data.url.searchParams.get('iframe'));
if (iframe === 'true') {
$ae_loc.iframe = true;
// Hide the AE system bar by default in iframe embeds — it's nav chrome
@@ -289,10 +291,22 @@ $effect(() => {
// show_menu=true — override to show the AE system bar even inside an iframe.
// Intended for trusted/admin users who need menu access while testing an embed.
// hide_menu=true — explicitly hide the bar outside of iframe contexts.
// const menu_override = data.url.searchParams.get('show_menu');
// if (menu_override === 'true') $ae_loc.sys_menu.hide = false;
// else if (data.url.searchParams.get('hide_menu') === 'true')
// $ae_loc.sys_menu.hide = true;
const menu_override = data.url.searchParams.get('show_menu');
if (menu_override === 'true') $ae_loc.sys_menu.hide = false;
else if (data.url.searchParams.get('hide_menu') === 'true')
if (menu_override === 'true') {
$ae_loc.sys_menu.hide = false;
} else if (data.url.searchParams.get('hide_menu') === 'true') {
$ae_loc.sys_menu.hide = true;
} else if (data.url.searchParams.get('iframe') === 'true') {
$ae_loc.sys_menu.hide = true;
} else if (data.url.searchParams.get('iframe') === 'false') {
$ae_loc.sys_menu.hide = false;
}
// console.log('iframe:', $ae_loc.iframe, 'sys_menu.hide:', $ae_loc.sys_menu.hide);
// Theme URL params — ?theme=AE_Firefly_SteelBlue&theme_mode=dark
// Applied once on load, then silently removed from the URL (no history entry).
@@ -397,7 +411,7 @@ $effect(() => {
</div>
{/if}
{#if browser && (!$ae_loc?.iframe || $ae_loc?.trusted_access)}
{#if browser && (!$ae_loc?.iframe || $ae_loc?.administrator_access || ($ae_loc?.trusted_access && $ae_loc.edit_mode))}
<!-- print:hidden wrapper: sys/debug menus are fixed overlays — must not appear on printed pages -->
<div class="print:hidden">
<E_app_sys_bar

1
src/routes/idaa/(idaa)/+layout.svelte
View File

@@ -90,6 +90,7 @@ async function verify_novi_uuid(
api_key: string | null,
api_root_url: string
) {
console.log(`IDAA Layout: Starting Novi UUID verification for ${uuid}...`);
if (!api_key) {
// No Novi API key in site config. All-or-nothing means no UUID-based access.
console.warn(

1
src/routes/idaa/(idaa)/video_conferences/+page.svelte
View File

@@ -518,6 +518,7 @@ onMount(async () => {
'Jitsi: onMount - fetching user data and initializing Jitsi...'
);
}
// $ae_loc.sys_menu.hide = true;
await fetch_novi_data();

170
src/routes/idaa/+layout.svelte
View File

@@ -32,56 +32,56 @@ interface Props {
let { data, children }: Props = $props();
function add_activity_log({
action = 'idaa_root_layout',
action_with = 'none'
}: {
action?: string;
action_with?: string;
}) {
let last_cache_refresh_iso = new Date($ae_loc?.last_cache_refresh);
// function add_activity_log({
// action = 'idaa_root_layout',
// action_with = 'none'
// }: {
// action?: string;
// action_with?: string;
// }) {
// let last_cache_refresh_iso = new Date($ae_loc?.last_cache_refresh);
let activity_description = `
${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? 'no-email'}
allow=${$ae_loc?.allow_access}
last_cache_refresh=${last_cache_refresh_iso.toLocaleString()}
data_route=${data?.route.toString() ?? 'unknown'}
`;
// let activity_description = `
// ${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? 'no-email'}
// allow=${$ae_loc?.allow_access}
// last_cache_refresh=${last_cache_refresh_iso.toLocaleString()}
// data_route=${data?.route.toString() ?? 'unknown'}
// `;
let data_kv = {
external_client_id: data?.route.id,
name: `IDAA: ${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? ''}`,
description: activity_description ?? null,
object_type: 'idaa', // archive, post, event
// object_id: data?.route,
url_root: data?.url.origin,
// url_full_path: data?.url.href,
url_full_path: data?.url.pathname,
url_params: data?.url.searchParams.toString(),
action: action,
action_with: action_with ?? 'none',
meta_json: {
allow_access: $ae_loc?.allow_access,
last_cache_refresh: $ae_loc?.last_cache_refresh,
last_cache_refresh_iso: last_cache_refresh_iso.toISOString(),
last_cache_refresh_locale: last_cache_refresh_iso.toLocaleString(),
access_level: $ae_loc?.access_level,
iframe: $ae_loc?.iframe
// site_access_key: $ae_loc?.site_access_key,
// site_domain_access_key: $ae_loc?.site_domain_access_key,
// site_domain: $ae_loc?.site_domain,
// extra_data: extra_data ?? '',
// log_lvl: log_lvl,
}
};
// let data_kv = {
// external_client_id: data?.route.id,
// name: `IDAA: ${$idaa_loc.novi_full_name ?? 'none'} ${$idaa_loc.novi_email ?? ''}`,
// description: activity_description ?? null,
// object_type: 'idaa', // archive, post, event
// // object_id: data?.route,
// url_root: data?.url.origin,
// // url_full_path: data?.url.href,
// url_full_path: data?.url.pathname,
// url_params: data?.url.searchParams.toString(),
// action: action,
// action_with: action_with ?? 'none',
// meta_json: {
// allow_access: $ae_loc?.allow_access,
// last_cache_refresh: $ae_loc?.last_cache_refresh,
// last_cache_refresh_iso: last_cache_refresh_iso.toISOString(),
// last_cache_refresh_locale: last_cache_refresh_iso.toLocaleString(),
// access_level: $ae_loc?.access_level,
// iframe: $ae_loc?.iframe
// // site_access_key: $ae_loc?.site_access_key,
// // site_domain_access_key: $ae_loc?.site_domain_access_key,
// // site_domain: $ae_loc?.site_domain,
// // extra_data: extra_data ?? '',
// // log_lvl: log_lvl,
// }
// };
core_func.create_ae_obj__activity_log({
api_cfg: $ae_api,
account_id: $ae_loc.account_id,
data_kv: data_kv,
log_lvl: log_lvl
});
}
// core_func.create_ae_obj__activity_log({
// api_cfg: $ae_api,
// account_id: $ae_loc.account_id,
// data_kv: data_kv,
// log_lvl: log_lvl
// });
// }
let box: any;
let xLeft = $state(0);
@@ -184,51 +184,53 @@ afterNavigate(() => {
}
});
let iframe = $derived(data.url.searchParams.get('iframe'));
// let iframe = $derived(data.url.searchParams.get('iframe'));
$effect(() => {
if (browser && iframe == 'true') {
console.log('Use iframe layout!');
// data_struct['iframe'] = iframe;
$ae_loc.iframe = true;
// $effect(() => {
// if (browser && iframe == 'true') {
// console.log('Use iframe layout!');
// // data_struct['iframe'] = iframe;
// // $ae_loc.iframe = true;
document.getElementsByTagName('html')[0].classList.add('iframe');
// document.getElementsByTagName('html')[0].classList.remove('dark');
// document.getElementsByTagName('html')[0].classList.remove('light');
// // document.getElementsByTagName('html')[0].classList.add('iframe');
// // document.getElementsByTagName('html')[0].classList.remove('dark');
// // document.getElementsByTagName('html')[0].classList.remove('light');
// $ae_loc.app_cfg.show_element__access_type = false;
// $ae_loc.app_cfg.show_element__cfg = false;
} else if (browser && iframe == 'false') {
// data_struct['iframe'] = false;
$ae_loc.iframe = false;
// // $ae_loc.app_cfg.show_element__access_type = false;
// // $ae_loc.app_cfg.show_element__cfg = false;
// } else if (browser && iframe == 'false') {
// // data_struct['iframe'] = false;
// // $ae_loc.iframe = false;
document.getElementsByTagName('html')[0].classList.remove('iframe');
// data_struct['iframe'] = false;
// WHY: The root layout sets sys_menu.hide=true when iframe=true, but never
// restores it. We restore it here so the system bar reappears when the URL
// param is explicitly set to false (e.g. admin toggling embed mode off).
untrack(() => {
$ae_loc.sys_menu.hide = false;
});
}
});
// // document.getElementsByTagName('html')[0].classList.remove('iframe');
// // data_struct['iframe'] = false;
// // WHY: The root layout sets sys_menu.hide=true when iframe=true, but never
// // restores it. We restore it here so the system bar reappears when the URL
// // param is explicitly set to false (e.g. admin toggling embed mode off).
// untrack(() => {
// $ae_loc.sys_menu.hide = false;
// });
// }
// });
// When in iframe mode, the sys bar is hidden by default (it's nav chrome the host page
// doesn't need). However, trusted admins should still get the menu — they can't update
// the iframe src to pass show_menu=true, so we watch for trusted_access and unhide it.
$effect(() => {
if (browser && $ae_loc.iframe && $ae_loc.trusted_access) {
// WHY the guard: ae_loc is a tracked dep here (reads above). Writing
// $ae_loc.sys_menu.hide re-notifies this effect every run — infinite loop.
// untrack() does NOT help: it prevents new dep reads but the store still
// notifies already-subscribed effects after the write.
// The idempotent write guard breaks the cycle: run 2 finds the value
// already false, skips the write, no further re-queue.
if ($ae_loc.sys_menu.hide !== false) {
$ae_loc.sys_menu.hide = false;
}
}
});
// let show_menu = $derived(data.url.searchParams.get('show_menu'));
// $effect(() => {
// if (browser && $ae_loc.iframe && $ae_loc.trusted_access && show_menu === 'true') {
// // WHY the guard: ae_loc is a tracked dep here (reads above). Writing
// // $ae_loc.sys_menu.hide re-notifies this effect every run — infinite loop.
// // untrack() does NOT help: it prevents new dep reads but the store still
// // notifies already-subscribed effects after the write.
// // The idempotent write guard breaks the cycle: run 2 finds the value
// // already false, skips the write, no further re-queue.
// if ($ae_loc.sys_menu.hide !== false) {
// $ae_loc.sys_menu.hide = false;
// }
// }
// });
$effect(() => {
if (