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

Trying to get things ready for tomorrow. Now with saving of opt outs and other.

Browse Source
This commit is contained in:
Scott Idem
2024-06-14 00:34:24 -04:00
parent 58d25e922c
commit 0156426f4b
5 changed files with 351 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
src/lib/ae_events_functions.ts
View File

@@ -461,6 +461,53 @@ async function handle_load_ae_obj_li__event_presenter(
}
// Updated 2024-06-13
async function handle_update_ae_obj__event_presenter(
{
api_cfg,
event_presenter_id,
data,
params={},
log_lvl=0
} : {
api_cfg: any,
event_presenter_id: string,
data: any,
params?: key_val,
log_lvl?: number
}
) {
console.log(`*** handle_update_ae_obj__event_presenter() *** event_presenter_id=${event_presenter_id}`);
ae_promises.update__event_presenter_obj = await api.update_ae_obj_id_crud({
api_cfg: api_cfg,
obj_type: 'event_presenter',
obj_id: event_presenter_id, // NOTE: This is the FQDN, not normally the ID.
fields: data,
key: api_cfg.api_crud_super_key,
params: params,
return_obj: true,
log_lvl: log_lvl
})
.then(function (event_presenter_obj_update_result) {
if (event_presenter_obj_update_result) {
handle_db_save_ae_obj_li__event_presenter({obj_type: 'event_presenter', obj_li: [event_presenter_obj_update_result]});
return event_presenter_obj_update_result;
} else {
return null;
}
})
.catch(function (error) {
console.log('No results returned or failed.', error);
})
.finally(function () {
});
console.log('ae_promises.update__event_presenter_obj:', ae_promises.update__event_presenter_obj);
return ae_promises.update__event_presenter_obj;
}
async function handle_load_ae_obj_id__badge({api_cfg, badge_id, try_cache=false}) {
console.log(`*** handle_load_ae_obj_id__badge() *** badge_id=${badge_id}`);
@@ -1327,6 +1374,8 @@ function handle_db_save_ae_obj_li__event_session({obj_type, obj_li}) {
alert: obj.alert,
alert_msg: obj.alert_msg,
data_json: obj.data_json,
enable: obj.enable,
hide: obj.hide,
priority: obj.priority,
@@ -1393,6 +1442,8 @@ function handle_db_save_ae_obj_li__event_presentation({obj_type, obj_li}) {
hide_event_launcher: obj.hide_event_launcher,
// data_json: obj.data_json,
enable: obj.enable,
hide: obj.hide,
priority: obj.priority,
@@ -1467,6 +1518,8 @@ function handle_db_save_ae_obj_li__event_presenter({obj_type, obj_li}) {
hide_event_launcher: obj.hide_event_launcher,
data_json: obj.data_json,
enable: obj.enable,
hide: obj.hide,
priority: obj.priority,
@@ -1538,6 +1591,7 @@ let export_obj = {
handle_load_ae_obj_id__event_presenter: handle_load_ae_obj_id__event_presenter,
handle_load_ae_obj_li__event_presenter: handle_load_ae_obj_li__event_presenter,
handle_update_ae_obj__event_presenter: handle_update_ae_obj__event_presenter,
handle_load_ae_obj_id__badge: handle_load_ae_obj_id__badge,
handle_load_ae_obj_li__badge: handle_load_ae_obj_li__badge,

3
src/lib/ae_events_stores.ts
View File

@@ -137,6 +137,9 @@ let events_local_data_struct: key_val = {
show_content__presentation_description: false,
show_content__agree_text: false,
show_content__presenter_start: false,
disable_submit__opt_out: true,
submit_status__opt_out: null,
},
// Speakers Management (Collection)

3
src/lib/db_events.ts
View File

@@ -281,6 +281,8 @@ export interface Presenter {
hide_event_launcher: null|boolean;
data_json: null|string;
enable: null|boolean;
hide: null|boolean;
priority: null|boolean
@@ -365,6 +367,7 @@ export class MySubClassedDexie extends Dexie {
professional_title, full_name, affiliations, email,
biography, agree, comments, passcode,
hide_event_launcher,
data_json,
enable, hide, priority, sort, group, notes, created_on, updated_on`,
});
}

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

@@ -26,7 +26,6 @@ import { events_loc, events_sess, events_slct, events_trigger } from '$lib/ae_ev
import { events_func } from '$lib/ae_events_functions';
import Form_agree from './form_agree.svelte';
import FormAgree from './form_agree.svelte';
// Quickly save the data passed from the parent(s) to the Svelte stores, localStorage, and other.
$slct.account_id = data.account_id;
@@ -208,6 +207,46 @@ onMount(() => {
$: if ($slct_trigger == 'load__event_presenter_obj_li') {
console.log(`load__event_presenter_obj_li event_session_id=${$slct.account_id}`);
$slct_trigger = null;
events_func.handle_load_ae_obj_li__event_presenter({
api_cfg: $ae_api,
event_presentation_id: $events_slct.event_presentation_id,
try_cache: false
});
}
function send_init_confirm_email() {
console.log(`*** send_init_confirm_email() *** to ${$lq__event_presenter_obj.email}.`);
let subject = `LCI 2024 Pres Mgmt Hub Link for ${$lq__event_session_obj.name} (ID: ${$lq__event_session_obj.eventt_session_id_random})`;
let body_html = `
<div>${$lq__event_session_obj.full_name},
<p>The link to sign in to the presentation management hub for LCI 2024 is below. If you need to make any changes or updates to your submission, you may access it via via the link below.</p>
</div>
<br>
<div>
LCI 2024 Session ID: ${$lq__event_session_obj.event_session_id_random}<br>
<p>Use this link to view or update your LCI 2024 presentation information.<br>
Copy and paste link: <a href="xxx">xxxx</a></p>
</div>`;
api.send_email({
api_cfg: $ae_api,
from_email: 'noreply+agree@oneskyit.com',
from_name: 'LCI 2024 Pres Mgmt Hub',
to_email: 'test+agree@oneskyit.com',
subject: subject,
body_html: body_html,
});
}
</script>
@@ -565,6 +604,9 @@ onMount(() => {
on:click={() => {
console.log('Email the access link');
alert(`NOT ENABLED: Emails link to the presenter (${event_presenter_obj.email}):\n${data.url.origin}/events_pres_mgmt/session/${$events_slct.event_session_id}?person_id=${event_presenter_obj.person_id_random}&person_pass=${event_presenter_obj.person_passcode}`);
// send_init_confirm_email();
// send_email({
// to: event_presenter_obj.email,
// subject: `Access link for ${$lq__event_session_obj.name}`,
@@ -734,46 +776,55 @@ onMount(() => {
{#if $events_loc.pres_mgmt?.show_content__agree_text}
<section class="ae_quick_modal_container">
<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
<button
on:click={
() => {
$events_loc.pres_mgmt.show_content__agree_text = null;
}
}
class="btn btn-sm variant-soft-secondary float-right"
class="btn btn-md variant-ghost-secondary hover:variant-filled-secondary float-right"
>
<span class="fas fa-times mx-1"></span>
Close
</button>
<Form_agree />
<Form_agree />
</section>
<!-- <div class="h-12"> -->
<button
on:click={
() => {
$events_loc.pres_mgmt.show_content__agree_text = null;
}
}
class="btn btn-sm variant-soft-secondary float-right"
class="btn btn-md variant-soft-secondary hover:variant-filled-secondary"
>
<span class="fas fa-times mx-1"></span>
Close
</button>
<!-- </div> -->
</div>
</section>
</section>
</div>
{/if}
{#if $events_loc.pres_mgmt.show_content__presenter_start}
<section class="ae_quick_modal_container">
<div class="ae_quick_modal_container">
<section class="ae_quick_popover">
<section class="ae_modal_scrollfix">
@@ -889,7 +940,7 @@ onMount(() => {
Close
</button>
</section>
</section>
</div>
{/if}
@@ -902,7 +953,9 @@ div.ae_quick_modal_container {
width: 100%;
height: 100%;
z-index: 100;
background-color: hsla(0, 0%, 0%, .5);
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. */
@@ -912,12 +965,20 @@ section.ae_quick_popover {
left: 50%;
transform: translate(-50%, -50%);
z-index: 100;
background-color: hsla(0, 0%, 100%, .95);
padding: 1rem;
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>

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

@@ -7,6 +7,7 @@ import { liveQuery } from "dexie";
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import Element_data_store from '$lib/element_data_store.svelte';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
@@ -19,6 +20,9 @@ import { events_func } from '$lib/ae_events_functions';
let ae_triggers: key_val = {};
let ae_promises: key_val = {}; // Promise<any>;
let lq__event_session_obj = liveQuery(
() => db_events.sessions.get($events_slct.event_session_id)
);
// let lq__event_presentation_obj = liveQuery(
// async () => await db_events.presentations.get($events_slct.event_presentation_id)
@@ -31,15 +35,134 @@ let lq__event_presenter_obj = liveQuery(
// $events_slct.event_presenter_obj = $lq__event_presenter_obj;
$events_sess.pres_mgmt.disable_submit__opt_out = false;
let tmp_agree = false;
let tmp_opt_out = {};
let tmp_opt_out: key_val = {
audio: false,
video: false,
transcription_and_publication: false,
publication_in_app: false
};
onMount(() => {
console.log('Events Session [slug]: form_agree.svelte');
console.log(`$events_slct.event_presenter_id:`, $events_slct.event_presenter_id);
console.log(`$lq__event_presenter_obj:`, $lq__event_presenter_obj);
// console.log($lq__event_presenter_obj.data_json);
});
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;
console.log(`opt_out_do:`, opt_out_do);
let data_out = {
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: 2
})
.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;
}
// function send_init_confirm_email() {
// console.log(`*** send_init_confirm_email() *** to ${$lq__event_presenter_obj.email}.`);
// let subject = `LCI 2024 Pres Mgmt Hub Link for ${$lq__event_session_obj.name} (ID: ${$lq__event_session_obj.eventt_session_id_random})`;
// let body_html = `
// <div>${$lq__event_session_obj.full_name},
// <p>The link to sign in to the presentation management hub for LCI 2024 is below. If you need to make any changes or updates to your submission, you may access it via via the link below.</p>
// </div>
// <br>
// <div>
// LCI 2024 Session ID: ${$lq__event_session_obj.event_session_id_random}<br>
// <p>Use this link to view or update your LCI 2024 presentation information.<br>
// Copy and paste link: <a href="xxx">xxxx</a></p>
// </div>`;
// api.send_email({
// api_cfg: $ae_api,
// from_email: 'noreply+agree@oneskyit.com',
// from_name: 'LCI 2024 Pres Mgmt Hub',
// to_email: 'test+agree@oneskyit.com',
// subject: subject,
// body_html: body_html,
// });
// }
</script>
{#await $lq__event_presenter_obj}
@@ -59,47 +182,114 @@ onMount(() => {
class_li="p-2"
/>
<section class="text-lg p-1 m-1 border border-red-200 rounded-md bg-red-100 space-y-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: "{$events_slct.presentation_obj.name}"</h3>
<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>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_audio">
<input
type="checkbox"
class="form-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}
>
Audio Reproduction of Presentation
Opt-out - Audio Reproduction of Presentation
</label>
<label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_video">
<input
type="checkbox"
class="form-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}
>
Video Reproduction of Presentation
Opt-out - Video Reproduction of Presentation
</label>
<label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_transcription_and_publication">
<input
type="checkbox"
class="form-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}
>
Transcription and Publication of Presentation on LCI Website
Opt-out - Transcription and Publication of Presentation on LCI Website
</label>
<label>
<label
class="label p-1 hover:variant-ghost-warning rounded-md"
for="optout_publication_in_app">
<input
type="checkbox"
class="form-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}
>
Publication of Presentation on LCI Congress App
Opt-out - Publication of Presentation on LCI Congress App
</label>
<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 mx-1"></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>
</form>
<h3 class="h4">Agree?</h3>
<!-- Agree (agreement) means this presenter has agreed to the terms and conditions. -->
@@ -119,7 +309,16 @@ onMount(() => {
class_li={'m-1'}
on:ae_crud_updated={e => {
console.log(`ae_crud_updated event:`, e.detail);
events_func.handle_load_ae_obj_id__event_presenter({api_cfg: $ae_api, event_presenter_id: $lq__event_presenter_obj?.event_presenter_id_random, log_lvl: 1});
// Wait 1 second to make sure it saved...?
events_func.handle_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) {
// Wait and then close
// $events_loc.pres_mgmt.show_content__agree_text = null;
// Maybe reload page... to get the outline view to refresh?
});
}}
>
{#if !$lq__event_presenter_obj?.agree}
@@ -151,7 +350,7 @@ onMount(() => {
{#if $lq__event_presenter_obj?.agree}
<!-- <span class="fas fa-sync m-1"></span> -->
<span class="fas fa-times text-red-500 mx-1"></span>
Not agreed?
Change to not agreed?
{:else}
<span class="fa fa-check m-1 text-green-500"></span>
Mark as agreed?