Trying to make the slightly newer event session search page load consistently.

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

@@ -8,10 +8,11 @@ import { sineIn } from 'svelte/easing';
 import { liveQuery } from "dexie";
 import { Drawer, Footer } from 'flowbite-svelte';
 import { ae_util } from '$lib/ae_utils/ae_utils';
-import { db_events } from "$lib/db_events";
-import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
+import { db_events } from '$lib/db_events';
+import { ae_snip, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger, time } from '$lib/ae_stores';
 import { events_loc, events_sess, events_slct, events_trigger, events_trig } from '$lib/ae_events_stores';
 
+import Element_websocket_v2 from '$lib/element_websocket_v2.svelte';
 import Event_launcher_menu from './launcher_menu.svelte';
 import Event_launcher_session_view from './launcher_session_view.svelte';
 
@@ -135,9 +136,10 @@ console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
         "
     >
     <h3 class="h4 text-center italic">&AElig; Presentation Launcher</h3>
-    <h2 class="h3 text-center">{$lq__event_obj?.name}</h2>
-    <h3 class="h4 text-center italic">{$lq__event_location_obj?.name}
-        {$events_slct.event_location_id}
+    <h2 class="h3 text-center">{$lq__event_obj.cfg_json?.short_name}</h2>
+    <h3 class="h4 text-center italic">
+        {$lq__event_location_obj?.name}
+        <!-- {$events_slct.event_location_id} -->
     </h3>
 </header>
 {/if}
@@ -276,8 +278,8 @@ console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
     [Help]
     </div>
 
-    <div>
-    [Session Name]
+    <div class="slct_location_name">
+    {$lq__event_location_obj?.name}
     </div>
 
     <div>
@@ -285,18 +287,27 @@ console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
     </div>
 
     <div>
-    [Recording]
+    {#if $events_loc.launcher?.av_recording}
+        <span class="fas fa-video"></span> AV Recording Active
+    {:else}
+        <span class="fas fa-video-slash"></span> AV Recording Inactive
+    {/if}
     </div>
 
-    <div>
-    [Date and Time]
+    <div class="current_datetime">
+        {ae_util.iso_datetime_formatter($time,'date_full_no_year')}
+        {#if $events_loc.launcher?.time_hours == 12}
+            {ae_util.iso_datetime_formatter($time,'time_12_long')}
+        {:else}
+        {ae_util.iso_datetime_formatter($time,'time_long')}
+        {/if}
     </div>
 </Footer>
 
 
 <Drawer
     bgColor="bg-blue"
-    class="bg-orange-100 opacity-75 hover:opacity-95 transition-all duration-1000"
+    class="bg-orange-100 opacity-90 hover:opacity-95 transition-all duration-1000"
     placement="left"
     transitionType="fly"
     transitionParams={
@@ -326,11 +337,71 @@ console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
         </button>
     </div>
 
-    <h3
+
+    <hr>
+
+    <section class="controller">
+        <h3>
+            <button
+                on:click={() => {
+                    $events_loc.launcher.show_section__controller = !$events_loc.launcher.show_section__controller;
+                }}
+                class="ae_btn btn_sm btn_seamless"
+                >
+                Controller:
+                {#if $events_loc.launcher.show_section__controller}
+                    <span class="fas fa-chevron-down"></span>
+                {:else}
+                    <span class="fas fa-chevron-right"></span>
+                {/if}
+            </button>
+        </h3>
+
+        <div
+            class:hidden={!$events_loc.launcher.show_section__controller}
+            >
+
+            <select
+                bind:value={$events_loc.launcher.controller}
+                class="select"
+                >
+                    <option value="local">Locally Controlled</option>
+                    <option value="remote">Remotely Controlled</option>
+                    <option value="local_push">Controller</option>
+            </select>
+
+            <input
+                bind:value={$events_loc.launcher.controller_group_code}
+                placeholder="Controller group code"
+                class="input"
+                >
+        </div>
+
+        {#if $events_loc.launcher.controller_group_code}
+            <!-- {$ae_api.base_url} -->
+            <Element_websocket_v2
+                ws_server={$ae_api.fqdn}
+                group_id={$events_loc.launcher.controller_group_code}
+                cmd={$events_loc.launcher.controller_cmd}
+                type={'cmd'}
+                trigger_send={$events_loc.launcher.controller_trigger_send}
+
+                />
+                <!-- on:ws_conn={handle_ws_conn} -->
+                <!-- on:ws_recv={handle_ws_recv} -->
+                <!-- on:ws_sent={handle_ws_sent} -->
+        {/if}
+    </section>
+
+    <hr>
+
+    <!-- <h3
         class="text-center mb-4 text-sm font-semibold"
         >
         Controller
-    </h3>
+    </h3> -->
+
+
 
     <h3
         class="text-center mb-4 text-sm font-semibold"
@@ -431,6 +502,10 @@ console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
     <pre class="text-xs">
         {JSON.stringify($events_loc.launcher, null, 2)}
     </pre>
+    <hr />
+    <pre class="text-xs">
+        {JSON.stringify($ae_api, null, 2)}
+    </pre>
 
     </div>
 </Drawer>