The posters look pretty good now. A lot more is configurable.
This commit is contained in:
@@ -124,6 +124,34 @@ let lq__event_obj = $derived(liveQuery(async () => {
|
||||
return results;
|
||||
}));
|
||||
|
||||
// Event Device
|
||||
let lq__event_device_obj = $derived(liveQuery(async () => {
|
||||
if (log_lvl) {
|
||||
console.log(`lq__event_device_obj: event_device_id = ${$events_slct?.event_device_id}`);
|
||||
}
|
||||
let results = await db_events.device
|
||||
.get($events_slct.event_device_id);
|
||||
if (log_lvl) {
|
||||
console.log(`lq__event_device_obj: results = `, results);
|
||||
}
|
||||
|
||||
// Check if results are different than the current session version stored under $events_slct
|
||||
if ($events_slct.event_device_obj && results) {
|
||||
if (JSON.stringify($events_slct.event_device_obj) !== JSON.stringify(results)) {
|
||||
$events_slct.event_device_obj = { ...results};
|
||||
if (log_lvl) {
|
||||
console.log(`Device slct stored version has changed for ID = ${$events_slct.event_device_id}`, $events_slct.event_device_obj);
|
||||
}
|
||||
} else {
|
||||
if (log_lvl > 1) {
|
||||
console.log(`Device slct stored version has not changed for ID = ${$events_slct.event_device_id}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}));
|
||||
|
||||
// Event File - For Event
|
||||
let lq__event_event_file_obj_li = $derived(liveQuery(async () => {
|
||||
let results = await db_events.file
|
||||
@@ -699,23 +727,23 @@ $effect(() => {
|
||||
</title>
|
||||
</svelte:head>
|
||||
|
||||
<!-- max-w-(--breakpoint-xl) -->
|
||||
<!-- outline-2 outline-red-500 -->
|
||||
<div
|
||||
class="
|
||||
static
|
||||
m-auto
|
||||
|
||||
border-x border-gray-200 dark:border-gray-600
|
||||
mt-12 mb-14 sm:mb-12
|
||||
mt-4 mb-16 sm:mb-12
|
||||
h-full
|
||||
w-full max-w-7xl
|
||||
outline
|
||||
transition-all
|
||||
"
|
||||
>
|
||||
|
||||
|
||||
<header
|
||||
id="Main-Header"
|
||||
class:hidden={$events_loc.launcher.hide__launcher_header}
|
||||
class="
|
||||
z-20
|
||||
absolute top-0 left-0 right-0
|
||||
@@ -913,6 +941,7 @@ $effect(() => {
|
||||
|
||||
<footer
|
||||
id="Main-Footer"
|
||||
class:hidden={$events_loc.launcher.hide__launcher_footer}
|
||||
class="
|
||||
z-20
|
||||
absolute bottom-0 left-0 right-0
|
||||
@@ -935,24 +964,25 @@ $effect(() => {
|
||||
[Help]
|
||||
</div> -->
|
||||
|
||||
<div class="slct_location_name">
|
||||
<div class="slct_location_name transition-all duration-1000">
|
||||
<span class="fas fa-map-marker-alt"></span>
|
||||
{$lq__event_location_obj?.name}
|
||||
{$lq__event_device_obj?.name}
|
||||
</div>
|
||||
|
||||
<span
|
||||
class="*:hover:inline px-1 rounded-md"
|
||||
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
|
||||
class:preset-tonal-success={$events_loc.launcher.ws_connect}
|
||||
class="group px-1 rounded-md transition-all duration-1000"
|
||||
>
|
||||
{#if $events_sess.launcher.ws_connect_status == 'connected'}
|
||||
<span class="fas fa-wifi mx-1"></span>
|
||||
<span class="hidden">
|
||||
<span class="hidden group-hover:inline">
|
||||
WebSocket Connected
|
||||
</span>
|
||||
{:else}
|
||||
<span class="fas fa-times mx-1"></span>
|
||||
<span class="hidden">
|
||||
<span class="hidden group-hover:inline">
|
||||
WebSocket Disconnected
|
||||
</span>
|
||||
{/if}
|
||||
@@ -1015,7 +1045,7 @@ $effect(() => {
|
||||
easing: sineIn
|
||||
}
|
||||
}
|
||||
width={'min-w-80 w-1/2 max-w-(--breakpoint-lg)'}
|
||||
width={'w-md'}
|
||||
bind:hidden={$events_loc.launcher.hide_drawer__cfg}
|
||||
id="sidebar1"
|
||||
>
|
||||
@@ -1023,9 +1053,9 @@ $effect(() => {
|
||||
<Launcher_cfg></Launcher_cfg>
|
||||
|
||||
|
||||
<hr />
|
||||
<hr class="my-2 border-gray-300 dark:border-gray-600" />
|
||||
|
||||
<div class="flex flex-row flex-wrap gap-0.5 items-center justify-center">
|
||||
<div class="flex flex-row flex-wrap gap-0.5 items-center justify-center max-w-md">
|
||||
<a href="/events/{$events_slct.event_id}" class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500">
|
||||
<span class="fas fa-search m-1"></span>
|
||||
Session Search
|
||||
@@ -1051,6 +1081,7 @@ $effect(() => {
|
||||
class="btn btn-sm variant-ghost-tertiary hover:variant-filled-tertiary"
|
||||
>Test 2</button> -->
|
||||
</div>
|
||||
|
||||
</Drawer>
|
||||
|
||||
|
||||
@@ -1120,7 +1151,7 @@ $effect(() => {
|
||||
min-w-full
|
||||
"
|
||||
bodyClass='p-0 overflow-y-auto overscroll-contain'
|
||||
headerClass={`fixed top-0 right-0 left-0 z-20 p-1 md:p-2 flex flex-row items-center justify-between ${$events_loc.launcher.controller == 'remote' ? 'hidden' : ''} bg-white dark:bg-gray-800 opacity-50`}
|
||||
headerClass={`fixed top-0 right-0 left-0 p-1 md:p-2 flex flex-row items-center ${$events_loc.launcher.controller == 'remote' ? 'hidden' : ''} bg-white dark:bg-gray-800 opacity-50 ${$events_loc.launcher.hide__modal_header_title ? 'justify-center' : 'justify-between'}`}
|
||||
footerClass='text-center'
|
||||
onclose={async () => {
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
@@ -1141,11 +1172,14 @@ $effect(() => {
|
||||
|
||||
{#snippet header()}
|
||||
<!-- <div class="flex flex-row items-center justify-between"> -->
|
||||
<h3 class="text-lg font-semibold">
|
||||
<h3
|
||||
class:hidden={$events_loc.launcher.hide__modal_header_title}
|
||||
class="text-lg font-semibold opacity-20 hover:opacity-100 transition-all">
|
||||
{$events_sess.launcher?.modal__title ?? 'Digital Poster Display'}
|
||||
</h3>
|
||||
<button
|
||||
type="button"
|
||||
class="btn flex-row-reverse group transition-all justify-self-end"
|
||||
onclick={() => {
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
if ($events_loc.launcher.controller == 'local_push' && $events_sess.launcher.ws_connect_status == 'connected') {
|
||||
@@ -1153,8 +1187,9 @@ $effect(() => {
|
||||
}}
|
||||
title="Close Modal"
|
||||
>
|
||||
<span class="fas fa-times m-1"></span>
|
||||
<span class="hidden ">Close</span>
|
||||
<span class="fas fa-times my-1.5"></span>
|
||||
<span class="hidden group-hover:inline">
|
||||
Close</span>
|
||||
</button>
|
||||
<!-- </div> -->
|
||||
{/snippet}
|
||||
@@ -1174,10 +1209,18 @@ $effect(() => {
|
||||
$events_sess.launcher.controller_trigger_send = true;
|
||||
// $events_sess.launcher.modal__open = false;
|
||||
}}
|
||||
class="absolute top-0 right-20 m-1 p-1 btn btn-sm preset-tonal-error hover:preset-filled-error-500"
|
||||
class="
|
||||
absolute top-0 right-12
|
||||
m-1 p-1
|
||||
btn btn-sm
|
||||
preset-tonal-error preset-outlined-error hover:preset-filled-success-200-800
|
||||
transition-all
|
||||
"
|
||||
class:hidden={$events_loc.launcher.controller != 'local_push' || $events_sess.launcher.ws_connect_status != 'connected'}
|
||||
title="Close the remote device's display of the poster"
|
||||
>
|
||||
<span class="fas fa-times m-1"></span>
|
||||
<span class="fas fa-tv"></span>
|
||||
Close Remote Poster Display Only
|
||||
</button>
|
||||
<!-- Open: {$ae_api.base_url} {$events_sess.launcher.modal__open_event_file_id} -->
|
||||
@@ -1206,10 +1249,18 @@ $effect(() => {
|
||||
$events_sess.launcher.controller_trigger_send = true;
|
||||
// $events_sess.launcher.modal__open = false;
|
||||
}}
|
||||
class="absolute bottom-0 left-20 m-1 p-1 btn btn-sm preset-tonal-error hover:preset-filled-error-500"
|
||||
class="
|
||||
absolute bottom-0 left-12
|
||||
m-1 p-1
|
||||
btn btn-sm
|
||||
preset-tonal-error preset-outlined-error hover:preset-filled-success-200-800
|
||||
transition-all
|
||||
"
|
||||
class:hidden={$events_loc.launcher.controller != 'local_push' || $events_sess.launcher.ws_connect_status != 'connected'}
|
||||
title="Close the remote device's display of the poster"
|
||||
>
|
||||
<span class="fas fa-times m-1"></span>
|
||||
<span class="fas fa-tv"></span>
|
||||
Close Remote Poster Display Only
|
||||
</button>
|
||||
|
||||
@@ -1222,11 +1273,25 @@ $effect(() => {
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
$events_sess.launcher.modal__event_file_obj = null;
|
||||
}}
|
||||
class="absolute bottom-0 right-20 m-1 p-1 btn btn-sm preset-tonal-warning hover:preset-tonal-warning border border-warning-500"
|
||||
class="
|
||||
absolute bottom-0 right-12
|
||||
m-1 p-1
|
||||
btn btn-sm
|
||||
preset-tonal-success preset-outlined-success hover:preset-filled-success-200-800
|
||||
transition-all
|
||||
"
|
||||
class:hidden={!$ae_loc.trusted_access && ($events_loc.launcher.controller != 'local_push' || $events_sess.launcher.ws_connect_status != 'connected')}
|
||||
title="Close this controller's local modal display of this poster"
|
||||
>
|
||||
<span class="fas fa-times m-1"></span>
|
||||
Close Controller Poster Only
|
||||
<span class="fas fa-list"></span>
|
||||
Close
|
||||
<!-- Controller -->
|
||||
<!-- Local -->
|
||||
Poster
|
||||
<!-- Here -->
|
||||
on This Device
|
||||
<!-- Only -->
|
||||
</button>
|
||||
|
||||
<!-- <svelte:fragment slot="footer">
|
||||
@@ -1264,6 +1329,7 @@ $effect(() => {
|
||||
type={'cmd'}
|
||||
bind:trigger_send={$events_sess.launcher.controller_trigger_send}
|
||||
|
||||
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}
|
||||
bind:hide__ws_commands={$events_loc.launcher.hide__ws_commands}
|
||||
|
||||
Reference in New Issue
Block a user