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

More work on the WebSockets. Improved status and WS triggers. Better online/offline status.

Browse Source
This commit is contained in:
Scott Idem
2025-10-16 14:48:10 -04:00
parent 3d6b7c412c
commit 8d15a5ba0b
6 changed files with 189 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -46,6 +46,21 @@ import Element_websocket_v2 from '$lib/element_websocket_v2.svelte';
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
import {
// devicePixelRatio,
// innerHeight,
// innerWidth,
online,
// outerHeight,
// outerWidth,
// screenLeft,
// screenTop,
// scrollX,
// scrollY
} from 'svelte/reactivity/window';
// const online: ReactiveValue<boolean | undefined>;
$ae_sess.disable_sys_nav = true;
$ae_sess.disable_sys_header = true;
$ae_sess.disable_sys_footer = true;
@@ -1042,28 +1057,96 @@ $effect(() => {
</div>
<span
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
class:preset-tonal-success={$events_loc.launcher.ws_connect}
class:preset-tonal-warning={!$idle}
class:preset-tonal-success={$idle}
class="group px-1 rounded-md transition-all duration-1000"
title="The user is currently { $idle ? 'idle' : 'active' }"
>
{#if $events_sess.launcher.ws_connect_status == 'connected'}
<span class="fas fa-wifi mx-1"></span>
{#if $idle}
<span class="fas fa-bed mx-1"></span>
<span class="hidden group-hover:inline">
WebSocket Connected
Idle
</span>
{:else}
<span class="fas fa-times mx-1"></span>
<span class="fas fa-mouse-pointer mx-1"></span>
<span class="hidden group-hover:inline">
WebSocket Disconnected
Active
</span>
{/if}
</span>
<!-- Why does this not behave consistently???? Spent a few hours trying to make it work right. -->
<!-- {#if online.current}
online
{:else}
offline
{/if} -->
<!-- class:preset-tonal-warning={!online?.current} -->
<!-- class:preset-tonal-success={online?.current} -->
<span
class="group px-1 rounded-md transition-all duration-1000"
title="Online status = { online?.current }"
>
<!-- {@html online?.current ? '<span class="fas fa-wifi mx-1"></span> Online!' : '--'} -->
<span class="fas fa-wifi mx-1"></span>
{online?.current ? '' : 'Offline!'}
<!-- {@html online?.current ? '--' : 'No Connection'} -->
<!-- {@html online?.current ? '<span class="fas fa-wifi mx-1"></span> Online!' : '<span class="fas fa-times mx-1 text-red-700"></span> No Connection'} -->
<!-- current value data type = {online.current ? typeof(online.current) : 'null'} -->
<!-- {#if online?.current}
<span class="fas fa-wifi mx-1"></span>
<span class="hidden group-hover:inline">
Online
</span>
{:else}
<span class="fas fa-times mx-1 text-red-700"></span>
<span class="hidden group-hover:inline">
No Connection!
</span>
{/if} -->
<!-- {#if online.current === true}
<span class="fas fa-wifi mx-1"></span>
<span class="hidden group-hover:inline">
Online
</span>
{:else}
<span class="fas fa-times mx-1 text-red-700"></span>
<span class="hidden group-hover:inline">
No Connection!
</span>
{/if} -->
</span>
<span
class:hidden={!$events_loc.launcher.ws_connect}
class:preset-tonal-warning={$events_sess.launcher.ws_connect_status != 'connected'}
class:preset-tonal-success={$events_sess.launcher.ws_connect_status == 'connected'}
class="group px-1 rounded-md transition-all duration-1000"
title="WebSocket is { $events_sess.launcher.ws_connect_status == 'connected' ? 'connected' : 'disconnected' } API: {$ae_api?.base_url}"
>
{#if $events_sess.launcher.ws_connect_status == 'connected'}
<span class="fas fa-sitemap mx-1 text-green-700"></span>
<span class="hidden group-hover:inline">
WS Connected
</span>
{:else}
<span class="fas fa-times mx-1"></span>
<span class="hidden group-hover:inline">
WS Disconnected
</span>
{/if}
</span>
<span
class:hidden={$events_loc.launcher.app_mode != 'native'}
class="group px-1 rounded-md"
class="group px-1 rounded-md transition-all duration-1000"
class:preset-tonal-warning={!$events_sess.launcher?.av_recording_status}
class:preset-tonal-success={$events_sess.launcher?.av_recording_status}
title="Audio/Video recording is { $events_sess.launcher?.av_recording_status ? 'active' : 'inactive' }"
>
{#if $events_sess.launcher?.av_recording_status}
<span class="fas fa-video mx-1"></span>
@@ -1079,9 +1162,13 @@ $effect(() => {
</span>
<div class="current_datetime font-mono px-2 hover:font-bold hover:bg-white transition-all">
<span class="fas fa-calendar-alt"></span>
{ae_util.iso_datetime_formatter($time,'date_full_no_year')}
<span class="fas fa-clock"></span>
<span class="hidden md:inline">
<span class="fas fa-calendar-alt"></span>
{ae_util.iso_datetime_formatter($time,'date_full_no_year')}
</span>
<span class="hidden sm:inline">
<span class="fas fa-clock"></span>
</span>
{#if $events_loc.launcher?.time_hours == 12}
{ae_util.iso_datetime_formatter($time,'time_12_long')}
{:else}
@@ -1407,6 +1494,9 @@ $effect(() => {
type={'cmd'}
bind:trigger_send={$events_sess.launcher.controller_trigger_send}
bind:trigger_connect={$events_sess.launcher.trigger__ws_connect}
bind:trigger_disconnect={$events_sess.launcher.trigger__ws_disconnect}
bind:hide__ws_element={$events_loc.launcher.hide__ws_element}
bind:hide__ws_form={$events_loc.launcher.hide__ws_form}
bind:hide__ws_messages={$events_loc.launcher.hide__ws_messages}