Things are looking and working better. Note the Modal size is set to "". This allows it to stretch to the full width of the screen.
This commit is contained in:
@@ -437,15 +437,13 @@ function handle_ws_recv(ws_recv_status: any) {
|
||||
|
||||
// NOTE: This is not finished yet.
|
||||
if (obj_type == 'event_file') {
|
||||
// We are assuming this is for digital posters and needs to be opened in the modal.
|
||||
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
clearInterval(idle_timer_interval);
|
||||
$events_slct.event_file_id = obj_id;
|
||||
|
||||
|
||||
let modal_title = null;
|
||||
if (!modal_title) {
|
||||
modal_title = '*'; // event_file_obj.filename;
|
||||
}
|
||||
$events_sess.launcher.modal__title = modal_title;
|
||||
$events_sess.launcher.modal__title = $events_sess.launcher.modal__title ?? '*';
|
||||
|
||||
$events_sess.launcher.modal__open_event_file_id = $events_slct.event_file_id;
|
||||
// $events_sess.launcher.modal__event_file_obj = event_file_obj;
|
||||
@@ -1105,19 +1103,24 @@ $effect(() => {
|
||||
|
||||
|
||||
<!-- Main modal -->
|
||||
<!-- NOTE: The modal size is intentionally set to "". This makes it undefined and allows the modal to be as large as the content. -->
|
||||
<!-- bind:open={$events_sess.launcher.modal__open_event_file_id} -->
|
||||
<!-- {#if $events_sess.launcher.modal__open_event_file_id} -->
|
||||
<!-- **NOTE:** The modal size is intentionally set to "". This makes it undefined and allows the modal to be as large as the content. **NOTE** -->
|
||||
<!-- title={$events_sess.launcher?.modal__title} -->
|
||||
<Modal
|
||||
title={$events_sess.launcher?.modal__title}
|
||||
|
||||
open={$events_sess.launcher?.modal__open_event_file_id}
|
||||
autoclose={false}
|
||||
placement="top-center"
|
||||
size=""
|
||||
class="bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 rounded-lg border-gray-200 dark:border-gray-700 divide-gray-200 dark:divide-gray-700 shadow-md relative flex flex-col mx-auto w-full divide-y m-0"
|
||||
dialogClass="fixed top-0 start-0 end-0 h-modal md:inset-0 md:h-full z-50 w-full p-0 flex"
|
||||
classHeader="px-1 py-0 md:px-1 md:py-0 absolute top-0 start-0 end-0 bg-gray-200 dark:bg-gray-800 opacity-50 hover:opacity-75"
|
||||
bodyClass='p-0 flex-1 overflow-y-auto overscroll-contain'
|
||||
classBody="flex flex-col items-center p-0 md:px-0 py-0"
|
||||
class="
|
||||
bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200
|
||||
rounded-lg border-gray-200 dark:border-gray-700
|
||||
divide-y divide-gray-200 dark:divide-gray-700 shadow-md
|
||||
relative
|
||||
flex flex-col
|
||||
"
|
||||
bodyClass='p-0 overflow-y-auto overscroll-contain'
|
||||
headerClass='p-1 md:p-2 flex flex-row items-center justify-between'
|
||||
footerClass='text-center'
|
||||
onclose={async () => {
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
if ($events_loc.launcher.controller == 'local_push' && $events_sess.launcher.ws_connect_status == 'connected') {
|
||||
@@ -1135,6 +1138,26 @@ $effect(() => {
|
||||
}}
|
||||
>
|
||||
|
||||
{#snippet header()}
|
||||
<!-- <div class="flex flex-row items-center justify-between"> -->
|
||||
<h3 class="text-lg font-semibold">
|
||||
{$events_sess.launcher?.modal__title ?? 'Digital Poster Display'}
|
||||
</h3>
|
||||
<button
|
||||
type="button"
|
||||
onclick={() => {
|
||||
$events_sess.launcher.modal__open_event_file_id = null;
|
||||
if ($events_loc.launcher.controller == 'local_push' && $events_sess.launcher.ws_connect_status == 'connected') {
|
||||
}
|
||||
}}
|
||||
title="Close Modal"
|
||||
>
|
||||
<span class="fas fa-times m-1"></span>
|
||||
<span class="hidden ">Close</span>
|
||||
</button>
|
||||
<!-- </div> -->
|
||||
{/snippet}
|
||||
|
||||
<!-- <svelte:fragment slot="header">
|
||||
<div class="flex flex-row items-center justify-between">
|
||||
<h3 class="text-lg font-semibold">
|
||||
@@ -1156,7 +1179,7 @@ $effect(() => {
|
||||
<span class="fas fa-times m-1"></span>
|
||||
Close Remote Poster Display Only
|
||||
</button>
|
||||
Open: {$ae_api.base_url} {$events_sess.launcher.modal__open_event_file_id}
|
||||
<!-- Open: {$ae_api.base_url} {$events_sess.launcher.modal__open_event_file_id} -->
|
||||
<!-- /event/file/{$events_slct.event_file_obj.event_file_id_random}/download?filename={$events_slct.event_file_obj.filename}&x_no_account_id_token=direct-download -->
|
||||
<!-- <span class="aspect-9/16 max-h-96"> -->
|
||||
{#if $events_sess.launcher.modal__open_event_file_id}
|
||||
|
||||
@@ -60,7 +60,6 @@ import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_ev
|
||||
import { events_func } from '$lib/ae_events_functions';
|
||||
|
||||
import Element_ae_crud from '$lib/element_ae_crud.svelte';
|
||||
import { modal } from 'flowbite-svelte';
|
||||
|
||||
|
||||
// *** Functions and Logic
|
||||
@@ -384,12 +383,13 @@ async function handle_open_file() {
|
||||
>
|
||||
{#if (screen_saver_exts.includes(event_file_obj.extension))}
|
||||
<span class="fas fa-chart-bar m-1" class:hidden="{hide_launch_icon}"></span>
|
||||
Open Poster {event_file_id}
|
||||
Open Poster
|
||||
<!-- {event_file_id} -->
|
||||
{:else}
|
||||
<span class="fas fa-paper-plane m-1" class:hidden="{hide_launch_icon}"></span>
|
||||
{ae_util.shorten_filename({filename: event_file_obj.filename, max_length: max_filename_length})}
|
||||
{/if}
|
||||
{$events_sess.launcher.modal__open_event_file_id ?? '-- not set --'}
|
||||
<!-- {$events_sess.launcher.modal__open_event_file_id ?? '-- not set --'} -->
|
||||
</button>
|
||||
|
||||
|
||||
|
||||
@@ -85,6 +85,10 @@ let lq__event_file_obj_li = $derived(liveQuery(async () => {
|
||||
session_type={event_file_obj?.event_session_type_code ?? 'oral'}
|
||||
open_method={event_file_obj?.event_session_type_code == 'poster' ? 'modal' : null}
|
||||
modal_title={lq__event_presenter_obj?.event_presentation_name}
|
||||
|
||||
bind:modal__title={$events_sess.launcher.modal__title}
|
||||
bind:modal__open_event_file_id={$events_sess.launcher.modal__open_event_file_id}
|
||||
bind:modal__event_file_obj={$events_sess.launcher.modal__event_file_obj}
|
||||
/>
|
||||
</li>
|
||||
{/each}
|
||||
|
||||
@@ -2,9 +2,13 @@
|
||||
interface Props {
|
||||
// export let slct_event_presenter_id: string;
|
||||
lq__event_presenter_obj: any; // This is not actually the LiveQuery object. This was pulled from the list of presenters for a presentation. With Svelte 5 this should not matter.
|
||||
hide_name?: boolean;
|
||||
}
|
||||
|
||||
let { lq__event_presenter_obj }: Props = $props();
|
||||
let {
|
||||
lq__event_presenter_obj,
|
||||
hide_name = false
|
||||
}: Props = $props();
|
||||
|
||||
import type { key_val } from '$lib/ae_stores';
|
||||
// import { ae_util } from '$lib/ae_utils/ae_utils';
|
||||
@@ -39,7 +43,9 @@ let lq__event_file_obj_li = $derived(liveQuery(async () => {
|
||||
</script>
|
||||
|
||||
|
||||
<strong>
|
||||
<strong
|
||||
class:hidden={hide_name}
|
||||
>
|
||||
{#if lq__event_presenter_obj?.given_name && lq__event_presenter_obj?.given_name != 'Group'}
|
||||
<span class="fas fa-user"></span>
|
||||
{lq__event_presenter_obj?.full_name}
|
||||
|
||||
@@ -404,9 +404,30 @@ let ae_promises: key_val = $state({});
|
||||
|
||||
<span class="event_presentation_name grow">{event_presentation_obj?.name}</span>
|
||||
<!-- </div> -->
|
||||
|
||||
<!-- Yes, this is kind of inefficient, but it works for now. -->
|
||||
{#if $lq__event_presenter_obj_li}
|
||||
{#each $lq__event_presenter_obj_li as event_presenter_obj, index}
|
||||
{#if event_presenter_obj.event_presentation_id_random == event_presentation_obj.event_presentation_id_random}
|
||||
<span class="event_presentation_single_presenter italic text-sm text-gray-500">
|
||||
{#if $lq__event_presenter_obj_li[index]?.given_name && $lq__event_presenter_obj_li[index]?.given_name != 'Group'}
|
||||
<span class="fas fa-user"></span>
|
||||
{$lq__event_presenter_obj_li[index]?.full_name}
|
||||
{:else if $lq__event_presenter_obj_li[index]?.given_name == 'Group'}
|
||||
<span class="fas fa-users"></span>
|
||||
{$lq__event_presenter_obj_li[index]?.affiliations}
|
||||
{:else}
|
||||
--not set--
|
||||
{/if }
|
||||
|
||||
</span>
|
||||
{/if}
|
||||
{/each}
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<!-- The presenter list -->
|
||||
|
||||
{#if $lq__event_presenter_obj_li && $lq__event_presenter_obj_li.length}
|
||||
<ul class="event_presentation_presenter_list">
|
||||
{#each $lq__event_presenter_obj_li as event_presenter_obj, index}
|
||||
@@ -424,12 +445,14 @@ let ae_promises: key_val = $state({});
|
||||
{#if type_code == 'poster'}
|
||||
<Launcher_presenter_view_posters
|
||||
lq__event_presenter_obj={event_presenter_obj}
|
||||
hide_name={true}
|
||||
/>
|
||||
{:else}
|
||||
<Launcher_presenter_view
|
||||
lq__event_presenter_obj={event_presenter_obj}
|
||||
/>
|
||||
{/if}
|
||||
<!-- {index} -->
|
||||
</li>
|
||||
{/if}
|
||||
{/each}
|
||||
|
||||
Reference in New Issue
Block a user