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

I am done for the night...

Browse Source
This commit is contained in:
Scott Idem
2024-03-08 00:09:17 -05:00
parent 1694dfb5c5
commit 5a147a98bb
18 changed files with 414 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/routes/sponsorships/+layout.svelte
View File

@@ -5,7 +5,7 @@ export let data;
<svelte:head>
<title>Sponsorships - {data.ae_loc.title}</title>
<title>Sponsor Hub - {data.ae_loc.title}</title>
</svelte:head>
<!-- <h1>Sponsorships Layout?</h1> -->

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

@@ -32,7 +32,7 @@ const modalComponentEditSponsorshipObj: ModalComponent = { ref: Edit_modal_spons
const modal_edit__sponsorship_obj: ModalSettings = {
type: 'component',
component: modalComponentEditSponsorshipObj,
title: 'Sponsor Submission Form', // Editing Sponsorship
title: 'Sponsor Form', // Editing Sponsorship
position: '', // default is "items-center"
response: (r: boolean | undefined) => handle_modal_close(r)
@@ -333,72 +333,74 @@ async function handle_load_ae_obj_id__sponsorship({sponsorship_id, try_cache=fal
</script>
<section class="ae_sponsorships md:container h-full mx-auto">
<div class="space-y-10 flex flex-col">
<section class="ae_events_speakers md:container h-full mx-auto flex flex-col items-center space-y-4">
<h1 class="h1 text-center">
<!-- &AElig; - Sponsorships -->
Sponsors Hub
</h1>
<section>
<button
class="btn variant-ghost-primary"
on:click={() => {
// $ae_loc.mod.sponsorships.show_edit__sponsorship_obj = true;
$slct.sponsorship_id = null;
$slct.sponsorship_obj = null;
<header>
<h1 class="h1 text-center">
<!-- &AElig; - Sponsorships -->
Sponsor Hub
</h1>
</header>
// modalStore.trigger(modal_edit__sponsorship_obj);
$ae_loc.mod.sponsorships.show_edit__sponsorship_obj = true;
$slct_trigger = 'show_edit__sponsorship_obj';
}}
>
<span class="fas fa-edit mx-1"></span>
Start Sponsor Submission Form
</button>
<section>
<button
class="btn variant-ghost-primary"
on:click={() => {
// $ae_loc.mod.sponsorships.show_edit__sponsorship_obj = true;
$slct.sponsorship_id = null;
$slct.sponsorship_obj = null;
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_x);
}}
>
Open Drawer X
</button> -->
// modalStore.trigger(modal_edit__sponsorship_obj);
$ae_loc.mod.sponsorships.show_edit__sponsorship_obj = true;
$slct_trigger = 'show_edit__sponsorship_obj';
}}
>
<span class="fas fa-edit mx-1"></span>
Start Sponsor Submission Form
</button>
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_y);
}}
>
Open Drawer Y
</button> -->
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_x);
}}
>
Open Drawer X
</button> -->
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_edit);
}}
>
Open Drawer Edit
</button> -->
</section>
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_y);
}}
>
Open Drawer Y
</button> -->
<!-- <button
on:click={() => {
console.log('Open drawer');
drawerStore.open(drawer_settings_edit);
}}
>
Open Drawer Edit
</button> -->
</section>
<section class="sponsorships_list ae_h_scrollfix">
{#await ae_sponsorship_obj_li_get_promise}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Loading...
</span>
</div>
{/await}
{#if $slct.sponsorship_obj_li && $ae_loc.mod.sponsorships.show_list__sponsorship_obj_li}
<List_sponsorship_obj />
{/if}
</section>
<section class="sponsorships_list">
{#await ae_sponsorship_obj_li_get_promise}
<div class="modal-loading">
<span class="fas fa-spinner fa-spin"></span>
<span class="loading-text">
Loading...
</span>
</div>
{/await}
{#if $slct.sponsorship_obj_li && $ae_loc.mod.sponsorships.show_list__sponsorship_obj_li}
<List_sponsorship_obj />
{/if}
</section>
</div>
</section>

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

@@ -45,10 +45,49 @@ if ($slct.sponsorship_id) {
console.log(`Sponsorship object selected:`, $slct.sponsorship_obj);
$slct_trigger = 'load__sponsorship_obj';
} else {
$store_current_tab = 'start';
$slct.sponsorship_id = null;
$slct.sponsorship_obj = {
sponsorship_cfg_id_random: $ae_loc.mod.sponsorships.cfg_id,
name: null,
description: null,
poc_person_id: null,
logo_li_json: null,
media_li_json: null,
questions_li_json: {},
social_li_json: null,
guest_li_json: null,
level_num: '',
level_str: null,
amount: null,
paid: null,
enable: null,
};
}
let ae_promises: key_val = {}; // Promise<any>;
$ae_sess.mod.sponsorships.submit_status = null;
$ae_sess.mod.sponsorships.disable_submit__sponsorship_obj = false;
let placeholder_li: key_val = {
file_logo_primary: '-- No File Selected --',
file_logo_light: '-- No File Selected --',
file_logo_dark: '-- No File Selected --',
file_media_promo_video: '-- No File Selected --',
};
onMount(() => {
console.log('** Component Mounted: ** View Modal - Sponsorship Obj');
console.log('** Component Mounted: ** Edit Modal - Sponsorship Obj');
if ($slct.sponsorship_id && $ae_loc.href_url) {
// $ae_loc.mod.sponsorships.link = `${$ae_loc.href_url}/load?sponsorship_id=${$slct.sponsorship_id}`;
@@ -88,48 +127,6 @@ onMount(() => {
});
let ae_promises: key_val = {}; // Promise<any>;
$ae_sess.mod.sponsorships.submit_status = null;
$ae_sess.mod.sponsorships.disable_submit__sponsorship_obj = false;
let placeholder_li: key_val = {
file_logo_primary: '-- No File Selected --',
file_logo_light: '-- No File Selected --',
file_logo_dark: '-- No File Selected --',
file_media_promo_video: '-- No File Selected --',
};
if ($slct.sponsorship_id) {
console.log(`Sponsorship ID selected: ${$slct.sponsorship_id}`);
console.log(`Sponsorship object selected:`, $slct.sponsorship_obj);
} else {
$store_current_tab = 'start';
$slct.sponsorship_id = null;
$slct.sponsorship_obj = {
sponsorship_cfg_id_random: $ae_loc.mod.sponsorships.cfg_id,
name: null,
description: null,
poc_person_id: null,
logo_li_json: null,
media_li_json: null,
questions_li_json: {},
social_li_json: null,
guest_li_json: null,
level_num: '',
level_str: null,
amount: null,
paid: null,
enable: null,
};
}
$: if ($slct.sponsorship_obj) {
@@ -492,24 +489,25 @@ async function handle_submit_form(event) {
if ($store_current_tab == 'start' && $slct.sponsorship_id) {
$store_current_tab = 'marketing';
// If level is above 1 then they can go to the exhibits tab.
} else if ($store_current_tab == 'marketing' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num > 1) {
// If level is 2 or above then they can go to the exhibits tab.
} else if ($store_current_tab == 'marketing' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num >= 2) {
$store_current_tab = 'exhibit';
} else if ($store_current_tab == 'marketing' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num == 1) {
$store_current_tab = 'files';
// If level is above 2 then they can go to the sessions tab.
} else if ($store_current_tab == 'exhibit' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num > 2) {
// If level is 3 or above then they can go to the sessions tab.
} else if ($store_current_tab == 'exhibit' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num >= 3) {
$store_current_tab = 'sessions';
} else if ($store_current_tab == 'exhibit' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num <= 2) {
// All levels can go to the files tab.
} else if ($store_current_tab == 'exhibit' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num) {
$store_current_tab = 'files';
} else if ($store_current_tab == 'sessions') {
} else if ($store_current_tab == 'sessions' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num) {
$store_current_tab = 'files';
} else if ($store_current_tab == 'files') {
} else if ($store_current_tab == 'files' && $slct.sponsorship_id && $slct.sponsorship_obj.level_num) {
$store_current_tab = 'guests';
}
} else {
@@ -733,9 +731,10 @@ async function handle_update__sponsorship({
{#if $modalStore[0]}
<div class="svelte_component ae_edit_modal ae_obj__sponsorship {container_class_li}">
<header class={parent.regionHeader}>
{$modalStore[0].title ?? '-- No Title --'}:
{$slct.sponsorship_obj.level_str}
({$slct.sponsorship_obj.level_num})
<h2>{$modalStore[0].title ?? '-- No Title --'}:
{$slct.sponsorship_obj.level_str ?? '-- Please Select Level --'}
<!-- ({$slct.sponsorship_obj.level_num}) -->
</h2>
{#await ae_promises.update__sponsorship_obj}
@@ -841,7 +840,7 @@ async function handle_update__sponsorship({
Marketing
</Tab>
<!-- Exhibit Level 2 and above -->
{#if $slct.sponsorship_obj.level_num > 1}
{#if $slct.sponsorship_obj.level_num >= 2}
<Tab bind:group={$store_current_tab} name="tab_exhibit" value={'exhibit'} disabled={!$slct.sponsorship_id || $slct.sponsorship_obj.level_num < 2}
regionTab={!$slct.sponsorship_id || $slct.sponsorship_obj.level_num < 2 ? 'text-slate-400' : ''}
>
@@ -854,7 +853,7 @@ async function handle_update__sponsorship({
Exhibitor Info
</Tab>
{/if}
{#if $slct.sponsorship_obj.level_num > 2}
{#if $slct.sponsorship_obj.level_num >= 3}
<Tab bind:group={$store_current_tab} name="tab_session" value={'sessions'} disabled={!$slct.sponsorship_id || $slct.sponsorship_obj.level_num < 3}>
<svelte:fragment slot="lead">
{#if $slct.sponsorship_obj.questions_li_json && ($slct.sponsorship_obj.questions_li_json.virtual_session || $slct.sponsorship_obj.questions_li_json.virtual_session === 0)}
@@ -865,6 +864,7 @@ async function handle_update__sponsorship({
Session Info
</Tab>
{/if}
<!-- All levels with some restrictions within the section -->
<Tab bind:group={$store_current_tab} name="tab_files" value={'files'} disabled={!$slct.sponsorship_id}
regionTab={!$slct.sponsorship_id ? 'text-slate-400' : ''}
>
@@ -968,7 +968,7 @@ async function handle_update__sponsorship({
<span class="fas fa-check-circle"></span>
<span class="ae_value">Yes, marked as paid</span>
{:else}
<p class="variant-glass-error">Deadline to complete payment: April 15th, 2024</p>
<p class="variant-glass-error max-w-96">Deadline to complete payment: April 15, 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>Please refer to the sponsorship
@@ -1447,6 +1447,7 @@ async function handle_update__sponsorship({
</div>
</label>
{#if $slct.sponsorship_obj.level_num >= 4}
<h3 class="h4 input_required">Social Media &amp; Email Inclusion</h3>
<label for="q_social_email" class="label">
<div>Would you like social and email inclusion at CHOW?</div>
@@ -1476,7 +1477,9 @@ async function handle_update__sponsorship({
</label>
</div>
</label>
{/if}
{#if $slct.sponsorship_obj.level_num >= 6}
<h3 class="h4 input_required">Dedicated Social Promos</h3>
<label for="q_dedicated_promos" class="label">
<div>Would you like dedicated social media promotions at CHOW?</div>
@@ -1506,6 +1509,7 @@ async function handle_update__sponsorship({
</label>
</div>
</label>
{/if}
<button
type="submit"
@@ -1783,6 +1787,7 @@ async function handle_update__sponsorship({
<section class="space-y-4">
<h2 class="h3">Logos</h2>
<Element_data_store
ds_code="sponsorships__form__logos_info_html"
ds_type="html"
@@ -1790,19 +1795,8 @@ async function handle_update__sponsorship({
for_id={$slct.sponsorship_cfg_id}
ds_name="Default: Sponsorships Form - Logos Information HTML"
display="block"
class_li=""
class_li="hidden"
/>
<!-- <div class="text-sm">
<p>Add your logo here. Your logo will be used throughout Capitol Hill Ocean Week.</p>
<div>Recommend specs:
<ul class="list-disc list-inside">
<li>High resolution image</li>
<li>Most image types: PNG, WEBP, SVG, JPG, Illustrator, etc</li>
<li>Max file size: 20 MB</li>
</ul>
</div>
</div> -->
<div class="flex flex-wrap gap-4">
@@ -1816,7 +1810,7 @@ async function handle_update__sponsorship({
padding="p-1"
accept="image/*"
class="w-96 variant-glass-warning"
required={!placeholder_li.file_logo_primary}
required={!$slct.sponsorship_obj.logo_li_json}
on:change={(e) => {
console.log('*** FileDropzone change event ***', e);
@@ -1829,7 +1823,7 @@ async function handle_update__sponsorship({
>
<svelte:fragment slot="lead"><span class="fas fa-file-upload"></span></svelte:fragment>
<svelte:fragment slot="message"><strong>Upload your file</strong> (drag and drop)</svelte:fragment>
<svelte:fragment slot="meta">Image file types only (PNG, WEBP, JPG, etc)</svelte:fragment>
<svelte:fragment slot="meta">High resolution and vector image files only<br>(PNG, WEBP, SVG, JPG, Illustrator, etc)</svelte:fragment>
</FileDropzone>
</label>
{@html placeholder_li.file_logo_primary}
@@ -1857,7 +1851,7 @@ async function handle_update__sponsorship({
>
<svelte:fragment slot="lead"><span class="fas fa-file-upload"></span></svelte:fragment>
<svelte:fragment slot="message"><strong>Upload your file</strong> (drag and drop)</svelte:fragment>
<svelte:fragment slot="meta">Image file types only (PNG, WEBP, JPG, etc)</svelte:fragment>
<svelte:fragment slot="meta">High resolution and vector image files only<br>(PNG, WEBP, SVG, JPG, Illustrator, etc)</svelte:fragment>
</FileDropzone>
</label>
{@html placeholder_li.file_logo_light}
@@ -1885,7 +1879,7 @@ async function handle_update__sponsorship({
>
<svelte:fragment slot="lead"><span class="fas fa-file-upload"></span></svelte:fragment>
<svelte:fragment slot="message"><strong>Upload your file</strong> (drag and drop)</svelte:fragment>
<svelte:fragment slot="meta">Image file types only (PNG, WEBP, JPG, etc)</svelte:fragment>
<svelte:fragment slot="meta">High resolution and vector image files only<br>(PNG, WEBP, SVG, JPG, Illustrator, etc)</svelte:fragment>
</FileDropzone>
</label>
{@html placeholder_li.file_logo_dark}
@@ -1974,19 +1968,19 @@ async function handle_update__sponsorship({
<h2 class="h3">Ocean Awards Gala Guests</h2>
<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>
{#if $slct.sponsorship_obj.level_num == 0}
<!-- These are the guests that will be attending the Ocean Awards Gala. -->
{#if $slct.sponsorship_obj.level_num < 1}
<p class="variant-glass-error">Please select a sponsorship level before adding guests.</p>
{:else}
<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] == 8 ? 'one table' : ''}
{$ae_loc.mod.sponsorships.level_guest_max_li[$slct.sponsorship_obj.level_num] == 16 ? 'two tables' : ''}
)</strong> at the 2024 Oceans Award Gala.</p>
)</strong> at the 2024 Oceans Award Gala. The maximum number is based on your currently selected sponsorship level.</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 and update names at a later date.
</p>
<p class="variant-glass-error">Deadline to submit RSVPs is May 15, 2024.</p>
<p class="variant-glass-error max-w-96">Deadline to submit RSVPs is May 15, 2024.</p>
{/if}
</div>
@@ -2076,7 +2070,18 @@ async function handle_update__sponsorship({
</label>
<label for="guest_{index}_family_name" class="label max-w-64">
<!-- Family name -->
<input type="text" class="input text-xs" id="guest_{index}_family_name" name="guest_{index}_family_name" placeholder="Last name" value={guest.family_name ?? ''} autocomplete="name">
<input
type="text"
class="input text-xs variant-glass-warning"
id="guest_{index}_family_name"
name="guest_{index}_family_name"
placeholder="Last name"
value={guest.family_name ?? ''}
autocomplete="off"
required
class:variant-soft-error={!guest.family_name}
>
</label>
<label for="guest_{index}_title" class="label max-w-64">
<!-- Title -->

4
src/routes/sponsorships/10_list__sponsorship_obj.svelte
View File

@@ -10,7 +10,7 @@ import { ae_util } from '$lib/ae_utils';
// import { ae } from 'aether_npm_lib';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
export let container_class_li = [];
export let class_li: string = '';
onMount(() => {
console.log('** Component Mounted: ** List - Sponsorships Obj');
@@ -18,7 +18,7 @@ onMount(() => {
</script>
<section class="svelte_component ae_section ae_list list__sponsorship_obj sponsorship_obj_li {container_class_li.join(' ')} ae_h_scrollfix">
<section class="svelte_component ae_section ae_list list__sponsorship_obj sponsorship_obj_li {class_li} ae_h_scrollfix">
{#if $slct.sponsorship_obj_li}
<table class="table table-compact table-hover">
<thead>