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

Work on bug fix or something for IDAA and the page not fully loading properly. Unsure if this is related to Novi permissions check?

Browse Source
This commit is contained in:
Scott Idem
2025-06-02 13:31:22 -04:00
parent eb32ae1eaa
commit a2e4c710a0
7 changed files with 122 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/lib/ae_stores.ts
View File

@@ -47,8 +47,8 @@ export let ae_snip = string_snippets;
// };
// Set the version for the app data. Changing this should force a notification and ask the user to clear and reload the page.
let ver = '2025-05-01_1445'; // KEEP: 2025-04-18_1335 and 2025-04-29_1545
let ver_idb = '2025-04-18_1100'; // Not currently used
let ver = '2025-05-01_1445'; // KEEP: 2025-05-01_1445
let ver_idb = '2025-05-01_1445'; // Not currently used
// *** BEGIN *** Longer-term app data. This should be stored to local storage.
const ae_app_local_data_defaults: key_val = {

179
src/routes/+layout.svelte
View File

@@ -2,7 +2,7 @@
/** @type {import('./$types').LayoutData} */
// /** @type {import('./$types').LayoutProps} */
let log_lvl: number = 0;
let log_lvl: number = 2;
// *** Import Svelte specific
// import { tick } from 'svelte';
@@ -15,16 +15,16 @@ import { AppShell, AppBar, initializeStores } from '@skeletonlabs/skeleton';
// Initialize the stores for Drawer, Modal, and Toast so they work throughout the app.
initializeStores();
// import { Modal } from '@skeletonlabs/skeleton';
import type {
ModalComponent
} from '@skeletonlabs/skeleton';
// import type {
// ModalComponent
// } from '@skeletonlabs/skeleton';
const modalRegistry: Record<string, ModalComponent> = {
// Set a unique modal ID, then pass the component reference
// modalComponentEditSponsorshipObj: { ref: ModalComponentEditSponsorshipObj },
// modalComponentTwo: { ref: ModalComponentTwo },
// ...
};
// const modalRegistry: Record<string, ModalComponent> = {
// // Set a unique modal ID, then pass the component reference
// // modalComponentEditSponsorshipObj: { ref: ModalComponentEditSponsorshipObj },
// // modalComponentTwo: { ref: ModalComponentTwo },
// // ...
// };
import {
ArrowBigRight,
// CircleX,
@@ -152,7 +152,7 @@ if (!$ae_loc?.site_cfg_json) {
// BEGIN: New Version Check:
if ($ae_loc && $ae_sess && ($ae_loc.ver != $ae_sess.ver)) {
if ($ae_loc && $ae_sess && ($ae_loc?.ver != $ae_sess?.ver)) {
if (log_lvl) {
console.log('ROOT: New version of the ae_loc (core local storage) available!!!');
console.log(`$ae_loc.ver: ${$ae_loc.ver} != $ae_sess.ver: ${$ae_sess.ver}`);
@@ -309,6 +309,9 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
if (log_lvl > 1) {
console.log(`ROOT: Last IDB reload is recent: ${$ae_loc.last_cache_refresh}`);
}
flag_expired = false;
$ae_loc.cache_expired = false;
}
}
// END: Expired Cache Check:
@@ -316,7 +319,7 @@ if (!$ae_loc?.last_cache_refresh) { // Default is null, currently...
// BEGIN: Access Checks:
// Updated 2024-11-21
if ($ae_loc.site_access_key || $ae_loc.site_domain_access_key) {
if ($ae_loc?.site_access_key || $ae_loc?.site_domain_access_key) {
// log_lvl = 2;
if (log_lvl > 1) {
console.log(`We need to do a current check against the allow_access value. site key: ${$ae_loc.site_access_key}, domain key: ${$ae_loc.site_domain_access_key}`);
@@ -366,28 +369,28 @@ if ($ae_loc.site_access_key || $ae_loc.site_domain_access_key) {
// }
// }
// This is mainly for Precon CHOW
if ($ae_loc?.site_cfg_json?.slct__sponsorship_cfg_id) {
$slct.sponsorship_cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
if ($ae_loc?.mod?.sponsorships) {
$ae_loc.mod.sponsorships.cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
} else {
$ae_loc.mod = {
...$ae_loc.mod,
sponsorships: {
cfg_id: $ae_loc.site_cfg_json.slct__sponsorship_cfg_id
}
};
}
} else if ($ae_loc?.sponsorship_cfg_id) {
$slct.sponsorship_cfg_id = $ae_loc.sponsorship_cfg_id;
$ae_loc.mod.sponsorships.cfg_id = $ae_loc.sponsorship_cfg_id;
} else {
if (log_lvl > 1) {
console.log(`No Sponsorship Config ID set.`);
}
}
// END: Special Checks
// // This is mainly for Precon CHOW
// if ($ae_loc?.site_cfg_json?.slct__sponsorship_cfg_id) {
// $slct.sponsorship_cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
// if ($ae_loc?.mod?.sponsorships) {
// $ae_loc.mod.sponsorships.cfg_id = $ae_loc.site_cfg_json.slct__sponsorship_cfg_id;
// } else {
// $ae_loc.mod = {
// ...$ae_loc.mod,
// sponsorships: {
// cfg_id: $ae_loc.site_cfg_json.slct__sponsorship_cfg_id
// }
// };
// }
// } else if ($ae_loc?.sponsorship_cfg_id) {
// $slct.sponsorship_cfg_id = $ae_loc.sponsorship_cfg_id;
// $ae_loc.mod.sponsorships.cfg_id = $ae_loc.sponsorship_cfg_id;
// } else {
// if (log_lvl > 1) {
// console.log(`No Sponsorship Config ID set.`);
// }
// }
// // END: Special Checks
// Root Svelte Layout Specific:
let trigger_clear_access: null|boolean = $state(null);
@@ -448,28 +451,11 @@ if (browser && flag_reload) {
function clear_idb() {
indexedDB.deleteDatabase('ae_archives_db'); // Archives module
// indexedDB.deleteDatabase('content'); // Archives module <-- WARNING
indexedDB.deleteDatabase('ae_core_db');
indexedDB.deleteDatabase('ae_events_db'); // Events module
// indexedDB.deleteDatabase('badges'); // Events module <-- WARNING
// indexedDB.deleteDatabase('devices'); // Events module <-- WARNING
// indexedDB.deleteDatabase('exhibits'); // Events module <-- WARNING
// indexedDB.deleteDatabase('exhibit_tracking'); // Events module
// indexedDB.deleteDatabase('files'); // Events module <-- WARNING
// indexedDB.deleteDatabase('locations'); // Events module <-- WARNING
// indexedDB.deleteDatabase('presentations'); // Events module <-- WARNING
// indexedDB.deleteDatabase('presenters'); // Events module <-- WARNING
// indexedDB.deleteDatabase('sessions'); // Events module <-- WARNING
// indexedDB.deleteDatabase('file'); // Core - Hosted Files module
indexedDB.deleteDatabase('ae_journals_db'); // Journals module
// indexedDB.deleteDatabase('journal_entry');
// indexedDB.deleteDatabase('notes');
indexedDB.deleteDatabase('ae_posts_db'); // Posts module
// indexedDB.deleteDatabase('comment'); // Posts module <-- WARNING
indexedDB.deleteDatabase('ae_sponsorships_db'); // Sponsorships module
// indexedDB.deleteDatabase('cfg'); // Sponsorships module <-- WARNING
// indexedDB.deleteDatabase('person'); // Core - People module
// indexedDB.deleteDatabase('user'); // Core - Not currently used
}
function clear_local() {
@@ -477,6 +463,7 @@ function clear_local() {
// localStorage.removeItem('ae_idaa_loc');
// localStorage.removeItem('ae_journals_loc');
// localStorage.removeItem('ae_events_loc');
$ae_loc.allow_access = false;
$ae_loc.authenticated_access = false;
$ae_loc.edit_mode = false;
@@ -862,6 +849,21 @@ $effect(() => {
</div>
</div>
<button
type="button"
onclick={() => {
window.location.reload();
}}
class="btn btn-sm m-1 variant-ghost-secondary hover:variant-ghost-warning hover:variant-outline-warning text-warning-800 hover:text-warning-900 transition-all"
title="Reload page to clear some caches and check for updates"
>
<!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCw class="mx-1" />
<span>
Reload
</span>
</button>
<button
type="button"
onclick={() => {
@@ -890,26 +892,13 @@ $effect(() => {
<!-- This is mainly for IDAA using iframes in the Novi site. -->
<div
class="text-center text-sm text-gray-500"
class:hidden={!$ae_loc.iframe}
class:hidden={!$ae_loc?.iframe}
>
<p>If you have tried the "Clear Cache and Reload" button, you may need to manually reload the page using your browser's reload button or by pressing <kbd>Ctrl</kbd> + <kbd>R</kbd> or <kbd>Cmd</kbd> + <kbd>R</kbd>.</p>
<p>This sometimes happens with new versions of the app or when in an iframe.</p>
</div>
<button
type="button"
onclick={() => {
window.location.reload();
}}
class="btn btn-sm m-1 variant-ghost-secondary hover:variant-ghost-warning hover:variant-outline-warning text-warning-800 hover:text-warning-900 transition-all"
title="Reload page to clear some caches and check for updates"
>
<!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCw class="mx-1" />
<span>
Reload
</span>
</button>
</div>
{:else if (browser && $ae_loc?.allow_access)}
@@ -920,10 +909,12 @@ $effect(() => {
{@render children?.()}
{:else if (browser || flag_reload)}
<span class="fas fa-spinner fa-spin"></span>
Loading...
<div class="flex flex-col items-center justify-center max-w-lg mx-auto space-y-6 border border-red-500 rounded-lg p-4 bg-green-50 dark:bg-green-900 m-8">
<div>
<span class="fas fa-spinner fa-spin mx-1"></span>
Page data is loading...
</div>
</div>
{/if}
{#if (browser) }
@@ -936,6 +927,54 @@ $effect(() => {
{:else}
<!-- Nothing to show -->
{/if}
{:else}
<div class="flex flex-col items-center justify-center max-w-lg mx-auto space-y-6 border border-red-500 rounded-lg p-4 bg-green-50 dark:bg-green-900 m-8">
<div>
<span class="fas fa-spinner fa-spin mx-1"></span>
Loading...
</div>
<button
type="button"
onclick={() => {
window.location.reload();
}}
class="btn btn-sm m-1 variant-ghost-secondary hover:variant-ghost-warning hover:variant-outline-warning text-warning-800 hover:text-warning-900 transition-all"
title="Reload page to clear some caches and check for updates"
>
<!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCw class="mx-1" />
<span>
Reload
</span>
</button>
<button
type="button"
onclick={() => {
console.log('Reloading page...');
// Clear the IndexedDB
clear_idb();
// Clear localStorage and sessionStorage
clear_local();
// clear_sess();
alert('IDB, Local, and Session Storage cleared. The page should now refresh on its own.');
window.location.reload();
}}
class="btn btn-sm m-1 variant-ghost-secondary hover:variant-ghost-warning hover:variant-outline-warning text-error-700 hover:text-error-900 transition-all text-wrap"
title="Reload and clear the page cache"
>
<!-- <span class="fas fa-sync mx-1"></span> -->
<RefreshCcwDot class="mx-1" />
<span>
Clear Cache and Reload
</span>
</button>
</div>
{/if}

4
src/routes/+layout.ts
View File

@@ -305,9 +305,7 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
}
// console.log(`ae_acct = `, ae_acct);
// WARNING: Precaution against shared data between sites and sessions.
// data_struct.ae_acct[ae_loc_init.account_id] = ae_acct;
// WARNING: Using the Account ID is a precaution against shared data between other accounts (sites and sessions).
data_struct[ae_loc_init.account_id] = ae_acct;
return data_struct;

6
src/routes/+page.ts
View File

@@ -1,7 +1,7 @@
/** @type {import('./$types').PageLoad} */
export function load() {
return {
ae_root_page_ts: true,
};
// return {
// ae_root_page_ts: true,
// };
}

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

@@ -1,8 +1,6 @@
<script lang="ts">
import { run } from 'svelte/legacy';
import { browser } from '$app/environment';
import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
import { idaa_loc, idaa_sess, idaa_slct } from '$lib/ae_idaa_stores';
@@ -45,7 +43,7 @@ if (browser) {
// Reminder: super > manager > administrator > trusted > public > authenticated > anonymous
// NOTE: This is checking if they are in an iframe *and* have a Novi UUID. We ignore the iframe mode for trusted and above (administrators, managers, etc).
if ($ae_loc.iframe && $idaa_loc?.novi_uuid?.length == 36 && $idaa_loc?.novi_email?.length > 3 && $idaa_loc?.novi_full_name?.length > 0) {
if ($ae_loc?.iframe && $idaa_loc?.novi_uuid?.length == 36 && $idaa_loc?.novi_email?.length > 3 && $idaa_loc?.novi_full_name?.length > 0) {
$ae_loc.access_type = 'authenticated';
$ae_loc.super_access = false;
$ae_loc.manager_access = false;
@@ -146,8 +144,6 @@ if (browser && iframe == 'true') {
}
run(() => {
if ($ae_loc.iframe && $ae_loc.iframe_height && $ae_loc.iframe_height_modal_body) {
if (log_lvl > 1) {
@@ -197,7 +193,7 @@ run(() => {
</svelte:head>
{#if ($ae_loc.trusted_access || ($ae_loc.authenticated_access && $idaa_loc.novi_uuid))}
{#if (browser && ($ae_loc.trusted_access || ($ae_loc.authenticated_access && $idaa_loc.novi_uuid)))}
<div
bind:clientHeight={$ae_loc.iframe_height}

0
src/routes/idaa/(idaa)/+page.svelte → src/routes/idaa/(idaa)/hold_+page.svelte
View File

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

@@ -29,7 +29,7 @@ let { data, children }: Props = $props();
</script>
<svelte:head>
<title>IDAA - {$idaa_loc.title ?? 'Æ loading...'}</title>
<title>IDAA - {$idaa_loc?.title ?? 'Æ loading...'}</title>
</svelte:head>
<Modal components={modalRegistry}
@@ -41,9 +41,9 @@ let { data, children }: Props = $props();
<!-- App Shell -->
<AppShell
regionPage={($ae_loc.iframe ? 'iframe' : '')}
slotHeader={($ae_loc.iframe ? 'iframe' : '')}
slotFooter={($ae_loc.iframe ? 'iframe' : '')}
regionPage={($ae_loc?.iframe ? 'iframe' : '')}
slotHeader={($ae_loc?.iframe ? 'iframe' : '')}
slotFooter={($ae_loc?.iframe ? 'iframe' : '')}
>
{#snippet header()}
@@ -102,7 +102,7 @@ let { data, children }: Props = $props();
<div
class="flex text-sm sm:text-sm md:text-md lg:text-md xl:text-md 2xl:text-lg text-slate-400 hover:text-slate-800 transition px-1"
class:ae_debug={$ae_loc.debug}
class:ae_debug={$ae_loc?.debug}
>
<Element_data_store