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

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;
}