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

Separating out components and functions to make things more modular.

Browse Source
This commit is contained in:
Scott Idem
2024-07-03 17:48:06 -04:00
parent 270a1429f8
commit 4aae2bead4
16 changed files with 528 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/lib/ae_events__event_file.ts
View File

@@ -51,23 +51,32 @@ export async function handle_load_ae_obj_id__event_file(
}
// Updated 2024-06-14
// Updated 2024-07-03
export async function handle_load_ae_obj_li__event_file(
{
api_cfg,
event_session_id,
for_obj_type,
for_obj_id,
params={},
try_cache=true,
log_lvl=0
}: {
api_cfg: any,
event_session_id: string,
for_obj_type: string,
for_obj_id: string,
params?: key_val,
try_cache?: boolean,
log_lvl?: number
}
) {
console.log(`*** handle_load_ae_obj_li__event_file() *** event_id=${event_session_id}`);
console.log(`*** handle_load_ae_obj_li__event_file() *** for_obj_type=${for_obj_type} for_obj_id=${for_obj_id}`);
// Check if for_obj_type is in the list of valid Aether object types:
let valid_for_obj_types = ['event', 'event_session', 'event_presentation', 'event_presenter', 'event_location'];
if (!valid_for_obj_types.includes(for_obj_type)) {
console.log(`Invalid for_obj_type: ${for_obj_type}`);
return [];
}
let enabled: string = (params.qry__enabled ?? 'enabled'); // all, disabled, enabled
let hidden: string = (params.qry__hidden ?? 'not_hidden'); // all, hidden, not_hidden
@@ -81,8 +90,8 @@ export async function handle_load_ae_obj_li__event_file(
ae_promises.load__event_file_obj_li = await api.get_ae_obj_li_for_obj_id_crud({
api_cfg: api_cfg,
obj_type: 'event_file',
for_obj_type: 'event_session',
for_obj_id: event_session_id,
for_obj_type: for_obj_type,
for_obj_id: for_obj_id,
use_alt_table: true, // NOTE: This will use the table_name_alt value instead of the table_name value in the API config.
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value
enabled: enabled,

3
src/lib/ae_events_stores.ts
View File

@@ -167,6 +167,7 @@ export let events_loc: Writable<key_val> = localStorageStore('ae_events_loc', ev
// Updated 2024-03-06
let events_session_data_struct: key_val = {
'ver': '2024-03-19_17',
'log_lvl': 1,
// Shared
'ds': {
'submit_status': null,
@@ -348,6 +349,8 @@ let events_slct_obj_template: key_val = {
'session_id': null,
'session_obj': {},
'session_obj_li': [],
'lq__presenter_obj': {}, // Testing passing a LiveQuery object around...
};
// console.log(`AE Stores - Selected Events Objects:`, events_slct_obj_template);

14
src/lib/ae_stores.ts
View File

@@ -35,12 +35,15 @@ export type key_val = {
// export type key_val = key_val;
import { html__not_set } from './ae_string_snippets';
// import { html__not_set, classes__events_pres_mgmt_menu } from './ae_string_snippets';
import {string_snippets} from './ae_string_snippets';
export let ae_snip = string_snippets;
export let ae_html =
{
'not_set': html__not_set,
};
// export let ae_snip =
// {
// 'not_set': html__not_set,
// 'classes__events_pres_mgmt_menu': classes__events_pres_mgmt_menu
// };
// *** BEGIN *** Longer-term app data. This should be stored to local storage.
export let ae_app_local_data_struct: key_val = {
@@ -172,6 +175,7 @@ export let ae_loc: Writable<key_val> = localStorageStore('ae_loc', ae_app_local_
// *** BEGIN *** Temporary app data. This should be stored to session storage.
export let ae_app_session_data_struct: key_val = {
'ver': '2024-02-27_13',
'log_lvl': 0,
// 'name': 'Aether App Template',
// 'theme': 'light',
// 'account_id': ae_account_id,

13
src/lib/ae_string_snippets.ts
View File

@@ -1,13 +1,18 @@
// These are shared snippets of text, This is mostly HTML and CSS.
let html__not_set = `
export let string_snippets: any = {};
string_snippets['html__not_set'] = `
<span
class="text-sm text-gray-500 bg-gray-100 p-1 rounded-md border border-gray-200"
>-- not set --
</span>
`;
string_snippets['classes__events_pres_mgmt_menu'] = 'flex flex-col items-center space-y-1 border border-blue-200 rounded-md py-1 px-2 hover:bg-blue-100';
export {
html__not_set,
};
string_snippets['classes__events_pres_mgmt_menu__button'] = 'btn btn-sm mx-1 variant-soft-tertiary text-info-300 hover:text-info-800';
string_snippets['classes__events_pres_mgmt_menu__button_highlight'] = 'btn btn-sm mx-1 variant-filled-tertiary text-info-300 hover:text-info-800';
string_snippets['classes__events_pres_mgmt_menu__button_warning'] = 'btn btn-sm mx-1 variant-soft-warning text-info-300 hover:text-info-800';
// export string_snippets;

4
src/lib/element_ae_crud.svelte
View File

@@ -13,7 +13,7 @@ import { core_func } from '$lib/ae_core_functions';
// *** Import Aether module components
// *** Export/Exposed variables and functions for component
export let log_lvl: number = 1;
export let log_lvl: number = 0;
export let trigger_patch: any = null;
export let api_cfg: key_val = {'api_crud_super_key': null};
// export let api_crud_super_key: null|string = api_cfg.api_crud_super_key;
@@ -56,7 +56,6 @@ const dispatch = createEventDispatcher();
onMount(() => {
// console.log('** Element Mounted: ** Element AE CRUD');
if (log_lvl) {
console.log(`Element AE CRUD: Object Type: ${object_type}; Object ID: ${object_id}; Field Name: ${field_name}; Field Value: ${field_value} (Original: ${original_field_value})`);
// ; Super Key: ${api_crud_super_key}
@@ -66,7 +65,6 @@ onMount(() => {
$: if (trigger_patch == true) {
console.log('AE CRUD: Patch triggered!');
// console.log(trigger_patch);
trigger_patch = null;
handle_obj_field_patch(field_value);
}

2
src/lib/element_manage_event_file_li.svelte
View File

@@ -65,7 +65,7 @@ onMount(() => {
$slct_trigger = 'load__event_file_obj_li';
ae_tmp.show__file_li = true;
}}
class="btn btn-sm p-1 m-1 variant-soft-secondary hover:variant-ghost-warning float-right transition hover:transition-all"
class="btn btn-sm p-1 m-1 variant-soft-tertiary hover:variant-ghost-warning float-right transition hover:transition-all"
class:hidden={display_mode != 'default' && !$ae_loc.administrator_access}
title="Refresh the list of files"
>

25
src/routes/+layout.ts
View File

@@ -1,12 +1,10 @@
/** @type {import('./$types').LayoutLoad} */
// console.log(`ae_root +layout.ts start`);
// console.log(`ae_root +layout.ts: start`);
import { error } from '@sveltejs/kit';
import { get } from 'svelte/store';
import { browser } from '$app/environment';
// import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
import { core_func } from '$lib/ae_core_functions';
import type { key_val } from '$lib/ae_stores';
@@ -90,7 +88,7 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
// console.log(`ae_ ds_code_li = `, ds_code_li);
let ds_code: null|string = null;
let data_struct = {
let data_struct: key_val = {
// ae_acct should only be updated and referenced by the corresponding account_id.
account_id: null,
ae_acct: {
@@ -178,10 +176,6 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
}
// console.log(ae_loc_init);
// if (browser) {
// localStorage.setItem('ae_account_id', await account_id);
// }
// NOTE: We need to wait for the account_id to be returned before we can continue. It is required for the api_cfg.
let ds_type: null|string = 'json';
ds_code = 'hub__page__access_code_li_json';
@@ -223,16 +217,3 @@ export async function load({ fetch, params, parent, route, url }) { // params, r
return data_struct;
}
// ds_type = 'text';
// ds_code = 'hub__site__appshell_header';
// ds_code_li[ds_code] = await core_func.handle_load_ae_obj_code__data_store({api_cfg: ae_api_tmp, code: ds_code, data_type: ds_type})
// .then(function (ds_results) {
// if (ds_results) {
// console.log(`ae_ ds_results = `, ds_results);
// return ds_results;
// }
// }
// );

24
src/routes/events_pres_mgmt/ae_comp__event_presenter_obj_li.svelte
View File

@@ -11,7 +11,7 @@ import type { key_val } from '$lib/ae_stores';
import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
import { db_events } from "$lib/db_events";
import { ae_html, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
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_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
@@ -112,8 +112,8 @@ onMount(() => {
});
// }
}}
class="btn btn-sm p-1 m-1 variant-soft-secondary hover:variant-ghost-warning float-right transition hover:transition-all"
class:hidden={display_mode != 'default' && !$ae_loc.administrator_access}
class="btn btn-sm p-1 m-1 variant-soft-tertiary hover:variant-ghost-warning float-right transition hover:transition-all"
class:hidden={!$ae_loc.trusted_access || display_mode != 'default'}
title="Refresh the list of presenters"
>
<span class="fas fa-sync-alt mx-1"></span>
@@ -135,7 +135,7 @@ onMount(() => {
<!-- This is a hack. I can not get the LiveQuery to work with specific presentation IDs. It only works with the session ID. I need to figure out how to get the presenters for the specific presentation. -->
<!-- {#if event_presenter_obj.event_presentation_id_random == event_presentation_obj.event_presentation_id_random} -->
<li>
<button
<!-- <button
type="button"
disabled={!($ae_loc.trusted_access || $events_loc.auth__kv.session[$events_slct.event_session_id]) && (!$events_loc.auth__kv.presenter[event_presenter_obj.event_presenter_id_random] || !event_presenter_obj.agree)}
on:click={
@@ -159,7 +159,18 @@ onMount(() => {
<span class="text-center grow">
{event_presenter_obj.full_name}
</span>
</button>
</button> -->
<a
href="/events_pres_mgmt/presenter/{event_presenter_obj.event_presenter_id_random}"
class="btn variant-ghost-primary hover:variant-filled-primary font-bold min-w-64 my-0.5"
class:btn-sm={display_mode != 'default'}
title="Person ID: {event_presenter_obj.person_id_random}; Email: {event_presenter_obj.email}"
>
<span class="fas fa-user mx-1"></span>
<span class="text-center grow">
{event_presenter_obj.full_name}
</span>
</a>
{#if $ae_loc.trusted_access || !$events_loc.auth__person?.id }
@@ -194,7 +205,7 @@ onMount(() => {
}
);
}}
class="btn variant-ghost-primary hover:variant-filled-primary my-0.5"
class="btn variant-ghost-secondary hover:variant-filled-secondary my-0.5"
class:btn-sm={display_mode != 'default'}
title="Email the access link to the presenter"
>
@@ -307,6 +318,7 @@ onMount(() => {
log_lvl: 1,
})
}}
class:hidden={!$ae_loc.edit_mode}
class="btn btn-sm variant-soft-warning hover:variant-filled-warning"
>
<span class="fas fa-plus mx-1"></span>

11
src/routes/events_pres_mgmt/event/[slug]/+page.svelte
View File

@@ -18,7 +18,7 @@ import Comp_event_session_obj_li from './ae_comp__event_session_obj_li.svelte';
import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
import { db_events } from "$lib/db_events";
import { ae_html, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
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';
@@ -405,16 +405,21 @@ async function handle_search__event_session(
{/if}
<div
class="pres_mgmt__session_search_help flex flex-col items-center space-y-1 border border-blue-200 rounded-md py-1 px-2 hover:bg-blue-100"
class="pres_mgmt__session_search_help {ae_snip.classes__events_pres_mgmt_menu}"
class:border-none={!$events_loc.pres_mgmt.show_content__session_search_help}
>
<div>
<!-- <a href="/events_pres_mgmt/x/" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
<span class="fas fa-home mx-1"></span>
X
</a> -->
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__session_search_help = !$events_loc.pres_mgmt.show_content__session_search_help;
}}
class="btn btn-sm mx-1 variant-soft-tertiary text-info-300 hover:text-info-800"
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>

7
src/routes/events_pres_mgmt/event/[slug]/ae_comp__event_session_obj_li.svelte
View File

@@ -13,7 +13,7 @@ import Element_manage_event_file_li from '$lib/element_manage_event_file_li.svel
import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
import { db_events } from "$lib/db_events";
import { ae_html, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
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_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
@@ -27,6 +27,7 @@ export let event_session_id_random_li: Array<string> = ['']; // 'VSBH-19-41-50'
// export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
// Variables
// let ae_promises: key_val = {};
let ae_tmp: key_val = {};
let ae_triggers: key_val = {};
@@ -198,7 +199,7 @@ let lq_kv__event_session_obj_li = liveQuery(
{ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_short')}
</span>
{:else}
{@html ae_html.not_set}
{@html ae_snip.html__not_set}
{/if}
</span>
</td>
@@ -221,7 +222,7 @@ let lq_kv__event_session_obj_li = liveQuery(
</span>
{/if}
{:else}
{@html ae_html.not_set}
{@html ae_snip.html__not_set}
{/if}
{#if $ae_loc.trusted_access}

6
src/routes/events_pres_mgmt/session/[slug]/form_agree.svelte → src/routes/events_pres_mgmt/form_agree.svelte
View File

@@ -20,9 +20,9 @@ import { events_func } from '$lib/ae_events_functions';
let ae_triggers: key_val = {};
let ae_promises: key_val = {}; // Promise<any>;
let lq__event_session_obj = liveQuery(
() => db_events.sessions.get($events_slct.event_session_id)
);
// let lq__event_session_obj = liveQuery(
// () => db_events.sessions.get($events_slct.event_session_id)
// );
// let lq__event_presentation_obj = liveQuery(
// async () => await db_events.presentations.get($events_slct.event_presentation_id)

286
src/routes/events_pres_mgmt/presenter/[slug]/+page.svelte Normal file
View File

@@ -0,0 +1,286 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
// Imports
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.svelte';
// import Comp_event_session_obj_li from './ae_comp__event_session_obj_li.svelte';
import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
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 Form_agree from './../../form_agree.svelte';
import Presenter_view from './../../presenter_view.svelte';
// Exports
export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
// 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;
$events_slct.event_presenter_id = ae_acct.slct.event_presenter_id;
$events_slct.event_presenter_obj = ae_acct.slct.event_presenter_obj;
$events_slct.event_file_obj_li = ae_acct.slct.event_file_obj_li;
$events_sess.pres_mgmt.show_content__agree_text = false;
$events_sess.pres_mgmt.show_content__presenter_start = false;
let lq__event_presenter_obj = liveQuery(
() => db_events.presenters.get($events_slct.event_presenter_id)
);
$events_slct.lq__event_presenter_obj = lq__event_presenter_obj;
// Functions and Logic
</script>
<svelte:head>
<title>Presenter {$lq__event_presenter_obj?.full_name} ({$lq__event_presenter_obj?.event_presenter_id}) - Pres Mgmt - {$events_loc?.title}</title>
</svelte:head>
<section
class="ae_events_pres_mgmt_event_presenter md:container h-full mx-auto flex flex-col space-y-4 pt-0 pb-8"
>
<div
class="pres_mgmt__presenter_view_menu {ae_snip.classes__events_pres_mgmt_menu}"
class:border-none={!$events_loc.pres_mgmt.show_content__presenter_page_help}
>
<div>
<a href="/events_pres_mgmt/event/{$events_slct.event_presenter_obj.event_id_random}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
<span class="fas fa-arrow-left mx-1"></span>
Back to Session Search
</a>
<a href="/events_pres_mgmt/session/{$events_slct.event_presenter_obj.event_session_id_random}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
<span class="fas fa-arrow-left mx-1"></span>
Back to Session
</a>
{#if $lq__event_presenter_obj?.agree}
<!-- {#if $ae_loc.trusted_access || $events_loc.auth__kv.presenter[$events_slct.event_presenter_obj.event_presenter_id_random]} -->
<button
type="button"
disabled={!$ae_loc.trusted_access && !$events_loc.auth__kv.presenter[$events_slct.event_presenter_obj.event_presenter_id_random]}
on:click={
() => {
$events_slct.event_presentation_id = $events_slct.event_presenter_obj.event_presentation_id_random;
$events_slct.event_presentation_obj = $events_slct.event_presentation_obj;
$events_slct.event_presenter_id = $events_slct.event_presenter_obj.event_presenter_id_random;
$events_slct.event_presenter_obj = $events_slct.event_presenter_obj;
$events_sess.pres_mgmt.show_content__agree_text = $events_slct.event_presenter_obj.event_presenter_id_random;
}
}
class="{ae_snip.classes__events_pres_mgmt_menu__button} hover:variant-filled-success"
title="Agreed to terms and conditions"
>
<span class="fas fa-check text-green-500 px-1" title="Agreed to terms and conditions"></span>
Agreed
</button>
{:else}
<button
type="button"
disabled={!$ae_loc.trusted_access && !$events_loc.auth__kv.presenter[$events_slct.event_presenter_obj.event_presenter_id_random]}
on:click={
() => {
$events_slct.event_presentation_id = $events_slct.event_presenter_obj.event_presentation_id_random;
$events_slct.event_presentation_obj = $events_slct.event_presentation_obj;
$events_slct.event_presenter_id = $events_slct.event_presenter_obj.event_presenter_id_random;
$events_slct.event_presenter_obj = $events_slct.event_presenter_obj;
$events_sess.pres_mgmt.show_content__agree_text = $events_slct.event_presenter_obj.event_presenter_id_random;
}
}
class="{ae_snip.classes__events_pres_mgmt_menu__button_warning} hover:variant-filled-warning"
title="View terms and conditions"
>
<span class="fas fa-times bg-red-500 text-white px-1 mx-1" title="Not agreed to terms and conditions"></span>
Not yet agreed
</button>
{/if}
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__presenter_page_help = !$events_loc.pres_mgmt.show_content__presenter_page_help;
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $events_loc.pres_mgmt.show_content__presenter_page_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
<Element_data_store
ds_code="events__pres_mgmt__presenter_view_help"
ds_name="Default: Events - Pres Mgmt Session Search Help"
ds_type="html"
for_type="event"
for_id={$events_slct.event_id}
class_li="bg-yellow-100 p-2 rounded-md border border-yellow-200"
show_edit={false}
show_edit_btn={true}
hide={!$events_loc.pres_mgmt.show_content__presenter_page_help}
/>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__presenter_page_help = !$events_loc.pres_mgmt.show_content__presenter_page_help;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$events_loc.pres_mgmt.show_content__presenter_page_help}
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $events_loc.pres_mgmt.show_content__presenter_page_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
</div>
{#if !$lq__event_presenter_obj}
<span class="fas fa-spinner fa-spin mx-1"></span>
<span>Loading...</span>
{:else}
<!-- {$lq__event_presenter_obj?.full_name} -->
{/if}
<!-- <hr class="w-full border border-gray-200" /> -->
<!-- {#await $events_slct.event_presenter_obj}
<span class="fas fa-spinner fa-spin text-xl text-blue-500"></span>
{:then result} -->
<Presenter_view
event_presenter_id={$events_slct.event_presenter_id}
event_presentation_id={$events_slct.event_presenter_obj?.event_presentation_id_random}
/>
<!-- {:catch error}
<div class="text-red-800">
<span class="fas fa-exclamation-triangle text-xl"></span>
<span>Error: {error.message}</span>
</div>
{/await} -->
<!-- {$events_slct.event_presentation_id ?? 'Unknown ID'} -->
</section>
{#if $events_sess.pres_mgmt?.show_content__agree_text}
<div class="ae_quick_modal_container">
<section class="ae_quick_popover">
<div class="flex flex-col items-center">
<!-- <div class="h-4 p-10"> -->
<!-- </div> -->
<section class="ae_modal_scrollfix">
<button
on:click={
() => {
$events_sess.pres_mgmt.show_content__agree_text = null;
}
}
class="btn btn-md variant-soft-secondary hover:variant-filled-secondary float-right"
>
<span class="fas fa-times mx-1"></span>
Close
</button>
<Form_agree />
</section>
<!-- <div class="h-12"> -->
<button
on:click={
() => {
$events_sess.pres_mgmt.show_content__agree_text = null;
}
}
class="btn btn-md variant-soft-secondary hover:variant-filled-secondary"
>
<span class="fas fa-times mx-1"></span>
Close
</button>
<!-- </div> -->
</div>
</section>
</div>
{/if}
<style lang="postcss">
/* Use the div.ae_quick_modal_container to block background clicks when using the section.ae_quick_popover. */
div.ae_quick_modal_container {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
background-color: hsla(0, 0%, 50%, .75);
/* padding: 1rem; */
/* border: solid thick red; */
}
/* The section.ae_quick_popover should be above the rest of the content and centered on the page. */
section.ae_quick_popover {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 100;
background-color: hsla(0, 0%, 97%, .97);
/* margin-top: 1rem;
margin-bottom: 2rem; */
/* padding: 1rem;
padding-top:4rem; */
/* padding-bottom: 4rem; */
border: solid thin hsla(0, 0%, 0%, .9);
border-radius: .5rem;
box-shadow: 0 0 1rem hsla(0, 0%, 0%, .5);
min-height: 30%;
/* max-height: 100vh; */
min-width: 80%;
/* overflow-y: auto; */
}
</style>

53
src/routes/events_pres_mgmt/presenter/[slug]/+page.ts Normal file
View File

@@ -0,0 +1,53 @@
/** @type {import('./$types').PageLoad} */
console.log(`ae_p_event_presenter [slug] +page.ts: start`);
import { events_func } from '$lib/ae_events_functions';
export async function load({ parent }) { // route
let log_lvl = 0;
// console.log(`ae_events_pres_mgmt_event +page.ts data.params:`, params);
// console.log(`ae_events_pres_mgmt_event +page.ts data.route:`, route);
// console.log(`ae_events_pres_mgmt_event +page.ts data.url:`, url);
let data = await parent();
// console.log(`ae_events_pres_mgmt_event +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);
let event_presenter_id = data.params.slug;
if (!event_presenter_id) {
console.log(`ae_p_event_presenter [slug] +page.ts: The event_presenter_id was not found in the data.params.slug!!!`);
return false;
}
ae_acct.slct.event_presenter_id = event_presenter_id;
let load_event_presenter_obj = events_func.handle_load_ae_obj_id__event_presenter({api_cfg: ae_acct.api, event_presenter_id: event_presenter_id, try_cache: false});
ae_acct.slct.event_presenter_obj = await load_event_presenter_obj;
let load_event_file_obj_li = await events_func.handle_load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
for_obj_type: 'event_presenter',
for_obj_id: event_presenter_id,
params: {enabled: 'all', qry__limit: 50},
try_cache: false
})
.then((event_file_obj_li) => {
if (log_lvl) {
console.log(`event_file_obj_li = `, event_file_obj_li);
}
return event_file_obj_li;
});
if (log_lvl) {
console.log(`load_event_file_obj_li = `, load_event_file_obj_li);
}
ae_acct.slct.event_file_obj_li = load_event_file_obj_li;
// WARNING: Precaution against shared data between sites and presentations.
data[account_id] = ae_acct;
return data;
}

78
src/routes/events_pres_mgmt/session/[slug]/presenter_view.svelte → src/routes/events_pres_mgmt/presenter_view.svelte
View File

@@ -20,6 +20,10 @@ 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';
// Exports
export let event_presenter_id: string;
// export let event_presentation_obj: key_val;
export let event_presentation_id: null|string = null;
let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {}; // Promise<any>;
@@ -33,20 +37,26 @@ let ae_triggers: key_val = {};
// );
// let lq__event_presentation_obj = liveQuery(
// async () => await db_events.presentations.get($events_slct.event_presentation_id)
// async () => await db_events.presentations.get(event_presentation_id)
// );
console.log(`$events_slct.event_presenter_id:`, $events_slct.event_presenter_id);
console.log(`event_presenter_id:`, event_presenter_id);
let lq__event_presenter_obj = liveQuery(
() => db_events.presenters.get($events_slct.event_presenter_id)
async () => await db_events.presenters.get(event_presenter_id)
);
// let event_presentation_id: null|string = $lq__event_presenter_obj?.event_presentation_id_random ?? '';
// event_presentation_id = $lq__event_presenter_obj?.event_presentation_id_random ?? event_presentation_id;
console.log(`event_presentation_id:`, event_presentation_id);
$events_slct.event_presentation_id = event_presentation_id;
// event_presentation_id = $lq__event_presenter_obj?.event_presentation_id_random;
let lq__event_presentation_obj = liveQuery(
() => db_events.presentations.get($events_slct.event_presentation_id)
() => db_events.presentations.get(event_presentation_id)
);
// export let event_presentation_obj: any = $lq__event_presentation_obj;
let lq__event_file_obj_li = liveQuery(
async () => await db_events.files.where('event_presenter_id_random').equals($events_slct.event_presenter_id).toArray()
async () => await db_events.files.where('event_presenter_id_random').equals(event_presenter_id).toArray()
);
@@ -72,7 +82,7 @@ $slct.person_obj_kv = {}; // This is intended for the POC lookup list when gener
onMount(() => {
console.log('Events Session [slug]: presenter_view.svelte');
console.log(`$events_slct.event_presenter_id:`, $events_slct.event_presenter_id);
console.log(`event_presenter_id:`, event_presenter_id);
$slct_trigger = 'load__event_file_obj_li';
// ae_tmp.biography = $lq__event_presenter_obj?.biography;
@@ -107,7 +117,7 @@ async function handle_input_upload_files(input_upload_files) {
console.log('*** handle_input_upload_files() ***');
let link_to_type = 'event_presenter';
let link_to_id = $events_slct.event_presenter_id;
let link_to_id = event_presenter_id;
const form_data = new FormData();
@@ -208,7 +218,7 @@ async function handle_delete__event_file({event_file_id}) {
console.log(`*** handle_delete__event_file() *** event_file_id:`, event_file_id);
let link_to_type = 'event_presenter';
let link_to_id = $events_slct.event_presenter_id;
let link_to_id = event_presenter_id;
ae_promises.delete__event_file_obj = await events_func.handle_delete_ae_obj_id__event_file({
api_cfg: $ae_api,
@@ -267,7 +277,7 @@ async function handle_delete__event_file({event_file_id}) {
type="button"
use:clipboard={encodeURI(`${$ae_loc.url_origin}/events_pres_mgmt/session/${$events_slct.event_session_id}?person_id=${$lq__event_presenter_obj.person_id_random}&person_pass=${$lq__event_presenter_obj.person_passcode}&presentation_id=${$lq__event_presenter_obj.event_presentation_id_random}&presenter_id=${$lq__event_presenter_obj.event_presenter_id_random}`)}
use:clipboard={encodeURI(`${$ae_loc.url_origin}/events_pres_mgmt/session/${$lq__event_presenter_obj.event_session_id_random}?person_id=${$lq__event_presenter_obj.person_id_random}&person_pass=${$lq__event_presenter_obj.person_passcode}&presentation_id=${$lq__event_presenter_obj.event_presentation_id_random}&presenter_id=${$lq__event_presenter_obj.event_presenter_id_random}`)}
class="btn btn-sm variant-ghost-warning float-right m-1"
title="Copy the presenter access link to the clipboard."
>
@@ -278,6 +288,12 @@ async function handle_delete__event_file({event_file_id}) {
</h2>
<section class="p-2">
<h3 class="h4">
<span class="text-md font-normal">
Session:
</span>
<a href="/events_pres_mgmt/session/{$lq__event_presenter_obj.event_session_id_random}">{$lq__event_presenter_obj.event_session_name}</a>
</h3>
<h3 class="h4">
<Element_ae_crud
api_cfg={$ae_api}
@@ -297,12 +313,20 @@ async function handle_delete__event_file({event_file_id}) {
events_func.handle_load_ae_obj_id__event_presentation({api_cfg: $ae_api, event_presentation_id: $lq__event_presentation_obj?.event_presentation_id_random, log_lvl: 1});
}}
>
Title: "{$lq__event_presentation_obj?.name}"
<span class="text-md font-normal">
Presentation Title:
</span>
"{$lq__event_presentation_obj?.name}"
</Element_ae_crud>
<!-- Title: "{$lq__event_presentation_obj?.name}" -->
</h3>
<h3 class="h4">Presenter:</h3>
<h3 class="h4">
<span class="text-md font-normal">
Presenter:
<span class="text-md font-normal">
</h3>
<ul
class="space-y-2 px-4"
>
@@ -338,7 +362,9 @@ async function handle_delete__event_file({event_file_id}) {
});
}}
>
<span class="font-bold">
{$lq__event_presenter_obj.given_name}
</span>
</Element_ae_crud>
<Element_ae_crud
api_cfg={$ae_api}
@@ -363,7 +389,9 @@ async function handle_delete__event_file({event_file_id}) {
});
}}
>
<span class="font-bold">
{$lq__event_presenter_obj.family_name}
</span>
</Element_ae_crud>
<!-- </div> -->
<!-- {/if} -->
@@ -404,11 +432,13 @@ async function handle_delete__event_file({event_file_id}) {
}}
>
<span class="fas fa-envelope"></span>
<span class="font-bold">
<a
href="mailto:{$lq__event_presenter_obj.email}"
class="text-blue-500"
title="Presenter's email address"
>{$lq__event_presenter_obj.email}</a>
</span>
</Element_ae_crud>
{#if $lq__event_presenter_obj.person_primary_email != $lq__event_presenter_obj.email}
@@ -438,11 +468,13 @@ async function handle_delete__event_file({event_file_id}) {
>
<span class="fas fa-star-of-life"></span>
<span class="fas fa-envelope"></span>
<span class="font-bold">
<a
href="mailto:{$lq__event_presenter_obj.person_primary_email}"
class="text-blue-500"
title="Person's primary email address"
>{$lq__event_presenter_obj.person_primary_email}</a>
</span>
</Element_ae_crud>
<!-- We need a way to let them re-sync the email addresses. The update here should flow back to the person.primary_email. -->
@@ -514,7 +546,9 @@ async function handle_delete__event_file({event_file_id}) {
}}
>
<span class="fas fa-building"></span>
<span class="font-bold">
{$lq__event_presenter_obj.affiliations ?? '-- affiliations not set --'}
</span>
</Element_ae_crud>
{#if $lq__event_presenter_obj.person_affiliations != $lq__event_presenter_obj.affiliations}
@@ -544,7 +578,9 @@ async function handle_delete__event_file({event_file_id}) {
>
<span class="fas fa-star-of-life"></span>
<span class="fas fa-building"></span>
<span class="font-bold">
{$lq__event_presenter_obj.person_affiliations ?? '-- affiliations not set --'}
</span>
</Element_ae_crud>
<Element_ae_crud
@@ -615,10 +651,14 @@ async function handle_delete__event_file({event_file_id}) {
}}
>
<span class="fas fa-user-tag"></span>
<span class="font-bold">
{$lq__event_presenter_obj.professional_title && $lq__event_presenter_obj.professional_title.length ? $lq__event_presenter_obj.professional_title : '-- professional title not set --'}
</span>
</Element_ae_crud>
</li>
<li>
<li
class:hidden={!$ae_loc.trusted_access && !$events_loc.auth__kv.presenter[$lq__event_presenter_obj.event_presenter_id_random]}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'person'}
@@ -644,7 +684,11 @@ async function handle_delete__event_file({event_file_id}) {
>
<span class="fas fa-user-secret"></span>
Passcode:
<span
class="font-bold"
>
{$lq__event_presenter_obj.person_passcode ?? '-- passcode not set --'}
</span>
</Element_ae_crud>
<!-- <span class="fas fa-user-secret"></span>
@@ -893,7 +937,7 @@ async function handle_delete__event_file({event_file_id}) {
$slct_trigger = 'load__event_file_obj_li';
ae_tmp.show__file_li = true;
}}
class="btn btn-sm variant-soft-secondary hover:variant-ghost-warning float-right transition hover:transition-all"
class="btn btn-sm variant-soft-tertiary hover:variant-ghost-warning float-right transition hover:transition-all"
>
<span class="fas fa-sync-alt mx-1"></span>
Refresh Files
@@ -950,8 +994,8 @@ WARNING: The file upload and management is a work in progress. You can upload an
<span class="fas fa-spinner fa-spin mx-1"></span>
<span class="">
Uploading
{#if $ae_sess.api_upload_kv[$events_slct.event_presenter_id]}
{$ae_sess.api_upload_kv[$events_slct.event_presenter_id].percent_completed}%
{#if $ae_sess.api_upload_kv[event_presenter_id]}
{$ae_sess.api_upload_kv[event_presenter_id].percent_completed}%
{/if}
</span>
{:then}
@@ -976,8 +1020,8 @@ WARNING: The file upload and management is a work in progress. You can upload an
<Element_manage_event_file_li
link_to_type={'event_presenter'}
link_to_id={$lq__event_presenter_obj.event_presenter_id_random}
allow_basic={$events_loc.auth__kv.session[$events_slct.event_session_id] || $events_loc.auth__kv.presenter[$events_slct.event_presenter_id]}
allow_moderator={$events_loc.auth__kv.session[$events_slct.event_session_id]}
allow_basic={$events_loc.auth__kv.session[$lq__event_presenter_obj.event_session_id_random] || $events_loc.auth__kv.presenter[event_presenter_id]}
allow_moderator={$events_loc.auth__kv.session[$lq__event_presenter_obj.event_session_id_random]}
container_class_li={''}
/>
</div>

97
src/routes/events_pres_mgmt/session/[slug]/+page.svelte
View File

@@ -20,12 +20,12 @@ let ae_triggers: key_val = {};
import { liveQuery } from "dexie";
import { core_func } from '$lib/ae_core_functions';
import { db_events } from "$lib/db_events";
import { ae_html, ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
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_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Form_agree from './form_agree.svelte';
import Presenter_view from './presenter_view.svelte';
import Form_agree from '../../form_agree.svelte';
import Presenter_view from '../../presenter_view.svelte';
import Comp_event_presenter_obj_li from '../../ae_comp__event_presenter_obj_li.svelte';
import Element_manage_event_file_li from '$lib/element_manage_event_file_li.svelte';
@@ -333,7 +333,8 @@ $: if ($slct_trigger == 'load__event_file_obj_li') {
events_func.handle_load_ae_obj_li__event_file({
api_cfg: $ae_api,
event_session_id: $events_slct.event_session_id,
for_obj_type: 'event_session',
for_obj_id: $events_slct.event_session_id,
try_cache: false
});
}
@@ -465,49 +466,23 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
>
<div
class="pres_mgmt__session_help flex flex-col items-center space-y-2 border border-blue-200 rounded-md p-2 hover:bg-blue-100"
class="pres_mgmt__session_menu {ae_snip.classes__events_pres_mgmt_menu}"
class:border-none={!$events_loc.pres_mgmt.show_content__session_help}
>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__session_help = !$events_loc.pres_mgmt.show_content__session_help;
}}
class="btn btn-sm mx-1 variant-soft-tertiary text-info-300 hover:text-info-800"
title="Help and information about the session"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $events_loc.pres_mgmt.show_content__session_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
<Element_data_store
ds_code="events__pres_mgmt__session_help"
ds_name="Default: Events - Pres Mgmt Session Help"
ds_type="html"
for_type="event"
for_id={$events_slct.event_id}
class_li="bg-yellow-100 p-2 rounded-md border border-yellow-200"
show_edit={false}
show_edit_btn={true}
hide={!$events_loc.pres_mgmt.show_content__session_help}
/>
<div>
<a href="/events_pres_mgmt/event/{$events_slct.event_session_obj.event_id_random}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
<span class="fas fa-arrow-left mx-1"></span>
Back to Session Search
</a>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__session_help = !$events_loc.pres_mgmt.show_content__session_help;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$events_loc.pres_mgmt.show_content__session_help}
title="Help and information about the session search"
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
title="Help and information about the session"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $events_loc.pres_mgmt.show_content__session_help}
@@ -517,13 +492,45 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
{/if}
Help?
</button>
</div>
</div>
<Element_data_store
ds_code="events__pres_mgmt__session_help"
ds_name="Default: Events - Pres Mgmt Session Help"
ds_type="html"
for_type="event"
for_id={$events_slct.event_id}
class_li="bg-yellow-100 p-2 rounded-md border border-yellow-200"
show_edit={false}
show_edit_btn={true}
hide={!$events_loc.pres_mgmt.show_content__session_help}
/>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_content__session_help = !$events_loc.pres_mgmt.show_content__session_help;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$events_loc.pres_mgmt.show_content__session_help}
title="Help and information about the session search"
>
<span class="fas fa-question-circle mx-1"></span>
{#if $events_loc.pres_mgmt.show_content__session_help}
Hide
{:else}
Show
{/if}
Help?
</button>
</div>
</div>
{#if $events_slct.event_session_id && $lq__event_session_obj}
<h2 class="h2 text-center rounded-md p-2 bg-gray-300">
{@html $lq__event_session_obj?.name ?? ae_html.not_set}
{@html $lq__event_session_obj?.name ?? ae_snip.html__not_set}
</h2>
<!-- Information about the session -->
@@ -641,7 +648,7 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
</Element_ae_crud>
</li>
<li>
<strong class="text-sm">Location/Room:</strong> {@html $lq__event_session_obj.event_location_name ? $lq__event_session_obj.event_location_name : ae_html.not_set}
<strong class="text-sm">Location/Room:</strong> {@html $lq__event_session_obj.event_location_name ? $lq__event_session_obj.event_location_name : ae_snip.html__not_set}
{#if $ae_loc.trusted_access && $ae_loc.edit_mode}
<Element_ae_crud
@@ -751,7 +758,7 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
<li>
<strong class="text-sm">Moderator/Champion:</strong>
<span title={$lq__event_session_obj?.poc_person_id_random}>
{@html $lq__event_session_obj.poc_person_full_name ? $lq__event_session_obj.poc_person_full_name : ae_html.not_set}
{@html $lq__event_session_obj.poc_person_full_name ? $lq__event_session_obj.poc_person_full_name : ae_snip.html__not_set}
</span>
{#if $ae_loc.trusted_access && $ae_loc.edit_mode}
@@ -949,7 +956,7 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
{#if $ae_loc.administrator_access}
<li>
<strong class="text-sm">Session passcode:</strong> {@html $lq__event_session_obj.passcode ? $lq__event_session_obj.passcode : ae_html.not_set}
<strong class="text-sm">Session passcode:</strong> {@html $lq__event_session_obj.passcode ? $lq__event_session_obj.passcode : ae_snip.html__not_set}
</li>
{/if}
@@ -1004,7 +1011,7 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
>{$lq__event_session_obj.description}</pre>
{:else}
{@html ae_html.not_set}
{@html ae_snip.html__not_set}
{/if}
</Element_ae_crud>
</div>
@@ -1382,7 +1389,7 @@ $: if ($slct_trigger == 'load__event_presenter_obj_li') {
>{event_presentation_obj.description}</pre>
{:else}
{@html ae_html.not_set}
{@html ae_snip.html__not_set}
{/if}
<!-- {:else}
<div class="text-sm text-gray-500 bg-gray-100 p-1 rounded-md border border-gray-200"

3
src/routes/events_pres_mgmt/session/[slug]/+page.ts
View File

@@ -75,7 +75,8 @@ export async function load({ parent }) { // route
let load_event_file_obj_li = await events_func.handle_load_ae_obj_li__event_file({
api_cfg: ae_acct.api,
event_session_id: event_session_id,
for_obj_type: 'event_session',
for_obj_id: event_session_id,
params: {enabled: 'all', qry__limit: 50},
try_cache: false
})