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

Work on location views and editing. Also session list clean up.

Browse Source
This commit is contained in:
Scott Idem
2024-09-03 14:51:36 -04:00
parent acf89f3fa5
commit 9a0112e884
12 changed files with 1981 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
src/lib/ae_events__event_presentation.ts
View File

@@ -11,11 +11,15 @@ export async function load_ae_obj_id__event_presentation(
{
api_cfg,
event_presentation_id,
try_cache=false,
log_lvl=0
inc_file_li = false,
inc_presenter_li = false,
try_cache = true,
log_lvl = 0
}: {
api_cfg: any,
event_presentation_id: string,
inc_file_li?: boolean,
inc_presenter_li?: boolean
try_cache?: boolean,
log_lvl?: number
}
@@ -35,8 +39,14 @@ export async function load_ae_obj_id__event_presentation(
})
.then(function (event_presentation_obj_get_result) {
if (event_presentation_obj_get_result) {
// This is expecting a list
db_save_ae_obj_li__event_presentation({obj_type: 'event_presentation', obj_li: [event_presentation_obj_get_result]});
if (try_cache) {
// This is expecting a list
db_save_ae_obj_li__event_presentation({
obj_type: 'event_presentation',
obj_li: [event_presentation_obj_get_result]
});
}
return event_presentation_obj_get_result;
} else {
console.log('No results returned.');
@@ -47,6 +57,20 @@ export async function load_ae_obj_id__event_presentation(
console.log('No results returned or failed.', error);
});
if (inc_file_li) {
// Load the files for the presentation
if (log_lvl) {
console.log(`Need to load the file list for the presentation now.`);
}
}
if (inc_presenter_li) {
// Load the presenters for the presentation
if (log_lvl) {
console.log(`Need to load the presenter list for the presentation now.`);
}
}
return ae_promises.load__event_presentation_obj;
}
@@ -55,19 +79,25 @@ export async function load_ae_obj_id__event_presentation(
export async function load_ae_obj_li__event_presentation(
{
api_cfg,
event_session_id,
params={},
try_cache=true,
log_lvl=0
for_obj_type,
for_obj_id,
inc_file_li = false,
inc_presenter_li = false,
params = {},
try_cache = true,
log_lvl = 0
}: {
api_cfg: any,
event_session_id: string,
for_obj_type: string,
for_obj_id: string,
inc_file_li?: boolean,
inc_presenter_li?: boolean
params?: key_val,
try_cache?: boolean,
log_lvl?: number
}
) {
console.log(`*** load_ae_obj_li__event_presentation() *** event_session_id=${event_session_id}`);
console.log(`*** load_ae_obj_li__event_presentation() *** for_obj_type=${for_obj_type} for_obj_id=${for_obj_id}`);
let enabled: string = (params.qry__enabled ?? 'enabled'); // all, disabled, enabled
let hidden: string = (params.qry__hidden ?? 'not_hidden'); // all, hidden, not_hidden
@@ -81,8 +111,8 @@ export async function load_ae_obj_li__event_presentation(
ae_promises.load__event_presentation_obj_li = await api.get_ae_obj_li_for_obj_id_crud({
api_cfg: api_cfg,
obj_type: 'event_presentation',
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,
@@ -96,7 +126,11 @@ export async function load_ae_obj_li__event_presentation(
})
.then(function (event_presentation_obj_li_get_result) {
if (event_presentation_obj_li_get_result) {
db_save_ae_obj_li__event_presentation({obj_type: 'event_presentation', obj_li: event_presentation_obj_li_get_result});
if (try_cache) {
db_save_ae_obj_li__event_presentation({
obj_type: 'event_presentation', obj_li: event_presentation_obj_li_get_result
});
}
return event_presentation_obj_li_get_result;
} else {
return [];
@@ -109,6 +143,21 @@ export async function load_ae_obj_li__event_presentation(
if (log_lvl) {
console.log('ae_promises.load__event_presentation_obj_li:', ae_promises.load__event_presentation_obj_li);
}
if (inc_file_li) {
// Load the files for the presentations
if (log_lvl) {
console.log(`Need to load the file list for each presentation now.`);
}
}
if (inc_presenter_li) {
// Load the presenters for the presentations
if (log_lvl) {
console.log(`Need to load the presenter list for each presentation now.`);
}
}
return ae_promises.load__event_presentation_obj_li;
}

17
src/lib/ae_events__event_session.ts
View File

@@ -136,15 +136,17 @@ export async function load_ae_obj_li__event_session(
for_obj_id,
inc_file_li = false,
inc_presentation_li = false,
params={},
try_cache=true,
log_lvl=0
order_by_li = {'priority': 'DESC', 'sort': 'DESC', 'start_datetime': 'ASC', 'name': 'ASC', 'updated_on': 'DESC', 'created_on': 'DESC'},
params = {},
try_cache = true,
log_lvl = 0
}: {
api_cfg: any,
for_obj_type: string,
for_obj_id: string,
inc_file_li?: boolean,
inc_presentation_li?: boolean,
order_by_li?: key_val,
params?: key_val,
try_cache?: boolean,
log_lvl?: number
@@ -170,7 +172,7 @@ export async function load_ae_obj_li__event_session(
use_alt_base: false, // NOTE: This will use the base_name_alt value instead of the base_name value
enabled: enabled,
hidden: hidden,
order_by_li: {'priority': 'DESC', 'sort': 'DESC', 'start_datetime': 'ASC', 'name': 'ASC', 'updated_on': 'DESC', 'created_on': 'DESC'},
order_by_li: order_by_li,
limit: limit,
offset: offset,
params_json: params_json,
@@ -239,8 +241,11 @@ export async function load_ae_obj_li__event_session(
let load_event_presentation_obj_li = load_ae_obj_li__event_presentation({
api_cfg: api_cfg,
event_session_id: event_session_id,
params: {enabled: 'all', qry__limit: 15},
for_obj_type: 'event_session',
for_obj_id: event_session_id,
inc_file_li: false, // This will need to be changed.
inc_presenter_li: false, // This will need to be changed.
params: {qry__enabled: 'all', qry__limit: 15},
try_cache: try_cache,
log_lvl: log_lvl
})

3
src/lib/ae_events_stores.ts
View File

@@ -192,13 +192,16 @@ let events_local_data_struct: key_val = {
saved_search__session: null,
// show_content__agree_text: false,
show_content__location_qr: false,
show_content__presentation_description: false,
show_content__presenter_page_help: true,
// show_content__presenter_start: false,
show_content__presenter_view: null,
show_content__presenter_qr: false,
show_content__session_description: false,
show_content__session_files: false,
show_content__session_help: true,
show_content__session_presentations: false,
show_content__session_search_view: null,
show_content__session_search_help: true,
show_content__session_view: null,

3
src/lib/api_get__crud_obj_li_v1.ts
View File

@@ -168,6 +168,9 @@ export async function get_ae_obj_li_for_obj_id_crud(
// NOTE: The order_by_li variable is in the "headers" because if is a the URL GET params do not handle multiple values very well. Maybe base64 encore in the future or something? Reminder that GET requests should not have a body (no JSON).
// NOTE: The order_by_li should be a key value pair of the property/DB field to sort and how to sort (ASC or DESC)
if (order_by_li) {
if (log_lvl) {
console.log('Order By:', order_by_li);
}
headers['order_by_li'] = order_by_li;
}

28
src/routes/events_pres_mgmt/ae_comp__event_session_obj_li.svelte
View File

@@ -22,7 +22,7 @@ export let lq__event_obj: any;
export let container_class_li: string|Array<string> = [];
export let link_to_type: string;
export let link_to_id: string;
export let event_session_id_random_li: Array<string> = ['']; // 'VSBH-19-41-50'
export let event_session_id_random_li: Array<string> = ['']; // ['']
export let hide__session_location: boolean = false;
export let hide__session_poc: boolean = false;
// export let allow_basic: boolean = false;
@@ -198,7 +198,7 @@ let lq_kv__event_session_obj_li = liveQuery(
</span>
</span>
<td>
<span class="flex flex-col items-center md:flex-row md:items-start">
<span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36">
{#if session_obj?.start_datetime}
<span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_us_short')}
@@ -214,6 +214,7 @@ let lq_kv__event_session_obj_li = liveQuery(
{/if}
</span>
</td>
<td
class:hidden={hide__session_location}
>
@@ -232,6 +233,18 @@ let lq_kv__event_session_obj_li = liveQuery(
{session_obj?.event_location_name ?? '-- not set --'}
</span>
{/if}
{#if $ae_loc.manager_access}
<a
href="/events_pres_mgmt/location/{session_obj?.event_location_id_random}"
class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary"
title="Location: {session_obj?.event_location_name} {session_obj?.event_location_id_random}"
>
<span class="fas fa-map-marker-alt mx-1"></span>
<!-- {@html session_obj?.event_location_name ? session_obj?.event_location_name : ae_snip.html__not_set} -->
</a>
{/if}
</td>
<td
class:hidden={hide__session_poc}
>
@@ -273,12 +286,11 @@ let lq_kv__event_session_obj_li = liveQuery(
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
({
api_cfg: $ae_api,
event_session_id: $events_slct?.event_session_id,
log_lvl: 1
})
events_func.load_ae_obj_id__event_session({
api_cfg: $ae_api,
event_session_id: $events_slct?.event_session_id,
log_lvl: 1
})
.then(function (load_results) {
ae_tmp[$events_slct.event_session_id].poc_person_id = null;
ae_tmp[$events_slct.event_session_id].show__edit_poc_person = false;

428
src/routes/events_pres_mgmt/ae_comp__event_session_obj_li_v2.svelte Normal file
View File

@@ -0,0 +1,428 @@
<script lang="ts">
// Imports
// import { onMount } from 'svelte';
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
// import { api, send_email } 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_presenter_obj_li from './ae_comp__event_presenter_obj_li.svelte';
import Element_manage_event_file_li from '$lib/element_manage_event_file_li_direct.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, events_trig_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
// Exports
export let lq__event_obj: any;
export let lq__event_session_obj_li: any; // This is probably not needed???
export let container_class_li: string|Array<string> = [];
export let link_to_type: string; // This is probably not needed???
export let link_to_id: string; // This is probably not needed???
export let event_session_id_random_li: Array<string>; // ['']
export let hide__session_location: boolean = false;
export let hide__session_poc: boolean = false;
export let show__session_files: boolean = false;
export let show__session_presentations: boolean = false;
// export let allow_basic: boolean = false;
// export let allow_moderator: boolean = false;
// 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 = {};
// let dq__where_type_val: string = link_to_type; // "event", "event_location", "event_track"
// let dq__where_type_id_val: string = `${link_to_type}_id_random`;
// let dq__where_eq_id_val: string = link_to_id;
// Functions and Logic
import { browser } from '$app/environment';
if (browser) {
console.log('Browser environment detected.');
}
// let lq__event_obj = liveQuery(
// () => db_events.events.get($events_slct.event_id)
// );
// let lq__event_session_obj_li = liveQuery(
// () => db_events.sessions
// .where(dq__where_type_id_val)
// .equals(dq__where_eq_id_val)
// .sortBy('name')
// );
// let lq_kv__event_session_obj_li = liveQuery(
// () => db_events.sessions
// .bulkGet(event_session_id_random_li)
// .then(results => {
// // console.log(`LQ Results:`, results);
// // If the results are an array
// if (results.length == 1) {
// // If the first item is undefined we need to do something.
// if (results[0] == undefined) {
// console.log('Something went wrong! No sessions found?');
// // return [];
// // return [{ id: '' }];
// // return 'NOTHING???';
// }
// return results;
// }else if (results.length > 1) {
// return results;
// } else {
// return ['No sessions found.'];
// }
// // return results;
// })
// .catch(error => {
// console.error(`LQ Error: ${error}`);
// return ['No sessions found.'];
// })
// .finally(() => {
// console.log(`LQ Finally:`, $lq_kv__event_session_obj_li);
// })
// );
</script>
<section class="ae_comp event_session_obj_li {container_class_li}">
{#if event_session_id_random_li?.length > 0 && event_session_id_random_li?.length == $lq__event_session_obj_li?.length}
<!-- {#if $events_slct.event_session_obj_li?.length == event_session_id_random_li?.length && event_session_id_random_li.length == $lq__event_session_obj_li?.length} -->
<!-- {#if $events_slct?.event_session_obj_li && $events_slct.event_session_obj_li.length > 0} -->
<!-- <section class="ae_h_scrollfix py-2 space-y-2"> -->
<section class="py-2 space-y-2 xs:max-w-sm lg:max-w-100 container overflow-x-scroll">
<h2 class="h3">
<span class="text-md">
Sessions:
</span>
{#if $lq__event_session_obj_li?.length}
<span class="text-3xl font-bold bg-success-100 px-4 border rounded-lg border-success-200"
title="Count {$lq__event_session_obj_li?.length ?? 'None'}"
>
<span class="fas fa-list-ol mx-4"></span>
{$lq__event_session_obj_li?.length ?? 'None'}
</span>
{/if}
</h2>
<table class="table table-auto table-striped table-hover">
<thead>
<tr>
<th>Session</th>
<th>Date</th>
<th>Start/End</th>
<th
class:hidden={hide__session_location}
>Location</th>
<th
class:hidden={hide__session_poc}
>POC</th>
</tr>
</thead>
<tbody>
<!-- {#each $events_slct?.event_session_obj_li as session_obj} -->
{#each $lq__event_session_obj_li as session_obj}
<tr
class:dim={session_obj?.hide}
>
<td>
<a
href="/events_pres_mgmt/session/{session_obj?.event_session_id_random}"
class="
btn btn-md
variant-ghost-secondary hover:variant-filled-secondary
min-w-full max-w-md
sm:w-80
md:max-w-xs md:p-2
sm:btn-sm
md:btn-md
"
title="{session_obj?.name} - {session_obj?.event_session_id_random}"
>
<span class="fas fa-eye mx-1"></span>
<!-- overflow-x-scroll -->
<span class="grow overflow-hidden">
<strong>{session_obj?.name}</strong>
</span>
{#if session_obj?.file_count_all}
<span class="badge variant-glass-success hover:variant-filled-success" title="{session_obj?.file_count_all}x files under session">
<span class="fas fa-file-alt mx-1"></span>
{session_obj?.file_count_all}x
</span>
{:else}
<!-- Nothing -->
{/if}
</a>
{#if show__session_presentations && $ae_loc.manager_access}
<Comp_event_presenter_obj_li
link_to_type={'event_session'}
link_to_id={session_obj?.event_session_id_random}
display_mode={'minimal'}
>
</Comp_event_presenter_obj_li>
{/if}
{#if show__session_files && $ae_loc.manager_access}
<Element_manage_event_file_li
link_to_type={'event_session'}
link_to_id={session_obj?.event_session_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]}
container_class_li={''}
display_mode={'minimal'}
/>
{/if}
</td>
<td>
<span class="flex flex-col">
<span>
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'dddd')}
</span>
<span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'date_long_month_day')}
</span>
</span>
<td>
<span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36">
{#if session_obj?.start_datetime}
<span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_us_short')}
</span>
<span class="grow">
&ndash;
</span>
<span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_us_short')}
</span>
{:else}
{@html ae_snip.html__not_set}
{/if}
</span>
</td>
<td
class:hidden={hide__session_location}
>
<!-- Minimum level access to see the link here is "trusted". -->
{#if $ae_loc.manager_access || $ae_loc.trusted_access && $lq__event_obj?.mod_pres_mgmt_json?.show__launcher_link}
<a
href="/events_pres_mgmt/launcher/{session_obj?.event_id_random}?location_id={session_obj?.event_location_id_random}"
class="text-blue-500 hover:text-blue-800 hover:underline"
title="Launcher: {session_obj?.event_location_name} {session_obj?.event_location_id_random}"
>
<span class="fas fa-paper-plane"></span>
{@html session_obj?.event_location_name ? session_obj?.event_location_name : ae_snip.html__not_set}
</a>
{:else}
<span>
{session_obj?.event_location_name ?? '-- not set --'}
</span>
{/if}
{#if $ae_loc.manager_access}
<a
href="/events_pres_mgmt/location/{session_obj?.event_location_id_random}"
class="btn btn-sm variant-ghost-secondary hover:variant-filled-secondary"
title="Location: {session_obj?.event_location_name} {session_obj?.event_location_id_random}"
>
<span class="fas fa-map-marker-alt mx-1"></span>
<!-- {@html session_obj?.event_location_name ? session_obj?.event_location_name : ae_snip.html__not_set} -->
</a>
{/if}
</td>
<td
class:hidden={hide__session_poc}
>
<span class="flex flex-col items-start lg:flex-row lg:items-center lg:justify-between">
{#if session_obj?.poc_person_full_name}
<span style="break-inside: avoid;" class="">
<span class="fas fa-user mx-1"></span>
{session_obj?.poc_person_full_name}
</span>
<!-- <br> -->
{#if $ae_loc.trusted_access}
<span style="break-inside: avoid;" class="text-xs">
<a href="mailto:{session_obj?.poc_person_primary_email}" class="hover:underline">
<span class="fas fa-envelope mx-1"></span>
{session_obj?.poc_person_primary_email}
</a>
</span>
{/if}
{:else}
{@html ae_snip.html__not_set}
{/if}
{#if $ae_loc.trusted_access}
{#if session_obj?.event_session_id_random == $events_slct.event_session_id && ae_tmp[$events_slct.event_session_id] && ae_tmp[$events_slct.event_session_id].show__edit_poc_person}
<Element_ae_crud
trigger_patch={ae_triggers.update_person_poc}
api_cfg={$ae_api}
object_type={'event_session'}
object_id={$events_slct?.event_session_id}
field_name={'poc_person_id_random'}
field_type={'button'}
field_value={ae_tmp[$events_slct.event_session_id].poc_person_id}
allow_null={false}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_session({
api_cfg: $ae_api,
event_session_id: $events_slct?.event_session_id,
log_lvl: 1
})
.then(function (load_results) {
ae_tmp[$events_slct.event_session_id].poc_person_id = null;
ae_tmp[$events_slct.event_session_id].show__edit_poc_person = false;
$events_slct.event_session_id = null;
$events_slct.event_obj = null;
// Careful with the trigger_patch. It will keep firing if not reset.
ae_triggers.update_person_poc = false;
// Maybe reload page?
// window.location.reload();
});
}}
>
{#await $slct.person_obj_li}
<span class="fas fa-spinner fa-spin mx-1"></span>
{:then person_obj_li}
{#if person_obj_li && person_obj_li.length > 0}
<label class="text-sm">PoC:
<select
bind:value={ae_tmp[$events_slct.event_session_id].poc_person_id}
class="select min-w-fit max-w-md text-sm"
>
<option value="">-- Select a person --</option>
{#each person_obj_li as person_obj}
<option
value={person_obj.person_id_random}
selected={person_obj.person_id_random == $events_slct?.event_session_obj?.poc_person_id_random}
>
{person_obj.full_name}
({person_obj.primary_email})
<!-- (ID: {person_obj.person_id_random}) -->
</option>
{/each}
</select>
</label>
<button
type="button"
disabled={ae_tmp[$events_slct.event_session_id].poc_person_id == $events_slct?.event_session_obj?.poc_person_id_random}
on:click={() => {
console.log('Save the POC person for the session.');
let person_id = ae_tmp[$events_slct.event_session_id].poc_person_id;
console.log('Selected person ID:', person_id);
ae_triggers.update_person_poc = true;
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
>
<span class="fas fa-save mx-1"></span>
Save
</button>
{/if}
{/await}
</Element_ae_crud>
{/if}
{#if ae_tmp[$events_slct.event_session_id] && ae_tmp[$events_slct.event_session_id].show__edit_poc_person}
<button
type="button"
on:click={() => {
console.log('Cancel the POC person for the session.');
ae_tmp[$events_slct.event_session_id].poc_person_id = null;
ae_tmp[$events_slct.event_session_id].show__edit_poc_person = false;
$events_slct.event_session_id = null;
$events_slct.event_obj = null;
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
>
<span class="fas fa-times mx-1"></span>
Cancel
</button>
{:else}
<button
type="button"
on:click={() => {
console.log('Edit the POC person for the session.');
let params = {
qry__limit: 300,
}
$slct.person_obj_li = core_func.handle_load_ae_obj_li__person({api_cfg: $ae_api, account_id: $slct.account_id, params: params});
$events_slct.event_session_id = session_obj?.event_session_id_random;
ae_tmp[$events_slct.event_session_id] = {
poc_person_id: session_obj?.poc_person_id_random,
show__edit_poc_person: true,
};
// }
// ae_tmp[$events_slct.event_session_id].poc_person_id = $events_slct?.event_session_obj?.poc_person_id_random;
// ae_tmp[$events_slct.event_session_id].show__edit_poc_person = true;
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
class:hidden={!$ae_loc.edit_mode}
>
<span class="fas fa-edit mx-1"></span>
Edit
</button>
{/if}
{/if} <!-- $ae_loc.trusted_access -->
</span> <!-- flex flex-col items-center md:flex-row md:items-start -->
</td>
</tr>
{/each}
</tbody>
</table>
</section>
{:else}
<p class="text-center text-2xl bg-gray-100 p-4 rounded-md">
<span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
No results to show. Please use the search above to find your session.
<span class="fas fa-exclamation-triangle text-2xl text-yellow-500"></span>
</p>
<!-- <div class="text-sm text-gray-500 text-center"> -->
<!-- Query results length: {$events_slct.event_session_obj_li?.length}; -->
<!-- ID list length: {event_session_id_random_li?.length}; -->
<!-- LQ results length: {$lq__event_session_obj_li?.length} -->
<!-- LQ KV results length: {$lq_kv__event_session_obj_li?.length} -->
<!-- </div> -->
{/if}
</section>

340
src/routes/events_pres_mgmt/location/[slug]/+page.svelte Normal file
View File

@@ -0,0 +1,340 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
let log_lvl = 1;
// console.log(`ae_events_pres_mgmt location [slug] +page.svelte data:`, data);
// Imports
import { onMount } from 'svelte';
import { clipboard } from '@skeletonlabs/skeleton';
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
// import { api, send_email } from '$lib/api';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store.svelte';
let ae_promises: key_val = {};
let ae_tmp: key_val = {};
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_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 Comp_event_files_upload from './../../ae_comp__event_files_upload.svelte';
import Comp_event_session_obj_li from './../../ae_comp__event_session_obj_li_v2.svelte';
import Element_manage_event_file_li_wrap from '$lib/element_manage_event_file_li_direct.svelte';
import Location_view from './../../location_view.svelte';
import Location_page_menu from './../../location_page_menu.svelte';
import { browser } from '$app/environment';
// Variables
if (browser) {
console.log('Browser environment detected.');
}
// 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_id = ae_acct.slct.event_id;
// $events_slct.event_obj = ae_acct.slct.event_obj;
$events_slct.event_location_id = ae_acct.slct.event_location_id;
// $events_slct.event_location_obj = ae_acct.slct.event_location_obj;
$events_slct.event_session_id = null;
// $events_slct.event_session_obj = null;
$events_slct.event_session_obj_li = ae_acct.slct.event_session_obj_li;
// $events_slct.event_file_obj_li = ae_acct.slct.event_file_obj_li;
if (!$events_loc.pres_mgmt) {
$events_loc.pres_mgmt = {};
}
if (!$events_sess.pres_mgmt) {
$events_sess.pres_mgmt = {};
// $events_sess.pres_mgmt.show_content__agree_text = null;
// $events_sess.pres_mgmt.show_content__presenter_start = null;
}
// $events_sess.pres_mgmt.show_content__agree_text = false;
// $events_sess.pres_mgmt.show_content__presenter_start = false;
let lq__event_obj = liveQuery(
() => db_events.events.get($events_slct.event_id)
);
let lq__event_location_obj = liveQuery(
() => db_events.locations.get(ae_acct.slct.event_location_id)
);
let lq__event_session_obj_li = liveQuery(
() => db_events.sessions
.where('event_location_id_random')
.equals(ae_acct.slct.event_location_id)
.sortBy('start_datetime')
);
// let lq__auth__event_presenter_obj = liveQuery(
// () => db_events.presenters.get($events_loc.auth__person.presenter_id ?? null)
// );
$slct.person_obj_kv = {}; // This is intended for the POC lookup list when generated.
if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__location_view) {
$events_loc.pres_mgmt.show_content__location_view = null;
}
let event_session_id_random_li: Array<string>;
$: if ($lq__event_session_obj_li) {
if (log_lvl) {
console.log('Session list updated? Pulling out the event_session_id_random values.');
}
event_session_id_random_li = [];
// We need to loop through the array of objects and get the event_session_id_random from each object a new list of event_session_id_randoms. Then we can use this list to get the full objects from the database.
let tmp_li = []; // This is to prevent the array from constantly updating and triggering the liveQuery.
if ($lq__event_session_obj_li) {
for (let i = 0; i < $lq__event_session_obj_li.length; i++) {
tmp_li.push($lq__event_session_obj_li[i].event_session_id_random);
}
}
event_session_id_random_li = tmp_li;
// event_session_id_random_li = $events_slct.event_session_obj_li.map(session_obj => session_obj.event_session_id_random);
// Finally done with the search.
$events_sess.pres_mgmt.status_qry__search = 'done';
// $events_sess.pres_mgmt.status_rpt[$events_sess.pres_mgmt.show_report] = 'done';
if (log_lvl > 1) {
console.log(`TEST SEARCH - event_session_id_random_li:`, event_session_id_random_li);
// console.log(`TEST SEARCH - search live query: ${$lq_kv__event_session_obj_li}`);
}
}
// Functions and Logic
onMount(() => {
console.log('Events Location [slug]: +page.svelte');
});
</script>
<svelte:head>
<title>
Location: {ae_util.shorten_string({string: $lq__event_location_obj?.name ?? 'Loading...', max_length: 12})} ({$lq__event_location_obj?.event_location_id ?? ''}) - Pres Mgmt - {$events_loc?.title}
</title>
</svelte:head>
<section
class="ae_events_pres_mgmt_event_location
md:container h-full mx-auto flex flex-col gap-1 py-1 px-2 pb-16"
>
<Location_page_menu
data={data}
event_location_id={$lq__event_location_obj?.event_location_id}
lq__event_location_obj={lq__event_location_obj}
/>
{#if !$lq__event_location_obj}
<div>
<span class="fas fa-spinner fa-spin m-1"></span>
<span>Loading location information...</span>
</div>
{:else if $lq__event_location_obj?.enable || $ae_loc.trusted_access}
<h2 class="h2 text-center rounded-md p-2 bg-gray-300">
{@html $lq__event_location_obj?.name ?? ae_snip.html__not_set}
</h2>
{#if !$events_loc.pres_mgmt.show_content__location_view || $events_loc.pres_mgmt.show_content__location_view == 'default'}
<!-- General information about the location -->
<Location_view
event_location_id={$lq__event_location_obj?.event_location_id}
lq__event_obj={lq__event_obj}
lq__event_location_obj={lq__event_location_obj}
lq__event_session_obj_li={lq__event_session_obj_li}
/>
<!-- Sessions in the location -->
<section>
{#if $lq__event_session_obj_li && $lq__event_session_obj_li?.length > 0 && event_session_id_random_li && event_session_id_random_li?.length > 0}
<Comp_event_session_obj_li
lq__event_obj={lq__event_obj}
link_to_type={'event_location'}
link_to_id={$events_slct.event_location_id}
event_session_id_random_li={event_session_id_random_li}
lq__event_session_obj_li={lq__event_session_obj_li}
hide__session_poc={$events_loc.pres_mgmt.hide__session_poc}
hide__session_location={true}
show__session_files={$events_loc.pres_mgmt.show_content__session_files}
show__session_presentations={$events_loc.pres_mgmt.show_content__session_presentations}
>
</Comp_event_session_obj_li>
{:else if $lq__event_session_obj_li && $lq__event_session_obj_li?.length == 0}
<div class="bg-red-100 p-4 border border-red-200 rounded-md">
<h2 class="h3">
<span class="fas fa-exclamation-triangle text-red-500 m-1"></span>
No Sessions Found
</h2>
<p>
There are no sessions found for this location.
</p>
</div>
{:else if event_session_id_random_li?.length > 0}
<div class="text-center">
<span class="fas fa-spinner fa-spin m-1"></span>
<span>Loading session list...</span>
</div>
{/if}
</section>
{:else if $events_loc.pres_mgmt.show_content__location_view == 'manage_files' && $ae_loc.trusted_access}
<div>
<h3 class="h5">
<span class="fas fa-upload m-1"></span>
Manage and Upload Location Files:
</h3>
<Comp_event_files_upload
link_to_type="event_location"
link_to_id={$lq__event_location_obj.event_location_id}
/>
<div class="overflow-x-auto w-max max-w-full">
<Element_manage_event_file_li_wrap
link_to_type={'event_location'}
link_to_id={$lq__event_location_obj?.event_location_id_random}
allow_basic={$events_loc.auth__kv.location[$lq__event_location_obj.event_location_id_random] || $events_loc.auth__kv.location[$lq__event_location_obj?.event_location_id_random]}
allow_moderator={$events_loc.auth__kv.location[$lq__event_location_obj.event_location_id_random]}
container_class_li={''}
/>
</div>
</div>
{/if}
{:else}
<div class="bg-red-100 p-4 border border-red-200 rounded-md">
<h2 class="h3">
<span class="fas fa-exclamation-triangle text-red-500 m-1"></span>
Location Disabled
</h2>
<p>
This location is currently disabled. Please contact the event organizer for more information.
</p>
</div>
{/if}
</section>
{#if $events_sess.pres_mgmt?.show_form__sign_in}
<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 m-1"></span>
Close
</button>
</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 m-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>

111
src/routes/events_pres_mgmt/location/[slug]/+page.ts Normal file
View File

@@ -0,0 +1,111 @@
/** @type {import('./$types').PageLoad} */
import { error } from '@sveltejs/kit';
console.log(`ae_events_pres_mgmt_event [slug] +page.ts start`);
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 location [slug] +page.ts data:`, data);
let account_id = data.account_id;
let ae_acct = data[account_id];
// console.log(`ae_acct = `, ae_acct);
// if (!account_id) {
// console.log(`ae events_pres_mgmt location [slug] +page.ts: The account_id was not found in the data!!!`);
// return false;
// }
data.ae_events_pres_mgmt_event_slug_page_ts = true;
let event_location_id = params.slug;
if (!event_location_id) {
console.log(`ae events_pres_mgmt location [slug] +page.ts: The event_location_id was not found in the params!!!`);
error(404, {
message: 'Location not found'
});
}
ae_acct.slct.event_location_id = event_location_id;
if (browser) {
// Load event location object
let load_event_location_obj = events_func.load_ae_obj_id__event_location({
api_cfg: ae_acct.api,
event_location_id: event_location_id,
try_cache: true
});
ae_acct.slct.event_location_obj = load_event_location_obj;
// Load event sessions for the location
let load_event_session_obj_li = events_func.load_ae_obj_li__event_session({
api_cfg: ae_acct.api,
for_obj_type: 'event_location',
for_obj_id: event_location_id,
params: {qry__enabled: 'all', qry__limit: 50},
try_cache: true,
log_lvl: 1
})
.then((event_session_obj_li) => {
if (log_lvl) {
console.log(`event_session_obj_li = `, event_session_obj_li);
}
for (let index = 0; index < event_session_obj_li.length; index++) {
let event_session_obj = event_session_obj_li[index];
let event_session_id = event_session_obj.event_session_id_random;
let load_event_presentation_obj_li = events_func.load_ae_obj_li__event_presentation({
api_cfg: ae_acct.api,
for_obj_type: 'event_session',
for_obj_id: event_session_id,
params: {qry__enabled: 'all', qry__limit: 15},
try_cache: true
});
if (log_lvl) {
console.log(`load_event_presentation_obj_li = `, load_event_presentation_obj_li);
}
event_session_obj_li[index].event_presentation_li = load_event_presentation_obj_li;
}
return event_session_obj_li;
});
if (log_lvl) {
console.log(`load_event_session_obj_li = `, load_event_session_obj_li);
}
ae_acct.slct.event_session_obj_li = load_event_session_obj_li;
// Load event files for the location
let ae_params = {
qry__enabled: 'all',
qry__hidden: 'all',
qry__limit: 50
}
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_location',
for_obj_id: event_location_id,
params: ae_params,
try_cache: true
})
.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 sessions.
data[account_id] = ae_acct;
return data;
}

440
src/routes/events_pres_mgmt/location_page_menu.svelte Normal file
View File

@@ -0,0 +1,440 @@
<script lang="ts">
export let data: any;
export let log_lvl = 0;
import type { key_val } 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 Element_ae_crud from '$lib/element_ae_crud.svelte';
import Element_data_store from '$lib/element_data_store.svelte';
import Sign_in_out from './sign_in_out.svelte';
export let event_location_id: string;
export let lq__event_location_obj: any;
export let lq__auth__event_presenter_obj: any;
let ae_tmp: key_val = {};
let ae_triggers: key_val = {};
</script>
<!-- New standard page specific menu 2024-08-01 -->
<div
class="pres_mgmt__location_menu {ae_snip.classes__events_pres_mgmt_menu}"
class:border-gray-100={!$events_loc.pres_mgmt.show_menu__location}
>
<!-- BEGIN: The menu button options -->
<div
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
<span
class="ae_menu__navigation_options flex flex-row items-center justify-around"
>
<a href="/events_pres_mgmt/event/{$lq__event_location_obj?.event_id_random}" class="{ae_snip.classes__events_pres_mgmt_menu__button}">
<span class="fas fa-arrow-left m-1"></span>
Back to Session Search
</a>
</span>
<span
class="ae_menu__object_options flex flex-row items-center justify-around"
>
<!-- Button to toggle between the regular location view and managing location files -->
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_content__location_view == 'manage_files') {
$events_loc.pres_mgmt.show_content__location_view = null;
} else {
$events_loc.pres_mgmt.show_content__location_view = 'manage_files';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button_special}"
class:variant-filled-primary={$events_loc.pres_mgmt.show_content__location_view == 'manage_files'}
class:variant-glass-primary={$events_loc.pres_mgmt.show_content__location_view != 'manage_files'}
class:hidden={!$ae_loc.trusted_access}
title="Manage files for the location"
>
{#if $events_loc.pres_mgmt.show_content__location_view == 'manage_files'}
<span class="fas fa-users m-1"></span>
<!-- View Details -->
Location Sessions?
{:else}
<span class="fas fa-file-archive m-1"></span>
Location Files?
<!-- <span> -->
{$lq__event_location_obj?.file_count ? `(${$lq__event_location_obj?.file_count})` : ''}
<!-- </span> -->
{/if}
</button>
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_menu__location == 'options') {
$events_loc.pres_mgmt.show_menu__location = null;
} else {
$events_loc.pres_mgmt.show_menu__location = 'options';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
class:variant-filled-secondary={$events_loc.pres_mgmt.show_menu__location == 'options'}
class:variant-glass-secondary={$events_loc.pres_mgmt.show_menu__location != 'options'}
class:hidden={!$ae_loc.trusted_access}
title="Options for the location"
>
<span class="fas fa-cog m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__location == 'options'}
Hide
{:else}
Show
{/if}
Options?
</button>
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_menu__location == 'help') {
$events_loc.pres_mgmt.show_menu__location = null;
} else {
$events_loc.pres_mgmt.show_menu__location = 'help';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
class:variant-filled-secondary={$events_loc.pres_mgmt.show_menu__location == 'help'}
class:variant-glass-secondary={$events_loc.pres_mgmt.show_menu__location != 'help'}
title="Help and information about the location"
>
<span class="fas fa-question-circle m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__location == 'help'}
Hide Help?
{:else}
Help?
{/if}
</button>
</span>
<!-- <span
class="ae_menu__action_options"
class:hidden={!$ae_loc.administrator_access}
>
No Actions
</span> -->
</div> <!-- END: The menu button options -->
<!-- BEGIN: The expanded menu area for information and options -->
<div
class="flex flex-row items-center justify-around w-full bg-blue-100 hover:bg-blue-200 border border-blue-200 hover:border-blue-400 p-2 rounded-md"
class:hidden={$events_loc.pres_mgmt.show_menu__location != 'options'}
>
<Element_ae_crud
trigger_patch={ae_triggers.priority}
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'priority'}
field_type={'button'}
field_value={ae_tmp.value__priority}
allow_null={true}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: log_lvl
});
}}
>
<!-- {@html $lq__event_location_obj?.priority ? '<span class="fas fa-star m-1"></span> High Priority' : '<span class="far fa-star m-1"></span> Priority not set'} -->
<button
on:click={() => {
ae_tmp.value__priority = !$lq__event_location_obj?.priority;
// $events_slct.exhibit_tracking_obj.priority = !$lq__event_location_obj?.priority;
ae_triggers.priority = true;
}}
class="btn btn-sm m-1 transition-all hover:transition-all *:hover:inline"
class:variant-ringed-surface={!$lq__event_location_obj?.priority}
class:variant-ghost-success={$lq__event_location_obj?.priority}
>
{#if $lq__event_location_obj?.priority}
<span class="fas fa-star m-1"></span>
<!-- <span class="fas fa-arrow-down m-1"></span> -->
<span class="hidden">
Not Priority?
</span>
{:else}
<!-- <span class="fas fa-toggle-off m-1"></span> -->
<span class="far fa-star m-1"></span>
<span class="hidden">
Priority
</span>
?
{/if}
</button>
</Element_ae_crud>
<Element_ae_crud
trigger_patch={ae_triggers.hide}
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'hide'}
field_type={'button'}
field_value={ae_tmp.value__hide}
allow_null={false}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: log_lvl
});
}}
>
<!-- {($lq__event_location_obj?.hide ? 'Hidden' : 'Not Hidden')} -->
<button
on:click={() => {
ae_tmp.value__hide = !$lq__event_location_obj?.hide;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_location_obj?.hide;
ae_triggers.hide = true;
}}
class="btn btn-sm m-1 transition-all hover:transition-all *:hover:inline"
class:variant-ghost-success={!$lq__event_location_obj?.hide}
class:variant-ringed-warning={$lq__event_location_obj?.hide}
disabled={!$ae_loc.trusted_access}
>
{#if $lq__event_location_obj?.hide}
<span class="fas fa-toggle-on m-1"></span>
Unhide?
{:else}
<!-- <span class="fas fa-toggle-off m-1"></span> -->
<span class="fas fa-eye m-1"></span>
<span class="hidden">
Not Hidden
</span>
{/if}
<!-- {@html ($lq__event_location_obj?.hide ? '<span class="fas fa-eye m-1"></span> Unhide?' : '<span class="fas fa-eye-slash m-1"></span> Hide?')} -->
</button>
</Element_ae_crud>
<!-- Enable/Disable -->
<Element_ae_crud
trigger_patch={ae_triggers.enable}
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'enable'}
field_type={'button'}
field_value={ae_tmp.value__enable}
allow_null={false}
hide_edit_btn={true}
outline_element={false}
show_crud={false}
display_inline={true}
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: log_lvl
})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<!-- {($lq__event_location_obj?.enable ? 'Enabled' : 'Disabled')} -->
<button
on:click={() => {
ae_tmp.value__enable = !$lq__event_location_obj?.enable;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_location_obj?.hide;
ae_triggers.enable = true;
}}
class="btn btn-sm"
class:variant-ghost-success={$lq__event_location_obj?.enable}
class:variant-ringed-warning={!$lq__event_location_obj?.enable}
disabled={!$ae_loc.manager_access}
>
{#if $lq__event_location_obj?.enable}
<span class="fas fa-toggle-on m-1"></span>
Enabled
{:else}
<span class="fas fa-toggle-off m-1"></span>
Enable?
{/if}
<!-- {@html ($lq__event_location_obj?.enable ? '<span class="fas fa-toggle-on m-1"></span> Disable?' : '<span class="fas fa-toggle-off m-1"></span> Enable?')} -->
</button>
</Element_ae_crud>
<!-- Sort -->
<!-- Group -->
{#if $ae_loc.administrator_access}
<!-- {#if $events_loc.pres_mgmt.show_content__location_qr}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__location_qr = false;
}}
class="btn btn-sm variant-ghost-success"
>
<span class="fas fa-toggle-on m-1"></span>
Showing QR Code
</button>
{:else}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__location_qr = true;
}}
class="btn btn-sm variant-ringed-warning"
>
<span class="fas fa-toggle-off m-1"></span>
Show QR Code?
</button>
{/if} -->
{#if $events_loc.pres_mgmt.show_content__session_files}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__session_files = false;
}}
class="btn btn-sm variant-ghost-success"
>
<span class="fas fa-toggle-on m-1"></span>
Showing Files
</button>
{:else}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__session_files = true;
}}
class="btn btn-sm variant-ringed-warning"
>
<span class="fas fa-toggle-off m-1"></span>
Show Files?
</button>
{/if}
{#if $events_loc.pres_mgmt.show_content__session_presentations}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__session_presentations = false;
}}
class="btn btn-sm variant-ghost-success"
>
<span class="fas fa-toggle-on m-1"></span>
Showing Presentations
</button>
{:else}
<button
disabled={!$ae_loc.manager_access}
on:click={() => {
$events_loc.pres_mgmt.show_content__session_presentations = true;
}}
class="btn btn-sm variant-ringed-warning"
>
<span class="fas fa-toggle-off m-1"></span>
Show Presentations?
</button>
{/if}
{/if}
{#if $ae_loc.trusted_access}
{#if $ae_loc.edit_mode}
<button
on:click={() => {
$ae_loc.edit_mode = false;
}}
class="btn btn-sm variant-ghost-success"
>
<!-- <span class="fas fa-toggle-on m-1"></span> -->
<span class="fas fa-edit m-1"></span>
Edit Mode On
</button>
{:else}
<button
on:click={() => {
$ae_loc.edit_mode = true;
}}
class="btn btn-sm variant-ringed-warning"
>
<span class="fas fa-toggle-off m-1"></span>
<!-- <span class="fas fa-edit m-1"></span> -->
Edit Mode?
</button>
{/if}
{/if}
</div> <!-- END: The expanded menu area for information and options -->
<Element_data_store
ds_code="events__pres_mgmt__location_help"
ds_name="Default: Events - Pres Mgmt Session Help"
ds_type="html"
for_type="event"
for_id={$lq__event_location_obj?.event_id_random}
class_li="bg-yellow-100 border border-yellow-400 p-2 rounded-md max-w-xl"
show_edit={false}
show_edit_btn={true}
hide={$events_loc.pres_mgmt.show_menu__location != 'help'}
/>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_menu__location = !$events_loc.pres_mgmt.show_menu__location;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$events_loc.pres_mgmt.show_menu__location}
title="Collapse the expanded menu"
>
<span class="fas fa-chevron-up m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__location}
Hide
<!-- Collapse -->
{:else}
Show
{/if}
<!-- Menu? -->
</button>
</div>
</div> <!-- End of the new standard page specific menu -->

532
src/routes/events_pres_mgmt/location_view.svelte Normal file
View File

@@ -0,0 +1,532 @@
<script lang="ts">
console.log(`ae_events_pres_mgmt location_view.svelte`);
export let log_lvl = 1;
// import { clipboard } from '@skeletonlabs/skeleton';
import { liveQuery } from "dexie";
// const dispatch = createEventDispatcher();
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
import Element_data_store from '$lib/element_data_store.svelte';
let ae_promises: key_val = {};
let ae_tmp: key_val = {};
let ae_triggers: key_val = {};
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, events_trig_kv } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
import Form_agree from './form_agree.svelte';
// import Comp_event_session_obj_li from './ae_comp__event_session_obj_li.svelte';
// Exports
// export let event_location_id: string;
// export let event_location_obj: key_val;
// export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
if (!$events_sess.pres_mgmt) {
$events_sess.pres_mgmt = {};
// $events_sess.pres_mgmt.show_content__agree_text = null;
// $events_sess.pres_mgmt.show_content__presentation_start = null;
}
// $events_sess.pres_mgmt.show_content__agree_text = false;
// $events_sess.pres_mgmt.show_content__presentation_start = false;
export let lq__event_obj: any;
export let lq__event_location_obj: any;
// let lq__event_location_obj = liveQuery(
// () => db_events.locations.get(event_location_id)
// );
// export let lq__auth__event_presentation_obj: any;
export let lq__event_session_obj_li: any;
// let lq__event_session_obj_li = liveQuery(
// () => db_events.sessions
// .where('event_location_id_random')
// .equals(event_location_id)
// .sortBy('name')
// );
let lq__event_session_obj = liveQuery(
() => db_events.sessions.get($events_slct.event_session_id)
);
// let lq__auth__event_presentation_obj = liveQuery(
// () => db_events.presentations.get($events_slct.auth__event_presentation_id)
// );
let lq__event_presentation_obj = liveQuery(
() => db_events.presentations.get($events_slct.event_presentation_id)
);
// $slct.person_obj_kv = {}; // This is intended for the person POC lookup list when generated.
$events_sess.pres_mgmt.location__updated_on = null;
$: if ($lq__event_location_obj) {
if (log_lvl > 1) {
console.log(`$lq__event_location_obj:`, $lq__event_location_obj);
}
if ($events_loc.pres_mgmt.show_content__location_qr) {
if ($lq__event_location_obj.updated_on == $events_sess.pres_mgmt.location__updated_on) {
if (log_lvl > 1) {
console.log('Updated on is the same.');
}
} else {
if (log_lvl) {
console.log('Updated on is different.');
}
// FUTURE USE: Generate a QR code for the object ID.
// ae_promises.generate_qr_code_obj_id = core_func.generate_qr_code({api_cfg: $ae_api, account_id: $slct.account_id, qr_type: 'obj', qr_id: $lq__event_location_obj?.event_location_id_random, obj_type: 'event_location', obj_id: $lq__event_location_obj?.event_location_id_random});
// Generate a QR code for the URL.
let qr_id_url = `${$lq__event_location_obj?.event_location_id_random}_url`;
// URL for this page (be sure to URL encode it):
let url_str = `${$ae_loc.url_origin}/events_pres_mgmt/location/${$lq__event_location_obj?.event_location_id_random}`;
url_str = encodeURI(url_str);
ae_promises.generate_qr_code_url = core_func.generate_qr_code({api_cfg: $ae_api, account_id: $slct.account_id, qr_type: 'str', qr_id: qr_id_url, str: url_str});
$events_sess.pres_mgmt.location__updated_on = $lq__event_location_obj?.updated_on;
}
} else {
if (log_lvl) {
console.log('Clearing the URL.');
}
ae_promises.generate_qr_code_url = null;
// Resetting the updated_on value helps with the QR code come back when switched back on.
$events_sess.pres_mgmt.location__updated_on = null;
}
}
</script>
{#if $lq__event_location_obj}
<section class="p-2">
<!-- {#await ae_promises.generate_qr_code_url}
Generating...
{:then result}
{#if ae_promises.generate_qr_code_url && $ae_loc.trusted_access}
<span class="float-right m-1 p-1 flex flex-col items-center justify-center outline outline-gray-200 *:hover:inline">
<img
class="qr_code qr_type_url h-32 w-32 hover:h-48 hover:w-48"
style=""
src={result}
alt="URL QR code"
/>
<span>
<span class="fas fa-link"></span>
<span>Location URL</span>
</span>
<div class="hidden">
This QR is a link back to this page.
</div>
</span>
{/if}
{/await} -->
<ul
class="space-y-2 px-4"
>
<li
class:hidden={!$ae_loc.manager_access || !$ae_loc.edit_mode}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'external_id'}
field_type={'text'}
field_value={$lq__event_location_obj?.external_id}
allow_null={true}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
<strong class="text-sm">External ID:</strong> {$lq__event_location_obj.external_id}
</Element_ae_crud>
</li>
<li
class:hidden={!$ae_loc.administrator_access || !$ae_loc.edit_mode}
>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'code'}
field_type={'text'}
field_value={$lq__event_location_obj?.code}
allow_null={true}
hide_edit_btn={!$ae_loc.administrator_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
<strong class="text-sm">Code:</strong> {$lq__event_location_obj.code}
</Element_ae_crud>
</li>
<li>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'name'}
field_type={'text'}
field_value={$lq__event_location_obj?.name}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={true}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
<strong class="text-sm">Name/Title:</strong> {$lq__event_location_obj.name}
</Element_ae_crud>
{#if !$lq__event_obj?.mod_pres_mgmt_json?.hide__location_code && $events_loc.pres_mgmt.show_content__location_code}
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'code'}
field_type={'text'}
field_value={$lq__event_location_obj?.code}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
<span class="text-sm text-gray-500 bg-yellow-100 p-1 rounded-md border border-yellow-200"
title="Location code {$lq__event_location_obj.code}"
>
<strong class="text-sm">code:</strong>
<span class="fas fa-barcode"></span>
{$lq__event_location_obj.code}
</span>
</Element_ae_crud>
{/if}
</li>
{#if $ae_loc.administrator_access}
<li>
<strong class="text-sm">Location passcode:</strong>
<span class="fas fa-key"></span>
{@html $lq__event_location_obj.passcode ? $lq__event_location_obj.passcode : ae_snip.html__not_set}
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'passcode'}
field_type={'text'}
field_value={$lq__event_location_obj?.passcode}
allow_null={true}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
</Element_ae_crud>
</li>
{/if}
<li>
<div>
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_location'}
object_id={$lq__event_location_obj?.event_location_id_random}
field_name={'description'}
field_type={'textarea'}
field_value={$lq__event_location_obj.description}
allow_null={false}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={true}
textarea_rows={15}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_location({
api_cfg: $ae_api,
event_location_id: $lq__event_location_obj?.event_location_id_random,
log_lvl: 1
});
}}
>
<strong class="text-sm">
Location description:
</strong>
{#if $lq__event_location_obj.description}
<button
type="button"
on:click={() => {
console.log('Show/Hide Description');
$events_loc.pres_mgmt.show_content__location_description = !$events_loc.pres_mgmt.show_content__location_description;
}}
class="btn btn-sm variant-soft-surface hover:variant-filled-surface text-xs"
>
{#if $events_loc.pres_mgmt.show_content__location_description}
<span class="fas fa-eye-slash mx-1"></span>
<span>Hide Description</span>
{:else}
<span class="fas fa-eye mx-1"></span>
<span>Show</span>
{/if}
</button>
<pre
class="whitespace-pre-wrap p-2 bg-gray-100 rounded-md"
class:hidden={!$events_loc.pres_mgmt.show_content__location_description}
>{$lq__event_location_obj.description}</pre>
{:else}
{@html ae_snip.html__not_set}
{/if}
</Element_ae_crud>
</div>
</li>
</ul>
<!-- <label
class="text-sm"
>Location description:
<textarea
class="textarea my-1 p-2"
cols="30"
rows="4"
disabled
>{$lq__event_location_obj.description}</textarea>
</label> -->
<div class="m-1 flex flex-col flex-wrap gap-1 items-center">
{#if $ae_loc.trusted_access }
<!-- Message if they have agreed -->
<Element_data_store
ds_code="events__pres_mgmt__location_page_authorized_info"
ds_name="Default: Events - Pres Mgmt Location Authorized Info"
ds_type="html"
for_type="event"
for_id={$lq__event_presentation_obj?.event_id_random}
class_li="w-fit max-w-screen-lg flex flex-col gap-1"
show_edit={false}
show_edit_btn={true}
/>
{:else}
Not authorized
{/if}
</div>
</section>
<!-- Sessionss in the location -->
<section>
<!-- {#await $lq__event_session_obj_li}
Loading....
{:then event_session_obj_li} -->
{#if $lq__event_session_obj_li && $lq__event_session_obj_li?.length > 0}
<!-- {$lq__event_session_obj_li?.length} Presentations -->
<!-- <Comp_event_session_obj_li
lq__event_obj={lq__event_obj}
event_session_id_random_li={event_session_id_random_li}
>
</Comp_event_session_obj_li> -->
{/if}
<!-- {/await} -->
</section>
{/if}
{#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
lq__event_presentation_obj={lq__event_presentation_obj}
lq__event_session_obj={$lq__event_session_obj}
/>
</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>

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

@@ -45,7 +45,7 @@ export async function load({ params, parent }) { // route
let load_event_presentation_obj_li = events_func.load_ae_obj_li__event_presentation({
api_cfg: ae_acct.api,
event_session_id: event_session_id,
params: {enabled: 'all', qry__limit: 50},
params: {qry__enabled: 'all', qry__limit: 50},
try_cache: true
})
.then((event_presentation_obj_li) => {

31
src/routes/events_pres_mgmt/session_view.svelte
View File

@@ -624,7 +624,36 @@ $: if ($lq__event_session_obj) {
{#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_snip.html__not_set}
<strong class="text-sm">Session passcode:</strong>
<span class="fas fa-key"></span>
{@html $lq__event_session_obj.passcode ? $lq__event_session_obj.passcode : ae_snip.html__not_set}
<Element_ae_crud
api_cfg={$ae_api}
object_type={'event_session'}
object_id={$lq__event_session_obj?.event_session_id_random}
field_name={'passcode'}
field_type={'text'}
field_value={$lq__event_session_obj?.passcode}
allow_null={true}
hide_edit_btn={!$ae_loc.trusted_access || !$ae_loc.edit_mode}
outline_element={false}
show_crud={false}
display_inline={true}
display_block_edit={false}
class_li={''}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated:`, e.detail);
events_func.load_ae_obj_id__event_session({
api_cfg: $ae_api,
event_session_id: $lq__event_session_obj?.event_session_id_random,
log_lvl: 1
})
.then(function (load_results) {
});
}}
>
</Element_ae_crud>
</li>
{/if}