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

Wrapping up for the night. Things are working better. There are still API request misses or something.

Browse Source
This commit is contained in:
Scott Idem
2024-03-05 20:35:38 -05:00
parent bed4f4a0f2
commit e71cdab353
10 changed files with 261 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app.postcss
View File

@@ -82,8 +82,8 @@ body {
/* Remove the background from the body in all cases */ /* Remove the background from the body in all cases */
body[data-theme] { body[data-theme] {
background: none; /* background: none; */
background-image: none; /* background-image: none; */
} }
/* Remove the background from the body if using iframes */ /* Remove the background from the body if using iframes */

2
src/lib/ae_stores.ts
View File

@@ -64,6 +64,8 @@ export let ae_app_local_data_struct: key_val = {
'show_element__access_type': true, 'show_element__access_type': true,
'theme_mode': 'dark', 'theme_mode': 'dark',
'theme_name': 'wintry', 'theme_name': 'wintry',
'classes__form': 'border border-surface-200 p-4 space-y-4 rounded-container-token',
}, },
'mod': { 'mod': {
'archives': {}, 'archives': {},

4
src/lib/ae_utils.ts
View File

@@ -427,7 +427,7 @@ function handle_url_and_message(name: string, value: null|string) {
if (value) { if (value) {
url.searchParams.set(name, value); url.searchParams.set(name, value);
history.pushState({}, '', url); // history.pushState({}, '', url);
// console.log('url:', url); // console.log('url:', url);
// pushState(url.href, {}); // pushState(url.href, {});
@@ -438,7 +438,7 @@ function handle_url_and_message(name: string, value: null|string) {
window.parent.postMessage(message, "*"); window.parent.postMessage(message, "*");
} else { } else {
url.searchParams.delete(name); url.searchParams.delete(name);
history.pushState({}, '', url); // history.pushState({}, '', url);
// console.log('url:', url); // console.log('url:', url);
// pushState({}, '', url.search); // pushState({}, '', url.search);

102
src/lib/element_data_store.svelte
View File

@@ -9,6 +9,7 @@ import { ae_util } from '$lib/ae_utils';
import type { key_val } from '$lib/ae_stores'; import type { key_val } from '$lib/ae_stores';
export let ds_code: string; export let ds_code: string;
export let ds_name: string;
export let ds_type: string = 'text'; export let ds_type: string = 'text';
export let for_type: string; export let for_type: string;
export let for_id: string; export let for_id: string;
@@ -26,7 +27,9 @@ export let show_delete_btn: boolean = false;
export let debug: boolean = false; export let debug: boolean = false;
let ae_promises: key_val = {}; // Promise<any>; let ae_promises: key_val = {}; // Promise<any>;
let data_store_results: Promise<any>|key_val; let ds_get_results: Promise<any>|key_val;
let ds_loading_status: string = 'starting...';
let ds_submit_results: Promise<any>|key_val;
let val_json: key_val; let val_json: key_val;
let val_html: key_val; let val_html: key_val;
@@ -40,13 +43,13 @@ let ds_code_obj =
id: null, id: null,
account_id: null, account_id: null,
code: ds_code, code: ds_code,
name: ds_name,
type: ds_type, type: ds_type,
for_type: null, // for_type for_type: null, // for_type
for_id: null, // for_id for_id: null, // for_id
access_read: null, // 'super', 'administrator', 'trusted', 'anonymous' access_read: null, // 'super', 'administrator', 'trusted', 'anonymous'
access_write: null, // 'super', 'administrator', 'trusted', 'anonymous' access_write: null, // 'super', 'administrator', 'trusted', 'anonymous'
access_delete: null, // 'super', 'administrator', 'trusted', 'anonymous' access_delete: null, // 'super', 'administrator', 'trusted', 'anonymous'
name: null,
html: null, html: null,
json: null, json: null,
md: null, md: null,
@@ -57,34 +60,36 @@ let ds_code_obj =
let ae_ds_loc: Writable<key_val> = localStorageStore(`ae_ds__${ds_code}`, ds_code_obj); let ae_ds_loc: Writable<key_val> = localStorageStore(`ae_ds__${ds_code}`, ds_code_obj);
console.log(`ae_ Data Store ${ds_code} = `, $ae_ds_loc); console.log(`ae_ Data Store ${ds_code} = `, $ae_ds_loc);
if (!$ae_ds_loc.id) {
ds_loading_status = '-- loading --';
}
$ae_sess.ds.submit_status = null; $ae_sess.ds.submit_status = null;
$ae_sess.ds.create_status = null; $ae_sess.ds.create_status = null;
$ae_sess.ds.update_status = null; $ae_sess.ds.update_status = null;
$slct_trigger = 'load__ds__code'; let trigger: null|string = 'load__ds__code';
onMount(() => { onMount(() => {
console.log('Element: Data Store element_data_store.svelte'); console.log('Element: Data Store element_data_store.svelte');
if (ds_code && ds_type) { // if (ds_code && ds_type) {
$slct_trigger = 'load__ds__code'; // trigger = 'load__ds__code';
} // $slct_trigger = 'load__ds__code';
// }
}); });
// let ds_code_li = {}; //: key_val; // = ae_loc_tmp.ds; // let ds_code_li = {}; //: key_val; // = ae_loc_tmp.ds;
// console.log(`ae_ ds_code_li = `, ds_code_li); // console.log(`ae_ ds_code_li = `, ds_code_li);
$: if ($slct_trigger == 'load__ds__code' && ds_code && ds_type) { $: if (trigger == 'load__ds__code' && ds_code && ds_type) {
$slct_trigger = null; trigger = null;
load_data_store({ load_data_store({
code: ds_code, code: ds_code,
type: ds_type, type: ds_type,
for_type: for_type, for_type: for_type,
for_id: for_id, for_id: for_id,
store: store,
display: display,
class_li: class_li,
try_cache: try_cache try_cache: try_cache
}); });
} }
@@ -97,24 +102,8 @@ async function load_data_store({
try_cache=true try_cache=true
}) { }) {
// let ds_code_val = await api.get_data_store_obj_w_code({
// if ($ae_ds_loc) { ds_get_results = api.get_data_store_obj_w_code({
// console.log(`ae_ Data Store ${code} = `, $ae_ds_loc);
// // ds_code_val = ae_ds_loc;
// // if (type == 'html') {
// // val_html = $ae_ds_loc.text;
// // } else if (type == 'json') {
// // val_json = $ae_ds_loc.json;
// // } else if (type == 'md') {
// // val_md = $ae_ds_loc.text;
// // } else if (type == 'sql') {
// // val_sql = $ae_ds_loc.text;
// // } else {
// // val_text = $ae_ds_loc.text;
// // }
// }
let ds_code_val = await api.get_data_store_obj_w_code({
api_cfg: $ae_api, api_cfg: $ae_api,
data_store_code: code, data_store_code: code,
data_type: type, data_type: type,
@@ -154,11 +143,14 @@ async function load_data_store({
val_text = ds_results.text; val_text = ds_results.text;
return ds_results.text; return ds_results.text;
} }
} else {
ds_loading_status = '-- not found --';
} }
}) })
.catch(function (error) { .catch(function (error) {
console.log(`Something went wrong. for code ${code}`); console.log(`Something went wrong. for code ${code}`);
console.log(error); console.log(error);
ds_loading_status = '-- error --';
return false; return false;
}); });
// .finally(function (ds_val_result) { // .finally(function (ds_val_result) {
@@ -209,14 +201,20 @@ async function handle_submit_form(event) {
if (typeof data_store_di.ds_code !== 'undefined') { if (typeof data_store_di.ds_code !== 'undefined') {
data_store_do['code'] = data_store_di.ds_code; data_store_do['code'] = data_store_di.ds_code;
} else {
data_store_do['code'] = ds_code;
} }
if (typeof data_store_di.ds_name !== 'undefined') { if (typeof data_store_di.ds_name !== 'undefined') {
data_store_do['name'] = data_store_di.ds_name; data_store_do['name'] = data_store_di.ds_name;
} else {
data_store_do['name'] = ds_name;
} }
if (typeof data_store_di.ds_type !== 'undefined') { if (typeof data_store_di.ds_type !== 'undefined') {
data_store_do['type'] = data_store_di.ds_type; data_store_do['type'] = data_store_di.ds_type;
} else {
data_store_do['type'] = ds_type;
} }
if (typeof data_store_di.ds_for_type !== 'undefined' && data_store_di.ds_for_type) { if (typeof data_store_di.ds_for_type !== 'undefined' && data_store_di.ds_for_type) {
@@ -268,7 +266,7 @@ async function handle_submit_form(event) {
if (!$ae_ds_loc.id) { if (!$ae_ds_loc.id) {
// Create // Create
console.log(`ae_ Data Store Create:`, data_store_do); console.log(`ae_ Data Store Create:`, data_store_do);
data_store_results = handle_create__data_store({ ds_submit_results = handle_create__data_store({
obj_type: 'data_store', obj_type: 'data_store',
data: data_store_do data: data_store_do
}) })
@@ -294,7 +292,7 @@ async function handle_submit_form(event) {
} else { } else {
// Update // Update
console.log(`ae_ Data Store Update:`, data_store_do); console.log(`ae_ Data Store Update:`, data_store_do);
data_store_results = handle_update__data_store({ ds_submit_results = handle_update__data_store({
obj_type: 'data_store', obj_type: 'data_store',
obj_id: $ae_ds_loc.id, obj_id: $ae_ds_loc.id,
data: data_store_do data: data_store_do
@@ -437,7 +435,7 @@ async function handle_update__data_store({
value={$ae_ds_loc.id} value={$ae_ds_loc.id}
/> />
{#if $ae_loc.administrator_access} {#if $ae_loc.trusted_access}
<label for="ds_use_account_id" class="label text-xs inline">Use Account ID <label for="ds_use_account_id" class="label text-xs inline">Use Account ID
<input <input
type="checkbox" type="checkbox"
@@ -447,6 +445,8 @@ async function handle_update__data_store({
checked={$ae_ds_loc.account_id ? true : false} checked={$ae_ds_loc.account_id ? true : false}
/> />
</label> </label>
{/if}
{#if $ae_loc.administrator_access}
<input <input
type="text" type="text"
name="ds_account_id" name="ds_account_id"
@@ -455,7 +455,6 @@ async function handle_update__data_store({
value={$ae_ds_loc.account_id} value={$ae_ds_loc.account_id}
/> />
<input <input
type="text" type="text"
name="ds_code" name="ds_code"
@@ -464,6 +463,8 @@ async function handle_update__data_store({
value={$ae_ds_loc.code} value={$ae_ds_loc.code}
required required
/> />
{/if}
{#if $ae_loc.trusted_access}
<input <input
type="text" type="text"
name="ds_name" name="ds_name"
@@ -472,6 +473,8 @@ async function handle_update__data_store({
value={$ae_ds_loc.name} value={$ae_ds_loc.name}
required required
/> />
{/if}
{#if $ae_loc.administrator_access}
<input <input
type="text" type="text"
name="ds_type" name="ds_type"
@@ -515,6 +518,10 @@ async function handle_update__data_store({
placeholder="Access delete" placeholder="Access delete"
value={$ae_ds_loc.access_delete} value={$ae_ds_loc.access_delete}
/> />
{:else}
Code: {$ae_ds_loc.code}
<!-- Name: {$ae_ds_loc.name} -->
Type: {$ae_ds_loc.type}
{/if} {/if}
{#if $ae_ds_loc.type == 'html' || $ae_ds_loc.type == null} {#if $ae_ds_loc.type == 'html' || $ae_ds_loc.type == null}
@@ -541,7 +548,8 @@ async function handle_update__data_store({
class="btn variant-soft-warning" class="btn variant-soft-warning"
on:click={() => { on:click={() => {
if (confirm('Are you sure you want to delete this data store?')) { if (confirm('Are you sure you want to delete this data store?')) {
$slct_trigger = 'delete__ds__code'; trigger = 'delete__ds__code';
// $slct_trigger = 'delete__ds__code';
} }
show_edit = false; show_edit = false;
show_view = true; show_view = true;
@@ -560,30 +568,31 @@ async function handle_update__data_store({
}} }}
> >
<span class="fas fa-times mx-1"></span> <span class="fas fa-times mx-1"></span>
Cancel Close
</button> </button>
<button <button
type="submit" type="submit"
class="btn variant-soft-primary" class="btn variant-soft-primary"
disabled={data_store_results instanceof Promise} disabled={ds_submit_results instanceof Promise}
on:click={() => { on:click={() => {
$slct_trigger = 'save__ds__code'; trigger = 'save__ds__code';
// $slct_trigger = 'save__ds__code';
}} }}
> >
<span class="fas fa-save mx-1"></span> <span class="fas fa-save mx-1"></span>
Save Save
</button> </button>
{#await data_store_results} {#await ds_submit_results}
<div class="modal-loading"> <div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span> <span class="fas fa-spinner fa-spin"></span>
<span class="loading-text"> <span class="loading-text">
Saving... Saving...
</span> </span>
</div> </div>
{:then data_store_results} {:then ds_submit_results}
{#if data_store_results} {#if ds_submit_results}
<span class="fas fa-check text-green-500"></span> <span class="fas fa-check text-green-500"></span>
<span class="saved-text"> <span class="saved-text">
Saved Saved
@@ -625,6 +634,7 @@ async function handle_update__data_store({
{/if} {/if}
<button <button
type="button"
class="ae_btn_edit__ds btn hover:variant-glass-warning text-xs absolute top-0 right-0 opacity-75 hover:opacity-100 transition delay-700 hover:delay-200 m-1 p-1" class="ae_btn_edit__ds btn hover:variant-glass-warning text-xs absolute top-0 right-0 opacity-75 hover:opacity-100 transition delay-700 hover:delay-200 m-1 p-1"
on:click={() => { on:click={() => {
show_edit = true; show_edit = true;
@@ -636,6 +646,7 @@ async function handle_update__data_store({
</button> </button>
<!-- {/if} --> <!-- {/if} -->
{:else}
{/if} {/if}
@@ -650,6 +661,17 @@ async function handle_update__data_store({
{val_json} {val_json}
</pre> --> </pre> -->
{#await ds_get_results}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Loading...
</span>
</div>
{/await}
<!-- {ds_loading_status} -->
</div> </div>

3
src/routes/events_badges/+page.svelte
View File

@@ -49,11 +49,12 @@ onMount(() => {
ds_type="html" ds_type="html"
for_type="event" for_type="event"
for_id={$slct.event_id} for_id={$slct.event_id}
ds_name="Default: Events Badges Example"
store="local" store="local"
display="block" display="block"
class_li="variant-ghost-surface p-2" class_li="variant-ghost-surface p-2"
try_cache={true} try_cache={true}
show_edit={true} show_edit={false}
/> />
</section> </section>

58
src/routes/events_speakers/10_edit_modal__event_presenter_obj.svelte
View File

@@ -4,15 +4,14 @@ import { onMount } from 'svelte';
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
function number_w_commas(x) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
// This works and uses local storage: // This works and uses local storage:
// store_current_tab must be prefixed with $ to be reactive. // store_current_tab must be prefixed with $ to be reactive.
import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton'; import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import type { Writable } from 'svelte/store'; import type { Writable } from 'svelte/store';
import Element_data_store from '$lib/element_data_store.svelte';
const store_current_tab: Writable<string> = localStorageStore('ae_events_speakers_current_tab', 'start'); const store_current_tab: Writable<string> = localStorageStore('ae_events_speakers_current_tab', 'start');
console.log(`store_current_tab:`, $store_current_tab); console.log(`store_current_tab:`, $store_current_tab);
@@ -52,7 +51,6 @@ onMount(() => {
} }
}); });
const cForm = 'border border-surface-200 p-4 space-y-4 rounded-container-token';
let ae_promises: key_val = {}; // Promise<any>; let ae_promises: key_val = {}; // Promise<any>;
@@ -555,7 +553,7 @@ async function handle_update__event_presenter({
<p>The details provided will be used to list you as a speaker in our CHOW promotional materials and during CHOW in the event mobile app, speaker introductions, etc.</p> <p>The details provided will be used to list you as a speaker in our CHOW promotional materials and during CHOW in the event mobile app, speaker introductions, etc.</p>
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
@@ -636,7 +634,17 @@ async function handle_update__event_presenter({
<!-- </section> --> <!-- </section> -->
<fieldset class="mb-8"> <fieldset class="mb-8">
<legend class="legend input_required">Agreements & Accommodations</legend> <legend class="legend input_required">Agreements</legend>
<!-- <Element_data_store
ds_code="events_speakers__form__waiver_html"
ds_type="html"
for_type="devent"
for_id={$slct.event_id}
ds_name="Default: Events Speakers Form - Waiver HTML"
display="block"
class_li=""
/> -->
<label for="agree" class="label"> <label for="agree" class="label">
<input <input
@@ -650,6 +658,18 @@ async function handle_update__event_presenter({
> >
Yes, I grant the Foundation permission to use my biography, photo, and presentation, materials and verbal remarks on the Foundation website and promotional materials. I understand that summarized remarks will be sent to me for review prior to inclusion. Yes, I grant the Foundation permission to use my biography, photo, and presentation, materials and verbal remarks on the Foundation website and promotional materials. I understand that summarized remarks will be sent to me for review prior to inclusion.
</label> </label>
<!-- <label for="agree" class="label">
<input
type="checkbox"
class="checkbox variant-glass-warning"
id="agree"
name="agree"
value="1"
checked={$slct.event_presenter_obj.agree}
required
>
Yes, I understand the permissions.
</label> -->
<!-- <label for="accommodations" class="label"> <!-- <label for="accommodations" class="label">
<input <input
@@ -666,7 +686,7 @@ async function handle_update__event_presenter({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary m-2" class="btn variant-glass-primary m-2"
disabled={($ae_sess.mod.events.disable_submit__event_presenter_obj)} disabled={($ae_sess.mod.events.disable_submit__event_presenter_obj)}
on:click={() => { on:click={() => {
console.log('*** Start save and email button clicked ***'); console.log('*** Start save and email button clicked ***');
@@ -692,7 +712,7 @@ async function handle_update__event_presenter({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary m-2" class="btn variant-glass-primary m-2"
disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)} disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)}
on:click={() => { on:click={() => {
console.log('*** Save start button clicked ***'); console.log('*** Save start button clicked ***');
@@ -713,7 +733,7 @@ async function handle_update__event_presenter({
<section class="biograhpy space-y-4"> <section class="biograhpy space-y-4">
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
<label class="label ae_label event_presenter__biography required variant-glass-warning space-y-4"> <label class="label ae_label event_presenter__biography required variant-glass-warning space-y-4">
@@ -737,7 +757,7 @@ async function handle_update__event_presenter({
<div class="flex flex-wrap gap-2 p-1"> <div class="flex flex-wrap gap-2 p-1">
<button <button
type="submit" type="submit"
class="btn {parent.buttonPositive} btn-sm" class="btn variant-glass-primary m-2"
disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)} disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -761,7 +781,7 @@ async function handle_update__event_presenter({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form_files} on:submit|preventDefault={handle_submit_form_files}
> >
@@ -798,7 +818,7 @@ async function handle_update__event_presenter({
<button <button
type="submit" type="submit"
class="btn {parent.buttonPositive}" class="btn variant-glass-primary m-2"
disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)} disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -818,7 +838,7 @@ async function handle_update__event_presenter({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
<!-- Ask for common social media URLs. (Twitter, Facebook, Instagram, etc) --> <!-- Ask for common social media URLs. (Twitter, Facebook, Instagram, etc) -->
@@ -869,7 +889,7 @@ async function handle_update__event_presenter({
<button <button
type="submit" type="submit"
class="btn {parent.buttonPositive}" class="btn variant-glass-primary m-2"
disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)} disabled={($ae_loc.mod.events.disable_submit__event_presenter_obj)}
on:click={() => { on:click={() => {
console.log('*** Save more button clicked ***'); console.log('*** Save more button clicked ***');
@@ -902,7 +922,7 @@ async function handle_update__event_presenter({
// $slct.event_presenter_id = null; // $slct.event_presenter_id = null;
// $slct.event_presenter_obj = {}; // $slct.event_presenter_obj = {};
}} }}
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
class:hidden={!$ae_loc.trusted_access} class:hidden={!$ae_loc.trusted_access}
title="CURRENTLY DISABLED: Delete record permanently" title="CURRENTLY DISABLED: Delete record permanently"
> >
@@ -942,8 +962,8 @@ async function handle_update__event_presenter({
{/await} {/await}
<button class="btn variant-filled-primary" on:click={parent.onClose}> <button class="btn variant-glass-primary" on:click={parent.onClose}>
<span class="fas fa-window-close mx-1"></span> <span class="fas fa-times mx-1"></span>
Close Close
</button> </button>

39
src/routes/events_speakers/10_view_modal__event_presenter_obj.svelte
View File

@@ -2,18 +2,28 @@
import type { SvelteComponent } from 'svelte'; import type { SvelteComponent } from 'svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
// Stores
// This works and uses local storage:
// store_current_tab must be prefixed with $ to be reactive.
import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, RadioGroup, RadioItem, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import type { Writable } from 'svelte/store';
import { ae_util } from '$lib/ae_utils'; import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api'; import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores'; import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// Stores
// Props // Props
/** Exposes parent props to this component. */ /** Exposes parent props to this component. */
export let parent: SvelteComponent; export let parent: SvelteComponent;
console.log(`Parent:`, parent); console.log(`Parent:`, parent);
export let container_class_li = ''; export let container_class_li = '';
const modalStore = getModalStore();
if ($slct.event_presenter_id) { if ($slct.event_presenter_id) {
console.log(`Presenter ID selected: ${$slct.event_presenter_id}`); console.log(`Presenter ID selected: ${$slct.event_presenter_id}`);
console.log(`Presenter object selected:`, $slct.event_presenter_obj); console.log(`Presenter object selected:`, $slct.event_presenter_obj);
@@ -29,10 +39,16 @@ onMount(() => {
<!-- @component This is the Presenters modal view form. --> <!-- @component This is the Presenters modal view form. -->
{#if $modalStore[0]}
<section class="svelte_component ae_view_modal ae_obj__event_presenter {container_class_li} p-4 space-y-4"> <section class="svelte_component ae_view_modal ae_obj__event_presenter {container_class_li} p-4 space-y-4">
<header class={parent.regionHeader}> <header class={parent.regionHeader}>
{@html $slct.event_presenter_obj.full_name} {@html $slct.event_presenter_obj.full_name}
<button class="btn variant-glass-primary float-end" on:click={parent.onClose}>
<span class="fas fa-times mx-1"></span>
Close
</button>
</header> </header>
<p>This quick view of a presenter's information is customizable or can be hidden completely.</p> <p>This quick view of a presenter's information is customizable or can be hidden completely.</p>
@@ -109,10 +125,11 @@ onMount(() => {
</div> </div>
<footer class="{parent.regionFooter}"> <footer class="{parent.regionFooter}">
{#if $ae_loc.trusted_access || $slct.event_presenter_obj.external_person_id === $ae_loc.ae_uuid || $slct.event_presenter_obj.email === $ae_loc.ae_email}
<span> {#if $ae_loc.trusted_access}
<span class="ae_options mx-1">
<button <button
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
on:click={() => { on:click={() => {
if (!confirm(`Are you sure you want to send this email to ${$slct.event_presenter_obj.email}?`)) {return false;} if (!confirm(`Are you sure you want to send this email to ${$slct.event_presenter_obj.email}?`)) {return false;}
@@ -127,8 +144,7 @@ onMount(() => {
}} }}
> >
<span class="fas fa-paper-plane mx-1 <span class="fas fa-paper-plane mx-1"></span>
"></span>
Send Email Send Email
</button> </button>
@@ -139,7 +155,7 @@ onMount(() => {
parent.onClose(); parent.onClose();
$slct_trigger = 'show_edit__event_presenter_obj'; $slct_trigger = 'show_edit__event_presenter_obj';
}} }}
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
title={`Edit presenter: ${$slct.event_presenter_obj.name}`} title={`Edit presenter: ${$slct.event_presenter_obj.name}`}
> >
<span class="fas fa-edit mx-1"></span> Edit <span class="fas fa-edit mx-1"></span> Edit
@@ -147,20 +163,15 @@ onMount(() => {
</span> </span>
{/if} {/if}
<!-- <button
class="btn variant-filled-primary mx-1"
on:click={() => {parent.onClose();}}
>
<span class="fas fa-times mx-1"></span>
Close
</button> -->
<button class="btn variant-glass-primary" on:click={parent.onClose}> <button class="btn variant-glass-primary" on:click={parent.onClose}>
<span class="fas fa-times mx-1"></span> <span class="fas fa-times mx-1"></span>
Close Close
</button> </button>
</footer> </footer>
</section> </section>
{/if}
<style> <style>

27
src/routes/sponsorships/+page.svelte
View File

@@ -64,10 +64,13 @@ function handle_modal_close(response: boolean | undefined) {
ae_util.handle_url_and_message('sponsorship_id', null); ae_util.handle_url_and_message('sponsorship_id', null);
// We do NOT want to keep these values if it is closed and not just switching from view to edit. A "smart" transition? // We do NOT want to keep these values if it is closed and not just switching from view to edit. A "smart" transition?
if (!$ae_loc.mod.sponsorships.show_edit__sponsorship_obj && !$ae_loc.mod.sponsorships.show_view__sponsorship_obj) { // if (!$ae_loc.mod.sponsorships.show_edit__sponsorship_obj && !$ae_loc.mod.sponsorships.show_view__sponsorship_obj) {
console.log('Clearing the modal store and the selected sponsorship object.');
$slct.sponsorship_id = null; $slct.sponsorship_id = null;
$slct.sponsorship_obj = null; $slct.sponsorship_obj = null;
} // } else {
// console.log('Not clearing the modal store and the selected sponsorship object.');
// }
} }
@@ -98,7 +101,8 @@ onMount(() => {
ae_util.handle_url_and_message('sponsorship_cfg_id', $slct.sponsorship_cfg_id); ae_util.handle_url_and_message('sponsorship_cfg_id', $slct.sponsorship_cfg_id);
ae_util.handle_url_and_message('sponsorship_id', $slct.sponsorship_id); ae_util.handle_url_and_message('sponsorship_id', $slct.sponsorship_id);
if ($slct.sponsorship_id) { if ($slct.sponsorship_id) {
console.log(`Got an ID. Let's show the modal!`); console.log(`Got an ID. Let's clear the modal store and show the modal!`);
modalStore.clear();
modalStore.trigger(modal_edit__sponsorship_obj); modalStore.trigger(modal_edit__sponsorship_obj);
} }
}); });
@@ -112,7 +116,7 @@ $: if ($slct_trigger == 'show_edit__sponsorship_obj' && $ae_loc.mod.sponsorships
let location = window.location.href; let location = window.location.href;
const url = new URL(location); const url = new URL(location);
url.searchParams.set('sponsorship_id', $slct.sponsorship_id); url.searchParams.set('sponsorship_id', $slct.sponsorship_id);
history.pushState({}, '', url); // history.pushState({}, '', url);
let message = {'sponsorship_id': $slct.sponsorship_id}; let message = {'sponsorship_id': $slct.sponsorship_id};
window.parent.postMessage(message, "*"); window.parent.postMessage(message, "*");
@@ -130,7 +134,7 @@ $: if ($slct_trigger == 'show_view__sponsorship_obj' && $ae_loc.mod.sponsorships
let location = window.location.href; let location = window.location.href;
const url = new URL(location); const url = new URL(location);
url.searchParams.set('sponsorship_id', $slct.sponsorship_id); url.searchParams.set('sponsorship_id', $slct.sponsorship_id);
history.pushState({}, '', url); // history.pushState({}, '', url);
// modalStore.clear(); // modalStore.clear();
modalStore.trigger(modal_view__sponsorship_obj); modalStore.trigger(modal_view__sponsorship_obj);
@@ -261,12 +265,13 @@ async function handle_load_ae_obj_id__sponsorship_cfg({sponsorship_cfg_id, try_c
// For CHOW 2024 only // For CHOW 2024 only
$ae_loc.mod.sponsorships.level_guest_max_li = { $ae_loc.mod.sponsorships.level_guest_max_li = {
0: 0, 0: 0,
1: 4, // Friend 1: 4, // CHOW 2024 - Friend
2: 8, 2: 8, // CHOW 2024 - Supporter
3: 8, // Champion 3: 8, // CHOW 2024 - Advocate
4: 8, // Advocate 4: 8, // CHOW 2024 - Champion
5: 8, // Presenting Partner 5: 8, // CHOW 2024 - Presenting Partner
6: 16, // Signature Partner 6: 16, // CHOW 2024 - Signature Partner
7: 16, // CHOW 2024 - Premier Partner
}; };
// $ae_loc.mod.sponsorships.level_guest_max_li = { // $ae_loc.mod.sponsorships.level_guest_max_li = {
// '0': 0, // '0': 0,

133
src/routes/sponsorships/10_edit_modal__sponsorship_obj.svelte
View File

@@ -80,7 +80,6 @@ onMount(() => {
// console.log($slct.sponsorship_obj.address_li_json.mailing); // console.log($slct.sponsorship_obj.address_li_json.mailing);
}); });
const cForm = 'border border-surface-200 p-4 space-y-4 rounded-container-token';
let ae_promises: key_val = {}; // Promise<any>; let ae_promises: key_val = {}; // Promise<any>;
@@ -697,7 +696,10 @@ async function handle_update__sponsorship({
{#if $modalStore[0]} {#if $modalStore[0]}
<div class="svelte_component ae_edit_modal ae_obj__sponsorship {container_class_li}"> <div class="svelte_component ae_edit_modal ae_obj__sponsorship {container_class_li}">
<header class={parent.regionHeader}> <header class={parent.regionHeader}>
{$modalStore[0].title ?? '-- No Title --'} {$modalStore[0].title ?? '-- No Title --'}:
{$slct.sponsorship_obj.level_str}
({$slct.sponsorship_obj.level_num})
{#await ae_promises.update__sponsorship_obj} {#await ae_promises.update__sponsorship_obj}
<div class="modal-loading"> <div class="modal-loading">
@@ -850,7 +852,7 @@ async function handle_update__sponsorship({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
<!-- <section class="ae_section sponsorship__contacts border border-gray-500/20 p-4"> --> <!-- <section class="ae_section sponsorship__contacts border border-gray-500/20 p-4"> -->
@@ -861,8 +863,7 @@ async function handle_update__sponsorship({
<div class="label"> <div class="label">
<span class="input_required">Select sponsorship level:</span> <span class="input_required">Select sponsorship level:</span>
{#if $slct.sponsorship_cfg_obj} {#if $slct.sponsorship_cfg_obj}
<!-- <!-- Example JSON level_li_json:
Example JSON level_li_json:
{ {
"1": { "1": {
"name": "Friend", "name": "Friend",
@@ -919,7 +920,7 @@ async function handle_update__sponsorship({
<span class="fas fa-check-circle"></span> <span class="fas fa-check-circle"></span>
<span class="ae_value">Yes, marked as paid</span> <span class="ae_value">Yes, marked as paid</span>
{:else} {:else}
<p class="variant-ghost-warning">Deadline to complete payment: April 15th, 2024</p> <p class="variant-glass-error">Deadline to complete payment: April 15th, 2024</p>
<!-- <p>Return to the <a href="https://preconvirtual.com/chow-2024-faq/#Sponsorship">CHOW Sponsor Hub for Payment Options and Instruction</a> details.</p> --> <!-- <p>Return to the <a href="https://preconvirtual.com/chow-2024-faq/#Sponsorship">CHOW Sponsor Hub for Payment Options and Instruction</a> details.</p> -->
<p>Please refer to the sponsorship <p>Please refer to the sponsorship
@@ -1135,7 +1136,7 @@ async function handle_update__sponsorship({
<div class="flex flex-wrap gap-2 p-1"> <div class="flex flex-wrap gap-2 p-1">
<button <button
type="submit" type="submit"
class="btn variant-filled-primary btn-sm" class="btn variant-glass-primary btn-sm"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -1146,7 +1147,7 @@ async function handle_update__sponsorship({
</button> </button>
<button <button
class="btn variant-filled-warning btn-sm" class="btn variant-glass-warning btn-sm"
on:click={(event) => { on:click={(event) => {
console.log('*** Delete button clicked ***'); console.log('*** Delete button clicked ***');
if (!confirm('Are you sure you want to delete this contact?')) {return false;} if (!confirm('Are you sure you want to delete this contact?')) {return false;}
@@ -1172,7 +1173,7 @@ async function handle_update__sponsorship({
<div> <div>
<button <button
class="btn btn-sm variant-filled-secondary m-2" class="btn btn-sm variant-glass-secondary m-2"
on:click={() => { on:click={() => {
console.log('*** Add contact button clicked ***'); console.log('*** Add contact button clicked ***');
// if (!confirm('Are you sure you want to add a contact?')) {return false;} // if (!confirm('Are you sure you want to add a contact?')) {return false;}
@@ -1223,6 +1224,7 @@ async function handle_update__sponsorship({
ds_type="html" ds_type="html"
for_type="sponsorship_cfg" for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id} for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Waiver HTML"
display="block" display="block"
class_li="" class_li=""
/> />
@@ -1246,10 +1248,11 @@ async function handle_update__sponsorship({
ds_type="html" ds_type="html"
for_type="sponsorship_cfg" for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id} for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Accommodations HTML"
display="block" display="block"
class_li="" class_li=""
/> />
<!-- <h3 class="h4">Special Accomodations</h3> <!-- <h3 class="h4">Special Accommodations</h3>
<p class="text-sm">If you require any special accommodations in order to enhance/enable your involvement with CHOW please provide details in the text box below. A member of the CHOW team will reach out to assist.</p> --> <p class="text-sm">If you require any special accommodations in order to enhance/enable your involvement with CHOW please provide details in the text box below. A member of the CHOW team will reach out to assist.</p> -->
<label for="q_accommodations" class="label"> <label for="q_accommodations" class="label">
<input <input
@@ -1282,7 +1285,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary m-2" class="btn variant-glass-primary m-2"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Start save and email button clicked ***'); console.log('*** Start save and email button clicked ***');
@@ -1308,7 +1311,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary m-2" class="btn variant-glass-primary m-2"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Start save and continue button clicked ***'); console.log('*** Start save and continue button clicked ***');
@@ -1329,7 +1332,7 @@ async function handle_update__sponsorship({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
@@ -1458,7 +1461,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary m-2" class="btn variant-glass-primary m-2"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save marketing button clicked ***'); console.log('*** Save marketing button clicked ***');
@@ -1475,16 +1478,26 @@ async function handle_update__sponsorship({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
<h3 class="h4">Exhibit Booth Information</h3> <h3 class="h4">Exhibit Booth Information</h3>
<div class="text-sm space-y-4"> <Element_data_store
<p>Booth space is limted. Please select below if you would like to have a table top exhibit at CHOW.</p> ds_code="sponsorships__form__exhibit_booth_info_html"
ds_type="html"
for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Exhibit Booth Information HTML"
display="block"
class_li=""
/>
<!-- <div class="text-sm space-y-4">
<p>Booth space is limited. Please select below if you would like to have a table top exhibit at CHOW.</p>
<p>Booth specifications: Exhibit space is six feet wide by 3 feet deep. 10-feet-wide booth backdrops are not allowed. Banner signage or pop-up stands must fit behind the table in the 6-feet-wide space or on top of the table. Your space will include a six-foot skirted table and 2 chairs.</p> <p>Booth specifications: Exhibit space is six feet wide by 3 feet deep. 10-feet-wide booth backdrops are not allowed. Banner signage or pop-up stands must fit behind the table in the 6-feet-wide space or on top of the table. Your space will include a six-foot skirted table and 2 chairs.</p>
</div> </div> -->
<div class="space-y-2"> <div class="space-y-2">
<div class="font-bold input_required">Would you like a table top exhibit at CHOW?</div> <div class="font-bold input_required">Would you like a table top exhibit at CHOW?</div>
@@ -1542,7 +1555,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary" class="btn variant-glass-primary"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -1558,7 +1571,7 @@ async function handle_update__sponsorship({
{:else if $store_current_tab === 'session'} {:else if $store_current_tab === 'session'}
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
@@ -1570,11 +1583,20 @@ async function handle_update__sponsorship({
> >
<legend class="legend">Plenary Session</legend> <legend class="legend">Plenary Session</legend>
<div class="text-sm space-y-4"> <Element_data_store
ds_code="sponsorships__form__plenary_session_info_html"
ds_type="html"
for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Plenary Session Information HTML"
display="block"
class_li=""
/>
<!-- <div class="text-sm space-y-4">
<p>Plenary sessions are available on a limited basis.</p> <p>Plenary sessions are available on a limited basis.</p>
<p>If you select "Yes", our CHOW Manager, Shannon Colbert will review your selection and be in touch with more details.</p> <p>If you select "Yes", our CHOW Manager, Shannon Colbert will review your selection and be in touch with more details.</p>
</div> </div> -->
<div class="font-bold">Are you interested in hosting a CHOW plenary session?</div> <div class="font-bold">Are you interested in hosting a CHOW plenary session?</div>
<div class="space-y-2"> <div class="space-y-2">
<label class="flex items-center space-x-2"> <label class="flex items-center space-x-2">
@@ -1641,13 +1663,22 @@ async function handle_update__sponsorship({
<fieldset class="mb-8 space-y-2"> <fieldset class="mb-8 space-y-2">
<legend class="legend">Virtual Session</legend> <legend class="legend">Virtual Session</legend>
<div class="text-sm space-y-4"> <Element_data_store
ds_code="sponsorships__form__virtual_session_info_html"
ds_type="html"
for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Virtual Session Information HTML"
display="block"
class_li=""
/>
<!-- <div class="text-sm space-y-4">
<p>General Information: Virtual sessions are a collaborative process, and the Foundation will have final approval on session topics and speakers. Hosted sessions should align with key priorities related to CHOW 2024's theme 'LEADERSHIP'. Partner organizations will develop and host a live, 45-minute session using Zoom (link provided by the Foundation). The session will be integrated into the CHOW 2024 virtual platform for conference attendees to join.</p> <p>General Information: Virtual sessions are a collaborative process, and the Foundation will have final approval on session topics and speakers. Hosted sessions should align with key priorities related to CHOW 2024's theme 'LEADERSHIP'. Partner organizations will develop and host a live, 45-minute session using Zoom (link provided by the Foundation). The session will be integrated into the CHOW 2024 virtual platform for conference attendees to join.</p>
<p>Virtual sessions are available on a limited basis.</p> <p>Virtual sessions are available on a limited basis.</p>
<p>If you select "Yes", our CHOW Manager, Shannon Colbert will review your selection and be in touch with more details. Once confirmed, a draft session form must be submitted by Thursday, April 13 and a final session form must be submitted no later than Thursday, May 4.</p> <p>If you select "Yes", our CHOW Manager, Shannon Colbert will review your selection and be in touch with more details. Once confirmed, a draft session form must be submitted by Thursday, April 13 and a final session form must be submitted no later than Thursday, May 4.</p>
</div> </div> -->
<div class="font-bold">Are you interested in hosting a CHOW virtual session?</div> <div class="font-bold">Are you interested in hosting a CHOW virtual session?</div>
<div class="space-y-2"> <div class="space-y-2">
<label class="flex items-center space-x-2"> <label class="flex items-center space-x-2">
@@ -1679,7 +1710,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary" class="btn variant-glass-primary"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -1696,25 +1727,32 @@ async function handle_update__sponsorship({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form_files} on:submit|preventDefault={handle_submit_form_files}
> >
<section class="space-y-4"> <section class="space-y-4">
<h2 class="h3">Logos</h2> <h2 class="h3">Logos</h2>
<div class="text-sm"> <Element_data_store
ds_code="sponsorships__form__logos_info_html"
ds_type="html"
for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Logos Information HTML"
display="block"
class_li=""
/>
<!-- <div class="text-sm">
<p>Add your logo here. Your logo will be used throughout Capitol Hill Ocean Week.</p> <p>Add your logo here. Your logo will be used throughout Capitol Hill Ocean Week.</p>
<!-- Hidden at the request of Jordan -->
<!-- <p>Please note that these items are required if your company would like to take advantage of the logo recognition benefits associated with this sponsorship level. To prevent delayed benefits fulfillment, please make sure to include this item here.</p> -->
<div>Recommend specs: <div>Recommend specs:
<ul class="list-disc list-inside"> <ul class="list-disc list-inside">
<li>High resolution image</li> <li>High resolution image</li>
<li>Most image types: PNG, WEBP, SVG, JPG, Illistrator, etc</li> <li>Most image types: PNG, WEBP, SVG, JPG, Illustrator, etc</li>
<li>Max file size: 20 MB</li> <li>Max file size: 20 MB</li>
</ul> </ul>
</div> </div>
</div> </div> -->
<div class="flex flex-wrap gap-4"> <div class="flex flex-wrap gap-4">
@@ -1812,9 +1850,18 @@ async function handle_update__sponsorship({
<hr class="border border-gray-500/20" /> <hr class="border border-gray-500/20" />
<h2 class="h3">Promo video</h2> <h2 class="h3">Promo video</h2>
<div class="text-sm space-y-4"> <Element_data_store
ds_code="sponsorships__form__promo_info_html"
ds_type="html"
for_type="sponsorship_cfg"
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Promo Information HTML"
display="block"
class_li=""
/>
<!-- <div class="text-sm space-y-4">
<p>Add your 30 to 60 second promotional video here. This video will play during Capitol Hill Ocean Week.</p> <p>Add your 30 to 60 second promotional video here. This video will play during Capitol Hill Ocean Week.</p>
<p class="variant-ghost-warning">Submission Deadline: Wednesday, May 24</p> <p class="variant-glass-warning">Submission Deadline: Wednesday, May 24</p>
<div>Recommend specs: <div>Recommend specs:
<ul class="list-disc list-inside"> <ul class="list-disc list-inside">
<li>30 to 60 seconds</li> <li>30 to 60 seconds</li>
@@ -1824,7 +1871,7 @@ async function handle_update__sponsorship({
<li>Max file size: 400 MB</li> <li>Max file size: 400 MB</li>
</ul> </ul>
</div> </div>
</div> </div> -->
<span class="flex flex-col justify-between"> <span class="flex flex-col justify-between">
<label for="file_media_promo_video"> <label for="file_media_promo_video">
Upload your short second promotional video. Upload your short second promotional video.
@@ -1857,7 +1904,7 @@ async function handle_update__sponsorship({
<button <button
type="submit" type="submit"
class="btn variant-filled-primary" class="btn variant-glass-primary"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -1879,7 +1926,7 @@ async function handle_update__sponsorship({
<div class="text-sm space-y-4"> <div class="text-sm space-y-4">
<p>These are the guests that will be attending the Ocean Awards Gala. The maximum number is based on your currently selected sponsorship level.</p> <p>These are the guests that will be attending the Ocean Awards Gala. The maximum number is based on your currently selected sponsorship level.</p>
{#if $slct.sponsorship_obj.level_num == 0} {#if $slct.sponsorship_obj.level_num == 0}
<p class="variant-ghost-warning">Please select a sponsorship level before adding guests.</p> <p class="variant-glass-error">Please select a sponsorship level before adding guests.</p>
{:else} {:else}
<p class="">Included in your sponsorship are <strong>{$ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num]} seats ( <p class="">Included in your sponsorship are <strong>{$ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num]} seats (
{$ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num] == 4 ? 'half table' : ''} {$ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num] == 4 ? 'half table' : ''}
@@ -1889,17 +1936,17 @@ async function handle_update__sponsorship({
<p> <p>
Submit RSVPs below. You will have the opportunity to add names at a later date. Submit RSVPs below. You will have the opportunity to add names at a later date.
</p> </p>
<p class="variant-ghost-warning">Deadline to submit RSVPs is May 15, 2024.</p> <p class="variant-glass-error">Deadline to submit RSVPs is May 15, 2024.</p>
{/if} {/if}
</div> </div>
{#if $slct.sponsorship_obj.guest_li_json && $slct.sponsorship_obj.guest_li_json.length >= $ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num]} {#if $slct.sponsorship_obj.guest_li_json && $slct.sponsorship_obj.guest_li_json.length >= $ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num]}
<div class="variant-filled-warning"><span class="fas fa-lock mx-1"></span> Max! You have reached the maximum number of guests for your selected sponsorship level.</div> <div class="variant-glass-warning"><span class="fas fa-lock mx-1"></span> Max! You have reached the maximum number of guests for your selected sponsorship level.</div>
<!-- <span class="fas fa-lock mx-1"></span> --> <!-- <span class="fas fa-lock mx-1"></span> -->
{:else} {:else}
<button <button
class="btn btn-sm variant-filled-secondary m-2" class="btn btn-sm variant-glass-secondary m-2"
on:click={() => { on:click={() => {
console.log('*** Add guest button clicked ***'); console.log('*** Add guest button clicked ***');
// if (!confirm('Are you sure you want to add a guest?')) {return false;} // if (!confirm('Are you sure you want to add a guest?')) {return false;}
@@ -2056,7 +2103,7 @@ async function handle_update__sponsorship({
<div class="flex flex-wrap gap-2 p-1"> <div class="flex flex-wrap gap-2 p-1">
<button <button
type="submit" type="submit"
class="btn variant-filled-primary btn-sm" class="btn variant-glass-primary btn-sm"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)} disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => { on:click={() => {
console.log('*** Save button clicked ***'); console.log('*** Save button clicked ***');
@@ -2070,7 +2117,7 @@ async function handle_update__sponsorship({
</button> </button>
<button <button
class="btn variant-filled-warning btn-sm" class="btn variant-glass-warning btn-sm"
on:click={(event) => { on:click={(event) => {
console.log('*** Delete button clicked ***'); console.log('*** Delete button clicked ***');
if (!confirm('Are you sure you want to delete this guest?')) {return false;} if (!confirm('Are you sure you want to delete this guest?')) {return false;}
@@ -2107,7 +2154,7 @@ async function handle_update__sponsorship({
<form <form
class="modal-form {cForm}" class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form} on:submit|preventDefault={handle_submit_form}
> >
@@ -2171,7 +2218,7 @@ async function handle_update__sponsorship({
// $slct.sponsorship_id = null; // $slct.sponsorship_id = null;
// $slct.sponsorship_obj = {}; // $slct.sponsorship_obj = {};
}} }}
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
class:hidden={!$ae_loc.trusted_access} class:hidden={!$ae_loc.trusted_access}
title="Delete record permanently" title="Delete record permanently"
> >

28
src/routes/sponsorships/10_view_modal__sponsorship_obj.svelte
View File

@@ -2,18 +2,28 @@
import type { SvelteComponent } from 'svelte'; import type { SvelteComponent } from 'svelte';
import { onMount } from 'svelte'; import { onMount } from 'svelte';
// Stores
// This works and uses local storage:
// store_current_tab must be prefixed with $ to be reactive.
import { clipboard, FileDropzone, getModalStore, localStorageStore, ProgressRadial, RadioGroup, RadioItem, TabGroup, Tab, TabAnchor } from '@skeletonlabs/skeleton';
import type { Writable } from 'svelte/store';
import { ae_util } from '$lib/ae_utils'; import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api'; import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores'; import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
// Stores
// Props // Props
/** Exposes parent props to this component. */ /** Exposes parent props to this component. */
export let parent: SvelteComponent; export let parent: SvelteComponent;
console.log(`Parent:`, parent); console.log(`Parent:`, parent);
export let container_class_li = ''; export let container_class_li = '';
const modalStore = getModalStore();
if ($slct.sponsorship_id) { if ($slct.sponsorship_id) {
console.log(`Sponsorship ID selected: ${$slct.sponsorship_id}`); console.log(`Sponsorship ID selected: ${$slct.sponsorship_id}`);
console.log(`Sponsorship object selected:`, $slct.sponsorship_obj); console.log(`Sponsorship object selected:`, $slct.sponsorship_obj);
@@ -29,6 +39,7 @@ onMount(() => {
<!-- @component This is the Sponsorships modal view form. --> <!-- @component This is the Sponsorships modal view form. -->
{#if $modalStore[0]}
<section class="svelte_component ae_view_modal ae_obj__sponsorship_obj {container_class_li} p-4 space-y-4"> <section class="svelte_component ae_view_modal ae_obj__sponsorship_obj {container_class_li} p-4 space-y-4">
<header class={parent.regionHeader}> <header class={parent.regionHeader}>
@@ -149,10 +160,11 @@ onMount(() => {
</div> </div>
<footer class="{parent.regionFooter}"> <footer class="{parent.regionFooter}">
{#if $ae_loc.trusted_access} {#if $ae_loc.trusted_access}
<div class="ae_options mx-1"> <div class="ae_options mx-1">
<button <button
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
on:click={() => { on:click={() => {
if (!confirm(`Are you sure you want to send this email to ${$slct.sponsorship_obj.poc_json.email}?`)) {return false;} if (!confirm(`Are you sure you want to send this email to ${$slct.sponsorship_obj.poc_json.email}?`)) {return false;}
@@ -167,8 +179,7 @@ onMount(() => {
}} }}
> >
<span class="fas fa-paper-plane mx-1 <span class="fas fa-paper-plane mx-1"></span>
"></span>
Send Email Send Email
</button> </button>
@@ -179,23 +190,26 @@ onMount(() => {
parent.onClose(); parent.onClose();
$slct_trigger = 'show_edit__sponsorship_obj'; $slct_trigger = 'show_edit__sponsorship_obj';
}} }}
class="btn variant-filled-warning mx-1" class="btn variant-glass-warning mx-1"
title={`Edit sponsorship: ${$slct.sponsorship_obj.name}`} title={`Edit sponsorship: ${$slct.sponsorship_obj.name}`}
> >
<span class="fas fa-edit mx-1"></span> Edit <span class="fas fa-edit mx-1"></span> Edit
</button> </button>
</div> </div>
{/if} {/if}
<button <button
class="btn variant-filled-primary mx-1" class="btn variant-glass-primary mx-1"
on:click={() => {parent.onClose();}} on:click={parent.onClose}
> >
<span class="fas fa-times mx-1"></span> <span class="fas fa-times mx-1"></span>
Close Close
</button> </button>
</footer> </footer>
</section> </section>
{/if}
<style> <style>