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

Prettier for IDAA pages only

Browse Source
This commit is contained in:
Scott Idem
2026-03-24 12:28:07 -04:00
parent b74c6d0e9c
commit 12a9472064
39 changed files with 8673 additions and 8050 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,256 +1,280 @@
<script lang="ts">
let log_lvl: number = 0;
let log_lvl: number = 0;
// *** Import Svelte specific
import { browser } from '$app/environment';
import { afterNavigate } from '$app/navigation';
// *** Import Svelte specific
import { browser } from '$app/environment';
import { afterNavigate } from '$app/navigation';
// *** Import other supporting libraries
// import * as icons from '@lucide/svelte';
import { Brain, House, Library, RefreshCw, Satellite } from '@lucide/svelte';
// *** Import other supporting libraries
// import * as icons from '@lucide/svelte';
import { Brain, House, Library, RefreshCw, Satellite } from '@lucide/svelte';
// *** Import Aether specific variables and functions
import {
ae_snip,
ae_loc,
ae_sess,
ae_api,
ae_trig,
slct,
slct_trigger
} from '$lib/stores/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/stores/ae_idaa_stores';
import Element_data_store from '$lib/elements/element_data_store.svelte';
// *** Import Aether specific variables and functions
import {
ae_snip,
ae_loc,
ae_sess,
ae_api,
ae_trig,
slct,
slct_trigger
} from '$lib/stores/ae_stores';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/stores/ae_idaa_stores';
import Element_data_store from '$lib/elements/element_data_store.svelte';
interface Props {
/** @type {import('./$types').LayoutData} */
data: any;
children?: import('svelte').Snippet;
}
interface Props {
/** @type {import('./$types').LayoutData} */
data: any;
children?: import('svelte').Snippet;
}
let { data, children }: Props = $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 = `
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);
let xScroll = $state(0);
let xWidth = $state(0);
let yTop = $state(0);
let yScroll = $state(0);
let yHeight = $state(0);
let box: any;
let xLeft = $state(0);
let xScroll = $state(0);
let xWidth = $state(0);
let yTop = $state(0);
let yScroll = $state(0);
let yHeight = $state(0);
function parse_scroll() {
// console.log(`parse_scroll() called`);
xLeft = box.scrollLeft;
xScroll = box.scrollWidth;
xWidth = box.clientWidth;
yTop = box.scrollTop;
yHeight = box.clientHeight;
yScroll = box.scrollHeight;
// console.log(`parse_scroll() called: ${yTop}`);
}
function parse_scroll() {
// console.log(`parse_scroll() called`);
xLeft = box.scrollLeft;
xScroll = box.scrollWidth;
xWidth = box.clientWidth;
yTop = box.scrollTop;
yHeight = box.clientHeight;
yScroll = box.scrollHeight;
// console.log(`parse_scroll() called: ${yTop}`);
}
let is_safari = $state(/^((?!chrome|android).)*safari/i.test(navigator.userAgent));
let is_safari = $state(
/^((?!chrome|android).)*safari/i.test(navigator.userAgent)
);
let hide_scroll_btn = $state(true); // This is to hide the scroll to top button initially
let scroll_y = $state(0);
let hide_scroll_btn = $state(true); // This is to hide the scroll to top button initially
let scroll_y = $state(0);
function go_top() {
// document.body.scrollIntoView();
scroll_container().scrollIntoView();
}
function go_top() {
// document.body.scrollIntoView();
scroll_container().scrollIntoView();
}
function scroll_container() {
// console.log('Element', document.getElementById('ae_idaa__recovery_meetings'))
// return document.documentElement || document.body;
return document.getElementById('ae_idaa') || document.documentElement || document.body;
}
function scroll_container() {
// console.log('Element', document.getElementById('ae_idaa__recovery_meetings'))
// return document.documentElement || document.body;
return (
document.getElementById('ae_idaa') ||
document.documentElement ||
document.body
);
}
// function handle_on_scroll() {
// if (!scroll_container()) {
// return;
// }
// console.log(`Scroll position: ${scroll_container().scrollTop}`);
// function handle_on_scroll() {
// if (!scroll_container()) {
// return;
// }
// console.log(`Scroll position: ${scroll_container().scrollTop}`);
// let show_on_px = 500; // The scroll position at which the button will be shown
// let show_on_px = 500; // The scroll position at which the button will be shown
// if (scroll_container().scrollTop > show_on_px) {
// hide_scroll_btn = false;
// } else {
// hide_scroll_btn = true;
// }
// if (scroll_container().scrollTop > show_on_px) {
// hide_scroll_btn = false;
// } else {
// hide_scroll_btn = true;
// }
// }
$effect(() => {
// console.log(`idaa_root_layout.svelte`);
// if (scroll_y) {
// console.log(`Scroll position: ${scroll_y}`);
// // handle_on_scroll();
// }
$effect(() => {
// console.log(`idaa_root_layout.svelte`);
// if (scroll_y) {
// console.log(`Scroll position: ${scroll_y}`);
// // handle_on_scroll();
// }
// if (yTop) {
// console.log(`Scroll container top diff: ${yTop}`);
// }
// if (yTop) {
// console.log(`Scroll container top diff: ${yTop}`);
// }
// else {
// hide_scroll_btn = true; // Hide the button if scroll_y is 0
// }
// if (log_lvl > 1) {
// console.log(`idaa_root_layout.svelte: data:`, data);
// }
// else {
// hide_scroll_btn = true; // Hide the button if scroll_y is 0
// }
// if (log_lvl > 1) {
// console.log(`idaa_root_layout.svelte: data:`, data);
// }
// If the browser is Safari, we need to handle the scroll differently
if (is_safari) {
console.log('Safari detected, using special scroll handling');
$ae_loc.browser_type = 'safari';
}
// If the browser is Safari, we need to handle the scroll differently
if (is_safari) {
console.log('Safari detected, using special scroll handling');
$ae_loc.browser_type = 'safari';
// // Initial scroll position
// scroll_y = scroll_container().scrollTop;
// // Set up the scroll event listener
// window.addEventListener('scroll', () => {
// scroll_y = scroll_container().scrollTop;
// handle_on_scroll();
// });
});
// NOTE: Fires after every client-side navigation within the IDAA module.
// Scrolls the parent Novi page to show the top of the iframe so the user
// doesn't land in the middle of new content after clicking a post/meeting/archive.
// The individual detail pages also send scroll_to on load — this catches the
// cases they miss (e.g. navigating back to the list view).
afterNavigate(() => {
if ($ae_loc?.iframe) {
window.parent.postMessage({ scroll_to: 0 }, '*');
}
});
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;
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;
document.getElementsByTagName('html')[0].classList.remove('iframe');
// document.getElementsByTagName('html')[0].classList.add('light');
}
});
$effect(() => {
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
);
}
// // Initial scroll position
// scroll_y = scroll_container().scrollTop;
let iframe_height = 0;
// // Set up the scroll event listener
// window.addEventListener('scroll', () => {
// scroll_y = scroll_container().scrollTop;
// handle_on_scroll();
// });
});
// NOTE: Fires after every client-side navigation within the IDAA module.
// Scrolls the parent Novi page to show the top of the iframe so the user
// doesn't land in the middle of new content after clicking a post/meeting/archive.
// The individual detail pages also send scroll_to on load — this catches the
// cases they miss (e.g. navigating back to the list view).
afterNavigate(() => {
if ($ae_loc?.iframe) {
window.parent.postMessage({ scroll_to: 0 }, '*');
}
});
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;
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;
document.getElementsByTagName('html')[0].classList.remove('iframe');
// document.getElementsByTagName('html')[0].classList.add('light');
}
});
$effect(() => {
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
);
}
let iframe_height = 0;
if ($ae_loc.iframe_height > $ae_loc.iframe_height_modal_body) {
iframe_height = $ae_loc.iframe_height;
} else {
iframe_height = $ae_loc.iframe_height_modal_body;
// console.log($ae_loc.modal_dimensions);
if ($ae_loc.modal_dimensions && $ae_loc.modal_dimensions.header_height) {
iframe_height = iframe_height + $ae_loc.modal_dimensions.header_height;
}
if ($ae_loc.modal_dimensions && $ae_loc.modal_dimensions.footer_height) {
iframe_height = iframe_height + $ae_loc.modal_dimensions.footer_height;
}
// iframe_height = iframe_height + 50; // Just in case
}
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);
}
let iframe_height = 0;
if ($ae_loc.iframe_height > $ae_loc.iframe_height_modal_body) {
iframe_height = $ae_loc.iframe_height;
} else {
iframe_height = $ae_loc.iframe_height_modal_body;
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
// console.log($ae_loc.modal_dimensions);
if (
$ae_loc.modal_dimensions &&
$ae_loc.modal_dimensions.header_height
) {
iframe_height =
iframe_height + $ae_loc.modal_dimensions.header_height;
}
window.parent.postMessage({ iframe_height: iframe_height }, '*'); // This should be in pixels
if (
$ae_loc.modal_dimensions &&
$ae_loc.modal_dimensions.footer_height
) {
iframe_height =
iframe_height + $ae_loc.modal_dimensions.footer_height;
}
// iframe_height = iframe_height + 50; // Just in case
}
});
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);
}
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
}
});
</script>
<svelte:head>
@@ -261,18 +285,15 @@
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
referrerpolicy="no-referrer" />
{#if $ae_loc.iframe}
<!-- <meta name="robots" content="noindex, nofollow" /> -->
<link
href="https://assets-staging.noviams.com/novi-core-assets/css/fontawesome.css"
rel="stylesheet"
/>
rel="stylesheet" />
<link
href="https://assets-staging.noviams.com/novi-core-assets/css/c/idaa/idaa.css"
rel="stylesheet"
/>
rel="stylesheet" />
{/if}
</svelte:head>
@@ -287,11 +308,10 @@
class:iframe={$ae_loc?.iframe}
class="
ae_idaa
h-full max-h-fit max-w-6xl overflow-auto
flex flex-col gap-1
m-auto
"
>
m-auto flex h-full max-h-fit
max-w-6xl flex-col gap-1
overflow-auto
">
<nav
class="
module_header
@@ -303,8 +323,7 @@
p-1
px-2
pb-2
"
>
">
<span class="justify-self-start">
<!-- Be sure to explain what &AElig; (Aether) means in the title text or similar! -->
<Satellite size="1.5em" class="mx-1 inline-block text-gray-500" />
@@ -312,8 +331,7 @@
</span>
<a
href="/"
class="btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-filled-success-500"
>
class="btn btn-sm preset-tonal-surface border-surface-500 hover:preset-filled-success-500 border">
<House />
<span class="hidden md:inline"> Home </span>
</a>
@@ -324,29 +342,27 @@
class="
module_main_content main_content
grow
px-1 md:px-2 pb-28
flex flex-col gap-2 items-center justify-start
"
>
flex
grow flex-col items-center
justify-start gap-2 px-1 pb-28 md:px-2
">
{@render children?.()}
</section>
<section
class="module_footer footer_content flex text-sm sm:text-sm lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1 py-0.5 min-h-7"
class:ae_debug={$ae_loc?.debug}
>
class="module_footer footer_content lg:text-md xl:text-md flex min-h-7 px-1 py-0.5 text-sm text-slate-400 transition hover:text-slate-800 sm:text-sm 2xl:text-lg"
class:ae_debug={$ae_loc?.debug}>
<Element_data_store
ds_code="hub__site__appshell_footer"
ds_type="html"
class_li="grow flex flex-row justify-between"
/>
class_li="grow flex flex-row justify-between" />
</section>
</div>
<!-- </AppShell> -->
<!-- bottom-4 -->
<button type="button"
<button
type="button"
class="ae_idaa__recovery_meetings__scroll_top_btn btn btn-sm btn-secondary preset-tonal-surface fixed top-1/2 right-1 z-50 opacity-75 hover:opacity-100"
class:hidden={yTop < 750}
class:ae_btn_warning_outlined={is_safari}
@@ -386,8 +402,7 @@
window.parent.postMessage({ scroll_to: 0 }, '*'); // This should be in pixels
}
}}
title="Scroll to top"
>
title="Scroll to top">
<span class="fas fa-arrow-up"></span>
Scroll to Top
</button>