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

Lots of work on upgrading to Tailwind CSS 4. Still more to go. Need to fix Modals everywhere.

Browse Source
This commit is contained in:
Scott Idem
2025-06-18 20:36:09 -04:00
parent 13912fd145
commit 376837950e
15 changed files with 319 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/app.css
View File

@@ -9,15 +9,18 @@
@import '@skeletonlabs/skeleton/themes/modern';
@import '@skeletonlabs/skeleton/themes/wintry';
@source '../../node_modules/@skeletonlabs/skeleton-svelte/dist';
@source '../node_modules/@skeletonlabs/skeleton-svelte/dist';
/* Add your theme import for your theme: "osit-custom-theme" here */
@plugin '@tailwindcss/forms';
@plugin '@tailwindcss/typography';
/* @plugin '@tailwindcss/forms'; */
/* @plugin '@tailwindcss/typography'; */
@import "tailwindcss/preflight";
@tailwind utilities;
/* @import "tailwindcss/theme.css" layer(theme); */
/* @import "tailwindcss/preflight"; */
@import "tailwindcss/utilities.css" layer(utilities);
/*@tailwind utilities;*/
/* Register a Custom Themes */

5
src/lib/ae_events_stores.ts
View File

@@ -462,6 +462,11 @@ let events_session_data_struct: key_val = {
show_fields__presentation: true,
show_fields__session: true,
show_modal__presenter_agree: false,
show__session_poc_profile: false,
show_modal__session_poc_agree: false,
status_rpt: {
recent_files: null,
presenters_agree: null,

2
src/lib/ae_stores.ts
View File

@@ -371,6 +371,8 @@ let ae_app_session_data_defaults: key_val = {
qry_limit__people: 99,
},
show__modal_change_password: false,
'download': {},
// For API download and upload progress status per file.

37
src/lib/components/shad-editor/editor.css
View File

@@ -1,5 +1,18 @@
@import "tailwindcss/preflight";
@tailwind utilities;
@import 'tailwindcss';
@import "@skeletonlabs/skeleton";
@import "@skeletonlabs/skeleton/optional/presets";
/* @import "tailwindcss/preflight"; */
/* @tailwind utilities; */
@import '@skeletonlabs/skeleton/themes/cerberus';
@import '@skeletonlabs/skeleton/themes/modern';
@import '@skeletonlabs/skeleton/themes/wintry';
@source '../node_modules/@skeletonlabs/skeleton-svelte/dist';
@import "tailwindcss/utilities.css" layer(utilities);
.tiptap :where(p):not(:where([class~='not-prose'], [class~='not-prose'] *)) {
@@ -9,7 +22,7 @@
.tiptap code:not(pre code) {
/* Remove the before and after pseudo elements */
@apply rounded-sm border bg-muted/50 p-1 before:content-[''] after:content-[''];
@apply rounded-sm border bg-black/50 p-1 before:content-[''] after:content-[''];
}
.tiptap blockquote p {
@@ -54,11 +67,12 @@ ul[data-type='taskList'] li label {
}
ul[data-type='taskList'] li[data-checked='true'] div {
@apply text-muted-foreground line-through;
@apply text-black/50 line-through;
}
input[type='checkbox'] {
@apply size-4 cursor-pointer rounded-sm !important;
@apply size-4 cursor-pointer rounded-sm;
/* This kills compiling !important */
}
ul[data-type='taskList'] ul[data-type='taskList'] {
@@ -71,7 +85,7 @@ ul[data-type='taskList'] ul[data-type='taskList'] {
}
.color::before {
@apply mb-[0.15rem] mr-[0.1rem] inline-block size-[1rem] rounded-sm border border-muted align-middle;
@apply mb-[0.15rem] mr-[0.1rem] inline-block size-[1rem] rounded-sm border border-black/50 align-middle;
background-color: var(--color);
content: ' ';
}
@@ -87,7 +101,7 @@ ul[data-type='taskList'] ul[data-type='taskList'] {
.tiptap table td,
.tiptap table th {
@apply border border-muted;
@apply border border-black/50;
box-sizing: border-box;
min-width: 1em;
padding: 6px 8px;
@@ -101,17 +115,20 @@ ul[data-type='taskList'] ul[data-type='taskList'] {
}
.tiptap table th {
@apply bg-muted/50 text-left font-bold;
@apply bg-black/50 text-left;
/* Kills compile: font-bold */
font-weight: bold;
}
.tiptap table .selectedCell:after {
@apply pointer-events-none absolute bottom-0 left-0 right-0 top-0 border-[2px] border-muted-foreground;
@apply pointer-events-none absolute bottom-0 left-0 right-0 top-0 border-[2px] border-black/50;
content: '';
z-index: 2;
}
.tiptap table .column-resize-handle {
@apply pointer-events-none absolute -bottom-[2px] -right-[2px] top-0 w-1 bg-muted;
@apply pointer-events-none absolute -bottom-[2px] -right-[2px] top-0 w-1 bg-black/50;
}
.tiptap .tableWrapper {

4
src/lib/components/shad-editor/onedark.css
View File

@@ -63,7 +63,9 @@
}
.hljs-strong {
@apply font-bold;
/* @apply font-bold; */
/* Kills compile: font-bold */
font-weight: bold;
}
/* Base styles */

64
src/lib/e_app_clipboard.svelte Normal file
View File

@@ -0,0 +1,64 @@
<script lang="ts">
interface Props {
log_lvl?: number;
value: any;
success: boolean;
btn_text: string;
btn_title?: string;
btn_class?: string;
}
let {
log_lvl = 1,
value = $bindable(''),
success = $bindable(false),
btn_text = 'Copy to Clipboard',
btn_title = 'Copy to Clipboard',
btn_class = 'btn btn-sm preset-tonal-warning text-warning-500 m-1'
}: Props = $props();
if (log_lvl) {
console.log(`Clipboard component initialized with value:`, value);
}
// Select your trigger element
const elemButton: HTMLButtonElement | null = document.querySelector('[data-button]');
// Add a click event handler to the trigger
// elemButton?.addEventListener('click', () => {
// // Call the Clipboard API
// navigator.clipboard
// // Use the `writeText` method write content to the clipboard
// .writeText(value)
// // Handle confirmation
// .then(() => {
// if (log_lvl) {
// console.log(`Clipboard write successful: ${value}`);
// }
// success = true;
// });
// });
</script>
<button
data-button
onclick={() => {
// Call the Clipboard API
navigator.clipboard
// Use the `writeText` method write content to the clipboard
.writeText(value)
// Handle confirmation
.then(() => {
if (log_lvl) {
console.log(`Clipboard write successful: ${value}`);
}
success = true;
});
}}
class={btn_class}
title={btn_title}
>
{btn_text}
</button>

10
src/lib/e_app_debug_menu.svelte
View File

@@ -106,7 +106,7 @@ hover:opacity-100 -->
$ae_loc.debug_mode = !$ae_loc?.debug_mode;
}}
class="
btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-tonal-warning border border-warning-500
btn btn-sm preset-tonal-surface border-sm border-surface-500 hover:preset-tonal-warning
transition-all *:hover:inline-block
@@ -141,7 +141,7 @@ hover:opacity-100 -->
$ae_loc.debug_menu = !$ae_loc?.debug_menu;
}}
class="
btn btn-sm preset-tonal-surface border border-surface-500 hover:preset-tonal-warning border border-warning-500
btn btn-sm preset-tonal-surface border-sm border-surface-500 hover:preset-tonal-warning
transition-all *:hover:inline-block
"
title="Turn debug content and styles off and on"
@@ -166,8 +166,8 @@ hover:opacity-100 -->
id="AE-Quick-Debug"
class="
btn btn-icon
preset-tonal-surface border border-surface-500
hover:preset-tonal-warning border border-warning-500
preset-tonal-surface border-sm border-surface-500
hover:preset-tonal-warning
transition-all
fixed bottom-2 left-2
text-gray-400 hover:text-gray-800
@@ -182,5 +182,5 @@ hover:opacity-100 -->
</section>
<style lang="postcss">
<style lang="css">
</style>

86
src/lib/element_manage_event_file_li.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
export let log_lvl: number = 0;
import { onMount } from 'svelte';
// import { liveQuery } from "dexie";
import { Clipboard } from "flowbite-svelte";
import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
@@ -15,19 +15,33 @@ import { db_events } from "$lib/ae_events/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 container_class_li: string|Array<string> = [];
export let lq__event_file_obj_li: any;
export let link_to_type: string;
export let link_to_id: string;
export let allow_basic: boolean = false;
export let allow_moderator: boolean = false;
export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
interface Props {
log_lvl?: number;
container_class_li?: string|Array<string>;
lq__event_file_obj_li: any;
link_to_type: string;
link_to_id: string;
allow_basic?: boolean;
allow_moderator?: boolean;
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
}
let {
log_lvl = 0,
container_class_li = [],
lq__event_file_obj_li,
link_to_type,
link_to_id,
allow_basic = false,
allow_moderator = false,
display_mode = 'default'
}: Props = $props();
// export let show_convert_btn: null|boolean = null;
// let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {};
let ae_tmp: key_val = {};
let ae_promises: key_val = $state({});
let ae_tmp: key_val = $state({});
ae_tmp.show__file_li = true;
ae_tmp.show__direct_download = $events_loc.pres_mgmt.show__direct_download;
// let ae_triggers: key_val = {};
@@ -38,6 +52,8 @@ onMount(() => {
console.log(`allow_basic: ${allow_basic}; allow_moderator: ${allow_moderator}`);
}
});
let clipboard_success = $state(false);
</script>
@@ -46,7 +62,7 @@ onMount(() => {
>
<button
type="button"
on:click={() => {
onclick={() => {
console.log('*** Refresh button clicked ***');
db_events.files.clear();
@@ -81,7 +97,7 @@ onMount(() => {
<button
type="button"
on:click={() => {
onclick={() => {
console.log('*** Show Alt Download button clicked ***');
ae_tmp.show__direct_download = !ae_tmp.show__direct_download;
}}
@@ -152,7 +168,7 @@ onMount(() => {
<button
type="button"
disabled={!allow_basic && !allow_moderator && !$ae_loc.trusted_access}
on:click={() => {
onclick={() => {
// ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
api_cfg: $ae_api,
@@ -215,7 +231,7 @@ onMount(() => {
Download
</span>
</a>
<button
<!-- <button
type="button"
use:clipboard={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${ae_util.clean_filename(event_file_obj?.filename)}&x_no_account_id_token=direct-download`)}
class="btn btn-sm p-1 preset-tonal-secondary *:hover:inline lg:text-xs"
@@ -225,7 +241,15 @@ onMount(() => {
<span class="hidden">
Copy Link
</span>
</button>
</button> -->
<Clipboard
value={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${ae_util.clean_filename(event_file_obj?.filename)}&x_no_account_id_token=direct-download`)}
bind:success={clipboard_success}
class="w-24"
>
{#if clipboard_success}Copied!{:else}Copy Link{/if}
</Clipboard>
</div>
<div class="flex flex-row gap-0.5">
@@ -242,7 +266,7 @@ onMount(() => {
Renamed
</span>
</a>
<button
<!-- <button
type="button"
use:clipboard={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${event_file_obj?.event_session_code}-${ae_util.clean_filename(event_file_obj?.event_session_name).substring(0, 20)}-${ae_util.clean_filename(event_file_obj?.event_presenter_full_name)}.${event_file_obj?.extension}&x_no_account_id_token=direct-download`)}
class="btn btn-sm p-1 preset-tonal-secondary *:hover:inline lg:text-xs"
@@ -252,7 +276,14 @@ onMount(() => {
<span class="hidden">
Copy Renamed
</span>
</button>
</button> -->
<Clipboard
value={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${event_file_obj?.event_session_code}-${ae_util.clean_filename(event_file_obj?.event_session_name).substring(0, 20)}-${ae_util.clean_filename(event_file_obj?.event_presenter_full_name)}.${event_file_obj?.extension}&x_no_account_id_token=direct-download`)}
bind:success={clipboard_success}
class="w-24"
>
{#if clipboard_success}Copied!{:else}Copy Renamed{/if}
</Clipboard>
</div>
<div class="flex flex-row gap-0.5">
@@ -269,7 +300,7 @@ onMount(() => {
Renamed
</span>
</a>
<button
<!-- <button
type="button"
use:clipboard={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${event_file_obj?.event_session_code}-${ae_util.clean_filename(event_file_obj?.event_presentation_name).substring(0, 20)}-${ae_util.clean_filename(event_file_obj?.event_presenter_full_name)}.${event_file_obj?.extension}&x_no_account_id_token=direct-download`)}
class="btn btn-sm p-1 preset-tonal-secondary *:hover:inline lg:text-xs"
@@ -279,7 +310,14 @@ onMount(() => {
<span class="hidden">
Copy Renamed
</span>
</button>
</button> -->
<Clipboard
value={encodeURI(`${$ae_api.base_url}/event/file/${event_file_obj?.event_file_id_random}/download?filename=${event_file_obj?.event_session_code}-${ae_util.clean_filename(event_file_obj?.event_presentation_name).substring(0, 20)}-${ae_util.clean_filename(event_file_obj?.event_presenter_full_name)}.${event_file_obj?.extension}&x_no_account_id_token=direct-download`)}
bind:success={clipboard_success}
class="w-24"
>
{#if clipboard_success}Copied!{:else}Copy Renamed{/if}
</Clipboard>
</div>
</span>
@@ -301,7 +339,7 @@ onMount(() => {
{#if $events_sess.pres_mgmt.tmp_val__filename_no_ext.trim() != event_file_obj.filename_no_ext}
<button
type="button"
on:click={async () => {
onclick={async () => {
let new_filename = $events_sess.pres_mgmt.tmp_val__filename_no_ext.trim()
// Remove possible double extension
new_filename = new_filename.replace('.'+event_file_obj.extension, '');
@@ -353,7 +391,7 @@ onMount(() => {
<button
type="button"
disabled={!allow_basic && !$ae_loc.trusted_access}
on:click={() => {
onclick={() => {
if ($events_sess.pres_mgmt.show_field_edit__filename == event_file_obj.event_file_id_random) {
$events_sess.pres_mgmt.tmp_val__filename_no_ext = '';
$events_sess.pres_mgmt.show_field_edit__filename = false;
@@ -377,7 +415,7 @@ onMount(() => {
<button
type="button"
disabled={!allow_basic && !$ae_loc.trusted_access}
on:click={async () => {
onclick={async () => {
let event_file_data = {
hide: !event_file_obj.hide,
};
@@ -433,7 +471,7 @@ onMount(() => {
<button
type="button"
disabled={!allow_basic && !$ae_loc.trusted_access}
on:click={async () => {
onclick={async () => {
if (!confirm(`Are you sure you want to delete this file?\n${event_file_obj.filename} [${event_file_obj.event_file_id_random}]`)) {return false;}
// ae_promises[event_file_obj.event_file_id_random] = handle_delete__event_file({event_file_id: event_file_obj.event_file_id_random});
@@ -487,7 +525,7 @@ onMount(() => {
name="file_purpose"
disabled={!allow_basic && !allow_moderator && !$ae_loc.trusted_access}
value={event_file_obj.file_purpose}
on:change={e => {
onchange={e => {
// ae_tmp[event_file_obj.event_file_id_random].file_purpose = e.target.value;
console.log(`Selected file_purpose: ${e.target.value}`);

15
src/routes/events/[event_id]/(launcher)/+layout.svelte
View File

@@ -689,8 +689,8 @@ $: {
<span
class="*:hover:inline px-1 rounded-md"
class:preset-tonal-warning border border-warning-500={!$events_loc.launcher.ws_connect}
class:preset-tonal-success border border-success-500={$events_loc.launcher.ws_connect}
class:preset-tonal-warning={!$events_loc.launcher.ws_connect}
class:preset-tonal-success={$events_loc.launcher.ws_connect}
>
{#if $events_sess.launcher.ws_connect_status == 'connected'}
<span class="fas fa-wifi mx-1"></span>
@@ -708,8 +708,8 @@ $: {
<span
class:hidden={$events_loc.launcher.app_mode != 'native'}
class="*:hover:inline px-1 rounded-md"
class:preset-tonal-warning border border-warning-500={!$events_sess.launcher?.av_recording_status}
class:preset-tonal-success border border-success-500={$events_sess.launcher?.av_recording_status}
class:preset-tonal-warning={!$events_sess.launcher?.av_recording_status}
class:preset-tonal-success={$events_sess.launcher?.av_recording_status}
>
{#if $events_sess.launcher?.av_recording_status}
<span class="fas fa-video mx-1"></span>
@@ -745,6 +745,7 @@ $: {
class:hover:opacity-75={!$ae_loc.trusted_access}
>
<span class="fas fa-biohazard"></span>
<span class="hidden">Launcher Config</span>
</button>
</div>
@@ -824,8 +825,12 @@ $: {
>
Debug
</h2>
<button on:click={() => ($events_loc.launcher.hide_drawer__debug = true)} class="mb-4 dark:text-white">
<button
on:click={() => ($events_loc.launcher.hide_drawer__debug = true)}
class="mb-4 dark:text-white"
>
<span class="fas fa-times"></span>
<span class="hidden">Close Debug Drawer</span>
</button>
</div>

4
src/routes/events/[event_id]/event_page_menu.svelte
View File

@@ -149,8 +149,8 @@ export let lq__event_obj: any;
$events_loc.pres_mgmt.save_search_text = !$events_loc.pres_mgmt.save_search_text;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={$events_loc.pres_mgmt.save_search_text}
class:preset-tonal-warning border border-warning-500={!$events_loc.pres_mgmt.save_search_text}
class:preset-tonal-success={$events_loc.pres_mgmt.save_search_text}
class:preset-tonal-warning={!$events_loc.pres_mgmt.save_search_text}
title="Save the search text for this session search?"
>
{#if $events_loc.pres_mgmt.save_search_text}

2
src/routes/events/[event_id]/locations/locations_page_menu.svelte
View File

@@ -113,7 +113,7 @@ export let lq__event_obj: any;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={$events_loc.pres_mgmt?.show_content__location_devices_sessions== 'sessions'}
class:preset-tonal-warning border border-warning-500={$events_loc.pres_mgmt?.show_content__location_devices_sessions== 'devices'}
class:preset-tonal-warning border-warning-500={$events_loc.pres_mgmt?.show_content__location_devices_sessions== 'devices'}
title="Show the session list or device list."
>
{#if $events_loc.pres_mgmt.show_content__location_devices_sessions == 'sessions'}

6
src/routes/events/[event_id]/presenter/[presenter_id]/presenter_page_menu.svelte
View File

@@ -224,7 +224,7 @@ let ae_triggers: key_val = {};
}}
class="btn btn-sm m-1 transition-all hover:transition-all *:hover:inline"
class:preset-outlined-surface-500={!$lq__event_presenter_obj?.priority}
class:preset-tonal-success border border-success-500={$lq__event_presenter_obj?.priority}
class:preset-tonal-success={$lq__event_presenter_obj?.priority}
>
{#if $lq__event_presenter_obj?.priority}
<span class="fas fa-star m-1"></span>
@@ -277,7 +277,7 @@ let ae_triggers: key_val = {};
ae_triggers.hide = true;
}}
class="btn btn-sm m-1 transition-all hover:transition-all *:hover:inline"
class:preset-tonal-success border border-success-500={!$lq__event_presenter_obj?.hide}
class:preset-tonal-success={!$lq__event_presenter_obj?.hide}
class:preset-outlined-warning-500={$lq__event_presenter_obj?.hide}
disabled={!$ae_loc.trusted_access}
>
@@ -333,7 +333,7 @@ let ae_triggers: key_val = {};
ae_triggers.enable = true;
}}
class="btn btn-sm"
class:preset-tonal-success border border-success-500={$lq__event_presenter_obj?.enable}
class:preset-tonal-success={$lq__event_presenter_obj?.enable}
class:preset-outlined-warning-500={!$lq__event_presenter_obj?.enable}
disabled={!$ae_loc.manager_access}
>

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

@@ -193,7 +193,7 @@ onMount(() => {
}
}}
class="btn btn-md hover:preset-filled-primary-500"
class:preset-tonal-tertiary border border-tertiary-500={$events_loc.pres_mgmt.show_content__session_view == 'manage_files'}
class:preset-tonal-tertiary={$events_loc.pres_mgmt.show_content__session_view == 'manage_files'}
class:preset-filled-tertiary-500={$events_loc.pres_mgmt.show_content__session_view != 'manage_files'}
class:hidden={!$ae_loc.public_access}
title="View session information or manage files for the session"
@@ -389,7 +389,7 @@ onMount(() => {
lq__event_presenter_obj={lq__event_presenter_obj}
/>
<svelte:fragment slot="footer">
<footer class="flex justify-end gap-4">
<div class="text-center w-full">
<button
@@ -402,10 +402,6 @@ onMount(() => {
Close
</button>
</div>
</svelte:fragment>
</footer>
</Modal>
<style lang="postcss">
</style>

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

@@ -1,9 +1,11 @@
<script lang="ts">
export let log_lvl: number = 0;
import { run } from 'svelte/legacy';
// Imports (external and then internal)
import { browser } from '$app/environment';
// import { liveQuery } from "dexie";
import { Clipboard } from "flowbite-svelte";
import { ae_util } from '$lib/ae_utils/ae_utils';
@@ -20,16 +22,23 @@ import { events_func } from '$lib/ae_events_functions';
// import { db_events } from "$lib/db_events";
// Exports
export let class_li: string = 'outline';
// export let event_session_id: string;
// export let lq__event_obj: any;
export let lq__event_session_obj: any;
interface Props {
log_lvl?: number;
// Exports
class_li?: string;
// export let lq__event_obj: any;
lq__event_session_obj: any;
}
let { log_lvl = 0, class_li = 'outline', lq__event_session_obj }: Props = $props();
// export let event_session_obj_poc_profile: any|key_val;
// Local Variables
let ae_promises: key_val = {};
let ae_tmp: key_val = {};
let ae_promises: key_val = $state({});
let ae_tmp: key_val = $state({});
// let ae_triggers: key_val = {};
ae_tmp.biography = null;
@@ -37,15 +46,19 @@ ae_tmp.biography = null;
let poc_type = $events_loc.pres_mgmt.label__session_poc_type;
let poc_name = $events_loc.pres_mgmt.label__session_poc_name;
$: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_json && $lq__event_session_obj?.poc_kv_json[poc_type]?.biography) {
run(() => {
if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_json && $lq__event_session_obj?.poc_kv_json[poc_type]?.biography) {
ae_tmp.biography = $lq__event_session_obj?.poc_kv_json[poc_type].biography;
console.log(`ae_tmp.biography:`, ae_tmp.biography);
}
});
// $: if ($lq__event_session_obj?.poc_kv_json) {
// lq__event_session_obj.poc_kv_json = JSON.parse(lq__event_session_obj.poc_kv_json);
// }
let clipboard_success = $state(false);
</script>
@@ -57,7 +70,7 @@ $: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_js
<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
<!-- <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"
@@ -65,7 +78,17 @@ $: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_js
>
<span class="fas fa-copy mx-1"></span>
Copy Access Link
</button>
</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>
</span>
{/if}
@@ -85,7 +108,7 @@ $: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_js
>
<div class="label event_session__biography required space-y-4">
<button
<!-- <button
type="button"
use:clipboard={ae_tmp.biography?.trim()}
class="btn btn-sm preset-tonal-warning border border-warning-500 float-right m-1"
@@ -94,7 +117,16 @@ $: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_js
>
<span class="fas fa-copy mx-1"></span>
Copy Biography Text
</button>
</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>
<label for="session_poc__biography" class="label">
<span class="fas fa-book"></span>
@@ -127,7 +159,7 @@ $: if (browser && ae_tmp.biography === null && $lq__event_session_obj?.poc_kv_js
type="button"
class="btn btn-md preset-tonal-primary hover:preset-filled-primary-500"
disabled={(ae_tmp.biography == $lq__event_session_obj.biography)}
on:click={() => {
onclick={() => {
console.log('*** Save button clicked ***');
let event_session_data = {poc_kv_json: $lq__event_session_obj.poc_kv_json};

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

@@ -1,5 +1,24 @@
<script lang="ts">
export let log_lvl: number = 0;
import { run } from 'svelte/legacy';
interface Props {
log_lvl?: number;
// export let lq__event_obj: any;
lq__event_presenter_obj: any; // This is the currently selected presenter.
lq__event_session_obj: any;
// );
lq__auth__event_presenter_obj: any;
lq__event_presentation_obj_li: any;
}
let {
log_lvl = 0,
lq__event_presenter_obj,
lq__event_session_obj,
lq__auth__event_presenter_obj,
lq__event_presentation_obj_li
}: Props = $props();
if (log_lvl) {
console.log(`ae_events_pres_mgmt session_view.svelte`);
}
@@ -7,6 +26,7 @@ if (log_lvl) {
// Imports (external and then internal)
import { liveQuery } from "dexie";
import { Modal } from 'flowbite-svelte';
import { Clipboard } from "flowbite-svelte";
// const dispatch = createEventDispatcher();
@@ -14,9 +34,10 @@ import type { key_val } from '$lib/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
import Element_ae_crud from '$lib/element_ae_crud.svelte';
// import Element_data_store from '$lib/element_data_store_v2.svelte';
import MyClipboard from '$lib/e_app_clipboard.svelte';
let ae_promises: key_val = {};
let ae_tmp: key_val = {};
let ae_promises: key_val = $state({});
let ae_tmp: key_val = $state({});
let ae_triggers: key_val = {};
import { core_func } from '$lib/ae_core/ae_core_functions';
@@ -48,17 +69,14 @@ $events_sess.pres_mgmt.show_content__presenter_start = false;
// let poc_type = $events_loc.pres_mgmt.label__session_poc_type;
// export let lq__event_obj: any;
export let lq__event_presenter_obj: any; // This is the currently selected presenter.
export let lq__event_session_obj: any;
// let lq__event_session_obj = liveQuery(
// () => db_events.sessions.get(event_session_id)
// );
export let lq__auth__event_presenter_obj: any;
export let lq__event_presentation_obj_li: any;
// let lq__event_presentation_obj_li = liveQuery(
// () => db_events.presentations
@@ -86,7 +104,8 @@ $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;
$: if ($lq__event_session_obj) {
run(() => {
if ($lq__event_session_obj) {
if (log_lvl > 1) {
console.log(`$lq__event_session_obj:`, $lq__event_session_obj);
}
@@ -124,6 +143,9 @@ $: if ($lq__event_session_obj) {
$events_sess.pres_mgmt.session__updated_on = null;
}
}
});
let clipboard_success = $state(false);
</script>
@@ -231,7 +253,7 @@ $: if ($lq__event_session_obj) {
&
<button
type="button"
on:click={() => {
onclick={() => {
if ($events_loc.pres_mgmt.time_hours == 12) {
$events_loc.pres_mgmt.time_hours = 24;
$events_loc.pres_mgmt.datetime_format = 'datetime_long';
@@ -384,7 +406,7 @@ $: if ($lq__event_session_obj) {
<button
type="button"
on:click={() => {
onclick={() => {
console.log('Cancel editing the location for the session.');
ae_tmp.event_location_id = null;
@@ -399,7 +421,7 @@ $: if ($lq__event_session_obj) {
{:else}
<button
type="button"
on:click={() => {
onclick={() => {
console.log('Edit the location for the session.');
let params = {
@@ -474,7 +496,7 @@ $: if ($lq__event_session_obj) {
<!-- Modal toggle -->
<button
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
on:click={() => ($events_sess.pres_mgmt.show__session_poc_profile = true)}>
onclick={() => ($events_sess.pres_mgmt.show__session_poc_profile = true)}>
<span class="fas fa-id-card m-1"></span>
<!-- {$events_loc.pres_mgmt?.label__session_poc_name}'s -->
{$lq__event_session_obj?.poc_person_full_name}'s Profile
@@ -493,21 +515,23 @@ $: if ($lq__event_session_obj) {
lq__event_session_obj={lq__event_session_obj}
/>
<svelte:fragment slot="footer">
{#snippet footer()}
<div class="text-center w-full">
<button
type="button"
on:click={() => {
console.log('Close modal session poc profile.');
$events_sess.pres_mgmt.show__session_poc_profile = !$events_sess.pres_mgmt.show__session_poc_profile;
}}
onclick={() => {
console.log('Close modal session poc profile.');
$events_sess.pres_mgmt.show__session_poc_profile = !$events_sess.pres_mgmt.show__session_poc_profile;
}}
class="btn btn-sm preset-tonal-warning hover:preset-tonal-warning border border-warning-500"
>
<span class="fas fa-times mx-1"></span>
Close
</button>
</div>
</svelte:fragment>
{/snippet}
</Modal>
@@ -519,8 +543,8 @@ $: if ($lq__event_session_obj) {
!$events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id] === true}
class="btn btn-sm hover:preset-filled-success-500"
class:preset-tonal-success={$lq__event_session_obj?.poc_agree}
class:preset-tonal-warning border border-warning-500={!$lq__event_session_obj?.poc_agree}
on:click={() => ($events_sess.pres_mgmt.show_modal__session_poc_agree = true)}>
class:preset-tonal-warning={!$lq__event_session_obj?.poc_agree}
onclick={() => ($events_sess.pres_mgmt.show_modal__session_poc_agree = true)}>
{#if !$lq__event_session_obj?.poc_agree}
<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
@@ -541,20 +565,22 @@ $: if ($lq__event_session_obj) {
lq__event_session_obj={lq__event_session_obj}
/>
<svelte:fragment slot="footer">
{#snippet footer()}
<div class="text-center w-full">
<button
on:click={() => {
$events_sess.pres_mgmt.show_modal__session_poc_agree = false;
}}
onclick={() => {
$events_sess.pres_mgmt.show_modal__session_poc_agree = false;
}}
class="btn btn-sm preset-tonal-warning hover:preset-tonal-warning border border-warning-500"
>
<span class="fas fa-times m-1"></span>
Close
</button>
</div>
</svelte:fragment>
{/snippet}
</Modal>
{/if}
@@ -658,7 +684,7 @@ $: if ($lq__event_session_obj) {
{#if ae_tmp.show__edit_poc_person}
<button
type="button"
on:click={() => {
onclick={() => {
console.log('Cancel the POC person for the session.');
ae_tmp.poc_person_id = null;
@@ -672,7 +698,7 @@ $: if ($lq__event_session_obj) {
{:else}
<button
type="button"
on:click={async () => {
onclick={async () => {
console.log('Edit the POC person for the session.');
// let params = {
@@ -728,12 +754,11 @@ $: if ($lq__event_session_obj) {
{#if $events_loc.pres_mgmt?.require__session_agree
&& $events_loc?.pres_mgmt?.show__email_access_link
&& $lq__event_session_obj?.poc_person_primary_email
&& ($ae_loc.trusted_access || !$events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id])
}
&& ($ae_loc.trusted_access || !$events_loc.auth__kv.session[$lq__event_session_obj?.event_session_id])}
<button
type="button"
on:click={() => {
onclick={() => {
console.log('Email the access link');
if (!$lq__event_session_obj.poc_person_primary_email) {
alert('No email address found for this point of contact (moderator/champion).');
@@ -773,7 +798,7 @@ $: if ($lq__event_session_obj) {
&& $ae_loc.trusted_access && $lq__event_session_obj.poc_person_id}
<!-- A button to copy the access link to the clipboard. -->
<!-- Example: /events/CHs3F44Xq76/session/Wh8UnJlbIA0?person_id=fV1dl_IJ0yY&person_pass=abc123 -->
<button
<!-- <button
type="button"
use:clipboard={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}`)}
class="btn btn-sm preset-tonal-warning border border-warning-500 m-1"
@@ -781,7 +806,26 @@ $: if ($lq__event_session_obj) {
>
<span class="fas fa-copy mx-1"></span>
Copy Access Link
</button>
</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="text-xs btn btn-sm preset-tonal-warning text-warning-500 border border-transparent hover:border hover:border-warning-500 hover:preset-filled-warning-500"
>
{#if clipboard_success}Copied!{:else}Copy Access Link{/if}
</Clipboard> -->
<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}`)}
bind:success={clipboard_success}
btn_text="Copy Access Link"
btn_title="Copy the POC (moderator/champion) access link to the clipboard."
btn_class="btn btn-sm preset-tonal-warning hover:preset-filled-warning-500"
>
</MyClipboard>
{/if}
</span>
@@ -856,7 +900,7 @@ $: if ($lq__event_session_obj) {
{#if $lq__event_session_obj.description}
<button
type="button"
on:click={() => {
onclick={() => {
console.log('Show/Hide Description');
$events_loc.pres_mgmt.show_content__session_description = !$events_loc.pres_mgmt.show_content__session_description;
}}