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

More work on the posters and Websockets

Browse Source
This commit is contained in:
Scott Idem
2025-10-13 17:19:32 -04:00
parent de071dae49
commit 8f7c1bf428
7 changed files with 108 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/lib/ae_events_stores.ts
View File

@@ -382,7 +382,10 @@ let events_session_data_struct: key_val = {
event_file_open: {}, // This is from the older Launcher.
native: {
},
modal__open: false,
modal__title: '',
modal__open_event_file_id: false,
modal__event_file_obj: null,
loading__session_li_status: null,
loading__session_id_status: null,

4
src/lib/element_websocket_v2.svelte
View File

@@ -23,12 +23,12 @@ interface Props {
let {
log_lvl = 0,
ws_connect = false,
ws_connect = $bindable(false),
ws_connect_status = $bindable(null),
ws_server = 'dev-api.oneskyit.com',
base_url = `wss://${ws_server}/ws`,
group_id = $bindable('ae-grp-99'),
client_id = Date.now(),
client_id = $bindable(Date.now()),
cmd = $bindable(null),
msg = $bindable(null),
type = null,

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

@@ -344,7 +344,7 @@ function handle_ws_recv(ws_recv_status: any) {
if ($events_loc.launcher.controller != 'remote') {
if (log_lvl) {
console.log('Controller is not set to remote. Ignoring command.', cmd);
console.log('Ignoring WS command. Launcher is not set to be remotely controlled.', cmd);
}
return;
}
@@ -440,17 +440,21 @@ function handle_ws_recv(ws_recv_status: any) {
clearInterval(idle_timer_interval);
$events_slct.event_file_id = obj_id;
$events_sess.launcher.modal__open = $events_slct.event_file_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__open_event_file_id = $events_slct.event_file_id;
// $events_sess.launcher.modal__event_file_obj = event_file_obj;
// $events_sess.launcher.modal__img_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
// $events_slct.event_file_obj = event_file_obj;
// $slct_trigger = 'event_file';
// $events_sess.launcher.event_file_open.open_status = 'open';
@@ -477,7 +481,11 @@ function handle_ws_recv(ws_recv_status: any) {
// let obj_id = obj_parts[1];
if (what == 'event_file_modal') {
$events_sess.launcher.modal__open = false;
$events_sess.launcher.modal__title = '';
$events_sess.launcher.modal__open_event_file_id = null;
$events_sess.launcher.modal__event_file_obj = null;
// $events_sess.launcher.modal__img_src = null;
// $events_slct.event_file_id = null;
// $slct_trigger = 'event_file';
// $events_sess.launcher.event_file_open.open_status = 'close';
@@ -523,6 +531,11 @@ $effect(() => {
$slct_trigger = null;
// handle_event_file_open();
}
// if ($events_sess.launcher.trigger_open_file) {
// $events_sess.launcher.trigger_modal_open_file = false;
// handle_event_file_open();
// }
});
$effect(() => {
@@ -1093,9 +1106,11 @@ $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} -->
<Modal
title={$events_sess.launcher?.modal__title}
bind:open={$events_sess.launcher.modal__open}
open={$events_sess.launcher?.modal__open_event_file_id}
autoclose={false}
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"
@@ -1103,7 +1118,8 @@ $effect(() => {
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"
on:close={async () => {
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') {
// // This should work....????
// console.log(`TEST - FAIL??? Local Push Controller Command: ae_close:event_file_modal`);
@@ -1140,14 +1156,14 @@ $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}
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}
{#if $events_sess.launcher.modal__open_event_file_id}
<img
src="{$ae_api.base_url}/event/file/{$events_sess.launcher.modal__open}/download?filename={$events_slct.event_file_obj.filename}&x_no_account_id_token=direct-download"
alt="Placeholder: /event/file/{$events_sess.launcher.modal__open}/download?filename={$events_slct.event_file_obj.filename}&x_no_account_id_token=direct-download"
class="margin-auto max-h-full max-w-full"
src="{$ae_api.base_url}/event/file/{$events_sess.launcher.modal__open_event_file_id}/download?filename={$events_slct.event_file_obj.filename}&x_no_account_id_token=direct-download"
alt="Placeholder: /event/file/{$events_sess.launcher.modal__open_event_file_id}/download?filename={$events_slct.event_file_obj.filename}&x_no_account_id_token=direct-download"
class="margin-auto min-h-28 max-h-full max-w-full"
/>
{:else}
<div class="flex flex-row items-center justify-center p-4">
@@ -1177,7 +1193,10 @@ $effect(() => {
<button
onclick={() => {
$events_sess.launcher.modal__open = false;
// $events_sess.launcher.modal__open = false;
$events_sess.launcher.modal__title = '';
$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:hidden={!$ae_loc.trusted_access && ($events_loc.launcher.controller != 'local_push' || $events_sess.launcher.ws_connect_status != 'connected')}
@@ -1203,6 +1222,9 @@ $effect(() => {
</Modal>
<!-- {:else}
{$events_sess.launcher.modal__open_event_file_id}
{/if} -->
{#if $events_loc.launcher.controller_group_code && $events_loc.launcher.ws_connect}
<!-- {$ae_api.base_url} -->

94
src/routes/events/[event_id]/(launcher)/launcher_file_cont.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
interface Props {
log_lvl?: number;
// *** Export/Exposed variables and functions for component
event_file_id: string;
event_file_obj: any;
// export let os: string = null;
max_filename_length?: number;
@@ -16,11 +16,16 @@ interface Props {
session_type?: string; // oral, poster, workshop, symposium, roundtable, other
open_method?: null|string; // modal, download, native open (download, cache, copy, open), URL
modal_title?: string;
modal__title?: any;
modal__open_event_file_id?: any;
modal__event_file_obj?: any;
}
let {
log_lvl = 0,
event_file_obj,
event_file_id,
event_file_obj = $bindable({}),
max_filename_length = 50,
hide_launch_icon = false,
hide_meta = false,
@@ -31,7 +36,11 @@ let {
btn_size = 'btn_md',
session_type = 'oral',
open_method = 'download',
modal_title = $bindable('')
modal_title = $bindable(''),
modal__title = $bindable(''),
modal__open_event_file_id = $bindable(null),
modal__event_file_obj = $bindable(null),
}: Props = $props();
// *** Import Svelte specific
@@ -51,6 +60,7 @@ 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
@@ -71,9 +81,9 @@ let screen_saver_exts = ['jpg', 'png', 'PNG', 'webp'];
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $events_loc.launcher.screen_saver_img_kv.push(event_file_obj);
// $events_loc.launcher.screen_saver_img_kv[event_file_obj.event_file_id_random] = event_file_obj;
// $events_loc.launcher.screen_saver_img_kv[event_file_id] = event_file_obj;
$events_loc.launcher.screen_saver_img_kv[event_file_obj.event_file_id_random] = Object.create(event_file_obj);
$events_loc.launcher.screen_saver_img_kv[event_file_id] = Object.create(event_file_obj);
// let temp_obj = Object.create(event_file_obj)
@@ -87,7 +97,7 @@ onMount(() => {
console.log(`Session Type: ${session_type}; Open Method: ${open_method}`);
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $events_loc.launcher.screen_saver_img_kv[event_file_obj.event_file_id_random] = event_file_obj;
// $events_loc.launcher.screen_saver_img_kv[event_file_id] = event_file_obj;
let temp_obj = Object.create(event_file_obj)
@@ -151,7 +161,7 @@ async function handle_open_file() {
console.log(`Cached hash file not found. Need to download from API server. Base URL ${$events_loc.launcher.api.base_url}`);
open_file_status = 'downloading_file';
open_file_status_message = 'Downloading file...';
let download_hash_file_to_cache_result = await native_app.download_hash_file_to_cache_v2({api_base_url: $events_loc.launcher.api.base_url, api_base_url_backup: $events_loc.launcher.api.base_url_backup, local_file_cache_path: $events_loc.launcher.local_file_cache_path, event_file_id: event_file_obj.event_file_id_random, hash: event_file_obj.hash_sha256, verify_hash: true, overwrite_existing: false});
let download_hash_file_to_cache_result = await native_app.download_hash_file_to_cache_v2({api_base_url: $events_loc.launcher.api.base_url, api_base_url_backup: $events_loc.launcher.api.base_url_backup, local_file_cache_path: $events_loc.launcher.local_file_cache_path, event_file_id: event_file_id, hash: event_file_obj.hash_sha256, verify_hash: true, overwrite_existing: false});
// console.log(download_hash_file_to_cache_result);
if (download_hash_file_to_cache_result) {
console.log('Hash file downloaded to cache.');
@@ -238,7 +248,7 @@ async function handle_open_file() {
// $events_loc.launcher.event_poster_file_type = 'video';
// }
// $events_loc.launcher.poster_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
// $events_loc.launcher.poster_src = `/event/file/${event_file_id}/download`;
// $events_loc.launcher.modal_title = modal_title;
// }
</script>
@@ -293,7 +303,7 @@ async function handle_open_file() {
<!-- First [WORKING!] - Handle opening using a modal. This applies to all Launcher app modes (default, onsite, native) -->
{#if (session_type == 'poster' || open_method == 'modal')}
<!-- <a
href="/event/file/{event_file_obj.event_file_id_random}/download"
href="/event/file/{event_file_id}/download"
download
class="ae_btn btn_info {btn_size}"
on:click|preventDefault={() => {handle_open_method_poster();}}
@@ -306,19 +316,28 @@ async function handle_open_file() {
<button
type="button"
onclick={() => {
$events_sess.launcher.modal__open = event_file_obj.event_file_id_random;
if (!modal_title) {
modal_title = event_file_obj.filename;
}
$events_sess.launcher.modal__title = modal_title;
// $events_sess.launcher.modal__img_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
// modal__title = modal_title;
modal__open_event_file_id = event_file_id;
modal__event_file_obj = event_file_obj;
$events_slct.event_file_id = event_file_obj.event_file_id_random;
// $events_sess.launcher.modal__open_event_file_id = event_file_id;
// $events_sess.launcher.modal__open = event_file_id;
// $events_sess.launcher.modal__open_event_file_id = event_file_id;
// $events_sess.launcher.modal__event_file_obj = event_file_obj;
if (!modal__title) {
modal__title = event_file_obj.filename;
}
// $events_sess.launcher.modal__title = modal__title;
// $events_sess.launcher.modal__img_src = `/event/file/${event_file_id}/download`;
$events_slct.event_file_id = event_file_id;
$events_slct.event_file_obj = event_file_obj;
// let as_modal_result = open_event_file_as_modal({
// event_file_id: event_file_obj.event_file_id_random,
// event_file_id: event_file_id,
// filename: event_file_obj.filename,
// extension: event_file_obj.extension,
// modal_title: modal_title
@@ -331,8 +350,8 @@ async function handle_open_file() {
// }
if ($events_loc.launcher.controller == 'local_push') {
console.log(`Local Push Controller Command: ae_open:event_file=${event_file_obj.event_file_id_random}`);
$events_sess.launcher.controller_cmd = `ae_open:event_file=${event_file_obj.event_file_id_random}`;
console.log(`Local Push Controller Command: ae_open:event_file=${event_file_id}`);
$events_sess.launcher.controller_cmd = `ae_open:event_file=${event_file_id}`;
$events_sess.launcher.controller_trigger_send = true;
// tick();
@@ -343,10 +362,10 @@ async function handle_open_file() {
data_kv: {
name: `Open Poster: ${event_file_obj.filename}`,
object_type: 'event_file',
object_id_random: event_file_obj.event_file_id_random,
object_id_random: event_file_id,
action: 'open_poster_w_controller',
meta_json: {
event_file_id: event_file_obj.event_file_id_random,
event_file_id: event_file_id,
filename: event_file_obj.filename,
extension: event_file_obj.extension,
modal_title: modal_title
@@ -361,15 +380,16 @@ async function handle_open_file() {
preset-tonal-primary border border-primary-500
min-w-96
"
title={`Open this file in a modal window:\n${event_file_obj.filename}\n[API] SHA256: ${event_file_obj.hash_sha256.slice(0, 10)}...\nHosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_obj.event_file_id_random}`}
title={`Open this file in a modal window:\n${event_file_obj.filename}\n[API] SHA256: ${event_file_obj.hash_sha256.slice(0, 10)}...\nHosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_id}`}
>
{#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_obj.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 --'}
</button>
@@ -377,7 +397,7 @@ async function handle_open_file() {
<!-- Second [NOT WORKING!!!] - Handle opening a file. This applies to all Launcher app modes (default, onsite, native) -->
{:else if ($events_loc.launcher.app_mode == 'native')}
<a
href="/event/file/{event_file_obj.event_file_id_random}/download?use_os=true"
href="/event/file/{event_file_id}/download?use_os=true"
download
class="ae_btn btn_info {btn_size}"
onclick={preventDefault(() => {handle_open_file();})}
@@ -392,7 +412,7 @@ async function handle_open_file() {
<!-- Third [NOT WORKING!!!] - Handle opening a file. This applies to all Launcher app modes (default, onsite, native) -->
<!-- {:else if ($events_loc.launcher.app_mode == 'onsite' && (event_file_obj.extension == 'ppt' || event_file_obj.extension == 'pptx') && event_file_obj.open_in_os == 'win')}
<a
href="/event/file/{event_file_obj.event_file_id_random}/download?use_os=true" download
href="/event/file/{event_file_id}/download?use_os=true" download
class="ae_btn btn_info {btn_size}"
on:click={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
@@ -415,8 +435,8 @@ async function handle_open_file() {
new_filename = event_file_obj.filename + 'win';
}
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
// ae_promises[event_file_id]
ae_promises[event_file_id] = api.download_hosted_file({
api_cfg: $ae_api,
hosted_file_id: event_file_obj.hosted_file_id_random, // +'x'
return_file: true,
@@ -425,7 +445,7 @@ async function handle_open_file() {
log_lvl: 1
});
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_obj.event_file_id_random, filename: event_file_obj.filename, auto_download: true }, '*');
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_id, filename: event_file_obj.filename, auto_download: true }, '*');
if ($events_loc.launcher.controller == 'local_push') {
console.log(`Local Push Controller Command: ae_download:hosted_file=${event_file_obj.hosted_file_id_random}`);
@@ -439,9 +459,9 @@ async function handle_open_file() {
preset-tonal-primary border border-primary-500
min-w-72 lg:min-w-96
"
title={`Download this file:\n${event_file_obj.filename}\n[API] SHA256: ${event_file_obj.hash_sha256.slice(0, 10)}...\nHosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_obj.event_file_id_random}`}
title={`Download this file:\n${event_file_obj.filename}\n[API] SHA256: ${event_file_obj.hash_sha256.slice(0, 10)}...\nHosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_id}`}
>
{#await ae_promises[event_file_obj.event_file_id_random]}
{#await ae_promises[event_file_id]}
<span class="text-sm">
<span class="fas fa-spinner fa-spin mx-0.5"></span>
<span class="">
@@ -503,8 +523,8 @@ async function handle_open_file() {
// new_filename = event_file_obj.filename + 'win';
// }
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
// ae_promises[event_file_id]
ae_promises[event_file_id] = api.download_hosted_file({
api_cfg: $ae_api,
hosted_file_id: event_file_obj.hosted_file_id_random, // +'x'
return_file: true,
@@ -513,7 +533,7 @@ async function handle_open_file() {
log_lvl: 1
});
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_obj.event_file_id_random, filename: event_file_obj.filename, auto_download: true }, '*');
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_id, filename: event_file_obj.filename, auto_download: true }, '*');
}}
class="event_file_os"
class:hidden="{hide_os || 1==1}"
@@ -532,7 +552,7 @@ async function handle_open_file() {
trigger_patch={ae_triggers.open_in_os}
api_cfg={$ae_api}
object_type={'event_file'}
object_id={event_file_obj.event_file_id_random}
object_id={event_file_id}
field_name={'open_in_os'}
field_type={'button'}
field_value={ae_tmp.value__open_in_os}
@@ -643,9 +663,9 @@ async function handle_open_file() {
<!-- {#if ($events_loc.launcher.app_mode == 'native' || $events_loc.launcher.app_mode == 'onsite')} -->
<!-- {#if (show_bak_download)} -->
<!-- <a href="/event/file/{event_file_obj.event_file_id_random}/download" class="event_file_download" class:hidden="{!show_bak_download}" title="Download with original filename and extension"><span class="fas fa-download"></span></a> -->
<!-- <a href="/event/file/{event_file_id}/download" class="event_file_download" class:hidden="{!show_bak_download}" title="Download with original filename and extension"><span class="fas fa-download"></span></a> -->
<!-- <a href="/event/file/{event_file_obj.event_file_id_random}/download?filename={event_file_obj.filename}&use_os=true" class="ae_btn btn_info {btn_size}">{event_file_obj.filename}</a> -->
<!-- <a href="/event/file/{event_file_id}/download?filename={event_file_obj.filename}&use_os=true" class="ae_btn btn_info {btn_size}">{event_file_obj.filename}</a> -->
<!-- {/if} -->
</span>
@@ -656,7 +676,7 @@ async function handle_open_file() {
// if (!confirm('Download file from API server?')) {
// return false;
// }
download_event_file({ 'event_file_id': event_file_obj.event_file_id_random, 'return_file': true, filename: event_file_obj.filename, auto_download: true, log_lvl: 1 });
download_event_file({ 'event_file_id': event_file_id, 'return_file': true, filename: event_file_obj.filename, auto_download: true, log_lvl: 1 });
}}
title="Download file from API server?"
>

1
src/routes/events/[event_id]/(launcher)/launcher_presenter_view.svelte
View File

@@ -78,6 +78,7 @@ let lq__event_file_obj_li = $derived(liveQuery(async () => {
>
<Event_launcher_file_cont
event_file_id={event_file_obj.event_file_id_random}
event_file_obj={event_file_obj}
hide_created_on={false}
show_bak_download={$ae_loc.trusted_access}

5
src/routes/events/[event_id]/(launcher)/launcher_presenter_view_posters.svelte
View File

@@ -77,6 +77,7 @@ let lq__event_file_obj_li = $derived(liveQuery(async () => {
class:hidden={!$events_loc.launcher.show_content__hidden_files && event_file_obj.hide}
>
<Event_launcher_file_cont
event_file_id={event_file_obj.event_file_id_random}
event_file_obj={event_file_obj}
hide_created_on={false}
hide_meta={true}
@@ -84,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}

5
src/routes/events/[event_id]/(launcher)/launcher_session_view.svelte
View File

@@ -335,12 +335,17 @@ let ae_promises: key_val = $state({});
>
<Event_launcher_file_cont
event_file_id={event_file_obj.event_file_id_random}
event_file_obj={event_file_obj}
hide_created_on={true}
show_bak_download={$ae_loc.trusted_access && $ae_loc.edit_mode}
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_session_obj?.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}
/>
<!-- <Launcher_file_cont {event_file_obj} hide_created_on={false} show_bak_download={($ae_loc.trusted_access || $events_loc.launcher.trusted_access)} open_file_as={$lq__event_session_obj.type_code} poster_title={$lq__event_session_obj.title} /> -->