Last minute work for CHOW. Hopefully done soon...

This commit is contained in:
Scott Idem
2024-03-13 10:32:22 -04:00
parent fd4f2bdf35
commit 3c30664b2b
4 changed files with 293 additions and 29 deletions

View File

@@ -200,6 +200,24 @@ async function handle_submit_form(event) {
event_presenter_do['agree'] = !!event_presenter_di.agree;
}
// Marketing for social media and email related questions
if (typeof event_presenter_di.website_url !== 'undefined') {
// This is also stored under social_li_json.
event_presenter_do['website_url'] = event_presenter_di.website_url;
}
if (event_presenter_di.social_media_facebook || event_presenter_di.social_media_twitter || event_presenter_di.social_media_instagram || event_presenter_di.social_media_linkedin) {
event_presenter_do['social_li_json'] = {
facebook: event_presenter_di.social_media_facebook,
twitter: event_presenter_di.social_media_twitter,
instagram: event_presenter_di.social_media_instagram,
linkedin: event_presenter_di.social_media_linkedin,
org: event_presenter_di.website_url,
};
}
if (typeof event_presenter_di.comments !== 'undefined') {
event_presenter_do['comments'] = event_presenter_di.comments;
}
@@ -724,6 +742,21 @@ async function handle_delete_event_presenter_obj({event_presenter_id, hosted_fil
</svelte:fragment>
Headshot
</Tab>
<!-- <Tab
bind:group={$store_current_tab}
name="tab_social"
value={'social'}
disabled={!$slct.event_presenter_obj.event_presenter_id_random}
regionTab={!$ae_loc.administrator_access || !$slct.event_presenter_obj.event_presenter_id_random ? 'text-slate-400' : ''}
>
{#if $slct.event_presenter_obj.social_li_json}
<span class="fas fa-check text-green-500"></span>
{/if}
<svelte:fragment slot="lead">
<span class="fas fa-share-alt"></span>
</svelte:fragment>
Social Media
</Tab> -->
<Tab
bind:group={$store_current_tab}
name="tab_summary"
@@ -1035,6 +1068,63 @@ async function handle_delete_event_presenter_obj({event_presenter_id, hosted_fil
</form>
{:else if $store_current_tab === 'social'}
<form
class="modal-form {$ae_loc.hub.classes__form}"
on:submit|preventDefault={handle_submit_form}
>
<h3 class="h4">Website and Social Media</h3>
<fieldset class="speaker__website_url space-y-4">
<legend class="legend input_required">Website URL:</legend>
<label for="website_url" class="label">
<!-- Website URL -->
<input type="url" id="website_url" name="website_url" class="input text-xs w-96 variant-glass-warning" placeholder="Website URL (https://example.org)" bind:value={$slct.event_presenter_obj.website_url} autocomplete="url" required />
</label>
<p class="text-xs italic variant-glass-tertiary max-w-96">The URLs should begin with "https://" or "http://"</p>
</fieldset>
<!-- Ask for common social media URLs. (Twitter, Facebook, Instagram, etc) -->
<fieldset class="speaker__social_media space-y-4">
<legend class="legend">Social Media:</legend>
<label for="social_media_facebook" class="label">
<!-- Facebook -->
<input type="url" id="social_media_facebook" name="social_media_facebook" class="input text-xs w-96" placeholder="Facebook" value={$slct.event_presenter_obj.social_li_json && $slct.event_presenter_obj.social_li_json.facebook ? $slct.event_presenter_obj.social_li_json.facebook : ''} autocomplete="url" />
</label>
<label for="social_media_instagram" class="label">
<!-- Instagram -->
<input type="url" id="social_media_instagram" name="social_media_instagram" class="input text-xs w-96" placeholder="Instagram" value={$slct.event_presenter_obj.social_li_json && $slct.event_presenter_obj.social_li_json.instagram ? $slct.event_presenter_obj.social_li_json.instagram : ''} autocomplete="url" />
</label>
<label for="social_media_linkedin" class="label">
<!-- LinkedIn -->
<input type="url" id="social_media_linkedin" name="social_media_linkedin" class="input text-xs w-96" placeholder="LinkedIn" value={$slct.event_presenter_obj.social_li_json && $slct.event_presenter_obj.social_li_json.linkedin ? $slct.event_presenter_obj.social_li_json.linkedin : ''} autocomplete="url" />
</label>
<label for="social_media_twitter" class="label">
<!-- X (Twitter) -->
<input type="url" id="social_media_twitter" name="social_media_twitter" class="input text-xs w-96" placeholder="X (Twitter)" value={$slct.event_presenter_obj.social_li_json && $slct.event_presenter_obj.social_li_json.twitter ? $slct.event_presenter_obj.social_li_json.twitter : ''} autocomplete="url" />
</label>
</fieldset>
<button
type="submit"
class="btn variant-glass-primary m-2"
disabled={($ae_sess.mod.sponsorships.disable_submit__sponsorship_obj)}
on:click={() => {
console.log('*** Save marketing button clicked ***');
}}
>
<span class="fas fa-check mx-1"></span>
Save and continue
</button>
</form>
{:else if $store_current_tab === 'summary'}
<section class="summary space-y-4">
@@ -1053,10 +1143,10 @@ async function handle_delete_event_presenter_obj({event_presenter_id, hosted_fil
</button>
<h2 class="h3">Summary</h2>
<div>Name: {$slct.event_presenter_obj.full_name}</div>
<div>Professional title: {$slct.event_presenter_obj.professional_title}</div>
<div>Affiliations: {$slct.event_presenter_obj.affiliations}</div>
<div>Email: {$slct.event_presenter_obj.email}</div>
<div>Name: {$slct.event_presenter_obj.full_name ?? '-- No Name Given --'}</div>
<div>Professional title: {$slct.event_presenter_obj.professional_title ?? '-- No Title Given --'}</div>
<div>Affiliations: {$slct.event_presenter_obj.affiliations ?? '-- No Affiliations Given --'}</div>
<div>Email: {$slct.event_presenter_obj.email ?? '-- No Email Given --'}</div>
<div>Biography:
<pre class="biography pre_wrap">{$slct.event_presenter_obj.biography ?? '-- Not Entered --'}</pre>
</div>

View File

@@ -53,12 +53,19 @@ onMount(() => {
<p>This quick view of a presenter's information is customizable or can be hidden completely.</p>
<div class="event_presenter__content">
<div class="event_presenter__content space-y-4">
<div
class="event_presenter_biography biography"
>
<div class="ae_label event_presenter__biography">Biography:</div>
<pre class="ae_value event_presenter__biography pre_wrap">{@html $slct.event_presenter_obj.biography ? $slct.event_presenter_obj.biography : '-- No Bio Given --'}</pre>
<h2 class="h4">Biography:</h2>
<pre class="event_presenter__biography pre_wrap">{@html $slct.event_presenter_obj.biography ? $slct.event_presenter_obj.biography : '-- No Bio Given --'}</pre>
</div>
<div
class="event_presenter__professional_title"
>
<span class="ae_label">Professional Title:</span>
<span class="ae_value">{@html $slct.event_presenter_obj.professional_title ? $slct.event_presenter_obj.professional_title : '-- No Title Given --'}</span>
</div>
<div
@@ -72,7 +79,8 @@ onMount(() => {
class="event_presenter__email"
>
<span class="ae_label">Email:</span>
<span class="ae_value"><span class="fas fa-envelope"></span> {$slct.event_presenter_obj.email}</span>
<span class="ae_value"><span class="fas fa-envelope"></span>
<a href="mailto:{$slct.event_presenter_obj.email}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.event_presenter_obj.email}</a></span>
</div>
<div
@@ -83,20 +91,20 @@ onMount(() => {
<span class="ae_value"><span class="fas fa-phone"></span> {$slct.event_presenter_obj.phone_mobile} &mdash; {$slct.event_presenter_obj.phone_mobile}</span>
</div>
<div>
<!-- <div>
<span class="ae_label">Approved:</span>
<span class="ae_value">
{$slct.event_presenter_obj.approve ? 'Yes, marked as approved' : 'Not yet marked as approved'}
</span>
</div>
</div> -->
<div class="ae_list event_presenter__guests">
<!-- <div class="ae_list event_presenter__guests">
<h2>More Information</h2>
<div class="ae_warning">More info can go here</div>
</div>
</div> -->
<section class="card-footer ae_section ae_meta event_presenter__meta">

View File

@@ -372,6 +372,7 @@ async function handle_submit_form(event) {
temp_questions['accommodations_text'] = sponsorship_di.accommodations_text;
}
// Marketing for social media and email related questions
if (typeof sponsorship_di.website_url !== 'undefined') {
// This is also stored under social_li_json.

View File

@@ -11,6 +11,7 @@ import type { Writable } from 'svelte/store';
import { ae_util } from '$lib/ae_utils';
import { api } from '$lib/api';
import { ae_loc, ae_sess, ae_api, slct, slct_trigger } from '$lib/ae_stores';
import type { key_val } from '$lib/ae_stores';
// Stores
@@ -23,6 +24,12 @@ export let container_class_li = '';
const modalStore = getModalStore();
let placeholder_li: key_val = {
file_logo_primary: '-- No File Uploaded --',
file_logo_light: '-- No File Uploaded --',
file_logo_dark: '-- No File Uploaded --',
file_media_promo_video: '-- No File Uploaded --',
};
if ($slct.sponsorship_id) {
console.log(`Sponsorship ID selected: ${$slct.sponsorship_id}`);
@@ -35,6 +42,63 @@ onMount(() => {
console.log('** Component Mounted: ** View Modal - Sponsorship Obj');
});
$: if ($slct.sponsorship_obj) {
console.log(`Sponsorship object selected:`, $slct.sponsorship_obj);
// Logo related
if ($slct.sponsorship_obj.logo_li_json) {
if ($slct.sponsorship_obj.logo_li_json.primary && $slct.sponsorship_obj.logo_li_json.primary.hosted_file_id_random) {
placeholder_li.file_logo_primary = ae_util.create_img_element({
account_id: $ae_loc.account_id,
base_url: $ae_api.base_url,
hosted_file_id: $slct.sponsorship_obj.logo_li_json.primary.hosted_file_id_random,
filename: `${$slct.sponsorship_obj.name} [logo_primary].${$slct.sponsorship_obj.logo_li_json.primary.extension}`,
inc_link: true,
})
// `<img src="${$ae_api.base_url}/hosted_file/${$slct.sponsorship_obj.logo_li_json.primary.hosted_file_id_random}/download?x_no_account_id_token=${$ae_loc.account_id}" class="max-w-64">${$slct.sponsorship_obj.logo_li_json.primary.filename}`;
}
if ($slct.sponsorship_obj.logo_li_json.light && $slct.sponsorship_obj.logo_li_json.light.hosted_file_id_random) {
placeholder_li.file_logo_light = ae_util.create_img_element({
account_id: $ae_loc.account_id,
base_url: $ae_api.base_url,
hosted_file_id: $slct.sponsorship_obj.logo_li_json.light.hosted_file_id_random,
filename: `${$slct.sponsorship_obj.name} [logo_light].${$slct.sponsorship_obj.logo_li_json.light.extension}`,
inc_link: true,
})
// `<img src="https://dev-demo.oneskyit.com/hosted_file/download/${$slct.sponsorship_obj.logo_li_json.light.hosted_file_id_random}" class="max-w-64">${$slct.sponsorship_obj.logo_li_json.light.filename}`;
}
if ($slct.sponsorship_obj.logo_li_json.dark && $slct.sponsorship_obj.logo_li_json.dark.hosted_file_id_random) {
placeholder_li.file_logo_dark = ae_util.create_img_element({
account_id: $ae_loc.account_id,
base_url: $ae_api.base_url,
hosted_file_id: $slct.sponsorship_obj.logo_li_json.dark.hosted_file_id_random,
filename: `${$slct.sponsorship_obj.name} [logo_dark].${$slct.sponsorship_obj.logo_li_json.dark.extension}`,
inc_link: true,
})
// `<img src="https://dev-demo.oneskyit.com/hosted_file/download/${$slct.sponsorship_obj.logo_li_json.dark.hosted_file_id_random}" class="max-w-64">${$slct.sponsorship_obj.logo_li_json.dark.filename}`;
}
}
// Other media files related
if ($slct.sponsorship_obj.media_li_json) {
if ($slct.sponsorship_obj.media_li_json.promo_video && $slct.sponsorship_obj.media_li_json.promo_video.hosted_file_id_random) {
placeholder_li.file_media_promo_video = ae_util.create_video_element({
account_id: $ae_loc.account_id,
base_url: $ae_api.base_url,
hosted_file_id: $slct.sponsorship_obj.media_li_json.promo_video.hosted_file_id_random,
filename: `${$slct.sponsorship_obj.name} [promo_video].${$slct.sponsorship_obj.media_li_json.promo_video.extension}`,
inc_link: true,
})
// `<video src="https://dev-demo.oneskyit.com/hosted_file/download/${$slct.sponsorship_obj.media_li_json.promo_video.hosted_file_id_random}" controls class="max-w-64"></video>${$slct.sponsorship_obj.media_li_json.promo_video.filename}`;
}
}
}
</script>
<!-- @component This is the Sponsorships modal view form. -->
@@ -53,31 +117,38 @@ onMount(() => {
<p>This quick view of a sponsorship's information is customizable or can be hidden completely.</p>
<div class="sponsorship__content">
<div class="sponsorship__content space-y-4">
<div class="sponsorship__poc">
<span class="ae_label">Point of Contact:</span>
<h2 class="h4">Point of Contact</h2>
<!-- <span class="ae_label">Point of Contact:</span> -->
<span class="ae_value">{@html $slct.sponsorship_obj.poc_json.full_name}</span>
<span class="ae_label">| Email:</span>
<span class="ae_value"><span class="fas fa-envelope"></span> {$slct.sponsorship_obj.poc_json.email}</span>
<span class="ae_label">| Mobile:</span>
<span class="ae_value"><span class="fas fa-mobile-alt"></span> {$slct.sponsorship_obj.poc_json.phone_mobile ?? '-- Not Given --'}</span>
<div
<span class="ae_label">| Email:</span>
<span class="ae_value"><span class="fas fa-envelope"></span>
<a href="mailto:{$slct.sponsorship_obj.poc_json.email}?Subject={$slct.sponsorship_obj.full_name}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.poc_json.email}</a></span>
<span class="ae_label">| Mobile:</span>
<span class="ae_value"><span class="fas fa-mobile-alt"></span>
<a href="tel:{$slct.sponsorship_obj.poc_json.phone_mobile}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.poc_json.phone_mobile ?? '-- Not Given --'}</span>
</div>
<!-- <div
class="sponsorship_description description"
>
<div class="ae_label sponsorship__description">Description:</div>
<pre class="ae_value sponsorship__description pre_wrap">{@html $slct.sponsorship_obj.description ? $slct.sponsorship_obj.description : '-- No Description Given --'}</pre>
</div>
</div> -->
<div
class:ae_d_none={!$slct.sponsorship_obj.level_num}
class="sponsorship_level"
>
<span class="ae_label">Level of Sponsorship:</span>
<span class="ae_value"><span class="fas fa-gem"></span> {$slct.sponsorship_obj.level_num} &mdash; {$slct.sponsorship_obj.level_str}</span>
<h2 class="h4">Level of Sponsorship</h2>
<!-- <span class="ae_label">Level of Sponsorship:</span> -->
<span class=""><span class="fas fa-gem"></span> {$slct.sponsorship_obj.level_str} ({$slct.sponsorship_obj.level_num})</span>
</div>
<div
<!-- <div
class:hidden={!$slct.sponsorship_obj.amount}
class="sponsorship_amount"
>
@@ -85,18 +156,111 @@ onMount(() => {
<span class="ae_value">
${$slct.sponsorship_obj.amount/100}
</span>
</div>
</div> -->
<div>
<!-- <div>
<span class="ae_label">Paid:</span>
$
<span class="ae_value">
{$slct.sponsorship_obj.paid ? 'Yes, marked as paid' : 'Not yet marked as paid'}
</span>
</div> -->
<div
class="mailing_address">
<h2 class="h4">Mailing Address</h2>
<div>
{#if $slct.sponsorship_obj.address_li_json.mailing}
{#if $slct.sponsorship_obj.address_li_json.mailing.line_1}{$slct.sponsorship_obj.address_li_json.mailing.line_1}<br>{/if}
{#if $slct.sponsorship_obj.address_li_json.mailing.line_2}{$slct.sponsorship_obj.address_li_json.mailing.line_2}<br>{/if}
{#if $slct.sponsorship_obj.address_li_json.mailing.city}{$slct.sponsorship_obj.address_li_json.mailing.city}{/if}
{#if $slct.sponsorship_obj.address_li_json.mailing.state_province}, {$slct.sponsorship_obj.address_li_json.mailing.state_province}{/if}
{#if $slct.sponsorship_obj.address_li_json.mailing.postal_code} {$slct.sponsorship_obj.address_li_json.mailing.postal_code}{/if}
{#if $slct.sponsorship_obj.address_li_json.mailing.country} {$slct.sponsorship_obj.address_li_json.mailing.country}{/if}
<!-- {#if $slct.sponsorship_obj.address_li_json.mailing.other_text}, {$slct.sponsorship_obj.address_li_json.mailing.other_text}{/if} -->
{/if}
</div>
</div>
<div
class="accommodations">
<h2 class="h4">Accommodations</h2>
{#if $slct.sponsorship_obj.questions_li_json && $slct.sponsorship_obj.questions_li_json.accommodations_text}
<div class="">
{$slct.sponsorship_obj.questions_li_json.accommodations_text}
</div>
{/if}
</div>
<div
class="marketing">
<h2 class="h4">Marketing</h2>
{#if $slct.sponsorship_obj.website_url}
<div class="">
<span class="fas fa-globe"></span> Organization website: <a href="{$slct.sponsorship_obj.website_url}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.website_url}</a>
</div>
{/if}
{#if $slct.sponsorship_obj.social_li_json}
{#if $slct.sponsorship_obj.social_li_json.facebook}
<div class="">
<span class="fab fa-facebook"></span> Facebook: <a href="{$slct.sponsorship_obj.social_li_json.facebook}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.social_li_json.facebook}</a>
</div>
{/if}
{#if $slct.sponsorship_obj.social_li_json.instagram}
<div class="">
<span class="fab fa-instagram"></span> Instagram:<a href="{$slct.sponsorship_obj.social_li_json.instagram}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.social_li_json.instagram}</a>
</div>
{/if}
{#if $slct.sponsorship_obj.social_li_json.linkedin}
<div class="">
<span class="fab fa-linkedin"></span> LinkedIn: <a href="{$slct.sponsorship_obj.social_li_json.linkedin}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.social_li_json.linkedin}</a>
</div>
{/if}
{#if $slct.sponsorship_obj.social_li_json.twitter}
<div class="">
<span class="fab fa-twitter"></span> Twitter: <a href="{$slct.sponsorship_obj.social_li_json.twitter}" class="font-medium text-blue-600 dark:text-blue-500 hover:underline">{$slct.sponsorship_obj.social_li_json.twitter}</a>
</div>
{/if}
{/if}
</div>
<div
class="file_uploads">
<h2 class="h4">File Uploads</h2>
{#if placeholder_li.file_logo_primary}
<div class="">
<span class="fas fa-image"></span> Logo (Primary): {@html placeholder_li.file_logo_primary}
</div>
{/if}
{#if placeholder_li.file_logo_light}
<div class="">
<span class="fas fa-image"></span> Logo (Light): {@html placeholder_li.file_logo_light}
</div>
{/if}
{#if placeholder_li.file_logo_dark}
<div class="">
<span class="fas fa-image"></span> Logo (Dark): {@html placeholder_li.file_logo_dark}
</div>
{/if}
{#if placeholder_li.file_media_promo_video}
<div class="">
<span class="fas fa-video"></span> Promo Video: {@html placeholder_li.file_media_promo_video}
</div>
{/if}
</div>
<div class="ae_list sponsorship__guests">
<h2>Guest List</h2>
<h2 class="h4">Guest List</h2>
{#if $slct.sponsorship_obj.guest_li_json && $slct.sponsorship_obj.guest_li_json.length && $slct.sponsorship_obj.guest_li_json[0].full_name}
<ul>
@@ -105,7 +269,8 @@ onMount(() => {
class:ae_d_none={!$slct.sponsorship_obj.guest_li_json[index].full_name}
>
<span class="ae_label">
<span class="fas fa-user"></span> Contact:
<span class="fas fa-user"></span>
<!-- Contact: -->
</span>
{$slct.sponsorship_obj.guest_li_json[index].full_name}
{#if $slct.sponsorship_obj.guest_li_json[index].email}
@@ -128,7 +293,7 @@ onMount(() => {
{/each}
</ul>
{:else}
<div class="ae_warning">No guest list found!</div>
<div class="ae_warning">No guest have been added</div>
{/if}
</div>
@@ -161,7 +326,7 @@ onMount(() => {
<footer class="{parent.regionFooter}">
{#if $ae_loc.trusted_access}
{#if $ae_loc.administrator_access}
<div class="ae_options mx-1">
<button
class="btn variant-glass-warning mx-1"