More work on the new Launcher. Wrapping up for the day.

src/lib/ae_stores.ts

@@ -60,12 +60,20 @@ const ae_app_local_data_defaults: key_val = {
     cache_expired: false,
     ver: ver, // ver, // '2025-04-18_1100',
     ver_idb: ver_idb, // '2025-04-18_1100',
+
     name: 'Aether - App Hub (SvelteKit 2.x Svelte 4.x)',
+
     theme: 'light',
     theme_mode: 'light',
     theme_name: 'nouveau', // wintry
     iframe: false,
+
+    // disable_sys_header: false,
+    // disable_sys_nav: false,
+    // disable_sys_footer: false,
+
     browser_type: null, // Safari needs help with scrolling correctly in iframes.
+
     title: `OSIT's Æ`, // - Dev SvelteKit`, // Æ
 
     // debug_menu: false, // Flag show debug menu.
@@ -332,9 +340,9 @@ let ae_app_session_data_defaults: key_val = {
     ver_idb: ver_idb,
     log_lvl: 0,
 
-    // 'name': 'Aether App Template',
+    disable_sys_header: false,
-    // 'theme': 'light',
+    disable_sys_nav: false,
-    // 'account_id': ae_account_id,
+    disable_sys_footer: false,
 
     sys_menu: {
     },

src/routes/+layout.svelte

@@ -1080,7 +1080,7 @@ email = ${$ae_loc?.email}
 
                 window.location.reload();
             }}
-            class="btn btn-sm m-1 preset-tonal-secondary border border-secondary-500 hover:preset-tonal-warning border border-warning-500 hover:variant-outline-warning text-error-700 hover:text-error-900 transition-all text-wrap"
+            class="btn btn-sm m-1 preset-tonal-secondary border-secondary-500 hover:preset-tonal-warning border-warning-500 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> -->

src/routes/events/+layout.svelte

@@ -151,7 +151,7 @@ if (browser) {
         "
     >
 
-
+{#if !$ae_sess?.disable_sys_nav}
 <nav
     class="
         submenu
@@ -176,10 +176,12 @@ if (browser) {
             Events
         </abbr>
     </span>
+    {#if !$ae_sess?.disable_sys_header}
     <Element_data_store
-                ds_code="hub__site__appshell_header"
+        ds_code="hub__site__appshell_header"
-                ds_type="html"
+        ds_type="html"
-                />
+        />
+    {/if}
     <a
         href="/"
         class="btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-filled-success-500"
@@ -190,6 +192,7 @@ if (browser) {
         </span>
     </a>
 </nav>
+{/if}
 
 <section
     class:iframe={$ae_loc?.iframe}
@@ -240,6 +243,7 @@ if (browser) {
 </section>
 
 
+{#if !$ae_sess?.disable_sys_footer}
 <section
     class="footer_contenttext-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 py-0.5 min-h-7"
     class:ae_debug={$ae_loc.debug}
@@ -252,6 +256,7 @@ if (browser) {
         />
 
 </section>
+{/if}
 
 
 </div>

src/routes/events/[event_id]/(launcher)/launcher/+layout.svelte

@@ -41,6 +41,10 @@ $slct.account_id = data.account_id;
 let ae_acct = data[$slct.account_id];
 // console.log(`ae_acct = `, ae_acct);
 
+$ae_sess.disable_sys_nav = true;
+$ae_sess.disable_sys_header = true;
+$ae_sess.disable_sys_footer = true;
+
 // This is a just in case check...
 if (!$events_loc?.launcher) {
     $events_loc.launcher = {
@@ -92,10 +96,20 @@ let lq__event_obj = $derived(liveQuery(async () => {
     return results;
 }));
 
+// Event File - For Event
+let lq__event_event_file_obj_li = $derived(liveQuery(async () => {
+    let results = await db_events.files
+        .where('for_id_random')
+        .equals($events_slct.event_id ?? '')
+        .sortBy('filename');
+
+    return results;
+}));
+
 // Event File - For Location
 let lq__location_event_file_obj_li = $derived(liveQuery(async () => {
     let results = await db_events.files
-        // .where('event_session_id_random')
+        // .where('event_location_id_random')
         .where('for_id_random')
         .equals($events_slct.event_location_id ?? '')
         .sortBy('filename');
@@ -576,11 +590,16 @@ $effect(() => {
     </title>
 </svelte:head>
 
-<div class="static max-w-(--breakpoint-xl) m-auto border border-gray-200 dark:border-gray-600 mt-12 mb-14 sm:mb-12">
+<div
+    class="
+        static max-w-(--breakpoint-xl) m-auto border border-gray-200 dark:border-gray-600 mt-12 mb-14 sm:mb-12
+        h-full
+        "
+        >
 
 
 {#if !$lq__event_obj}
-<div class="flex flex-row items-center justify-center">
+<div class="flex flex-row gap-1 items-center justify-center">
     <span class="fas fa-spinner fa-spin mx-1"></span>
     <span>Loading...</span>
 </div>
@@ -614,9 +633,10 @@ $effect(() => {
 <div
     class="
         container h-full min-w-full w-full
-        flex flex-row flex-wrap sm:flex-nowrap gap-0
+        flex flex-col sm:flex-row flex-wrap sm:flex-nowrap gap-0
+        items-center
         justify-center
-        py-1 px-2
+        py-1 px-1
         bg-gray-100
         "
     >
@@ -624,11 +644,14 @@ $effect(() => {
 <section
     id="Main-Nav-Menu"
     class="event_launcher_menu
-        container h-full flex flex-col gap-2 py-1 px-1
+        container h-full
+        flex flex-col flex-wrap gap-1 items-center justify-start py-1 px-0.5
         basis-1/5
-        min-w-72
+        min-w-56 md:min-w-64 lg:min-w-72
         max-w-xs
-        border-r border-gray-200
+        border-gray-200
+        overflow-x-auto
+        overflow-y-auto
         "
     class:hidden={$events_loc.launcher.hide__launcher_menu}
     >
@@ -643,6 +666,7 @@ $effect(() => {
 
         lq__event_obj={lq__event_obj}
 
+        lq__event_event_file_obj_li={lq__event_event_file_obj_li}
         lq__location_event_file_obj_li={lq__location_event_file_obj_li}
 
         lq__event_location_obj={lq__event_location_obj}
@@ -669,6 +693,7 @@ $effect(() => {
         container h-full flex flex-col gap-1 py-1 px-2
         items-center
         basis-4/5
+        min-w-xs
         max-w-full
         overflow-y-auto
         "

src/routes/events/[event_id]/(launcher)/launcher_menu.svelte

@@ -2,6 +2,7 @@
 interface Props {
     data_url: any;
     lq__event_obj: any;
+    lq__event_event_file_obj_li: any;
     lq__location_event_file_obj_li: any;
     // lq__event_location_obj: any;
     // export let lq__event_location_obj_li: any;
@@ -15,6 +16,7 @@ interface Props {
 let {
     data_url,
     lq__event_obj,
+    lq__event_event_file_obj_li,
     lq__location_event_file_obj_li,
     // lq__event_location_obj,
     lq__event_location_obj_li,
@@ -74,67 +76,69 @@ let ae_promises: key_val = $state({
 </script>
 
 
-<section class="text-center space-y-1">
+<section
-
-<h2 class="">{$lq__event_obj?.cfg_json.short_name ?? 'loading...'}</h2>
-
-<button
-    onclick={() => {
-        $events_loc.launcher.show_content__hidden_files = !$events_loc.launcher.show_content__hidden_files;
-    }}
     class="
-        btn btn-sm
+        flex flex-col gap-1 items-center justify-center
-        text-xs
+        text-center
-        py-1 px-2
+        w-full max-w-full
-        preset-outlined-warning-200-800 preset-filled-warning-50-950
-        hover:preset-outlined-success-200-800 hover:preset-filled-success-100-900
-        w-1/2
-        transition-all
         "
-    >
+        >
-    {#if $events_loc.launcher.show_content__hidden_files}
-        <span class="fas fa-eye-slash m-1"></span>
-        Hide Files
-    {:else}
-        <span class="fas fa-eye m-1"></span>
-        All Files?
-    {/if}
 
-</button>
+<!-- <h2 class="text-sm font-semibold">{$lq__event_obj?.cfg_json.short_name ?? 'loading...'}</h2> -->
-<button
-    onclick={() => {
-        $events_loc.launcher.show_content__hidden_sessions = !$events_loc.launcher.show_content__hidden_sessions;
-    }}
-    class="
-        btn btn-sm
-        text-xs
-        py-1 px-2
-        preset-outlined-warning-200-800 preset-filled-warning-50-950
-        hover:preset-outlined-success-200-800 hover:preset-filled-success-100-900
-        w-1/2
-        transition-all
-        "
-    >
-    {#if $events_loc.launcher.show_content__hidden_sessions}
-        <span class="fas fa-eye-slash m-1"></span>
-        Hide Sessions
-    {:else}
-        <span class="fas fa-eye m-1"></span>
-        All Sessions?
-    {/if}
-</button>
 
+
+{#if $lq__event_event_file_obj_li}
+<div class="w-full text-center">
+    <!-- <div class="text-xs text-neutral-800/80">
+        <strong>
+        Event Files:
+        {#if $ae_loc.administrator_access}
+            ({$lq__event_event_file_obj_li?.length}&times;)
+        {/if}
+        </strong>
+    </div> -->
+    {#each $lq__event_event_file_obj_li as event_file_obj, index}
+        <button
+            disabled={!$ae_loc.trusted_access}
+            onclick={() => {
+                // ae_promises[event_file_obj.event_file_id_random]
+                ae_promises[event_file_obj?.event_file_id_random] = api.download_hosted_file({
+                    api_cfg: $ae_api,
+                    hosted_file_id: event_file_obj?.hosted_file_id_random,
+                    return_file: true,
+                    filename: event_file_obj?.filename,
+                    auto_download: true,
+                    log_lvl: 0
+                });
+            }}
+            class="
+                btn btn-sm
+                text-xs w-full
+                preset-tonal-primary
+                hover:preset-tonal-success
+                transition-all
+                "
+            >
+            <span class="fas fa-file-archive m-1 text-neutral-800/80"></span>
+            {event_file_obj?.filename}
+        </button>
+    {/each}
+</div>
+{/if}
+
+
+{#if $ae_loc.edit_mode}
 {#if $lq__event_location_obj_li && $lq__event_location_obj_li.length > 0}
-<div class="text-xs"><strong>
+<div class="text-xs text-neutral-800/80"><strong>
     Locations:
     {#if $ae_loc.administrator_access}
-        ({$lq__event_location_obj_li?.length})
+        ({$lq__event_location_obj_li?.length}&times;)
     {/if}
     <!-- This should fade out once the data is loaded. -->
     {#await ae_promises[slct_event_location_id]}
         <span class="fas fa-spinner fa-spin text-blue-500"></span>
     {:then result}
-        <span class="fas fa-check text-green-500"></span>
+        <span class="fas fa-check text-green-500/80"></span>
     {/await}
 </strong></div>
 <select
@@ -217,13 +221,17 @@ let ae_promises: key_val = $state({
     {/each}
 </select>
 {:else}
-<p class="text-sm">
+<div class="text-sm">
     No locations found.
-    Event ID: {$lq__event_obj?.id}
+    (Event ID: {$lq__event_obj?.id})
-</p>
+</div>
+{/if}
 {/if}
 
+
+
 {#if $lq__location_event_file_obj_li}
+<div class="w-full text-center">
 {#each $lq__location_event_file_obj_li as event_file_obj, index}
     <button
         disabled={!$ae_loc.trusted_access}
@@ -238,18 +246,25 @@ let ae_promises: key_val = $state({
                 log_lvl: 0
             });
         }}
-        class="btn btn-sm preset-tonal-primary border border-primary-500 hover:preset-filled-primary-500 text-xs py-1 px-2 w-full"
+        class="
+            btn btn-sm
+            text-xs w-full
+            preset-tonal-primary
+            hover:preset-tonal-success
+            transition-all
+            "
         >
-        <span class="fas fa-file-archive m-1"></span>
+        <span class="fas fa-file-archive m-1 text-neutral-800/80"></span>
-        {event_file_obj?.filename}aa
+        {event_file_obj?.filename}
     </button>
 {/each}
+</div>
 {/if}
 
 </section>
 
 
-<section class="text-center">
+<section class="text-center w-full max-w-full">
 
 {#if $lq__event_session_obj_li}
 <Menu_session_list_menu
@@ -260,4 +275,50 @@ let ae_promises: key_val = $state({
 
 </section>
 
-<!-- {/await} -->
+{#if $ae_loc.edit_mode}
+<section class="flex flex-row gap-2 items-center justify-center w-full max-w-full">
+    <button
+        onclick={() => {
+            $events_loc.launcher.show_content__hidden_files = !$events_loc.launcher.show_content__hidden_files;
+        }}
+        class="
+            btn btn-sm
+            text-xs
+            w-1/2 max-w-1/2
+            preset-tonal-warning
+            hover:preset-tonal-success
+            transition-all
+            "
+        >
+        {#if $events_loc.launcher.show_content__hidden_files}
+            <span class="fas fa-eye-slash m-1 text-neutral-800/80"></span>
+            Hide Files
+        {:else}
+            <span class="fas fa-eye m-1 text-neutral-800/80"></span>
+            All Files
+        {/if}
+
+    </button>
+    <button
+        onclick={() => {
+            $events_loc.launcher.show_content__hidden_sessions = !$events_loc.launcher.show_content__hidden_sessions;
+        }}
+        class="
+            btn btn-sm
+            text-xs
+            w-1/2 max-w-1/2
+            preset-tonal-warning
+            hover:preset-tonal-success
+            transition-all
+            "
+        >
+        {#if $events_loc.launcher.show_content__hidden_sessions}
+            <span class="fas fa-eye-slash m-1 text-neutral-800/80"></span>
+            Hide Sessions
+        {:else}
+            <span class="fas fa-eye m-1 text-neutral-800/80"></span>
+            All Sessions
+        {/if}
+    </button>
+</section>
+{/if}

src/routes/events/[event_id]/(launcher)/menu_session_list.svelte

@@ -50,20 +50,20 @@ let hover_timer: any = $state(null);
 
 
 {#if $lq__event_session_obj_li && $lq__event_session_obj_li.length > 0}
-<div class="text-xs"><strong>
+<div class="text-xs text-neutral-800/80 w-full max-w-full"><strong>
     Sessions:
     {#if $ae_loc.administrator_access}
-        ({$lq__event_session_obj_li?.length})
+        ({$lq__event_session_obj_li?.length}&times;)
     {/if}
     <!-- This should fade out once the data is loaded. -->
     {#await ae_promises.slct_event_session_id}
         <span class="fas fa-spinner fa-spin text-blue-500"></span>
     {:then result}
-        <span class="fas fa-check text-green-500"></span>
+        <span class="fas fa-check text-green-500/80"></span>
     {/await}
 </strong></div>
 <ul
-    class="space-y-1"
+    class="space-y-1 w-full max-w-full"
     >
     {#each $lq__event_session_obj_li as event_session_obj}
         <li>
@@ -133,7 +133,16 @@ let hover_timer: any = $state(null);
                     $events_sess.launcher.controller_trigger_send = true;
                 }
             }}
-            class="btn btn-sm hover:preset-filled-primary-500 overflow-hidden text-sm w-full max-w-full text-left transition-all rounded-md flex flex-row justify-between items-center"
+            class="
+                btn btn-sm hover:preset-filled-primary-500
+                overflow-hidden
+                text-sm
+                w-full max-w-full
+                text-left
+                transition-all
+                rounded-md
+                flex flex-row justify-between items-center
+                "
             class:preset-filled-primary-500={$events_slct.event_session_id === event_session_obj?.id}
             class:preset-tonal-secondary={$events_slct.event_session_id != event_session_obj?.id}
             class:border-secondary-500={$events_slct.event_session_id != event_session_obj?.id}

src/routes/events/[event_id]/+layout.svelte

@@ -31,9 +31,9 @@ if (log_lvl) {
 }
 
 if (log_lvl > 1) {
-    console.log(`event_id layout A: ${data.params.event_id}`);
+    console.log(`[event_id] +layout A: ${data.params.event_id}`);
-    console.log(`event_id layout B: ${ae_acct.slct.event_id}`);
+    console.log(`[event_id] +layout B: ${ae_acct.slct.event_id}`);
-    console.log(`event_id layout C: ${$events_slct.event_id}`);
+    console.log(`[event_id] +layout C: ${$events_slct.event_id}`);
 }
 
 // $: event_id = data.params.event_id;