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

Organizing things better. Hopefully nothing is broken!! Still need to move the event session related.

Browse Source
This commit is contained in:
Scott Idem
2024-09-27 17:21:57 -04:00
parent d6c26e7511
commit 6a8148228f
17 changed files with 36 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

321
src/routes/events/[event_id]/presenter/[presenter_id]/+page.svelte Normal file
View File

@@ -0,0 +1,321 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
export let log_lvl = 1;
// Imports (external and then internal)
import { browser } from '$app/environment';
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
import Element_data_store from '$lib/element_data_store_v2.svelte';
import { liveQuery } from "dexie";
import { Modal } from 'flowbite-svelte';
// 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 Comp_event_files_upload from '../../../../events_pres_mgmt/ae_comp__event_files_upload.svelte';
import Element_manage_event_file_li_wrap from '$lib/element_manage_event_file_li_direct.svelte';
import Comp_event_presenter_form_agree from './ae_comp__event_presenter_form_agree.svelte';
import Presenter_view from './presenter_view.svelte';
import Presenter_page_menu from './presenter_page_menu.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_modal__presenter_agree = false;
$events_sess.pres_mgmt.show_content__presenter_start = false;
let lq__event_obj = liveQuery(
() => db_events.events.get(ae_acct.slct.event_id)
);
let lq__event_presenter_obj = liveQuery(
() => db_events.presenters.get(ae_acct.slct.event_presenter_id)
);
let lq__event_presentation_obj = liveQuery(
() => db_events.presentations.get(ae_acct.slct.event_presentation_id)
);
let lq__auth__event_presenter_obj = liveQuery(
() => db_events.presenters.get($events_loc.auth__person.presenter_id ?? null)
);
if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__presenter_view) {
$events_loc.pres_mgmt.show_content__presenter_view = null;
}
// if (browser && $lq__event_presenter_obj) {
// console.log('Pres Mgmt [page]: +presenter.svelte');
// $events_slct.event_presenter_obj = $lq__event_presenter_obj;
// console.log(`$events_slct.event_presenter_obj = `, $events_slct.event_presenter_obj);
// }
// Functions and Logic
</script>
<svelte:head>
<title>
Presenter: {ae_util.shorten_string({ string: $lq__event_presenter_obj?.full_name, max_length: 20, begin_length: 10, end_length: 4 })}
({$lq__event_presenter_obj?.event_presenter_id ?? 'loading...'}) - 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 gap-1 py-1 px-2 pb-16"
>
<Presenter_page_menu
data={data}
lq__event_obj={lq__event_obj}
lq__event_presenter_obj={lq__event_presenter_obj}
/>
{#if !$lq__event_presenter_obj}
<div>
<span class="fas fa-spinner fa-spin mx-1"></span>
<span>Loading presenter information...</span>
</div>
{:else if $lq__event_presenter_obj?.enable || $ae_loc.trusted_access}
<h2 class="h2 text-center rounded-md p-2 bg-gray-300">
{@html $lq__event_presenter_obj?.full_name ?? ae_snip.html__not_set}
</h2>
{#if !$events_loc.pres_mgmt.show_content__presenter_view || $events_loc.pres_mgmt.show_content__presenter_view == 'default' && $lq__event_presenter_obj}
<Presenter_view
lq__event_presenter_obj={lq__event_presenter_obj}
lq__event_presentation_obj={lq__event_presentation_obj}
/>
{#if
($ae_loc.trusted_access ||
$lq__auth__event_presenter_obj?.agree)
}
<div class="m-1 flex flex-col flex-wrap gap-1 items-center justify-center w-full">
<!-- Message if they have agreed -->
<Element_data_store
ds_code="events__pres_mgmt__session_page_authorized_info"
ds_name="Default: Events - Pres Mgmt Session Authorized Info"
ds_type="html"
for_type="event"
for_id={$lq__event_presenter_obj?.event_id_random}
class_li="w-fit max-w-screen-lg flex flex-row gap-1"
show_edit={false}
show_edit_btn={true}
mount_reload_sec={1}
/>
</div>
{/if}
<h3 class="h5 text-center">
<span class="fas fa-tasks m-1"></span>
<span class="fas fa-mail-bulk m-1"></span>
Manage and Upload Presenter Files:
</h3>
<!-- Yes... This is a duplicate of what is shown when they press "Presenter Files" button. It can be cleaned up later. -->
{#if $ae_loc.trusted_access || $events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
<Comp_event_files_upload
class_li="border border-gray-300 rounded-md p-2 bg-gray-100 hover:bg-gray-200"
link_to_type="event_presenter"
link_to_id={$lq__event_presenter_obj?.event_presenter_id}
>
<span slot="label">
<div>
<span class="fas fa-upload"></span>
<strong class="bg-green-100 p-1">Upload presenter (speaker) specific files</strong>
</div>
<span class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Presenter (speaker) presentation files only</strong><br>
Recommended: PowerPoint (pptx) or Keynote (key)<br>
Media: Audio and videos files should be directly embedded in PowerPoint (PPTX) files<br>
Supplemental files: mp4, PDF, Word Doc, Excel, txt, etc
</span>
</span>
</Comp_event_files_upload>
{/if}
<div class="overflow-x-auto w-max max-w-full">
<Element_manage_event_file_li_wrap
link_to_type={'event_presenter'}
link_to_id={$lq__event_presenter_obj?.event_presenter_id_random}
allow_basic={$events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random] || $events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
allow_moderator={$events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
container_class_li={''}
/>
</div>
{:else if $events_loc.pres_mgmt.show_content__presenter_view == 'manage_files' && $ae_loc.authenticated_access}
<div>
<h3 class="h5 text-center">
<span class="fas fa-tasks m-1"></span>
<span class="fas fa-mail-bulk m-1"></span>
Manage and Upload Presenter Files:
</h3>
{#if $ae_loc.public_access || $events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
<Comp_event_files_upload
class_li="border border-gray-300 rounded-md p-2 bg-gray-100 hover:bg-gray-200"
link_to_type="event_presenter"
link_to_id={$lq__event_presenter_obj.event_presenter_id}
>
<span slot="label">
<div>
<span class="fas fa-upload"></span>
<strong class="bg-green-100 p-1">Upload presenter (speaker) specific files</strong>
</div>
<span class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Presentation related files only</strong><br>
Recommended: PowerPoint (pptx) or Keynote (key)<br>
Media: Audio and videos files should be directly embedded in PowerPoint (PPTX) files<br>
Supplemental files: mp4, PDF, Word Doc, Excel, txt, etc
</span>
</span>
</Comp_event_files_upload>
{/if}
<div class="overflow-x-auto w-max max-w-full">
<Element_manage_event_file_li_wrap
link_to_type={'event_presenter'}
link_to_id={$lq__event_presenter_obj?.event_presenter_id_random}
allow_basic={$ae_loc.public_access || $events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
allow_moderator={$events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
container_class_li={''}
/>
</div>
</div>
{#if
($ae_loc.trusted_access ||
$lq__auth__event_presenter_obj?.agree)
}
<div class="m-1 flex flex-col flex-wrap gap-1 items-center justify-center w-full">
<!-- Message if they have agreed -->
<Element_data_store
ds_code="events__pres_mgmt__session_page_authorized_info"
ds_name="Default: Events - Pres Mgmt Session Authorized Info"
ds_type="html"
for_type="event"
for_id={$lq__event_presenter_obj?.event_id_random}
class_li="w-fit max-w-screen-lg flex flex-row gap-1"
show_edit={false}
show_edit_btn={true}
mount_reload_sec={1}
/>
</div>
{/if}
{/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>
Presenter Disabled
</h2>
<p>
This presenter is currently disabled. Please contact the event organizer for more information.
</p>
</div>
{/if}
</section>
<!-- Main modal -->
<Modal
title="Presenter's Profile"
bind:open={$events_sess.pres_mgmt.show_modal__presenter_agree}
autoclose={false}
class="bg-white dark:bg-gray-800 text-gray-800 dark:text-gray-200 rounded-lg border-gray-200 dark:border-gray-700 divide-gray-200 dark:divide-gray-700 shadow-md relative flex flex-col mx-auto w-full divide-y"
>
<Comp_event_presenter_form_agree
lq__event_presenter_obj={lq__event_presenter_obj}
/>
<svelte:fragment slot="footer">
<div class="text-center w-full">
<button
on:click={() => {
$events_sess.pres_mgmt.show_modal__presenter_agree = false;
}}
class="btn btn-sm variant-soft-warning hover:variant-ghost-warning"
>
<span class="fas fa-times m-1"></span>
Close
</button>
</div>
</svelte:fragment>
</Modal>
<style lang="postcss">
/* Use the div.ae_quick_modal_container to block background clicks when ung 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>

67
src/routes/events/[event_id]/presenter/[presenter_id]/+page.ts Normal file
View File

@@ -0,0 +1,67 @@
/** @type {import('./$types').PageLoad} */
console.log(`ae_p_event_presenter [presenter_id] +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 presenter [presenter_id] +page.ts data:`, data);
data.log_lvl = log_lvl;
let account_id = data.account_id;
let ae_acct = data[account_id];
// console.log(`ae_acct = `, ae_acct);
let event_presenter_id = params.presenter_id;
// if (!event_presenter_id) {
// console.log(`ae events_pres_mgmt presenter [presenter_id] +page.ts: The event_presenter_id was not found in the params.presenter_id!!!`);
// return false;
// }
ae_acct.slct.event_presenter_id = event_presenter_id;
if (browser) {
// Load event presenter object
let load_event_presenter_obj = events_func.load_ae_obj_id__event_presenter({
api_cfg: ae_acct.api,
event_presenter_id: event_presenter_id,
try_cache: true,
log_lvl: log_lvl
});
ae_acct.slct.event_presenter_obj = await load_event_presenter_obj;
// Load event files for the presenter
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_presenter',
for_obj_id: event_presenter_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 presentations.
data[account_id] = ae_acct;
return data;
}

404
src/routes/events/[event_id]/presenter/[presenter_id]/ae_comp__event_presenter_form_agree.svelte Normal file
View File

@@ -0,0 +1,404 @@
<script lang="ts">
console.log(`ae_events_pres_mgmt session [slug] form_agree.svelte`);
// Imports (external and then internal)
// import { onMount } from 'svelte';
// import { liveQuery } from "dexie";
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
import { api } from '$lib/api';
import Element_data_store from '$lib/element_data_store_v2.svelte';
// import Element_ae_crud from '$lib/element_ae_crud.svelte';
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
// import { db_events } from "$lib/db_events";
import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_events_stores';
import { events_func } from '$lib/ae_events_functions';
// export let event_presenter_id: string;
export let lq__event_presenter_obj: any;
// export let event_presentation_id: string;
// export let lq__event_presentation_obj: any;
// export let lq__event_session_obj: any;
export let log_lvl: number = 0;
let ae_promises: key_val = {};
// let ae_tmp: key_val = {};
// let ae_triggers: key_val = {};
// 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)
// );
// console.log(`$events_slct.event_presenter_id:`, $events_slct.event_presenter_id);
// let lq__event_presenter_obj = liveQuery(
// () => db_events.presenters.get($events_slct.event_presenter_id)
// );
// let lq__event_presentation_obj = liveQuery(
// () => db_events.presentations.get($events_slct.event_presentation_id)
// );
$events_sess.pres_mgmt.disable_submit__opt_out = false;
let tmp_agree = false;
let tmp_opt_out: key_val = {
audio: false,
video: false,
transcription_and_publication: false,
publication_in_app: false
};
// Functions and Logic
async function handle_submit_form(event) {
console.log('*** handle_submit_form() ***');
$events_sess.pres_mgmt.disable_submit__opt_out = true;
$events_sess.pres_mgmt.submit_status = 'saving';
// Data in
let form_data = new FormData(event.target);
console.log(form_data);
let opt_out_di: key_val = ae_util.extract_prefixed_form_data({prefix: null, form_data: form_data, trim_values: true, bool_tf_str: true, log_lvl: 0});
console.log(`opt_out_di:`, opt_out_di);
// Data out
let opt_out_do: key_val = {};
opt_out_do.optout_audio = opt_out_di.optout_audio??false;
opt_out_do.optout_video = opt_out_di.optout_video??false;
opt_out_do.optout_transcription_and_publication = opt_out_di.optout_transcription_and_publication??false;
opt_out_do.optout_publication_in_app = opt_out_di.optout_publication_in_app??false;
opt_out_do.optout_updated_on = new Date().toISOString();
console.log(`opt_out_do:`, opt_out_do);
let data_out = {
data_json: {
...$lq__event_presenter_obj.data_json,
...opt_out_do
}
}
ae_promises.update__event_presenter_obj = await handle_update__event_presenter({
obj_type: 'event_presenter',
obj_id: $lq__event_presenter_obj?.event_presenter_id_random,
data: data_out
});
console.log(ae_promises.update__event_presenter_obj);
$events_sess.pres_mgmt.disable_submit__opt_out = false;
$events_sess.pres_mgmt.submit_status = 'saved';
}
async function handle_update__event_presenter({
obj_type,
obj_id,
data
}) {
console.log('*** handle_update__event_presenter() ***');
ae_promises.update__event_presenter_obj = api.update_ae_obj_id_crud({
api_cfg: $ae_api,
obj_type: obj_type,
obj_id: obj_id,
fields: data,
key: $ae_api.api_crud_super_key,
return_obj: true,
log_lvl: log_lvl
})
.then(async function (update__obj_result) {
if (!update__obj_result) {
console.log('The result was null or false.');
return false;
} else {
console.log(`update__obj_result = `, update__obj_result);
}
$slct_trigger = 'load__event_presenter_obj_li';
return update__obj_result;
})
.catch(function (error) {
console.log('Something went wrong.');
console.log(error);
return false;
});
return ae_promises.update__event_presenter_obj;
}
</script>
{#if $lq__event_presenter_obj}
<h2 class="h3">
Presenter Agreement for:<br>
<strong>{$lq__event_presenter_obj.full_name} ({$lq__event_presenter_obj.email})</strong>
</h2>
<Element_data_store
ds_code="event_presenter_agree_text"
ds_type="html"
class_li="p-2"
/>
<section class="text-lg border border-red-200 rounded-md bg-red-100 space-y-2">
<!-- Highlight the persons name, email, and that whole line. -->
<p class="text-lg bg-yellow-100 p-2">
<strong>{$lq__event_presenter_obj.full_name} ({$lq__event_presenter_obj.email})</strong> agrees to the following terms and conditions for the presentation:
</p>
<h3 class="h4">Title: "{$lq__event_presenter_obj?.event_presentation_name}"</h3>
<div>
<h3 class="h4">Opt-Out?</h3>
<form
class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form}
>
<p>Speaker does not permit the use of presentation materials as described in section(s), above for: (please check for all that apply)</p>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_audio">
<input
type="checkbox"
class="checkbox variant-ghost-warning checked:variant-filled-warning hover:variant-filled-error"
id="optout_audio"
name="optout_audio"
checked={$lq__event_presenter_obj.data_json?.optout_audio}
value={true}
>
Opt-out - Audio Reproduction of Presentation
</label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_video">
<input
type="checkbox"
class="checkbox variant-ghost-warning checked:variant-filled-warning hover:variant-filled-error"
id="optout_video"
name="optout_video"
checked={$lq__event_presenter_obj.data_json?.optout_video}
value={true}
>
Opt-out - Video Reproduction of Presentation
</label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_transcription_and_publication">
<input
type="checkbox"
class="checkbox variant-ghost-warning checked:variant-filled-warning hover:variant-filled-error"
id="optout_transcription_and_publication"
name="optout_transcription_and_publication"
checked={$lq__event_presenter_obj.data_json?.optout_transcription_and_publication}
value={true}
>
Opt-out - Transcription and Publication of Presentation on LCI Website
</label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_publication_in_app">
<input
type="checkbox"
class="checkbox variant-ghost-warning checked:variant-filled-warning hover:variant-filled-error"
id="optout_publication_in_app"
name="optout_publication_in_app"
checked={$lq__event_presenter_obj.data_json?.optout_publication_in_app}
value={true}
>
Opt-out - Publication of Presentation on LCI Congress App
</label>
<div class="text-center w-full">
<button
type="submit"
disabled={($events_sess.pres_mgmt?.disable_submit__opt_out)}
on:click={() => {
console.log('*** Save button clicked ***');
}}
class="btn btn-md variant-ghost-warning hover:variant-filled-secondary m-2"
>
<span class="fas fa-check m-1 text-orange-500"></span>
Save Opt-Out?
{#await ae_promises.update__event_presenter_obj}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
<!-- <ProgressRadial value={undefined} /> -->
Saving...
</span>
</div>
{:then update__event_presenter_obj_result}
{#if update__event_presenter_obj_result}
<div class="modal-loading">
<span class="fas fa-check-circle"></span>
<span class="loading-text">Successfully saved!</span>
</div>
{/if}
{:catch error}
<div class="modal-loading">
<span class="fas fa-exclamation-triangle"></span>
<span class="loading-text">Error: {error.message}</span>
</div>
{/await}
</button>
</div>
</form>
<div class="text-center w-full">
<h3 class="h4">Agree?</h3>
<!-- Agree (agreement) means this presenter has agreed to the terms and conditions. -->
{#if !$lq__event_presenter_obj?.agree}
<div>
Not Agreed:
<span class="fas fa-times text-red-500 m-1"></span>
<!-- <span class="fas fa-question text-red-500 m-1"></span> -->
</div>
<div>
Waiting for agreement to the Guest Speaker Consent and Release and Terms and Conditions before you can move on.
</div>
{:else}
<div>
Agreed:
<span class="fas fa-check text-green-500 m-1"></span>
Marked as agreed
</div>
{/if}
{#if !$lq__event_presenter_obj?.agree}
<button
disabled={!$ae_loc.administrator_access
&& !$events_loc.auth__kv.presentation[$lq__event_presenter_obj?.event_presentation_id_random]}
on:click={() => {
console.log('Agree to the terms and conditions.');
$events_sess.pres_mgmt.status__presenter_agree = 'saving';
let event_presenter_data = {
agree: true,
data_json: {
...$lq__event_presenter_obj.data_json,
agree_updated_on: new Date().toISOString()
}
};
ae_promises.update__event_presenter_obj__agree = events_func.update_ae_obj__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random,
data_kv: event_presenter_data,
log_lvl: log_lvl
})
.then(function (update_result) {
if (log_lvl) {
console.log('update_result:', update_result);
}
$events_sess.pres_mgmt.status__presenter_agree = 'saved';
});
}}
class="btn btn-lg variant-ghost-primary hover:variant-filled-success m-2"
>
<span class="fa fa-check m-1 text-orange-500"></span>
Mark as agreed?
{#await ae_promises.update__event_presenter_obj__agree}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Saving...
</span>
</div>
{:then update__event_presenter_obj__agree_result}
{#if $events_sess.pres_mgmt.status__presenter_agree}
<div class="modal-loading">
<span class="fas fa-check-circle"></span>
<span class="loading-text">Successfully saved!</span>
</div>
{/if}
{:catch error}
<div class="modal-loading">
<span class="fas fa-exclamation-triangle"></span>
<span class="loading-text">Error: {error.message}</span>
</div>
{/await}
</button>
{:else}
<button
disabled={!$ae_loc.administrator_access
&& !$events_loc.auth__kv.presentation[$lq__event_presenter_obj?.event_presentation_id_random]}
on:click={() => {
console.log('Revoke agreement to the terms and conditions.');
$events_sess.pres_mgmt.status__presenter_agree = 'saving';
let event_presenter_data = {
agree: false,
data_json: {
...$lq__event_presenter_obj.data_json,
agree_updated_on: new Date().toISOString()
}
};
ae_promises.update__event_presenter_obj__agree = events_func.update_ae_obj__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random,
data_kv: event_presenter_data,
log_lvl: log_lvl
})
.then(function (update_result) {
if (log_lvl) {
console.log('update_result:', update_result);
}
$events_sess.pres_mgmt.status__presenter_agree = 'saved';
});
}}
class="btn btn-lg variant-ghost-warning hover:variant-filled-error m-2"
>
<span class="fas fa-times m-1 text-orange-500"></span>
Change to not agreed?
{#await ae_promises.update__event_presenter_obj__agree}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Saving...
</span>
</div>
{:then update__event_presenter_obj__agree_result}
{#if $events_sess.pres_mgmt.status__presenter_agree}
<div class="modal-loading">
<span class="fas fa-check-circle"></span>
<span class="loading-text">Successfully saved!</span>
</div>
{/if}
{:catch error}
<div class="modal-loading">
<span class="fas fa-exclamation-triangle"></span>
<span class="loading-text">Error: {error.message}</span>
</div>
{/await}
</button>
{/if}
</div>
</section>
{/if}

510
src/routes/events/[event_id]/presenter/[presenter_id]/presenter_page_menu.svelte Normal file
View File

@@ -0,0 +1,510 @@
<script lang="ts">
export let data: any;
import { goto } from '$app/navigation';
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_v2.svelte';
import Comp__events_menu_nav from './../../../ae_comp__events_menu_nav.svelte';
// import Sign_in_out from './sign_in_out.svelte'; // Should this be used here later???
export let lq__event_obj: any;
export let lq__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__presenter_view_menu {ae_snip.classes__events_pres_mgmt_menu}"
class:border-gray-100={!$events_loc.pres_mgmt.show_menu__presenter}
>
<!-- BEGIN: The menu button options -->
<div
class="flex flex-row flex-wrap gap-1 items-center justify-around w-full">
<Comp__events_menu_nav
hide={false}
event_id={$lq__event_presenter_obj?.event_id_random}
events__session_id={$lq__event_presenter_obj?.event_session_id_random}
events__session_search={$events_slct.event_id}
/>
<span
class="ae_menu__object_options flex flex-row items-center justify-around"
>
<!-- Button to toggle between the regular presenter view and managing presenter files -->
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_content__presenter_view == 'manage_files') {
$events_loc.pres_mgmt.show_content__presenter_view = null;
} else {
$events_loc.pres_mgmt.show_content__presenter_view = 'manage_files';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button_special}"
class:variant-filled-primary={$events_loc.pres_mgmt.show_content__presenter_view == 'manage_files'}
class:variant-glass-primary={$events_loc.pres_mgmt.show_content__presenter_view != 'manage_files'}
class:hidden={!$ae_loc.authenticated_access}
title="View presenter information or manage files for the presenter"
>
{#if $events_loc.pres_mgmt.show_content__presenter_view == 'manage_files'}
<span class="fas fa-info m-1"></span>
<!-- View Details -->
Presenter Info?
{:else}
<span class="fas fa-file-archive m-1"></span>
Presenter Files?
<span
class="badge badge-icon variant-glass-success absolute -top-1.5 -right-1.5 z-10"
class:hidden={!$lq__event_presenter_obj?.file_count}
>
{$lq__event_presenter_obj?.file_count}&times;
</span>
{/if}
</button>
<!-- Button to toggle between showing and not showing the extended options menu -->
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_menu__presenter == 'options') {
$events_loc.pres_mgmt.show_menu__presenter = null;
} else {
$events_loc.pres_mgmt.show_menu__presenter = 'options';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button}"
class:variant-filled-secondary={$events_loc.pres_mgmt.show_menu__presenter == 'options'}
class:variant-glass-secondary={$events_loc.pres_mgmt.show_menu__presenter != 'options'}
class:hidden={!$ae_loc.trusted_access}
title="Options for the presenter"
>
<span class="fas fa-cog m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__presenter == 'options'}
Hide
{:else}
<span class="hidden">
Show
</span>
{/if}
Options?
</button>
<button
type="button"
on:click={() => {
if ($events_loc.pres_mgmt.show_menu__presenter == 'help') {
$events_loc.pres_mgmt.show_menu__presenter = null;
} else {
$events_loc.pres_mgmt.show_menu__presenter = 'help';
}
}}
class="{ae_snip.classes__events_pres_mgmt_menu__button} transition-all hover:transition-all *:hover:inline"
class:variant-filled-secondary={$events_loc.pres_mgmt.show_menu__presenter == 'help'}
class:variant-glass-secondary={$events_loc.pres_mgmt.show_menu__presenter != 'help'}
title="Help and information about the presenter"
>
<span class="fas fa-question-circle m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__presenter == 'help'}
Hide Help?
{:else}
<!-- <span class="hidden m-0 p-0">
Show
</span> -->
<!-- <span class="m-0 p-0"> -->
Help?
<!-- </span> -->
{/if}
</button>
</span>
{#if $events_loc.pres_mgmt?.require__presenter_agree}
<span
class="ae_menu__action_options flex flex-row items-center justify-around"
>
{#if $lq__event_presenter_obj?.agree}
<!-- {#if $ae_loc.trusted_access || $events_loc.auth__kv.presenter[$lq__event_presenter_obj.event_presenter_id_random]} -->
<button
type="button"
disabled={!$ae_loc.trusted_access && !$events_loc.auth__kv.presenter[$lq__event_presenter_obj?.event_presenter_id_random]}
on:click={
() => {
$events_slct.event_presentation_id = $lq__event_presenter_obj?.event_presentation_id_random;
// $events_slct.event_presentation_obj = $events_slct.event_presentation_obj;
$events_slct.event_presenter_id = $lq__event_presenter_obj?.event_presenter_id_random;
// $lq__event_presenter_obj = $lq__event_presenter_obj;
$events_sess.pres_mgmt.show_modal__presenter_agree = $lq__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[$lq__event_presenter_obj?.event_presenter_id_random]}
on:click={
() => {
$events_slct.event_presentation_id = $lq__event_presenter_obj?.event_presentation_id_random;
// $events_slct.event_presentation_obj = $events_slct.event_presentation_obj;
$events_slct.event_presenter_id = $lq__event_presenter_obj?.event_presenter_id_random;
// $lq__event_presenter_obj = $lq__event_presenter_obj;
$events_sess.pres_mgmt.show_modal__presenter_agree = $lq__event_presenter_obj?.event_presenter_id_random;
}
}
class="{ae_snip.classes__events_pres_mgmt_menu__button_warning_special} 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}
</span>
{/if}
</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__presenter != 'options'}
>
<Element_ae_crud
trigger_patch={ae_triggers.priority}
api_cfg={$ae_api}
object_type={'event_presenter'}
object_id={$lq__event_presenter_obj?.event_presenter_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_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random,
log_lvl: 1
});
}}
>
<!-- {@html $lq__event_presenter_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_presenter_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_presenter_obj?.priority}
class:variant-ghost-success={$lq__event_presenter_obj?.priority}
>
{#if $lq__event_presenter_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_presenter'}
object_id={$lq__event_presenter_obj?.event_presenter_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_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random,
log_lvl: 1
});
}}
>
<!-- {($lq__event_presenter_obj?.hide ? 'Hidden' : 'Not Hidden')} -->
<button
on:click={() => {
ae_tmp.value__hide = !$lq__event_presenter_obj?.hide;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_presenter_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_presenter_obj?.hide}
class:variant-ringed-warning={$lq__event_presenter_obj?.hide}
disabled={!$ae_loc.trusted_access}
>
{#if $lq__event_presenter_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_presenter_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_presenter'}
object_id={$lq__event_presenter_obj?.event_presenter_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_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random,
log_lvl: 1
})
.then(function (load_results) {
// Maybe reload page?
// window.location.reload();
});
}}
>
<!-- {($lq__event_presenter_obj?.enable ? 'Enabled' : 'Disabled')} -->
<button
on:click={() => {
ae_tmp.value__enable = !$lq__event_presenter_obj?.enable;
ae_triggers.enable = true;
}}
class="btn btn-sm"
class:variant-ghost-success={$lq__event_presenter_obj?.enable}
class:variant-ringed-warning={!$lq__event_presenter_obj?.enable}
disabled={!$ae_loc.manager_access}
>
{#if $lq__event_presenter_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_presenter_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.manager_access}
<button
on:click={() => {
if (!confirm('Are you sure you want to delete this speaker?')) {return false;}
events_func.delete_ae_obj_id__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj.event_presenter_id_random,
method: 'delete'
})
.then(function (delete_results) {
$events_slct.event_presenter_id = null;
$events_slct.event_presenter_obj = {};
goto(`/events_pres_mgmt/session/${$lq__event_presenter_obj.event_session_id_random}`);
});
}}
class="btn btn-sm variant-ghost-error mx-1" type="button"
title="Delete record permanently"
>
<span class="fas fa-minus-circle mx-1"></span>
Delete
</button>
{:else if $ae_loc.administrator_access}
<button
on:click={() => {
if (!confirm('Are you sure you want to remove (disable) this speaker?')) {return false;}
events_func.delete_ae_obj_id__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj.event_presenter_id_random,
method: 'disable'
})
.then(function (delete_results) {
$events_slct.event_presenter_id = null;
$events_slct.event_presenter_obj = {};
goto(`/events_pres_mgmt/session/${$lq__event_presenter_obj.event_session_id_random}`);
});
}}
class="btn btn-sm variant-ghost-warning mx-1" type="button"
title="Disable record"
>
<span class="fas fa-minus mx-1"></span>
Delete
</button>
{/if}
<!-- {:else if $ae_loc.authenticated_access}
<button
on:click={() => {
if (!confirm('Are you sure you want to hide this speaker?')) {return false;}
events_func.delete_ae_obj_id__event_presenter({
api_cfg: $ae_api,
event_presenter_id: $lq__event_presenter_obj.event_presenter_id_random.event_presenter_id,
method: 'hide'
});
$events_slct.event_presenter_id = null;
$events_slct.event_presenter_obj = {};
goto('/events_pres_mgmt/session/{$lq__event_presenter_obj.event_session_id_random}');
}}
class="btn btn-sm variant-ghost-warning mx-1" type="button"
title="Hide record"
>
<span class="fas fa-trash mx-1"></span>
Delete
</button>
{/if} -->
{#if $ae_loc.authenticated_access}
{#if $events_loc.pres_mgmt.show_content__presenter_qr}
<button
on:click={() => {
$events_loc.pres_mgmt.show_content__presenter_qr = false;
}}
class="btn btn-sm variant-ghost-success"
>
<span class="fas fa-toggle-on m-1"></span>
Showing QR Code
</button>
{:else}
<button
on:click={() => {
$events_loc.pres_mgmt.show_content__presenter_qr = true;
}}
class="btn btn-sm variant-ringed-warning"
>
<span class="fas fa-toggle-off m-1"></span>
Show QR Code?
</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__presenter_page_help"
ds_name="Default: Events - Pres Mgmt Presenter Page Help"
ds_type="html"
for_type="event"
for_id={$lq__event_presenter_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__presenter != 'help'}
/>
<div>
<button
type="button"
on:click={() => {
$events_loc.pres_mgmt.show_menu__presenter = !$events_loc.pres_mgmt.show_menu__presenter;
}}
class="btn btn-sm mx-1 variant-ghost-error hover:variant-filled-error"
class:hidden={!$events_loc.pres_mgmt.show_menu__presenter}
title="Collapse the expanded menu"
>
<span class="fas fa-chevron-up m-1"></span>
{#if $events_loc.pres_mgmt.show_menu__presenter}
Hide
<!-- Collapse -->
{:else}
Show
{/if}
<!-- Menu? -->
</button>
</div>
</div> <!-- End of the new standard page specific menu -->

1449
src/routes/events/[event_id]/presenter/[presenter_id]/presenter_view.svelte Normal file
View File

File diff suppressed because it is too large Load Diff