Create presentations and presenters. Making things look nicer.

This commit is contained in:
Scott Idem
2024-06-24 19:09:40 -04:00
parent 58a975bfe9
commit 384f91bbe7
5 changed files with 309 additions and 113 deletions

View File

View File

@@ -113,6 +113,64 @@ export async function handle_load_ae_obj_li__event_presentation(
}
// Updated 2024-06-24
export async function handle_create_ae_obj__event_presentation(
{
api_cfg,
event_id,
event_session_id,
data_kv,
params={},
log_lvl=0
}: {
api_cfg: any,
event_id: string,
event_session_id: string,
data_kv: key_val,
params?: key_val,
log_lvl?: number
}
) {
console.log(`*** handle_create_ae_obj__event_presentation() *** event_id=${event_id} event_session_id=${event_session_id}`);
ae_promises.create__event_presentation = await api.create_ae_obj_crud({
api_cfg: api_cfg,
obj_type: 'event_presentation',
fields: {
event_id_random: event_id,
event_session_id_random: event_session_id,
...data_kv
},
key: api_cfg.api_crud_super_key,
params: params,
return_obj: true,
log_lvl: log_lvl
})
.then(function (event_presentation_obj_create_result) {
if (event_presentation_obj_create_result) {
handle_db_save_ae_obj_li__event_presentation(
{
obj_type: 'event_presentation',
obj_li: [event_presentation_obj_create_result]
});
return event_presentation_obj_create_result;
} else {
return null;
}
})
.catch(function (error) {
console.log('No results returned or failed.', error);
})
.finally(function () {
});
if (log_lvl) {
console.log('ae_promises.create__event_presentation:', ae_promises.create__event_presentation);
}
return ae_promises.create__event_presentation;
}
// This function will loop through the event_presentation_obj_li and save each one to the DB.
// Updated 2024-06-10
export function handle_db_save_ae_obj_li__event_presentation(

View File

@@ -112,6 +112,65 @@ export async function handle_load_ae_obj_li__event_presenter(
return ae_promises.load__event_presenter_obj_li;
}
// Updated 2024-06-24
export async function handle_create_ae_obj__event_presenter(
{
api_cfg,
event_id,
event_session_id,
event_presentation_id,
data_kv,
params={},
log_lvl=0
}: {
api_cfg: any,
event_id: string,
event_session_id: string,
event_presentation_id: string,
data_kv: key_val,
params?: key_val,
log_lvl?: number
}
) {
console.log(`*** handle_create_ae_obj__event_presenter() *** event_id=${event_id} event_session_id=${event_session_id} event_presentation_id=${event_presentation_id}`);
ae_promises.create__event_presenter = await api.create_ae_obj_crud({
api_cfg: api_cfg,
obj_type: 'event_presenter',
fields: {
event_id_random: event_id,
event_session_id_random: event_session_id,
event_presentation_id_random: event_presentation_id,
...data_kv
},
key: api_cfg.api_crud_super_key,
params: params,
return_obj: true,
log_lvl: log_lvl
})
.then(function (event_presenter_obj_create_result) {
if (event_presenter_obj_create_result) {
handle_db_save_ae_obj_li__event_presenter(
{
obj_type: 'event_presenter', obj_li: [event_presenter_obj_create_result]
});
return event_presenter_obj_create_result;
} else {
return null;
}
})
.catch(function (error) {
console.log('No results returned or failed.', error);
})
.finally(function () {
});
if (log_lvl) {
console.log('ae_promises.create__event_presenter:', ae_promises.create__event_presenter);
}
return ae_promises.create__event_presenter;
}
// Updated 2024-06-13
export async function handle_update_ae_obj__event_presenter(

View File

@@ -35,12 +35,14 @@ import {
import {
handle_load_ae_obj_id__event_presentation,
handle_load_ae_obj_li__event_presentation,
handle_create_ae_obj__event_presentation,
handle_db_save_ae_obj_li__event_presentation
} from "$lib/ae_events__event_presentation";
import {
handle_load_ae_obj_id__event_presenter,
handle_load_ae_obj_li__event_presenter,
handle_create_ae_obj__event_presenter,
handle_update_ae_obj__event_presenter,
handle_db_save_ae_obj_li__event_presenter
} from "$lib/ae_events__event_presenter";
@@ -67,9 +69,11 @@ let export_obj = {
handle_load_ae_obj_id__event_presentation: handle_load_ae_obj_id__event_presentation,
handle_load_ae_obj_li__event_presentation: handle_load_ae_obj_li__event_presentation,
handle_create_ae_obj__event_presentation: handle_create_ae_obj__event_presentation,
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_create_ae_obj__event_presenter: handle_create_ae_obj__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,

View File

@@ -912,120 +912,185 @@ function send_sign_in_poc_email(
<!-- Presentations in the session -->
<section>
<div class="float-right space-2 flex flex-row items-center">
{#if $ae_loc.trusted_access }
<button
type="button"
on:click={() => {
console.log('Add Presentation');
let presentation_data = {
event_id_random: $events_slct.event_id,
event_session_id_random: $events_slct.event_session_id,
name: 'New Presentation',
code: 'new_presentation',
enable: true,
}
events_func.handle_create_ae_obj__event_presentation({
api_cfg: $ae_api,
event_id: $events_slct.event_id,
event_session_id: $events_slct.event_session_id,
data_kv: presentation_data,
log_lvl: 1,
})
}}
class="btn btn-sm variant-soft-warning hover:variant-filled-warning"
>
<span class="fas fa-plus mx-1"></span>
Add Presentation
</button>
{/if}
</div>
<h3 class="h3">Presentations:</h3>
{#await $events_slct.event_presentation_obj_li}
<p>Loading...</p>
{:then event_presentation_obj_li}
{#if event_presentation_obj_li && event_presentation_obj_li.length > 0}
<ul
class="space-y-2 px-4"
class="space-y-4 p-4 m-2 bg-gray-100 rounded-md"
>
{#each event_presentation_obj_li as event_presentation_obj}
<li>
<li
class="space-y-2 border border-gray-200 p-2 rounded-md"
>
<div class="float-right space-2 flex flex-row items-center">
{#if $ae_loc.trusted_access }
<button
type="button"
on:click={() => {
console.log('Add Presenter');
let presenter_data = {
event_id_random: $events_slct.event_id,
event_session_id_random: $events_slct.event_session_id,
event_presentation_id_random: event_presentation_obj.event_presentation_id_random,
given_name: 'New',
family_name: 'Presenter',
email: 'test+newpres@oneskyit.com',
code: 'new_presenter',
enable: true,
}
events_func.handle_create_ae_obj__event_presenter({
api_cfg: $ae_api,
event_id: $events_slct.event_id,
event_session_id: $events_slct.event_session_id,
event_presentation_id: event_presentation_obj.event_presentation_id_random,
data_kv: presenter_data,
log_lvl: 1,
})
}}
class="btn btn-sm variant-soft-warning hover:variant-filled-warning"
>
<span class="fas fa-plus mx-1"></span>
Add Presenter
</button>
{/if}
<!-- Make sure to show the edit button only if the user has the correct permissions. Need to set the presentation ID in the store. -->
{#if event_presentation_obj && ($ae_loc.trusted_access || $events_loc.auth__kv.presentation[event_presentation_obj.event_presentation_id_random])}
{#if $events_slct.event_presentation_id == event_presentation_obj.event_presentation_id_random && ae_tmp[$events_slct.event_presentation_id]?.show__edit_presentation_name}
<button
type="button"
on:click={() => {
console.log('Cancel edit presentation');
ae_tmp[$events_slct.event_presentation_id].show__edit_presentation_name = false;
// Careful with the trigger_patch. It will keep firing if not reset.
ae_triggers.update_event_presentation_name = false;
}}
class="btn btn-sm variant-soft-warning float-right"
>
<span class="fas fa-times mx-1">
</span>
Cancel
</button>
{:else}
<button
type="button"
on:click={() => {
console.log('Edit presentation title and description');
$events_slct.event_presentation_id = event_presentation_obj.event_presentation_id_random;
$events_slct.event_presentation_obj = event_presentation_obj;
ae_tmp[$events_slct.event_presentation_id] = {
show__edit_presentation_name: true,
}
}}
title="Edit presentation title and description"
class="btn btn-sm variant-soft-warning float-right">
<span class="fas fa-edit mx-1">
</span>
Edit
</button>
{/if}
{#if $events_slct.event_presentation_id == event_presentation_obj.event_presentation_id_random && ae_tmp[$events_slct.event_presentation_id]?.show__edit_presentation_name && $events_slct.event_presentation_obj}
<!-- Edit the presentation title -->
<Element_ae_crud
trigger_patch={ae_triggers.update_event_presentation_name}
api_cfg={$ae_api}
object_type={'event_presentation'}
object_id={$events_slct.event_presentation_obj.event_presentation_id_random}
field_name={'name'}
field_type={'input'}
field_value={$events_slct.event_presentation_obj.name}
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.handle_load_ae_obj_id__event_presentation({api_cfg: $ae_api, event_presentation_id: $events_slct.event_presentation_obj.event_presentation_id_random, log_lvl: 1})
.then(function (load_results) {
// We need to force reload the Indexed DB - Dexie.js?
// Sometimes the changes are not seen. The file disappears when the Save button is pressed.
// Maybe reload page?
// window.location.reload();
})
.finally(function () {
<button
type="button"
on:click={() => {
console.log('Cancel edit presentation');
ae_tmp[$events_slct.event_presentation_id].show__edit_presentation_name = false;
// Careful with the trigger_patch. It will keep firing if not reset.
ae_triggers.update_event_presentation_name = false;
});
}}
>
<input
bind:value={$events_slct.event_presentation_obj.name}
class="input min-w-96 max-w-96 text-sm"
/>
<!-- disabled={$events_slct.event_presentation_obj.name == event_presentation_obj.name} -->
class="btn btn-sm variant-soft-warning"
>
<span class="fas fa-times mx-1">
</span>
Cancel
</button>
{:else}
<button
type="button"
on:click={() => {
console.log('*** Save button clicked ***');
// if (!confirm('Are you sure you want to save this event_presenter?')) {return false;}
console.log(`Selected event_presentation_id: ${$events_slct.event_presentation_obj.event_presentation_id_random}`);
ae_triggers.update_event_presentation_name = true;
// ae_triggers.update_event_presentation_name = $events_slct.event_presentation_obj.event_presentation_id_random;
console.log('Edit presentation title and description');
$events_slct.event_presentation_id = event_presentation_obj.event_presentation_id_random;
$events_slct.event_presentation_obj = event_presentation_obj;
ae_tmp[$events_slct.event_presentation_id] = {
show__edit_presentation_name: true,
}
}}
class="btn btn-sm variant-soft-success hover:variant-ghost-success mx-1"
>
<span class="fas fa-save mx-1"></span>
Save
title="Edit presentation title and description"
class="btn btn-sm variant-soft-warning">
<span class="fas fa-edit mx-1">
</span>
Edit Presentation Name
</button>
</Element_ae_crud>
{/if}
{#if $events_slct.event_presentation_id == event_presentation_obj.event_presentation_id_random && ae_tmp[$events_slct.event_presentation_id]?.show__edit_presentation_name && $events_slct.event_presentation_obj}
<!-- Edit the presentation title -->
<Element_ae_crud
trigger_patch={ae_triggers.update_event_presentation_name}
api_cfg={$ae_api}
object_type={'event_presentation'}
object_id={$events_slct.event_presentation_obj.event_presentation_id_random}
field_name={'name'}
field_type={'input'}
field_value={$events_slct.event_presentation_obj.name}
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.handle_load_ae_obj_id__event_presentation({api_cfg: $ae_api, event_presentation_id: $events_slct.event_presentation_obj.event_presentation_id_random, log_lvl: 1})
.then(function (load_results) {
// We need to force reload the Indexed DB - Dexie.js?
// Sometimes the changes are not seen. The file disappears when the Save button is pressed.
// Maybe reload page?
// window.location.reload();
})
.finally(function () {
ae_tmp[$events_slct.event_presentation_id].show__edit_presentation_name = false;
// Careful with the trigger_patch. It will keep firing if not reset.
ae_triggers.update_event_presentation_name = false;
});
}}
>
<input
bind:value={$events_slct.event_presentation_obj.name}
class="input min-w-96 max-w-96 text-sm"
/>
<!-- disabled={$events_slct.event_presentation_obj.name == event_presentation_obj.name} -->
<button
type="button"
on:click={() => {
console.log('*** Save button clicked ***');
// if (!confirm('Are you sure you want to save this event_presenter?')) {return false;}
console.log(`Selected event_presentation_id: ${$events_slct.event_presentation_obj.event_presentation_id_random}`);
ae_triggers.update_event_presentation_name = true;
// ae_triggers.update_event_presentation_name = $events_slct.event_presentation_obj.event_presentation_id_random;
}}
class="btn btn-sm variant-soft-success hover:variant-ghost-success mx-1"
>
<span class="fas fa-save mx-1"></span>
Save
</button>
</Element_ae_crud>
{/if}
{/if}
</div>
<h4 class="h5">
"{event_presentation_obj.name}"
@@ -1040,35 +1105,45 @@ function send_sign_in_poc_email(
</h4>
<div>
<strong class="text-sm">
Description:
</strong>
<button
type="button"
on:click={() => {
console.log('Show/Hide Description');
if ($events_loc.pres_mgmt.show_content__presentation_description == event_presentation_obj.event_presentation_id_random) {
$events_loc.pres_mgmt.show_content__presentation_description = null;
} else {
$events_loc.pres_mgmt.show_content__presentation_description = event_presentation_obj.event_presentation_id_random;
}
}}
class="btn btn-sm variant-soft-surface hover:variant-filled-surface text-xs"
>
{#if $events_loc.pres_mgmt.show_content__presentation_description == event_presentation_obj.event_presentation_id_random}
<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>
</div>
{#if event_presentation_obj.description}
<strong class="text-sm">
Description:
</strong>
<pre
class="whitespace-pre-wrap p-2 bg-gray-100 rounded-md"
class:hidden={$events_loc.pres_mgmt.show_content__presentation_description !== event_presentation_obj.event_presentation_id_random}
>{event_presentation_obj.description}</pre>
<button
type="button"
on:click={() => {
console.log('Show/Hide Description');
if ($events_loc.pres_mgmt.show_content__presentation_description == event_presentation_obj.event_presentation_id_random) {
$events_loc.pres_mgmt.show_content__presentation_description = null;
} else {
$events_loc.pres_mgmt.show_content__presentation_description = event_presentation_obj.event_presentation_id_random;
}
}}
class="btn btn-sm variant-soft-surface hover:variant-filled-surface text-xs"
>
{#if $events_loc.pres_mgmt.show_content__presentation_description == event_presentation_obj.event_presentation_id_random}
<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__presentation_description !== event_presentation_obj.event_presentation_id_random}
>{event_presentation_obj.description}</pre>
{:else}
<div class="text-sm text-gray-500 bg-gray-100 p-1 rounded-md border border-gray-200"
class:hidden={!$ae_loc.administrator_access}
>
<span class="fas fa-exclamation-triangle mx-1"></span>
No description provided.
</div>
{/if}
</div>
<!-- Show presenters for this presentation -->
{#await event_presentation_obj.event_presenter_li}