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

Lots of work on the new Launcher. Also general reorganizing of files.

Browse Source
This commit is contained in:
Scott Idem
2024-09-24 16:55:23 -04:00
parent bd2583fde3
commit 476b303da4
23 changed files with 2221 additions and 684 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -0,0 +1,231 @@
<script lang="ts">
/** @type {import('./$types').LayoutData} */
export let data: any;
let log_lvl = 0;
import { onMount } from 'svelte';
import { liveQuery } from "dexie";
import { ae_util } from '$lib/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 { events_loc, events_sess, events_slct, events_trigger, events_trig } from '$lib/ae_events_stores';
import Event_launcher_menu from './launcher_menu.svelte';
import Event_launcher_session_view from './launcher_session_view.svelte';
// import { AppShell, AppBar, initializeStores } from '@skeletonlabs/skeleton';
// import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// import { events_loc, events_slct } from '$lib/ae_events_stores';
// Variables
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
// console.log(`$slct.account_id = `, $slct.account_id);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
console.log(`event_id: ${data.params.event_id}`);
$events_slct.event_id = data.params.event_id;
console.log(`event_location_id: ${data.params.event_location_id}`);
$events_slct.event_location_id = data.params.event_location_id;
console.log(`ae_acct.slct.event_id:`, ae_acct.slct.event_id);
$events_slct.event_id = ae_acct.slct.event_id;
// $events_slct.event_obj = ae_acct.slct.event_obj;
$events_slct.event_location_obj_li = ae_acct.slct.event_location_obj_li ?? [''];
$events_slct.id_li__event_location = ae_acct.slct.id_li__event_location ?? [''];
console.log(`$events_slct.event_location_obj_li:`, $events_slct.event_location_obj_li);
// Event
$: lq__event_obj = liveQuery(async () => {
let results = await db_events.events
.get($events_slct.event_id);
return results;
});
// Event File - For Location
$: lq__location_event_file_obj_li = liveQuery(async () => {
let results = await db_events.files
// .where('event_session_id_random')
.where('for_id_random')
.equals($events_slct.event_location_id ?? '')
.sortBy('filename');
return results;
});
// Event Location
$: lq__event_location_obj = liveQuery(async () => {
let results = await db_events.locations
.get($events_slct.event_location_id);
return results;
});
$: lq__event_location_obj_li = liveQuery(async () => {
let results = await db_events.locations
.where('event_id')
.equals($events_slct.event_id)
.sortBy('name');
return results;
});
// Event Session
$: lq__event_session_obj = liveQuery(async () => {
let results = await db_events.sessions
.get($events_slct.event_session_id);
return results;
});
$: lq__event_session_obj_li = liveQuery(async () => {
let results = await db_events.sessions
// .bulkGet(event_session_id_random_li);
.where('event_location_id')
.equals($events_slct.event_location_id)
.sortBy('name');
return results;
});
onMount(() => {
console.log('Events - Launcher: +layout.svelte');
// Hide the AppShell shell header (id="shell-header") and footer
document.getElementById('shell-header').classList.add('hidden');
document.getElementById('shell-footer').classList.add('hidden');
});
console.log(`BROWSER Events - [event_id] launcher +layout.svelte start`);
</script>
<svelte:head>
<title>
Launcher:
{ae_util.shorten_string({ string: $lq__event_obj?.name ?? '', max_length: 20, begin_length: 10, end_length: 4 })}
({$lq__event_obj?.event_id ?? 'loading...'}) - Pres Mgmt - {$ae_loc?.title}
</title>
</svelte:head>
{#if !$lq__event_obj}
<div class="flex flex-row items-center justify-center">
<span class="fas fa-spinner fa-spin mx-1"></span>
<span>Loading...</span>
</div>
{:else}
<header id="Main-Header" class="flex flex-row items-center justify-evenly">
<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}
</h3>
</header>
{/if}
<!-- The menu should be to the left of the main session view. -->
<div
class="
container h-full min-w-full w-full
flex flex-row flex-wrap sm:flex-nowrap gap-0
justify-center
py-1 px-2 pb-16
bg-gray-100
"
>
<section
id="Main-Nav-Menu"
class="event_launcher_menu
container h-full flex flex-col gap-2 py-1 px-1
basis-1/5
min-w-72
max-w-xs
border-r border-gray-200
"
>
<!-- {#await $events_slct.id_li__event_location}
Loading location list... a
{:then event_location_obj_li} -->
<!-- {#if $lq__event_obj && $lq__event_location_obj_li && $lq__event_session_obj_li && event_location_obj_li && event_location_obj_li.length > 0} -->
{#if $lq__event_obj && $lq__event_location_obj_li}
<Event_launcher_menu
bind:data_url={data.url}
lq__event_obj={lq__event_obj}
lq__location_event_file_obj_li={lq__location_event_file_obj_li}
lq__event_location_obj={lq__event_location_obj}
lq__event_location_obj_li={lq__event_location_obj_li}
lq__event_session_obj={lq__event_session_obj}
lq__event_session_obj_li={lq__event_session_obj_li}
>
</Event_launcher_menu>
{:else}
<div class="flex flex-row items-center justify-center">
<span class="fas fa-spinner fa-spin mx-1"></span>
<span>Loading location list...</span>
</div>
{/if}
<!-- {/await} -->
<!-- Root: slct Location ID: {$events_slct.event_location_id ?? '-- not set --'} -->
</section>
<section
id="Main-Content"
class="event_launcher_main
container h-full flex flex-col gap-1 py-1 px-2
items-center
basis-4/5
max-w-full
"
>
<!-- {#if $events_trigger == 'load__event_session_obj' && $events_slct.event_session_id}
<Event_launcher_session_view
slct_event_session_id={$events_slct.event_session_id}
lq__event_location_obj={lq__event_location_obj}
lq__event_location_obj_li={lq__event_location_obj_li}
lq__event_session_obj={lq__event_session_obj}
lq__event_session_obj_li={lq__event_session_obj_li}
>
</Event_launcher_session_view>
{/if} -->
<!-- {$lq__event_session_obj?.name} -->
{#if !$events_slct.event_location_id}
<div class="flex flex-row items-center justify-center">
<span class="fas fa-exclamation mx-1"></span>
<span>You must select a location first</span>
<span class="fas fa-exclamation mx-1"></span>
</div>
{/if}
{#if $events_slct.event_session_id && $lq__event_session_obj}
<Event_launcher_session_view
slct_event_session_id={$events_slct.event_session_id}
lq__event_location_obj={lq__event_location_obj}
lq__event_session_obj={lq__event_session_obj}
>
</Event_launcher_session_view>
{/if}
</section>
</div>
<slot />

78
src/routes/events/[event_id]/(launcher)/+layout.ts Normal file
View File

@@ -0,0 +1,78 @@
/** @type {import('./$types').LayoutLoad} */
console.log(`Events - [event_id] launcher +layout.ts start`);
import { error } from '@sveltejs/kit';
import { browser } from '$app/environment';
import { events_func } from '$lib/ae_events_functions';
export async function load({ params, parent }) { // route
let log_lvl = 0;
let data = await parent();
// console.log(`ae events_pres_mgmt event [event_id] +page.ts data:`, data);
data.log_lvl = log_lvl;
let account_id = data.account_id;
let ae_acct = data[account_id];
// console.log(`ae_acct = `, ae_acct);
// if (!account_id) {
// console.log(`events_pres_mgmt_event [event_id] +page.ts: The account_id was not found in the data!!!`);
// return false;
// }
// data.ae_events_pres_mgmt_event_event_id_page_ts = true;
let event_id = params.event_id;
if (!event_id) {
console.log(`ae Events - [event_id] +page.ts: The event_id was not found in the params.event_id!!!`);
error(404, {
message: 'Event ID not found'
});
}
// ae_acct.slct.event_id = event_id;
// let load_event_obj = events_func.handle_load_ae_obj_id__event({
// api_cfg: ae_acct.api, event_id: event_id, try_cache: true
// });
// ae_acct.slct.event_obj = await load_event_obj;
if (browser) {
console.log(`BROWSER Events - [event_id] launcher +layout.ts start`);
let load_event_obj = events_func.handle_load_ae_obj_id__event({
api_cfg: ae_acct.api, event_id: event_id, try_cache: true
});
console.log(`load_event_obj = `, load_event_obj);
ae_acct.slct.event_obj = load_event_obj;
// let load_event_session_obj_li = events_func.load_ae_obj_li__event_session({
// api_cfg: ae_acct.api,
// for_obj_type: 'event',
// for_obj_id: event_id,
// params: {qry__enabled: 'enabled', qry__hidden: 'all', qry__limit: 200},
// try_cache: true,
// log_lvl: 1
// });
// console.log(`load_event_session_obj_li = `, load_event_session_obj_li);
// ae_acct.slct.event_session_obj_li = load_event_session_obj_li;
let load_event_location_obj_li = events_func.load_ae_obj_li__event_location({
api_cfg: ae_acct.api,
for_obj_type: 'event',
for_obj_id: event_id,
params: {qry__enabled: 'enabled', qry__hidden: 'all', qry__limit: 200},
try_cache: true,
log_lvl: 1
});
console.log(`load_event_location_obj_li = `, load_event_location_obj_li);
ae_acct.slct.event_location_obj_li = load_event_location_obj_li;
}
// WARNING: Precaution against shared data between sites and sessions.
data[account_id] = ae_acct;
return data;
}

6
src/routes/events/[event_id]/(launcher)/launcher/+page.svelte Normal file
View File

@@ -0,0 +1,6 @@
<script lang="ts">
</script>
A location is required

0
src/routes/events/[event_id]/(launcher)/launcher/+page.ts Normal file
View File

249
src/routes/events/[event_id]/(launcher)/launcher/[event_location_id]/+page.svelte Normal file
View File

@@ -0,0 +1,249 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
// Imports
import { browser } from '$app/environment';
import { onMount } from 'svelte';
// import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
// import { api } from '$lib/api';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store_v2.svelte';
import { liveQuery } from "dexie";
// import { core_func } from '$lib/ae_core_functions';
// import { db_core } from "$lib/db_core";
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 { events_loc, events_sess, events_slct, events_trigger, events_trig } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import { kill_processes, open_local_file_v2, run_cmd, run_cmd_sync, run_osascript, get_device_info } from '$lib/electron_relay.js';
// import Event_launcher_menu from '../../launcher_menu.svelte';
// import Event_launcher_session_view from '../../launcher_session_view.svelte';
// import native_app from '$lib/electron_native.js';
// Exports
// Variables
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
// console.log(`$slct.account_id = `, $slct.account_id);
let ae_acct = data[$slct.account_id];
// console.log(`ae_acct = `, ae_acct);
// $ae_loc.url_origin = data.url.origin;
// if (browser) {
// console.log(`Browser: ${browser}`);
// events_func.db_save_ae_obj_li__event_location({
// obj_type: 'event_location',
// obj_li: ae_acct.slct.event_location_obj_li
// });
// events_func.db_save_ae_obj_li__event_session({
// obj_type: 'event_session',
// obj_li: ae_acct.slct.event_session_obj_li
// });
// }
console.log(`event_id: ${data.params.event_id}`);
$events_slct.event_id = data.params.event_id;
console.log(`event_location_id: ${data.params.event_location_id}`);
$events_slct.event_location_id = data.params.event_location_id;
// console.log(`ae_acct.slct.event_id:`, ae_acct.slct.event_id);
// $events_slct.event_id = ae_acct.slct.event_id;
// $events_slct.event_obj = ae_acct.slct.event_obj;
$events_slct.event_location_obj_li = ae_acct.slct.event_location_obj_li ?? [''];
$events_slct.id_li__event_location = ae_acct.slct.id_li__event_location ?? [''];
console.log(`$events_slct.event_location_obj_li:`, $events_slct.event_location_obj_li);
$events_slct.event_session_obj_li = ae_acct.slct.event_session_obj_li ?? [''];
$events_slct.id_li__event_session = ae_acct.slct.id_li__event_session ?? [''];
// $events_trig = ae_acct.trig;
// $events_trig.event_location_li = true;
// $events_trig.event_session_li = true;
// $events_trigger = 'event_location_li';
// Set the local storage values
if (!$events_loc.launcher) {
$events_loc.launcher = {};
$events_loc.launcher.slct = {
event_id: null,
};
$events_loc.launcher.show_content__session_code = true;
$events_loc.launcher.show_content__presentation_code = true;
$events_loc.launcher.show_content__presenter_code = true;
}
if (!$events_loc.launcher.slct) {
$events_loc.launcher.slct = {
event_id: null,
event_location_id: null,
event_session_id: null,
event_presentation_id: null,
event_presenter_id: null,
};
}
// if (browser) {
// console.log(`data.url.searchParams.get('location_id') = `, data.url.searchParams.get('location_id'));
// }
// if (ae_acct.slct.event_id) {
// $events_loc.launcher.slct.event_id = ae_acct.slct.event_id;
// }
// if (ae_acct.slct.event_location_id) {
// $events_loc.launcher.slct.event_location_id = ae_acct.slct.event_location_id;
// }
// if (ae_acct.slct.event_session_id) {
// $events_loc.launcher.slct.event_session_id = ae_acct.slct.event_session_id;
// }
// if (ae_acct.slct.event_presentation_id) {
// $events_loc.launcher.slct.event_presentation_id = ae_acct.slct.event_presentation_id;
// }
// if (ae_acct.slct.event_presenter_id) {
// $events_loc.launcher.slct.event_presenter_id = ae_acct.slct.event_presenter_id;
// }
// Set the session storage values
if (!$events_sess.launcher) {
$events_sess.launcher = {};
}
$events_sess.launcher.show_content__session_code = true;
$events_sess.launcher.show_content__presentation_code = true;
$events_sess.launcher.show_content__presenter_code = true;
// Process the location list to pull out just the IDs.
// let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
// let bi_id_li__event_location: string[] = [];
// for (let i = 0; i < $events_slct.event_location_obj_li.length; i++) {
// let event_location_obj = $events_slct.event_location_obj_li[i];
// let event_location_id_random = event_location_obj.event_location_id_random;
// tmp_li.push(event_location_id_random);
// }
// bi_id_li__event_location = tmp_li;
// console.log(`bi_id_li__event_location:`, bi_id_li__event_location);
// Variables that will be used with Svelte bind are prefixed with 'bi_'.
let bi_trig__event_location: any = null;
// let bi_id_li__event_location: string[] = [];
let bi_trig__event_session: any = null;
// let bi_id_li__event_session: string[] = [];
// Functions and Logic
// if (browser) {
// console.log(`Browser: ${browser}`);
// bi_trig__event_location = 'event_location_li';
// bi_trig__event_session = 'event_session_li';
// // $events_slct.event_location_id = data.url.searchParams.get('location_id');
// // $events_slct.event_session_id = data.url.searchParams.get('session_id');
// }
// onMount(() => {
// console.log('Pres Mgmt Launcher [slug]: +page@(launcher).svelte');
// // if ($ae_event_launcher.app_mode == 'native') {
// // handle_get_device_info($slct.event_device_id);
// // }
// // const native_app = require('$lib./script');
// // let native_app_config = native_app.load_init_config();
// // console.log('Native App Initial Config:', native_app_config);
// });
async function handle_get_device_info(event_device_id) {
console.log('*** handle_get_device_info() ***');
// console.log(event_device_id);
// console.log('GET DEVICE INFO!!! GET DEVICE INFO!!! GET DEVICE INFO!!!');
let get_device_info_promise = get_device_info({event_device_id: event_device_id});
get_device_info_promise.then(function (result) {
// console.log('GOT DEVICE INFO!!! GOT DEVICE INFO!!! GOT DEVICE INFO!!!');
console.log(get_device_info_promise);
let event_device_data = {};
event_device_data['other_json'] = JSON.stringify(result);
event_device_data['info_hostname'] = result.hostname;
// console.log(event_device_data['other_json']);
// console.log(result.networkInterfaces);
let ni_data_li = [];
let ip_address_li = [];
for (let network_interface in result.networkInterfaces) {
// console.log(network_interface);
let ni_data = {};
if (network_interface.startsWith('en')) {
console.log('Wired or wireless network interface found');
ni_data['name'] = network_interface;
let ni_details = result.networkInterfaces[network_interface];
// console.log(ni_details);
for (let i=0; i < ni_details.length; i++) {
ni_data['address'] = ni_details[i].address;
ni_data['mac'] = ni_details[i].mac;
ip_address_li.push(ni_details[i].address);
}
ni_data_li.push(ni_data);
}
}
event_device_data['meta_json'] = JSON.stringify(ni_data_li);
console.log(event_device_data['meta_json']);
event_device_data['info_ip_list'] = ip_address_li.join('; ');
console.log(event_device_data['info_ip_list']);
event_device_obj_up_promise = update_event_device_obj({event_device_id: event_device_id, data: event_device_data, log_lvl: 0})
.then(function (up_event_device_result) {
// console.log('UPDATED DEVICE INFO!!! UPDATED DEVICE INFO!!! UPDATED DEVICE INFO!!!');
if (up_event_device_result) {
console.log(up_event_device_result);
}
})
.catch(function (error) {
console.log('No results returned or failed.');
console.log(error);
});
});
return get_device_info_promise;
}
</script>

143
src/routes/events/[event_id]/(launcher)/launcher/[event_location_id]/+page.ts Normal file
View File

@@ -0,0 +1,143 @@
/** @type {import('./$types').PageLoad} */
import { error } from '@sveltejs/kit';
console.log(`ae events launcher [event_location_id] +page.ts: start`);
import { browser } from '$app/environment';
import { events_func } from '$lib/ae_events_functions';
export async function load({ params, parent, url }) { // route
let log_lvl = 0;
let data = await parent();
// console.log(`ae events_pres_mgmt event [event_location_id] +page.ts data:`, data);
data.log_lvl = log_lvl;
let account_id = data.account_id;
let ae_acct = data[account_id];
console.log(`ae_acct = `, ae_acct);
// if (!account_id) {
// console.log(`ae pres_mgmt launcher [event_location_id] +page.ts: The account_id was not found in the data!!!`);
// error(404, {
// message: 'Account ID not found'
// });
// }
let event_id = params.event_id;
if (!event_id) {
console.log(`ae Events - [event_id] launcher [event_location_id] +page.ts: The event_id was not found in the params.event_id!!!`);
error(404, {
message: 'Event ID not found'
});
}
console.log(`event_id = `, event_id);
// ae_acct.trig = {};
// if (ae_acct.slct.event_id !== event_id) {
// ae_acct.slct.event_id = event_id;
// ae_acct.trig.event_id = true;
// // let load_event_obj = events_func.handle_load_ae_obj_id__event({
// // api_cfg: ae_acct.api,
// // event_id: event_id,
// // try_cache: false
// // });
// // ae_acct.slct.event_obj = await load_event_obj;
// }
let event_location_id = params.event_location_id;
if (!event_location_id) {
console.log(`ae Events - [event_id] launcher [event_location_id] +page.ts: The event_location_id was not found in the params.event_location_id!!!`);
error(404, {
message: 'Event Location ID not found'
});
}
console.log(`event_location_id = `, event_location_id);
// if (browser) {
// ae_acct.trig.event_location_obj_li = false;
// let load_event_location_obj_li = await events_func.load_ae_obj_li__event_location({
// api_cfg: ae_acct.api,
// event_id: event_id,
// inc_file_li: true,
// params: {qry__enabled: 'enabled', qry__limit: 550},
// try_cache: true
// })
// .finally(() => {
// // console.log(`load_event_location_obj_li = `, load_event_location_obj_li);
// ae_acct.trig.event_location_obj_li = true;
// });
// ae_acct.slct.event_location_obj_li = load_event_location_obj_li;
// // console.log(`ae_acct.slct.event_location_obj_li = `, ae_acct.slct.event_location_obj_li);
// let id_li__event_location = [];
// let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
// for (let i = 0; i < load_event_location_obj_li.length; i++) {
// let event_location_obj = load_event_location_obj_li[i];
// let event_location_id_random = event_location_obj.event_location_id_random;
// tmp_li.push(event_location_id_random);
// }
// id_li__event_location = tmp_li;
// console.log(`id_li__event_location:`, id_li__event_location);
// ae_acct.slct.id_li__event_location = id_li__event_location;
// }
// let for_obj_type = 'event';
// let for_obj_id = event_id;
// ae_acct.trig.event_session_obj_li = true;
if (browser) {
console.log('HERE!!!');
// if (url.searchParams.get('location_id')) {
// console.log(`url.searchParams.get('location_id') = `, url.searchParams.get('location_id'));
// for_obj_type = 'event_location';
// for_obj_id = url.searchParams.get('location_id');
// }
let for_obj_type = 'event_location';
let for_obj_id = event_location_id;
// ae_acct.trig.event_session_obj_li = false;
let load_event_session_obj_li = await events_func.load_ae_obj_li__event_session({
api_cfg: ae_acct.api,
for_obj_type: for_obj_type,
for_obj_id: for_obj_id,
// inc_file_li: false,
// inc_presentation_li: false,
params: {qry__enabled: 'enabled', qry__hidden: 'all', qry__limit: 150},
try_cache: true
})
.finally(() => {
// console.log(`load_event_session_obj_li = `, load_event_session_obj_li);
// ae_acct.trig.event_session_obj_li = false;
});
ae_acct.slct.event_session_obj_li = load_event_session_obj_li;
// console.log(`ae_acct.slct.event_session_obj_li = `, ae_acct.slct.event_session_obj_li);
let id_li__event_session = [];
let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
for (let i = 0; i < load_event_session_obj_li.length; i++) {
let event_session_obj = load_event_session_obj_li[i];
let event_session_id_random = event_session_obj.event_session_id_random;
tmp_li.push(event_session_id_random);
}
id_li__event_session = tmp_li;
console.log(`id_li__event_session:`, id_li__event_session);
ae_acct.slct.id_li__event_session = id_li__event_session;
} else {
console.log(`ae pres_mgmt launcher [slug] +page.ts: browser = false`);
}
// WARNING: Precaution against shared data between sites and sessions.
data[account_id] = ae_acct;
return data;
}

421
src/routes/events/[event_id]/(launcher)/launcher_file_cont.svelte Normal file
View File

@@ -0,0 +1,421 @@
<script lang="ts">
// *** Import Svelte core
import { onMount, tick } from 'svelte';
import { fade, scale, fly } from 'svelte/transition';
type key_val = {
[key: string]: any;
};
// *** Import Aether core variables and functions
// import { ae } from 'aether_npm_lib';
// import { } from '../../mods/electron.js';
// import { ae_event_launcher, event_file_obj_def, open_event_file_as_modal, ae_screen_saver_img_list } from '../../stores_mod_events';
// *** Import Aether core components
// *** Import Aether module variables and functions
// import { ae_event_launcher } from '../stores_event.js';
// import { download_event_file } from '../stores_event_api.js';
// *** Import Aether module components
// *** Export/Exposed variables and functions for component
export let event_file_obj = $event_file_obj_def;
// export let use_os: boolean = false;
// export let os: string = null;
export let max_filename_length: number = 50;
export let hide_launch_icon: boolean = false;
export let hide_meta: boolean = false;
export let hide_created_on: boolean = false;
export let hide_os: boolean = false;
export let hide_size: boolean = false;
export let show_bak_download: boolean = false;
// export let hide_api_download: boolean = true;
export let btn_size: string = 'btn_md';
export let open_file_as: string = '';
export let poster_title: string = '';
// *** Set initial variables
let ae_promises: key_val = {};
let ae_downloads: key_val = {};
let open_file_clicked = null;
let open_file_status = null; // null, 'checking_cache', 'checking_cache_failed', 'downloading_file', 'downloading_file_failed', 'opening_file', 'opening_file_failed', 'opening_file_success'
let open_file_status_message = null;
let screen_saver_exts = ['jpg', 'png', 'PNG', 'webp'];
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $ae_event_launcher.screen_saver_img_list.push(event_file_obj);
// $ae_event_launcher.screen_saver_img_list[event_file_obj.event_file_id_random] = event_file_obj;
$ae_screen_saver_img_list[event_file_obj.event_file_id_random] = Object.create(event_file_obj);
// let temp_obj = Object.create(event_file_obj)
// $ae_event_launcher.screen_saver_img_list[temp_obj.event_file_id_random] = Object.create(temp_obj);
// $ae_event_launcher = $ae_event_launcher;
}
onMount(() => {
console.log('** Component Mounted: ** Event Launcher File Container (Hash Open)');
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $ae_event_launcher.screen_saver_img_list[event_file_obj.event_file_id_random] = event_file_obj;
let temp_obj = Object.create(event_file_obj)
$ae_event_launcher.screen_saver_img_list[temp_obj.event_file_id_random] = Object.create(temp_obj);
$ae_event_launcher = $ae_event_launcher;
}
window.addEventListener('message', function(event) {
console.log('Message received in event file uploaded manage component:');
console.log(event);
if (event.data.type == 'api_download_blob') {
console.log('Download blob (file) message received:');
console.log(event.data);
// Get the event_file_id from the event.data.endpoint value.
// Example: /event/file/abc123/download
let endpoint = event.data.endpoint;
let event_file_id = endpoint.split('/')[3];
ae_downloads[event_file_id] = {
'size_total': event.data.size_total,
'size_loaded': event.data.size_loaded,
'percent_completed': event.data.percent_completed,
};
// let event_file_id = event.data.event_file_id;
// let filename = event.data.filename;
// let auto_download = event.data.auto_download;
// ae_promises[event_file_id]
// ae_promises[event_file_id] = download_event_file({ 'event_file_id': event_file_id, 'return_file': true, filename: filename, auto_download: auto_download, log_lvl: 1 });
}
});
});
async function handle_open_file() {
console.log('*** handle_open_file() ***');
console.log(`App Mode: ${$ae_event_launcher.app_mode}; Cache Path: ${$ae_event_launcher.local_file_cache_path}; Temp Path: ${$ae_event_launcher.host_file_temp_path}`);
// null or "default" is for regular use in their preferred browser.
// "app" mode is for Electron and node.js.
// "onsite" mode is for Chrome or Firefox and downloading files with modified extensions and other slight changes.
if ($ae_event_launcher.app_mode == 'native' && native_app) {
console.log('* ** *** **** BEGIN TESTING **** *** ** *');
console.log('Process: Check local hash file cache, Download hash file to cache, and Open cached hash file after copying to temp directory');
open_file_clicked = true;
// await tick();
// setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
open_file_status = 'checking_cache';
open_file_status_message = 'Checking local cache...';
let check_hash_file_cache_result = await native_app.check_hash_file_cache_v2({local_file_cache_path: $ae_event_launcher.local_file_cache_path, hash: event_file_obj.hash_sha256, check_hash: true});
if (check_hash_file_cache_result) {
console.log('Cached hash file found.');
} else if (check_hash_file_cache_result == null) {
console.log(`Cached hash file not found. Need to download from API server. Base URL ${$ae_event_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: $ae_event_launcher.api.base_url, api_base_url_backup: $ae_event_launcher.api.base_url_backup, local_file_cache_path: $ae_event_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});
// console.log(download_hash_file_to_cache_result);
if (download_hash_file_to_cache_result) {
console.log('Hash file downloaded to cache.');
} else if (download_hash_file_to_cache_result == null) {
console.log('Hash file was not found in cache and or could not be downloaded.');
open_file_status = 'file_not_found';
open_file_status_message = 'File was not found in cache and could not be downloaded.';
setTimeout(() => {console.log(`Hiding Open File Message: ${open_file_status_message}`); open_file_clicked = false;}, 10000); // Default 15 seconds (15000)
return null;
} else {
console.log('Hash file may be in the process of being downloaded or something went wrong.');
open_file_status = 'downloading_file_or_failed';
open_file_status_message = 'Hash file may be in the process of being downloaded or something went wrong.';
setTimeout(() => {console.log(`Hiding Open File Message: ${open_file_status_message}`); open_file_clicked = false;}, 10000); // Default 15 seconds (15000)
return false;
}
} else {
console.log(`Cached hash file found, but hash did not match. May still be downloading from the API server. Base URL ${$ae_event_launcher.api.base_url}`);
open_file_status = 'try_again';
open_file_status_message = 'Please try again...';
return null;
}
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000); // Default 15 seconds (15000)
console.log('Cached hash file found and ready to be opened from the temp directory.');
open_file_status = 'opening_file';
open_file_status_message = 'Opening file...';
let filename = '';
if ((event_file_obj.extension == 'ppt' || event_file_obj.extension == 'pptx') && event_file_obj.open_in_os == 'win') {
if (event_file_obj.extension == 'ppt') {
filename = event_file_obj.filename.replace('.ppt', '.pptwin');
} else if (event_file_obj.extension == 'pptx') {
filename = event_file_obj.filename.replace('.pptx', '.pptxwin');
}
} else {
filename = event_file_obj.filename;
}
console.log(`Opening ${filename}`);
let electron_open_hash_file_to_temp_result = await native_app.open_hash_file_to_temp_v2({local_file_cache_path: $ae_event_launcher.local_file_cache_path, hash: event_file_obj.hash_sha256, host_file_temp_path: $ae_event_launcher.host_file_temp_path, filename: filename, verify_hash: true});
if (electron_open_hash_file_to_temp_result) {
console.log('Local hash file was opened to temp.');
open_file_status = 'opening_file_success';
open_file_status_message = 'Opening Application';
} else if (electron_open_hash_file_to_temp_result == null) {
console.log('Local hash file was not found. It may still be downloading.');
open_file_status = 'file_not_found';
open_file_status_message = 'File not found!';
} else {
console.log('Local hash file was not opened to temp. Something went wrong.');
open_file_status = 'opening_file_failed';
open_file_status_message = 'Failed to open the file!';
return false;
}
console.log('Done with test of cache check, download file, and open cached file from temp directory.');
} else if ($ae_event_launcher.app_mode == 'onsite') {
open_file_clicked = true;
await tick();
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
} else {
// NOTE: Add first test controller command here.
// $ae_event_launcher.controller_cmd = `ae:open:event_file_id=${$slct.event_file_id}`;
// $ae_event_launcher.controller_trigger_send = true; // Trigger the controller to send.
// $ae_event_launcher.controller_cmd = null; // Reset command to null
open_file_clicked = true;
await tick();
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
}
}
// function handle_open_file_as_poster() {
// console.log('*** handle_open_file_as_poster() ***');
// $ae_event_launcher.show_modal_event_poster = true;
// if (event_file_obj.extension == 'png' || event_file_obj.extension == 'jpg') {
// $ae_event_launcher.event_poster_file_type = 'image';
// } else if (event_file_obj.extension == 'mp4' || event_file_obj.extension == 'mov') {
// $ae_event_launcher.event_poster_file_type = 'video';
// }
// $ae_event_launcher.event_poster_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
// $ae_event_launcher.event_poster_title = poster_title;
// }
</script>
<div class="event_launcher_file_cont">
<span class="event_file_action">
{#if open_file_clicked}
<div class="open_file_clicked alert" in:fade="{{ duration: 250 }}" out:fade="{{ duration: 2000 }}">
{#if ($ae_event_launcher.app_mode == 'native')}
{#if (open_file_status)}
<div class="alert_msg_pulse"><strong>*** {open_file_status_message} ***</strong></div>
{/if}
<!-- <strong>*** Please wait while this file is cached... ***</strong> -->
<p>Most files will automatically be opened full screen.</p>
<p>PowerPoint or KeyNote will attempt to display in presenter view.</p>
<p>PDFs, videos, and images will attempt to be displayed mirrored.</p>
<p>Please close the file when finished.</p>
{:else if ($ae_event_launcher.app_mode == 'onsite')}
<strong>*** Please wait while this file loads... ***</strong>
<p>Most files will automatically be opened full screen.</p>
<p>PowerPoint or KeyNote will attempt to display in presenter view.</p>
<p>PDFs, videos, and images will attempt to be displayed mirrored.</p>
<p>Please close the file when finished.</p>
{:else}
<strong>*** Please wait while this file downloads... ***</strong>
<p>Onsite in the Speaker Ready Room and conference session rooms:
<ul>
<li>Most files will automatically be opened full screen.</li>
<li>PowerPoint or KeyNote will attempt to display in presenter view.</li>
<li>PDFs, videos, and images will attempt to be displayed mirrored.</li>
<li>Please close the file when finished.</li>
</ul>
{/if}
</div>
{/if}
{#if (open_file_as == 'poster')}
<!-- <a
href="/event/file/{event_file_obj.event_file_id_random}/download"
download
class="ae_btn btn_info {btn_size}"
on:click|preventDefault={() => {handle_open_file_as_poster();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={event_file_obj.filename}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a> -->
<button
class="ae_btn btn_info {btn_size}"
on:click={() => {
let as_modal_result = open_event_file_as_modal({
event_file_id: event_file_obj.event_file_id_random,
filename: event_file_obj.filename,
extension: event_file_obj.extension,
modal_title: poster_title
});
if (as_modal_result) {
console.log($ae_event_launcher);
console.log(event_file_obj);
ae_event_launcher.set({...$ae_event_launcher, ...as_modal_result});
}
if ($ae_event_launcher.controller == 'local_push') {
$ae_event_launcher.controller_cmd = `ae_open:event_file=${event_file_obj.event_file_id_random}`;
$ae_event_launcher.controller_trigger_send = true;
}
}}
title={`${event_file_obj.filename} [BTN] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
{#if (screen_saver_exts.includes(event_file_obj.extension))}
<span class="fas fa-chart-bar" class:d_none="{hide_launch_icon}"></span>
Open Poster
{:else}
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
{/if}
</button>
<!-- {#if ($ae_event_launcher.app_mode == 'native')} -->
{:else if ($ae_event_launcher.app_mode == 'native')}
<a
href="/event/file/{event_file_obj.event_file_id_random}/download?use_os=true"
download
class="ae_btn btn_info {btn_size}"
on:click|preventDefault={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={`${event_file_obj.filename} [A] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a>
{:else if ($ae_event_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
class="ae_btn btn_info {btn_size}"
on:click={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={`${event_file_obj.filename} [A] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a>
{:else}
<button
class="ae_btn btn_info {btn_size}"
on:click={() => {
ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = 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 })
.then((result) => {
console.log('Downloaded file:');
console.log(result);
if (result === null) {
ae_promises[event_file_obj.event_file_id_random] = null;
}
})
}}
title={`${event_file_obj.filename} [API] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
{#await ae_promises[event_file_obj.event_file_id_random]}
<span class="fas fa-spinner fa-spin"></span>
Downloading...
<span>
{#if ae_downloads[event_file_obj.event_file_id_random]}
{ae_downloads[event_file_obj.event_file_id_random].percent_completed}%
{/if}
</span>
{:then}
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
{#if ae_promises[event_file_obj.event_file_id_random] === null}
<span class="fas fa-exclamation-triangle"></span>
Download failed!
{/if}
{/await}
</button>
<!-- <a
href="/event/file/{event_file_obj.event_file_id_random}/download"
download
class="ae_btn btn_info {btn_size}"
on:click={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={event_file_obj.filename}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a> -->
{/if}
<!-- <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> -->
</span>
<span class="event_file_meta" class:d_none="{hide_meta}">
<span class="event_file_created_on" class:d_none="{hide_created_on}">
{ae.util.iso_datetime_formatter(event_file_obj.created_on, 'datetime_short')}
</span>
<span class="event_file_size" class:d_none="{hide_size}">
{#if event_file_obj.file_size}{ae.util.format_bytes(event_file_obj.file_size)}{/if}
</span>
<span class="event_file_os" class:d_none="{hide_os}">
{#if event_file_obj.open_in_os == 'win'}
<span class="fab fa-windows"></span> Win
{:else if event_file_obj.open_in_os == 'mac'}
<span class="fab fa-apple"></span> Mac
{:else}
<!-- <span class="fas fa-folder-open"></span> -->
{/if}
</span>
<!-- {#if ($ae_event_launcher.app_mode == 'native' || $ae_event_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:d_none="{!show_bak_download}" title="Download with original filename and extension"><span class="fas fa-download"></span></a>
<!-- {/if} -->
</span>
<!-- <button
class="ae_btn btn_xs btn_outline_debug"
class:d_none="{hide_api_download}"
on:click={() => {
// 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 });
}}
title="Download file from API server?"
>
<span class="fas fa-download"></span>
</button> -->
</div>
<style>
</style>

281
src/routes/events/[event_id]/(launcher)/launcher_menu.svelte Normal file
View File

@@ -0,0 +1,281 @@
<script lang="ts">
// import { tick } from 'svelte';
import { goto } from '$app/navigation';
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
import Element_data_store from '$lib/element_data_store_v2.svelte';
import { liveQuery } from "dexie";
// import { core_func } from '$lib/ae_core_functions';
// import { db_core } from "$lib/db_core";
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 { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Menu_session_list_menu from './menu_session_list.svelte';
export let data_url: any;
let slct_event_location_id: string = $events_slct.event_location_id;
$events_trigger = null;
export let lq__event_obj: any;
export let lq__location_event_file_obj_li: any;
export let lq__event_location_obj: any;
// export let lq__event_location_obj_li: any;
export let lq__event_location_obj_li: any;
export let lq__event_session_obj: any;
// export let lq__event_session_obj_li: any;
export let lq__event_session_obj_li: any;
let qry__enabled = 'enabled';
let qry__hidden = 'not_hidden';
if ($ae_loc.administrator_access) {
qry__enabled = 'all';
qry__hidden = 'all';
} else if ($ae_loc.trusted_access) {
qry__enabled = 'enabled';
qry__hidden = 'all';
} else {
qry__enabled = 'enabled';
qry__hidden = 'not_hidden';
}
let ae_promises: key_val = {
get_li__event_file: null,
};
</script>
<section class="text-center space-y-1">
<h2 class="">{$lq__event_obj?.cfg_json.short_name ?? 'loading...'}</h2>
<button
on:click={() => {
$events_loc.launcher.show_content__hidden_files = !$events_loc.launcher.show_content__hidden_files;
}}
class="btn btn-sm variant-ghost-warning hover:variant-filled-primary text-xs py-1 px-2"
>
{#if $events_loc.launcher.show_content__hidden_files}
<span class="fas fa-eye-slash m-1"></span>
Hide Files
{:else}
<span class="fas fa-eye m-1"></span>
Hidden Files?
{/if}
</button>
<button
on:click={() => {
$events_loc.launcher.show_content__hidden_sessions = !$events_loc.launcher.show_content__hidden_sessions;
}}
class="btn btn-sm variant-ghost-warning hover:variant-filled-primary text-xs py-1 px-2"
>
{#if $events_loc.launcher.show_content__hidden_sessions}
<span class="fas fa-eye-slash m-1"></span>
Hide Sessions
{:else}
<span class="fas fa-eye m-1"></span>
Hidden Sessions?
{/if}
</button>
{#if $lq__event_location_obj_li && $lq__event_location_obj_li.length > 0}
<div class="text-xs"><strong>
Locations:
{#if $ae_loc.administrator_access}
({$lq__event_location_obj_li?.length})
{/if}
<!-- This should fade out once the data is loaded. -->
{#await ae_promises[slct_event_location_id]}
<span class="fas fa-spinner fa-spin text-blue-500"></span>
{:then result}
<span class="fas fa-check text-green-500"></span>
{/await}
</strong></div>
<select
class="select text-xs p-1"
bind:value={slct_event_location_id}
on:change={async () => {
// console.log(`slct_event_location_id:`, slct_event_location_id);
console.log('Remove fields from the URL.');
// data_url.searchParams.delete('location_id');
data_url.searchParams.delete('presentation_id');
data_url.searchParams.delete('presenter_id');
data_url.searchParams.delete('session_id');
// let url_location_id = slct_event_location_id;
// data_url.searchParams.set('location_id', url_location_id);
let new_url = `/events/${$events_slct.event_id}/launcher`;
if (slct_event_location_id) {
$events_loc.launcher.slct.event_location_id = slct_event_location_id;
$events_slct.event_location_id = slct_event_location_id;
// console.log(`$events_loc.launcher.slct.event_location_id:`, $events_loc.launcher.slct.event_location_id);
// data_url.searchParams.set('location_id', slct_event_location_id);
// await tick();
// $events_slct.event_location_id = slct_event_location_id;
// dq__where_type_id_val = 'event_location_id';
// dq__where_eq_id_val = slct_event_location_id;
// $events_loc.launcher.slct.event_location_id = null;
// await tick();
// $events_loc.launcher.slct.event_location_id = slct_event_location_id;
// await tick();
// $slct.event_location_id = slct_event_location_id;
// $slct_trigger = 'event_location_li';
// $events_trigger = 'event_location_li';
$events_slct.id_li__event_session = [];
// await tick();
ae_promises[slct_event_location_id] = events_func.load_ae_obj_li__event_session({
api_cfg: $ae_api,
for_obj_type: 'event_location',
for_obj_id: $events_slct.event_location_id,
inc_file_li: false,
inc_presentation_li: false,
params: {qry__enabled: 'enabled', qry__hidden: 'all', qry__limit: 100},
try_cache: true,
log_lvl: 1,
})
.then(async function (load_results) {
console.log(`load_results = `, load_results);
let event_session_id_li = [];
let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
for (let i = 0; i < load_results.length; i++) {
let event_session_obj = load_results[i];
let event_session_id_random = event_session_obj.event_session_id_random;
tmp_li.push(event_session_id_random);
}
event_session_id_li = tmp_li;
console.log(`event_session_id_li:`, event_session_id_li);
$events_slct.id_li__event_session = event_session_id_li;
// $events_slct = {...$events_slct};
// await tick();
return load_results;
})
.finally(async () => {
// This will hide the selected session if the location is changed to false.
// WARNING: This may need to be commented out later.
// $events_loc.launcher.slct.event_session_id = null;
// await tick();
// $events_loc.launcher.slct.event_session_id = event_session_obj?.id;
// await tick();
// $events_slct.event_session_id = event_session_obj?.id;
// $events_slct.event_session_obj = event_session_obj;
// ae_promises.slct_event_session_id = events_func.load_ae_obj_id__event_session({
// api_cfg: $ae_api,
// event_session_id: event_session_obj?.id,
// inc_file_li: true,
// inc_presentation_li: true,
// try_cache: true,
// log_lvl: 1
// })
// .then(async (load_results) => {
// console.log(`load_results = `, load_results);
// let new_url = data_url.toString();
// console.log(new_url);
// events/UFu-gF-rZ-ws/launcher/XB6wmasQN6E?
// let new_url = `/events/${$events_slct.event_id}/launcher/${$events_slct.event_location_id}`;
// goto(new_url, {replaceState: true});
});
// let new_url = `/events/${$events_slct.event_id}/launcher/${$events_slct.event_location_id}`;
// goto(new_url, {replaceState: true});
// await tick();
new_url = `/events/${$events_slct.event_id}/launcher/${$events_slct.event_location_id}`;
} else {
// This will hide the selected session if the location is changed to false.
// WARNING: This may need to be commented out later.
// slct_event_session_id = null;
$events_loc.launcher.slct.event_location_id = null;
$events_slct.event_location_id = null;
$events_loc.launcher.slct.event_session_id = null;
$events_slct.event_session_id = null;
// WARNING: This may need to be commented out later.
}
// let new_url = `/events/${$events_slct.event_id}/launcher/${$events_slct.event_location_id}`;
goto(new_url, {replaceState: true});
// let new_url = data_url.toString()
// console.log(new_url);
// goto(new_url, {replaceState: false});
}}
>
<option value="">Select a location</option>
{#each $lq__event_location_obj_li as event_location_obj}
<option
value={event_location_obj?.id}
>
{event_location_obj?.name}
</option>
{/each}
</select>
{:else}
<p class="text-sm">
No locations found.
Event ID: {$lq__event_obj?.id}
</p>
{/if}
{#if $lq__location_event_file_obj_li}
{#each $lq__location_event_file_obj_li as event_file_obj, index}
<button
disabled={!$ae_loc.trusted_access}
on:click={() => {
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj?.event_file_id_random] = api.download_hosted_file({
api_cfg: $ae_api,
hosted_file_id: event_file_obj?.hosted_file_id_random,
return_file: true,
filename: event_file_obj?.filename,
auto_download: true,
log_lvl: 0
});
}}
class="btn btn-sm variant-ghost-primary hover:variant-filled-primary text-xs py-1 px-2"
>
<span class="fas fa-file-archive m-1"></span>
{event_file_obj?.filename}
</button>
{/each}
{/if}
</section>
<section class="text-center">
{#if $lq__event_session_obj_li}
<Menu_session_list_menu
data_url={data_url}
lq__event_session_obj_li={lq__event_session_obj_li}
/>
{/if}
</section>
<!-- {/await} -->

114
src/routes/events/[event_id]/(launcher)/launcher_presenter_view.svelte Normal file
View File

@@ -0,0 +1,114 @@
<script lang="ts">
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import { liveQuery } from "dexie";
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 { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
// export let slct_event_presentation_id: string;
// export let slct_event_presenter_id: string;
export let lq__event_presenter_obj: any;
let ae_promises: key_val = {
get_li__event_file: null,
};
// Event File
let lq__event_file_obj_li = liveQuery(
() => db_events.files
// .where('event_session_id_random')
.where('for_id_random')
.equals(lq__event_presenter_obj?.event_presenter_id)
.sortBy('name')
);
</script>
<strong>
<span class="fas fa-user"></span>
{#if lq__event_presenter_obj?.full_name }{lq__event_presenter_obj?.full_name}{:else }{lq__event_presenter_obj?.given_name}{/if }
</strong>
{#if !lq__event_presenter_obj?.file_count}
<p class="text-sm text-center text-gray-400">
<!-- <span class="fas fa-exclamation"></span> -->
No files to show for this presenter at this time.
<!-- <span class="fas fa-exclamation"></span> -->
</p>
{/if}
{#if $lq__event_file_obj_li && $lq__event_file_obj_li.length }
<section class="event_session_file_list">
<div>
<div class="text-xs"><strong>
<span class="fas fa-file-archive"></span>
Presenter Files:
{#if $ae_loc.administrator_access}
({$lq__event_file_obj_li?.length})
{/if}
</strong></div>
</div>
<ul class="space-y-1">
{#each $lq__event_file_obj_li as event_file_obj, index}
<li
class="flex flex-row justify-center gap-1"
class:hidden={!$events_loc.launcher.show_content__hidden_files && event_file_obj.hide}
>
<button
disabled={!$ae_loc.trusted_access}
on:click={() => {
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
api_cfg: $ae_api,
hosted_file_id: event_file_obj.hosted_file_id_random,
return_file: true,
filename: event_file_obj.filename,
auto_download: true,
log_lvl: 0
});
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_obj.event_file_id_random, filename: event_file_obj.filename, auto_download: true }, '*');
}}
class="btn btn-sm lg:btn-md variant-soft-primary hover:variant-filled-primary 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)}... Hosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_obj.event_file_id_random}`}
>
{#await ae_promises[event_file_obj.event_file_id_random]}
<span class="fas fa-spinner fa-spin mx-1"></span>
<span class="">
Downloading
{#if $ae_sess.api_download_kv[event_file_obj.hosted_file_id_random]}
{$ae_sess.api_download_kv[event_file_obj.hosted_file_id_random].percent_completed}%
{/if}
:
</span>
{:then}
<!-- <span class="fas fa-download mx-1"></span> -->
<span class="fas fa-{ae_util.file_extension_icon(event_file_obj.extension)}"></span>
<!-- <span class="text-sm">
Download:
</span> -->
{/await}
<span class="grow">
{ae_util.shorten_filename({filename: event_file_obj.filename, max_length: 30})}
</span>
<span
class="badge variant-glass-success hover:variant-filled-success text-sm"
class:hidden={!event_file_obj.file_purpose}
>
{event_file_obj.file_purpose}
</span>
</button>
</li>
{/each}
</ul>
</section>
{/if}

384
src/routes/events/[event_id]/(launcher)/launcher_session_view.svelte Normal file
View File

@@ -0,0 +1,384 @@
<script lang="ts">
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
import Launcher_file_cont from './launcher_file_cont.svelte';
import Launcher_presenter_view from './launcher_presenter_view.svelte';
import { liveQuery } from "dexie";
// import { core_func } from '$lib/ae_core_functions';
// import { db_core } from "$lib/db_core";
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 { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
// export let slct_event_session_id: string;
// export let lq__event_file_obj: any;
// export let lq_get__event_file_obj_li: any;
// export let lq__event_location_obj: any;
// export let lq__event_presentation_obj: any;
// export let lq_get__event_presentation_obj_li: any;
// export let lq__event_presenter_obj: any;
// export let lq_get__event_presenter_obj_li: any;
export let lq__event_session_obj: any;
// let load_event_session_obj = events_func.load_ae_obj_id__event_session({
// api_cfg: $ae_api,
// event_session_id: $events_slct.event_session_id,
// inc_presenter_li: false,
// try_cache: true,
// log_lvl: 1
// });
// let lq__event_session_obj = liveQuery(
// () => db_events.sessions.get(slct_event_session_id)
// );
// let lq__event_session_obj = liveQuery(
// () => db_events.sessions.get($events_slct.event_session_id)
// );
// import Event_launcher_file_cont from './launcher_file_cont.svelte';
export let hide_description: boolean = true;
export let show_designations: boolean = false;
export let show_email: boolean = false;
// Event File
let lq__event_file_obj_li = liveQuery(
() => db_events.files
// .where('event_session_id_random')
.where('for_id_random')
.equals($events_slct.event_session_id)
.sortBy('filename')
);
// Does not refresh when the event_file_id_li_json changes.
// let lq_get__event_file_obj_li = liveQuery(
// () => db_events.files
// .bulkGet($lq__event_session_obj?.event_file_id_li_json ?? [''])
// );
// console.log(`$lq__event_session_obj?.event_file_id_li_json = `, $lq__event_session_obj?.event_file_id_li_json);
// Event Presentation
// let lq__event_presentation_obj = liveQuery(
// () => db_events.presentations
// .get($events_slct.event_presentation_id)
// );
$: lq__event_presentation_obj_li = liveQuery(async () => {
let results = await db_events.presentations
.where('event_session_id_random')
.equals($events_slct.event_session_id)
.sortBy('start_datetime');
// .sortBy('name')
return results;
});
// FIX! This id list needs to be updated. It is currently commented out in the menu_session_list.svelte file.
// let lq_get__event_presentation_obj_li = liveQuery(
// () => db_events.presentations
// .bulkGet($events_slct.id_li__event_presentation)
// );
$: lq__event_presenter_obj_li = liveQuery(async () => {
let results = await db_events.presenters
.where('event_session_id_random')
.equals($events_slct.event_session_id)
.sortBy('full_name');
return results;
});
let show_modal_upload_files: boolean = false;
let link_to_type: null|string = null;
let link_to_id: null|string = null;
let ae_promises: key_val = {};
$events_slct.id_li__event_presenter = [];
// await tick();
ae_promises[$events_slct.event_session_id] = events_func.load_ae_obj_li__event_presenter({
api_cfg: $ae_api,
for_obj_type: 'event_session',
for_obj_id: $events_slct.event_session_id,
// inc_file_li: false,
params: {qry__enabled: 'enabled', qry__limit: 550},
try_cache: true,
log_lvl: 1,
})
.then(async function (load_results) {
console.log(`load_results = `, load_results);
let event_presenter_id_li = [];
let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
for (let i = 0; i < load_results.length; i++) {
let event_presenter_obj = load_results[i];
let event_presenter_id_random = event_presenter_obj.event_presenter_id_random;
tmp_li.push(event_presenter_id_random);
}
event_presenter_id_li = tmp_li;
console.log(`event_presenter_id_li:`, event_presenter_id_li);
$events_slct.id_li__event_presenter = event_presenter_id_li;
// $events_slct = {...$events_slct};
// await tick();
return load_results;
});
</script>
<!-- {$events_slct.event_session_id} -->
<section class="event_launcher_session_view grow w-full space-y-2">
<!-- <slot name="event_session_message">event session message</slot> -->
{#if $lq__event_session_obj && $lq__event_session_obj.event_session_id_random}
<header class="event_session_about text-center border-b-2 border-gray-400">
<h3
class="event_session_datetimes"
>
<button
type="button"
on:click={() => {
if ($events_loc.launcher.time_format == 'time_12_short') {
$events_loc.launcher.time_format = 'time_short';
} else {
$events_loc.launcher.time_format = 'time_12_short';
}
}}
>
<strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'week_long')}</strong>
<span class="font-normal">
{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'date_long_month_day')}
</span>
<strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, $events_loc.launcher.time_format)}</strong>
<span class="font-normal">
&ndash;
{ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, $events_loc.launcher.time_format)}
</span>
</button>
</h3>
<h2 class="text-xl">
{$lq__event_session_obj?.name}
{#if $lq__event_session_obj?.code}
<span class="text-base text-gray-500 font-normal p-1"
title="Session code {$lq__event_session_obj.code}"
>
<span class="fas fa-barcode"></span>
{$lq__event_session_obj?.code}
</span>
{/if}
</h2>
</header>
<!-- <section class="event_session_description text-xs" class:d_none="{hide_description}">
{@html $lq__event_session_obj.description}
</section> -->
{#if !$lq__event_session_obj?.file_count_all}
<p class="text-2xl text-center text-red-500 font-bold">
<span class="fas fa-exclamation-triangle"></span>
Warning
<span class="fas fa-exclamation-triangle"></span>
<br>
No files available show for this session.
</p>
{/if}
{#if $lq__event_file_obj_li && $lq__event_file_obj_li.length }
<section class="event_session_file_list">
<div>
<div class="text-xs"><strong>
<span class="fas fa-file-archive"></span>
Session Files:
{#if $ae_loc.administrator_access}
({$lq__event_file_obj_li?.length})
{/if}
</strong></div>
<!-- {#if $ae_loc.trusted_access || $events_loc.launcher.trusted_access}
<button on:click={async () => {
show_modal_upload_files = true;
link_to_type = 'event_session';
link_to_id = $lq__event_session_obj.event_session_id_random;
}}
type="button" class="ae_btn btn_outline_warning btn_xs" title="Upload updated or additional files"
>
<span class="fas fa-upload"></span> Upload Session File(s)
</button>
{/if} -->
</div>
<ul>
{#each $lq__event_file_obj_li as event_file_obj, index}
<li
class="flex flex-row justify-center gap-1"
class:hidden={!$events_loc.launcher.show_content__hidden_files && event_file_obj.hide}
>
<button
disabled={!$ae_loc.trusted_access}
on:click={() => {
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
api_cfg: $ae_api,
hosted_file_id: event_file_obj.hosted_file_id_random,
return_file: true,
filename: event_file_obj.filename,
auto_download: true,
log_lvl: 0
});
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_obj.event_file_id_random, filename: event_file_obj.filename, auto_download: true }, '*');
}}
class="btn btn-sm lg:btn-md variant-soft-secondary hover:variant-filled-primary 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)}... Hosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_obj.event_file_id_random}`}
>
{#await ae_promises[event_file_obj.event_file_id_random]}
<span class="fas fa-spinner fa-spin mx-1"></span>
<span class="">
Downloading
{#if $ae_sess.api_download_kv[event_file_obj.hosted_file_id_random]}
{$ae_sess.api_download_kv[event_file_obj.hosted_file_id_random].percent_completed}%
{/if}
:
</span>
{:then}
<!-- <span class="fas fa-download mx-1"></span> -->
<span class="fas fa-{ae_util.file_extension_icon(event_file_obj.extension)}"></span>
<!-- <span class="text-sm">
Download:
</span> -->
{/await}
<span class="grow">
{ae_util.shorten_filename({filename: event_file_obj.filename, max_length: 30})}
</span>
<span
class="badge variant-glass-success hover:variant-filled-success text-sm"
class:hidden={!event_file_obj.file_purpose}
>
{event_file_obj.file_purpose}
</span>
</button>
<!-- <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} /> -->
<!-- <a
href="{$ae_api.base_url}/event/file/{event_file_obj.event_file_id_random}/download?filename={event_file_obj.filename}&x_no_account_id_token=direct-download"
class="btn btn-sm variant-soft-secondary m-0.5 *:hover:inline"
class:hidden={!ae_tmp.show__direct_download}
title={`Download this file:\n${event_file_obj.filename}\n[API] SHA256: ${event_file_obj.hash_sha256.slice(0, 10)}... Hosted ID: ${event_file_obj.hosted_file_id_random} Event File ID: ${event_file_obj.event_file_id_random}`}
>
<span class="fas fa-download mx-1"></span>
<div class="hidden">
Download
</div>
</a> -->
</li>
{/each}
</ul>
</section>
{/if}
<!-- <hr class="w-full border border-gray-200" /> -->
<section class="event_presentation_list">
<!-- {$lq__event_session_obj?.event_presentation_li?.length ?? 'loading...?'} -->
{#if $lq__event_presentation_obj_li}
<div class="text-xs"><strong>
Presentations:
{#if $ae_loc.administrator_access}
({$lq__event_presentation_obj_li?.length})
{/if}
</strong></div>
<!-- Maybe set max with? max-w-screen-md -->
<ul class="event_presentation_list max-w-full space-y-2">
{#each $lq__event_presentation_obj_li as event_presentation_obj}
<li class="border-b-2 border-gray-300 my-1 py-1">
<!-- The presentation information -->
<div class="event_presentation_datetime_name flex flex-row justify-evenly gap-4">
<!-- <div class="event_presentation_datetime_name"> -->
{#if event_presentation_obj?.start_datetime}
<span class="event_presentation_datetime"><strong>{ae_util.iso_datetime_formatter(event_presentation_obj?.start_datetime, 'time_12_short_no_leading')}</strong></span>
{/if}
<span class="event_presentation_name grow">{event_presentation_obj?.name}</span>
<!-- </div> -->
</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}
{#if event_presenter_obj.event_presentation_id_random == event_presentation_obj.event_presentation_id_random}
<li>
<Launcher_presenter_view
lq__event_presenter_obj={event_presenter_obj}
/>
</li>
{/if}
{/each}
</ul>
{:else}
<span class="event_launcher_no_presenters">No presenters to display</span>
{/if}
</li>
{/each}
</ul>
{:else}
<p>No presentations available to display.</p>
{/if}
</section>
{:else}
<span class="fas fa-spinner fa-spin"></span>
No session selected
{/if}
</section>
<!-- {#if show_modal_upload_files}
<Element_modal_v3
show = { true }
modal_cover_body = { true }
on:close={ () => {show_modal_upload_files=false;} }
>
<span slot="header_title">Upload New File(s)</span>
<span slot="body">
<Event_file_upload_form
link_to_type={link_to_type}
link_to_id={link_to_id}
display_minimal={true}
on:event_file_obj_li_updated={handle_event_file_obj_li_updated}
/>
</span>
</Element_modal_v3>
{/if} -->
<style>
</style>

193
src/routes/events/[event_id]/(launcher)/menu_session_list.svelte Normal file
View File

@@ -0,0 +1,193 @@
<script lang="ts">
import { goto } from '$app/navigation';
// import { liveQuery } from "dexie";
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/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 { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import { tick } from 'svelte';
export let data_url: any;
// export let slct_event_session_id: any;
// export let lq__event_session_obj: any;
export let lq__event_session_obj_li: any;
let ae_promises: key_val = {
slct_event_session_id: null,
slct_event_presentation_li: null
};
let hover_timer_wait = 1000;
let hover_timer: any = null;
</script>
<!-- <span
class="text-sm font-bold"
>
{$lq__event_session_obj?.name}
</span> -->
{#if $lq__event_session_obj_li && $lq__event_session_obj_li.length > 0}
<div class="text-xs"><strong>
Sessions:
{#if $ae_loc.administrator_access}
({$lq__event_session_obj_li?.length})
{/if}
<!-- This should fade out once the data is loaded. -->
{#await ae_promises.slct_event_session_id}
<span class="fas fa-spinner fa-spin text-blue-500"></span>
{:then result}
<span class="fas fa-check text-green-500"></span>
{/await}
</strong></div>
<ul
class="space-y-1"
>
{#each $lq__event_session_obj_li as event_session_obj}
<li>
<button
type="button"
on:mouseenter={() => {
// Start a 750 ms timer to prevent changing the session too quickly.
hover_timer = setTimeout(async () => {
$events_slct.event_session_id = null;
await tick();
$events_slct.event_session_id = event_session_obj?.id;
data_url.searchParams.set('session_id', event_session_obj?.id);
$events_slct.event_session_id = event_session_obj?.id;
$events_slct.event_session_obj = event_session_obj;
ae_promises.slct_event_session_id = events_func.load_ae_obj_id__event_session({
api_cfg: $ae_api,
event_session_id: event_session_obj?.id,
inc_file_li: true,
inc_presentation_li: true,
try_cache: true,
log_lvl: 1
})
.then(async (load_results) => {
console.log(`load_results = `, load_results);
let new_url = data_url.toString();
console.log(new_url);
goto(new_url, {replaceState: false});
});
}, hover_timer_wait);
}}
on:mouseleave={() => {
clearTimeout(hover_timer);
}}
on:click={async () => {
$events_slct.event_session_id = null;
await tick();
$events_slct.event_session_id = event_session_obj?.id;
data_url.searchParams.set('session_id', event_session_obj?.id);
$events_slct.event_session_id = event_session_obj?.id;
$events_slct.event_session_obj = event_session_obj;
ae_promises.slct_event_session_id = events_func.load_ae_obj_id__event_session({
api_cfg: $ae_api,
event_session_id: event_session_obj?.id,
inc_file_li: true,
inc_presentation_li: true,
try_cache: true,
log_lvl: 1
})
.then(async (load_results) => {
console.log(`load_results = `, load_results);
let new_url = data_url.toString();
console.log(new_url);
goto(new_url, {replaceState: false});
});
// await tick();
// ae_promises.slct_event_presentation_li = await events_func.load_ae_obj_li__event_presentation({
// api_cfg: $ae_api,
// event_session_id: event_session_obj?.id,
// try_cache: true,
// log_lvl: 1
// })
// .then(async (load_results) => {
// console.log(`load_results = `, load_results);
// let event_presentation_id_li = [];
// let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
// for (let i = 0; i < load_results.length; i++) {
// let event_presentation_obj = load_results[i];
// let event_presentation_id_random = event_presentation_obj.event_presentation_id_random;
// tmp_li.push(event_presentation_id_random);
// }
// event_presentation_id_li = tmp_li;
// console.log(`event_presentation_id_li:`, event_presentation_id_li);
// $events_slct.id_li__event_presentation = event_presentation_id_li;
// data_url.searchParams.set('presentation_li', event_presentation_id_li);
// // let new_url = data_url.toString();
// // console.log(new_url);
// // goto(new_url, {replaceState: false});
// // return load_results;
// });
// await tick();
// let new_url = data_url.toString();
// console.log(new_url);
// goto(new_url, {replaceState: false});
}}
class="btn btn-sm hover:variant-filled-primary overflow-hidden text-sm w-full max-w-full text-left transition-all rounded-md flex flex-row justify-between items-center"
class:variant-filled-primary={$events_slct.event_session_id === event_session_obj?.id}
class:variant-ghost-secondary={$events_slct.event_session_id != event_session_obj?.id}
class:font-bold={$events_slct.event_session_id === event_session_obj?.id}
class:hidden={!$events_loc.launcher.show_content__hidden_sessions && event_session_obj?.hide}
class:dim={event_session_obj?.hide}
title={event_session_obj?.name}
>
<span
class="border-r border-gray-400 pr-1"
>
{#if $events_slct.event_session_id === event_session_obj?.id}
<span class="fas fa-calendar-check"></span>
{:else}
<span class="fas fa-calendar-alt"></span>
{/if}
<span
class="text-xs"
class:hidden={$events_slct.event_session_id === event_session_obj?.id}
>
{ae_util.iso_datetime_formatter(event_session_obj?.start_datetime, 'week_medium')}
</span>
<span
class="text-xs"
>
{ae_util.iso_datetime_formatter(event_session_obj?.start_datetime, $events_loc.launcher.time_format)}
</span>
</span>
<span class="text-xs">
{event_session_obj?.name}
</span>
</button>
</li>
{/each}
</ul>
{:else}
<p class="text-sm">
No sessions found.
</p>
{/if}