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

Lot of updates to Svelte 5 syntax

Browse Source
This commit is contained in:
Scott Idem
2025-07-23 16:21:27 -04:00
parent 8504f4b79a
commit 4861ae0499
41 changed files with 998 additions and 1079 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
src/routes/events/[event_id]/session/[session_id]/+page.svelte
View File

@@ -1,12 +1,16 @@
<script lang="ts">
/** @type {import('./$types').PageData} */
export let data: any;
let log_lvl: number = 0;
interface Props {
/** @type {import('./$types').PageData} */
data: any;
}
let { data }: Props = $props();
let log_lvl: number = $state(0);
// console.log(`ae_events_pres_mgmt event [session_id] +page.svelte data:`, data);
// Imports
import { Modal } from 'flowbite-svelte';
import { onMount } from 'svelte';
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
@@ -32,6 +36,7 @@ import Session_page_menu from './session_page_menu.svelte';
import { browser } from '$app/environment';
// Variables
if (browser) {
console.log('Browser environment detected.');
@@ -86,46 +91,57 @@ if (!$events_sess.pres_mgmt) {
$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_obj = $derived(liveQuery(async () => {
let results = await db_events.events
.get($events_slct.event_id);
return results;
}));
let lq__event_session_obj = liveQuery(
() => db_events.sessions.get(ae_acct.slct.event_session_id)
);
let lq__event_session_obj = $derived(liveQuery(async () => {
let results = await db_events.sessions.get(ae_acct.slct.event_session_id)
return results;
}));
let lq__event_presentation_obj_li = liveQuery(
() => db_events.presentations
let lq__event_presentation_obj_li = $derived(liveQuery(async () => {
let results = await db_events.presentations
.where('event_session_id')
.equals(ae_acct.slct.event_session_id)
.sortBy('name')
);
;
return results;
}));
let lq__event_presenter_obj = liveQuery(
() => db_events.presenters.get($events_slct.event_presenter_id)
);
let lq__event_presenter_obj = $derived(liveQuery(async () => {
let results = await db_events.presenters
.get($events_slct.event_presenter_id);
return results;
}));
let lq__auth__event_presenter_obj = liveQuery(
() => db_events.presenters.get($events_loc.auth__person?.presenter_id ?? null)
);
let lq__auth__event_presenter_obj = $derived(liveQuery(async () => {
let results = await db_events.presenters
.get($events_loc.auth__person?.presenter_id ?? null);
return results;
}));
$slct.person_obj_kv = {}; // This is intended for the POC lookup list when generated.
// JSON formatted configuration options for an event, and specifically for the presentation management module.
$: if ($lq__event_obj?.mod_pres_mgmt_json) {
// if (log_lvl) {
// console.log(`*** Event Pres Mgmt JSON *** pres_mgmt_cfg_local`, $events_loc.pres_mgmt);
// }
// $events_loc.pres_mgmt =
events_func.sync_config__event_pres_mgmt({
pres_mgmt_cfg_remote: $lq__event_obj?.mod_pres_mgmt_json,
pres_mgmt_cfg_local: $events_loc?.pres_mgmt,
log_lvl: log_lvl,
$effect(() => {
if ($lq__event_obj?.mod_pres_mgmt_json) {
// if (log_lvl) {
// console.log(`*** Event Pres Mgmt JSON *** pres_mgmt_cfg_local`, $events_loc.pres_mgmt);
// }
// $events_loc.pres_mgmt =
events_func.sync_config__event_pres_mgmt({
pres_mgmt_cfg_remote: $lq__event_obj?.mod_pres_mgmt_json,
pres_mgmt_cfg_local: $events_loc?.pres_mgmt,
log_lvl: log_lvl,
});
// if (log_lvl) {
// console.log(`*** Event Pres Mgmt JSON *** pres_mgmt_cfg_local`, $events_loc.pres_mgmt);
// }
}
});
// if (log_lvl) {
// console.log(`*** Event Pres Mgmt JSON *** pres_mgmt_cfg_local`, $events_loc.pres_mgmt);
// }
}
if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__session_view) {
@@ -133,9 +149,6 @@ if (!$ae_loc.authenticated_access && $events_loc.pres_mgmt.show_content__session
}
// *** Functions and Logic
onMount(() => {
console.log('Events Session [session_id]: +page.svelte');
});
</script>
@@ -185,7 +198,7 @@ onMount(() => {
<!-- Button to toggle between the regular session view and managing session files -->
<button
type="button"
on:click={() => {
onclick={() => {
if ($events_loc.pres_mgmt.show_content__session_view == 'manage_files') {
$events_loc.pres_mgmt.show_content__session_view = null;
} else {
@@ -249,7 +262,7 @@ onMount(() => {
/>
<div class="m-1 flex flex-col flex-wrap gap-1 items-center">
{#if $ae_loc.trusted_access || ($events_loc.auth__person?.id && $events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id]) }
{#if $ae_loc.trusted_access || ($events_loc.auth__person?.id && $events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id])}
{#if $events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] === true}
<h3 class="h3">Welcome {$lq__event_session_obj?.poc_person_full_name ?? 'Session POC'}</h3>
@@ -261,8 +274,7 @@ onMount(() => {
{#if
$ae_loc.trusted_access ||
$events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] === true ||
($events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] == 'read' && $lq__auth__event_presenter_obj?.agree)
}
($events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] == 'read' && $lq__auth__event_presenter_obj?.agree)}
<!-- Message if they have agreed -->
<Element_data_store
ds_code="events__pres_mgmt__session_page_authorized_info"
@@ -337,18 +349,20 @@ onMount(() => {
link_to_type="event_session"
link_to_id={$lq__event_session_obj.event_session_id}
>
<span slot="label">
<div class="text-lg">
<span class="fas fa-upload"></span>
<strong class="">Upload session (breakout) specific files only!</strong>
</div>
<div class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Session (breakout) 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
</div>
</span>
{#snippet label()}
<span >
<div class="text-lg">
<span class="fas fa-upload"></span>
<strong class="">Upload session (breakout) specific files only!</strong>
</div>
<div class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Session (breakout) 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
</div>
</span>
{/snippet}
</Comp_event_files_upload>
<div class="overflow-x-auto w-max max-w-full">
@@ -399,7 +413,7 @@ onMount(() => {
<div class="text-center w-full">
<button
on:click={() => {
onclick={() => {
$events_sess.pres_mgmt.show_modal__presenter_agree = false;
}}
class="btn btn-sm preset-tonal-warning hover:preset-tonal-warning border border-warning-500"

29
src/routes/events/[event_id]/session/[session_id]/ae_comp__event_session_poc_form_agree.svelte
View File

@@ -1,6 +1,13 @@
<script lang="ts">
interface Props {
log_lvl?: number;
// Exports
lq__event_session_obj: any;
}
let { log_lvl = 0, lq__event_session_obj }: Props = $props();
console.log(`ae_events_pres_mgmt session [slug] form_agree.svelte`);
export let log_lvl: number = 0;
// Imports (external and then internal)
import type { key_val } from '$lib/ae_stores';
@@ -12,11 +19,8 @@ import { events_func } from '$lib/ae_events_functions';
// Import components and elements
import Element_data_store from '$lib/element_data_store_v2.svelte';
// Exports
export let lq__event_session_obj: any;
// Local Variables
let ae_promises: key_val = {};
let ae_promises: key_val = $state({});
// let ae_tmp: key_val = {};
// let ae_triggers: key_val = {};
@@ -35,6 +39,13 @@ let tmp_opt_out: key_val = {
};
// *** Functions and Logic
function preventDefault(fn) {
return function (event) {
event.preventDefault();
fn.call(this, event);
};
}
async function handle_submit_form(event) {
console.log('*** handle_submit_form() ***');
@@ -172,7 +183,7 @@ async function handle_submit_form(event) {
<h3 class="h4 text-center">Opt-Out?</h3>
<form
class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form}
onsubmit={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>
@@ -236,7 +247,7 @@ async function handle_submit_form(event) {
<button
type="submit"
disabled={($events_sess.pres_mgmt?.disable__session_submit_opt_out)}
on:click={() => {
onclick={() => {
console.log('*** Save button clicked ***');
}}
class="btn btn-md preset-tonal-warning border border-warning-500 hover:preset-filled-secondary-500 m-2"
@@ -296,7 +307,7 @@ async function handle_submit_form(event) {
<button
disabled={!$ae_loc.administrator_access &&
!$events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] === true}
on:click={() => {
onclick={() => {
console.log('Agree to the terms and conditions.');
$events_sess.pres_mgmt.status__session_agree = 'saving';
@@ -353,7 +364,7 @@ async function handle_submit_form(event) {
</button>
{:else}
<button
on:click={() => {
onclick={() => {
console.log('Change to not agreed.');
let event_session_data = {

41
src/routes/events/[event_id]/session/[session_id]/ae_comp__event_session_poc_profile.svelte
View File

@@ -71,25 +71,8 @@ let clipboard_success = $state(false);
<span class="float-right">
<!-- A button to copy the access link to the clipboard. -->
<!-- Example: /events/CHs3F44Xq76/session/Wh8UnJlbIA0?person_id=fV1dl_IJ0yY&person_pass=abc123 -->
<!-- <button
type="button"
use:clipboard={encodeURI(`${$ae_loc.url_origin}/events/${$events_slct.event_id}/session/${$events_slct.event_session_id}?person_id=${$lq__event_session_obj.poc_person_id_random}&person_pass=${$lq__event_session_obj.poc_person_passcode}&session_id=${$lq__event_session_obj.event_session_id_random}`)}
class="btn btn-sm preset-tonal-warning border border-warning-500 m-1"
title="Copy the POC (moderator/champion) access link to the clipboard."
>
<span class="fas fa-copy mx-1"></span>
Copy Access Link
</button> -->
<!-- <Clipboard
value={encodeURI(`${$ae_loc.url_origin}/events/${$lq__event_session_obj.event_id}/session/${$events_slct.event_session_id}?person_id=${$lq__event_session_obj.poc_person_id}&person_pass=${$lq__event_session_obj.poc_person_passcode}&session_id=${$lq__event_session_obj.event_session_id}`)}
bind:success={clipboard_success}
class="btn btn-sm preset-tonal-warning text-warning-500 m-1"
title="Copy the POC (moderator/champion) access link to the clipboard."
>
{#if clipboard_success}Copied!{:else}Copy Access Link{/if}
</Clipboard> -->
<!-- {#if clipboard_success}Copied!{:else}Copy Access Link{/if} -->
<!-- <span class="fas fa-copy mx-1"></span> -->
<MyClipboard
value={encodeURI(`${$ae_loc.url_origin}/events/${$lq__event_session_obj.event_id}/session/${$events_slct.event_session_id}?person_id=${$lq__event_session_obj.poc_person_id}&person_pass=${$lq__event_session_obj.poc_person_passcode}&session_id=${$lq__event_session_obj.event_session_id}`)}
btn_text="Copy Access Link"
@@ -116,26 +99,6 @@ let clipboard_success = $state(false);
>
<div class="label event_session__biography required space-y-4">
<!-- <button
type="button"
use:clipboard={ae_tmp.biography?.trim()}
class="btn btn-sm preset-tonal-warning border border-warning-500 float-right m-1"
class:hidden={!ae_tmp?.biography || ae_tmp.biography.length < 100}
title="Copy the session POC biography text to the clipboard."
>
<span class="fas fa-copy mx-1"></span>
Copy Biography Text
</button> -->
<!-- <Clipboard
value={ae_tmp.biography?.trim()}
bind:success={clipboard_success}
class="btn btn-sm preset-tonal-warning text-warning-500 float-right m-1"
title="Copy the session POC biography text to the clipboard."
>
{#if clipboard_success}Copied!{:else}Copy Biography Text{/if}
</Clipboard> -->
<MyClipboard
value={ae_tmp.biography?.trim()}
btn_text="Copy Biography Text"

44
src/routes/events/[event_id]/session/[session_id]/session_page_menu.svelte
View File

@@ -1,6 +1,18 @@
<script lang="ts">
export let data: any;
export let log_lvl: number = 0;
interface Props {
data: any;
log_lvl?: number;
// export let event_session_id: string;
lq__event_session_obj: any;
lq__auth__event_presenter_obj: any;
}
let {
data,
log_lvl = 0,
lq__event_session_obj,
lq__auth__event_presenter_obj
}: Props = $props();
import { goto } from '$app/navigation';
@@ -16,12 +28,8 @@ import Comp__events_menu_nav from '../../../ae_comp__events_menu_nav.svelte';
// import Comp__global_menu_opts from '$lib/ae_comp__global_menu_opts.svelte';
import Comp__pres_mgmt_menu_opts from '../../../ae_comp__events_menu_opts.svelte';
// export let event_session_id: string;
export let lq__event_session_obj: any;
export let lq__auth__event_presenter_obj: any;
let ae_tmp: key_val = {};
let ae_triggers: key_val = {};
let ae_tmp: key_val = $state({});
let ae_triggers: key_val = $state({});
</script>
@@ -53,7 +61,7 @@ let ae_triggers: key_val = {};
<!-- Button to toggle between the regular session view and managing session files -->
<button
type="button"
on:click={() => {
onclick={() => {
if ($events_loc.pres_mgmt.show_content__session_view == 'manage_files') {
$events_loc.pres_mgmt.show_content__session_view = null;
} else {
@@ -84,7 +92,7 @@ let ae_triggers: key_val = {};
<button
type="button"
on:click={() => {
onclick={() => {
if ($events_loc.pres_mgmt.show_menu__session == 'options') {
$events_loc.pres_mgmt.show_menu__session = null;
} else {
@@ -108,7 +116,7 @@ let ae_triggers: key_val = {};
<button
type="button"
on:click={() => {
onclick={() => {
if ($events_loc.pres_mgmt.show_menu__session == 'help') {
$events_loc.pres_mgmt.show_menu__session = null;
} else {
@@ -190,7 +198,7 @@ let ae_triggers: key_val = {};
>
<!-- {($lq__event_session_obj?.hide_event_launcher ? 'Hidden' : 'Not Hidden')} -->
<button
on:click={() => {
onclick={() => {
ae_tmp.value__hide_event_launcher = !$lq__event_session_obj?.hide_event_launcher;
// $events_slct.exhibit_tracking_obj.hide_event_launcher = !$lq__event_session_obj?.hide_event_launcher;
@@ -244,7 +252,7 @@ let ae_triggers: key_val = {};
>
<!-- {@html $lq__event_session_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={() => {
onclick={() => {
ae_tmp.value__priority = !$lq__event_session_obj?.priority;
// $events_slct.exhibit_tracking_obj.priority = !$lq__event_session_obj?.priority;
@@ -298,7 +306,7 @@ let ae_triggers: key_val = {};
>
<!-- {($lq__event_session_obj?.hide ? 'Hidden' : 'Not Hidden')} -->
<button
on:click={() => {
onclick={() => {
ae_tmp.value__hide = !$lq__event_session_obj?.hide;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_session_obj?.hide;
@@ -355,7 +363,7 @@ let ae_triggers: key_val = {};
>
<!-- {($lq__event_session_obj?.enable ? 'Enabled' : 'Disabled')} -->
<button
on:click={() => {
onclick={() => {
ae_tmp.value__enable = !$lq__event_session_obj?.enable;
// $events_slct.exhibit_tracking_obj.hide = !$lq__event_session_obj?.hide;
@@ -386,7 +394,7 @@ let ae_triggers: key_val = {};
{#if $ae_loc.manager_access}
<button
on:click={() => {
onclick={() => {
if (!confirm('Are you sure you want to delete this session?')) {return false;}
events_func.delete_ae_obj_id__event_session({
@@ -409,7 +417,7 @@ let ae_triggers: key_val = {};
</button>
{:else if $ae_loc.administrator_access}
<button
on:click={() => {
onclick={() => {
if (!confirm('Are you sure you want to remove (disable) this session? This is not common.')) {return false;}
events_func.delete_ae_obj_id__event_session({
api_cfg: $ae_api,
@@ -463,7 +471,7 @@ let ae_triggers: key_val = {};
<div>
<button
type="button"
on:click={() => {
onclick={() => {
$events_loc.pres_mgmt.show_menu__session = !$events_loc.pres_mgmt.show_menu__session;
}}
class="btn btn-sm mx-1 ae_btn_info_filled"

79
src/routes/events/[event_id]/session/[session_id]/session_view.svelte
View File

@@ -1,6 +1,4 @@
<script lang="ts">
import { run } from 'svelte/legacy';
interface Props {
log_lvl?: number;
// export let lq__event_obj: any;
@@ -24,7 +22,7 @@ if (log_lvl) {
}
// Imports (external and then internal)
import { liveQuery } from "dexie";
// import { liveQuery } from "dexie";
import { Modal } from 'flowbite-svelte';
// import { Clipboard } from "flowbite-svelte";
@@ -71,13 +69,10 @@ $events_sess.pres_mgmt.show_content__presenter_start = false;
// Local Variables
// let lq__event_session_obj = liveQuery(
// () => db_events.sessions.get(event_session_id)
// let lq__event_presentation_obj_li = liveQuery(
// () => db_events.presentations
// .where('event_session_id')
@@ -85,11 +80,9 @@ $events_sess.pres_mgmt.show_content__presenter_start = false;
// .sortBy('name')
// );
// Local Variables
let lq__event_presentation_obj = liveQuery(
() => db_events.presentations.get($events_slct.event_presentation_id)
);
// let lq__event_presentation_obj = liveQuery(
// () => db_events.presentations.get($events_slct.event_presentation_id)
// );
// let lq__auth__event_presenter_obj = liveQuery(
// () => db_events.presenters.get($events_slct.auth__event_presenter_id)
@@ -104,45 +97,45 @@ $slct.person_obj_kv = {}; // This is intended for the person POC lookup list whe
// *** Functions and Logic
$events_sess.pres_mgmt.session__updated_on = null;
run(() => {
if ($lq__event_session_obj) {
if (log_lvl > 1) {
console.log(`$lq__event_session_obj:`, $lq__event_session_obj);
}
$effect(() => {
if ($lq__event_session_obj) {
if (log_lvl > 1) {
console.log(`$lq__event_session_obj:`, $lq__event_session_obj);
}
if ($events_loc.pres_mgmt.show_content__session_qr) {
if ($events_loc.pres_mgmt.show_content__session_qr) {
if ($lq__event_session_obj.updated_on == $events_sess.pres_mgmt.session__updated_on) {
if (log_lvl > 1) {
console.log('Updated on is the same.');
if ($lq__event_session_obj.updated_on == $events_sess.pres_mgmt.session__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_session_obj?.event_session_id, obj_type: 'event_session', obj_id: $lq__event_session_obj?.event_session_id});
// Generate a QR code for the URL.
let qr_id_url = `${$lq__event_session_obj?.event_session_id}_url`;
// URL for this page (be sure to URL encode it):
let url_str = `${$ae_loc.url_origin}/events/${$lq__event_session_obj?.event_id}/session/${$lq__event_session_obj?.event_session_id}`;
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.session__updated_on = $lq__event_session_obj?.updated_on;
}
} else {
if (log_lvl) {
console.log('Updated on is different.');
console.log('Clearing the URL.');
}
// 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_session_obj?.event_session_id, obj_type: 'event_session', obj_id: $lq__event_session_obj?.event_session_id});
// Generate a QR code for the URL.
let qr_id_url = `${$lq__event_session_obj?.event_session_id}_url`;
// URL for this page (be sure to URL encode it):
let url_str = `${$ae_loc.url_origin}/events/${$lq__event_session_obj?.event_id}/session/${$lq__event_session_obj?.event_session_id}`;
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.session__updated_on = $lq__event_session_obj?.updated_on;
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.session__updated_on = null;
}
} 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.session__updated_on = null;
}
}
});
let clipboard_success = $state(false);