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

Changing the datetime formatter a bit.

Browse Source
This commit is contained in:
Scott Idem
2024-09-16 12:20:28 -04:00
parent 2a3e386f6f
commit 3a6c462155
12 changed files with 68 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/lib/ae_events_stores.ts
View File

@@ -117,7 +117,9 @@ let events_local_data_struct: key_val = {
show_content__presentation_code: true, show_content__presentation_code: true,
show_content__presenter_code: true, show_content__presenter_code: true,
time_format: 'time_us_short', // 'time_short', 'time_us_short' datetime_format: 'datetime_12_long',
time_format: 'time_12_short',
time_hours: 12, // 12 or 24
slct: { slct: {
event_id: null, event_id: null,
@@ -179,6 +181,10 @@ let events_local_data_struct: key_val = {
// Presentation Management (Distributing) // Presentation Management (Distributing)
'pres_mgmt': { 'pres_mgmt': {
datetime_format: 'datetime_12_long',
time_format: 'time_12_short',
time_hours: 12, // 12 or 24
qry_enabled: 'enabled', // all, disabled, enabled qry_enabled: 'enabled', // all, disabled, enabled
qry_hidden: 'not_hidden', // all, hidden, not_hidden qry_hidden: 'not_hidden', // all, hidden, not_hidden
qry_limit__files: 75, qry_limit__files: 75,
@@ -232,7 +238,7 @@ let events_local_data_struct: key_val = {
show_report__presenters_agree: false, show_report__presenters_agree: false,
show_report__recent_files: false, show_report__recent_files: false,
// time_format: 'time_us_short', // 'time_short', 'time_us_short' // time_format: 'time_12_short', // 'time_short', 'time_12_short'
disable_submit__opt_out: true, disable_submit__opt_out: true,
submit_status__opt_out: null, submit_status__opt_out: null,

18
src/lib/ae_utils__datetime_format.ts
View File

@@ -3,6 +3,7 @@ import dayjs from 'dayjs';
export let iso_datetime_formatter = function iso_datetime_formatter( export let iso_datetime_formatter = function iso_datetime_formatter(
raw_datetime: null|string|Date = null, raw_datetime: null|string|Date = null,
named_format: string = 'datetime_iso_no_seconds', // date_iso, datetime_iso_no_seconds named_format: string = 'datetime_iso_no_seconds', // date_iso, datetime_iso_no_seconds
time_24_hours: boolean = false
) { ) {
// console.log('*** iso_datetime_formatter() ***'); // console.log('*** iso_datetime_formatter() ***');
@@ -22,7 +23,7 @@ export let iso_datetime_formatter = function iso_datetime_formatter(
// datetime_iso_12_short 'YY-MM-DD hh:mm A' // datetime_iso_12_short 'YY-MM-DD hh:mm A'
// datetime_iso_tz 'YYYY-MM-DD HH:mm:ss' // datetime_iso_tz 'YYYY-MM-DD HH:mm:ss'
// datetime_us_no_seconds 'YYYY-MM-DD hh:mm A' // datetime_12_no_seconds 'YYYY-MM-DD hh:mm A'
// datetime_long 'dddd, MMMM D, YYYY hh:mm:ss A' // datetime_long 'dddd, MMMM D, YYYY hh:mm:ss A'
// datetime_medium 'ddd, MMM D, YYYY hh:mm:ss A' // datetime_medium 'ddd, MMM D, YYYY hh:mm:ss A'
@@ -62,16 +63,25 @@ export let iso_datetime_formatter = function iso_datetime_formatter(
case 'datetime_iso_12_short_month': case 'datetime_iso_12_short_month':
datetime_string = dayjs(raw_datetime).format('MM-DD hh:mm A'); datetime_string = dayjs(raw_datetime).format('MM-DD hh:mm A');
break; break;
case 'datetime_us_no_seconds': case 'datetime_12_no_seconds':
datetime_string = dayjs(raw_datetime).format('YYYY-MM-DD hh:mm A'); datetime_string = dayjs(raw_datetime).format('YYYY-MM-DD hh:mm A');
break; break;
case 'datetime_short': case 'datetime_short':
datetime_string = dayjs(raw_datetime).format('MMM D, YY HH:mm');
break;
case 'datetime_12_short':
datetime_string = dayjs(raw_datetime).format('MMM D, YY hh:mm A'); datetime_string = dayjs(raw_datetime).format('MMM D, YY hh:mm A');
break; break;
case 'datetime_medium': case 'datetime_medium':
datetime_string = dayjs(raw_datetime).format('MMM D, YYYY H:mm');
break;
case 'datetime_12_medium':
datetime_string = dayjs(raw_datetime).format('MMM D, YYYY h:mm A'); datetime_string = dayjs(raw_datetime).format('MMM D, YYYY h:mm A');
break; break;
case 'datetime_long': case 'datetime_long':
datetime_string = dayjs(raw_datetime).format('MMMM D, YYYY HH:mm');
break;
case 'datetime_12_long':
datetime_string = dayjs(raw_datetime).format('MMMM D, YYYY hh:mm A'); datetime_string = dayjs(raw_datetime).format('MMMM D, YYYY hh:mm A');
break; break;
case 'datetime_short_month': case 'datetime_short_month':
@@ -116,10 +126,10 @@ export let iso_datetime_formatter = function iso_datetime_formatter(
case 'time_short_no_leading': case 'time_short_no_leading':
datetime_string = dayjs(raw_datetime).format('H:mm'); datetime_string = dayjs(raw_datetime).format('H:mm');
break; break;
case 'time_us_short': case 'time_12_short':
datetime_string = dayjs(raw_datetime).format('hh:mm A'); datetime_string = dayjs(raw_datetime).format('hh:mm A');
break; break;
case 'time_us_short_no_leading': case 'time_12_short_no_leading':
datetime_string = dayjs(raw_datetime).format('h:mm A'); datetime_string = dayjs(raw_datetime).format('h:mm A');
break; break;
case 'week_long': case 'week_long':

4
src/lib/element_manage_event_file_li.svelte
View File

@@ -540,14 +540,14 @@ onMount(() => {
</strong> </strong>
{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'date_iso')} {ae_util.iso_datetime_formatter(event_file_obj.created_on, 'date_iso')}
at at
<strong>{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'time_us_short_no_leading')}</strong> <strong>{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'time_12_short_no_leading')}</strong>
<!-- {event_file_obj.updated_on} --> <!-- {event_file_obj.updated_on} -->
{:else} {:else}
<!-- <span class="fas fa-calendar-day mx-1"></span> --> <!-- <span class="fas fa-calendar-day mx-1"></span> -->
<strong> <strong>
{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'date_short')} {ae_util.iso_datetime_formatter(event_file_obj.created_on, 'date_short')}
<!-- at --> <!-- at -->
<strong>{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'time_us_short_no_leading')}</strong> <strong>{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'time_12_short_no_leading')}</strong>
</strong> </strong>
{/if} {/if}
</span> </span>

4
src/routes/core/ae_comp__person_obj_tbl.svelte
View File

@@ -122,9 +122,9 @@ let lq_kv__person_obj_li = liveQuery(
{/if} {/if}
<td class="px-4 py-2"> <td class="px-4 py-2">
{ae_util.iso_datetime_formatter(person_obj?.created_on, 'datetime_us_no_seconds')} {ae_util.iso_datetime_formatter(person_obj?.created_on, 'datetime_12_no_seconds')}
<br> <br>
{ae_util.iso_datetime_formatter(person_obj?.updated_on, 'datetime_us_no_seconds')} {ae_util.iso_datetime_formatter(person_obj?.updated_on, 'datetime_12_no_seconds')}
</td> </td>
</tr> </tr>
{/each} {/each}

2
src/routes/events_leads/exhibit/[slug]/leads_manage.svelte
View File

@@ -82,7 +82,7 @@ $: if ($events_slct.exhibit_id) {
</div> </div>
<div class="flex flex-row items-center space-x-2"> <div class="flex flex-row items-center space-x-2">
<span class="ae_label">Started:</span> <span class="ae_label">Started:</span>
<span class="ae_value">{ae_util.iso_datetime_formatter($events_loc.leads.auth_exhibit_kv[$events_slct.exhibit_id].updated_on, 'datetime_long')}</span> <span class="ae_value">{ae_util.iso_datetime_formatter($events_loc.leads.auth_exhibit_kv[$events_slct.exhibit_id].updated_on, 'datetime_12_long')}</span>
</div> </div>
</div> </div>

25
src/routes/events_pres_mgmt/(launcher)/launcher/[slug]/launcher_session_view.svelte
View File

@@ -145,23 +145,24 @@ ae_promises[$events_loc.launcher.slct.event_session_id] = events_func.load_ae_ob
class="event_session_datetimes" class="event_session_datetimes"
> >
<button <button
type="button"
on:click={() => { on:click={() => {
if ($events_loc.launcher.time_format == 'time_us_short') { if ($events_loc.launcher.time_format == 'time_12_short') {
$events_loc.launcher.time_format = 'time_short'; $events_loc.launcher.time_format = 'time_short';
} else { } else {
$events_loc.launcher.time_format = 'time_us_short'; $events_loc.launcher.time_format = 'time_12_short';
} }
}} }}
> >
<strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'week_long')}</strong> <strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'week_long')}</strong>
<span class="font-normal"> <span class="font-normal">
{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'date_long_month_day')} {ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'date_long_month_day')}
</span> </span>
<strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, $events_loc.launcher.time_format)}</strong> <strong>{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, $events_loc.launcher.time_format)}</strong>
<span class="font-normal"> <span class="font-normal">
&ndash; &ndash;
{ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, $events_loc.launcher.time_format)} {ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, $events_loc.launcher.time_format)}
</span> </span>
</button> </button>
</h3> </h3>
<h2 class="text-xl"> <h2 class="text-xl">
@@ -314,7 +315,7 @@ ae_promises[$events_loc.launcher.slct.event_session_id] = events_func.load_ae_ob
<div class="event_presentation_datetime_name flex flex-row justify-evenly gap-4"> <div class="event_presentation_datetime_name flex flex-row justify-evenly gap-4">
<!-- <div class="event_presentation_datetime_name"> --> <!-- <div class="event_presentation_datetime_name"> -->
{#if event_presentation_obj?.start_datetime} {#if event_presentation_obj?.start_datetime}
<span class="event_presentation_datetime"><strong>{ae_util.iso_datetime_formatter(event_presentation_obj?.start_datetime, 'time_us_short_no_leading')}</strong></span> <span class="event_presentation_datetime"><strong>{ae_util.iso_datetime_formatter(event_presentation_obj?.start_datetime, 'time_12_short_no_leading')}</strong></span>
{/if} {/if}
<span class="event_presentation_name grow">{event_presentation_obj?.name}</span> <span class="event_presentation_name grow">{event_presentation_obj?.name}</span>

6
src/routes/events_pres_mgmt/ae_comp__event_file_obj_tbl.svelte
View File

@@ -186,7 +186,7 @@ let lq_kv__event_file_obj_li = liveQuery(
</span> </span>
</div> </div>
<span> <span>
{ae_util.iso_datetime_formatter(event_file_obj?.created_on, 'time_us_short')} {ae_util.iso_datetime_formatter(event_file_obj?.created_on, 'time_12_short')}
</span> </span>
</td> </td>
{#if show_location_fields} {#if show_location_fields}
@@ -210,7 +210,7 @@ let lq_kv__event_file_obj_li = liveQuery(
{event_file_obj?.event_session_name} {event_file_obj?.event_session_name}
</a> </a>
</td> </td>
<td class="px-4 py-2">{ae_util.iso_datetime_formatter(event_file_obj?.event_session_start_datetime, 'datetime_us_no_seconds')}</td> <td class="px-4 py-2">{ae_util.iso_datetime_formatter(event_file_obj?.event_session_start_datetime, 'datetime_12_no_seconds')}</td>
{/if} {/if}
{#if show_presentation_fields} {#if show_presentation_fields}
<td class="px-4 py-2 lg:text-xs"> <td class="px-4 py-2 lg:text-xs">
@@ -222,7 +222,7 @@ let lq_kv__event_file_obj_li = liveQuery(
</td> </td>
<td class="px-4 py-2"> <td class="px-4 py-2">
{#if event_file_obj?.event_presentation_id_random} {#if event_file_obj?.event_presentation_id_random}
{ae_util.iso_datetime_formatter(event_file_obj?.event_presentation_start_datetime, 'time_us_short')} {ae_util.iso_datetime_formatter(event_file_obj?.event_presentation_start_datetime, 'time_12_short')}
{:else} {:else}
{@html ae_snip.html__not_set} {@html ae_snip.html__not_set}
{/if} {/if}

6
src/routes/events_pres_mgmt/ae_comp__event_presenter_obj_tbl.svelte
View File

@@ -116,15 +116,15 @@ let lq_kv__event_presenter_obj_li = liveQuery(
{event_presenter_obj?.event_session_name} {event_presenter_obj?.event_session_name}
</a> </a>
</td> </td>
<td class="px-4 py-2 text-sm">{ae_util.iso_datetime_formatter(event_presenter_obj?.event_session_start_datetime, 'datetime_us_no_seconds')}</td> <td class="px-4 py-2 text-sm">{ae_util.iso_datetime_formatter(event_presenter_obj?.event_session_start_datetime, 'datetime_12_no_seconds')}</td>
{/if} {/if}
{#if show_presentation_fields} {#if show_presentation_fields}
<td class="px-4 py-2 lg:text-xs">{event_presenter_obj?.event_presentation_name}</td> <td class="px-4 py-2 lg:text-xs">{event_presenter_obj?.event_presentation_name}</td>
<td class="px-4 py-2 lg:text-xs">{ae_util.iso_datetime_formatter(event_presenter_obj?.event_presentation_start_datetime, 'time_us_short')}</td> <td class="px-4 py-2 lg:text-xs">{ae_util.iso_datetime_formatter(event_presenter_obj?.event_presentation_start_datetime, 'time_12_short')}</td>
{/if} {/if}
<td class="px-4 py-2 text-sm">{ae_util.iso_datetime_formatter(event_presenter_obj?.updated_on, 'datetime_us_no_seconds')}</td> <td class="px-4 py-2 text-sm">{ae_util.iso_datetime_formatter(event_presenter_obj?.updated_on, 'datetime_12_no_seconds')}</td>
</tr> </tr>
{/each} {/each}

4
src/routes/events_pres_mgmt/ae_comp__event_session_obj_li.svelte
View File

@@ -215,13 +215,13 @@ let lq_kv__event_session_obj_li = liveQuery(
<span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36"> <span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36">
{#if session_obj?.start_datetime} {#if session_obj?.start_datetime}
<span style="break-inside: avoid;"> <span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_us_short')} {ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_12_short')}
</span> </span>
<span class="grow"> <span class="grow">
&ndash; &ndash;
</span> </span>
<span style="break-inside: avoid;"> <span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_us_short')} {ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_12_short')}
</span> </span>
{:else} {:else}
{@html ae_snip.html__not_set} {@html ae_snip.html__not_set}

4
src/routes/events_pres_mgmt/ae_comp__event_session_obj_li_v2.svelte
View File

@@ -209,13 +209,13 @@ if (browser) {
<span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36"> <span class="flex flex-col items-center md:flex-row md:items-start md:text-center max-w-36">
{#if session_obj?.start_datetime} {#if session_obj?.start_datetime}
<span style="break-inside: avoid;"> <span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_us_short')} {ae_util.iso_datetime_formatter(session_obj?.start_datetime,'time_12_short')}
</span> </span>
<span class="grow"> <span class="grow">
&ndash; &ndash;
</span> </span>
<span style="break-inside: avoid;"> <span style="break-inside: avoid;">
{ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_us_short')} {ae_util.iso_datetime_formatter(session_obj?.end_datetime,'time_12_short')}
</span> </span>
{:else} {:else}
{@html ae_snip.html__not_set} {@html ae_snip.html__not_set}

2
src/routes/events_pres_mgmt/ae_comp__event_session_obj_tbl.svelte
View File

@@ -87,7 +87,7 @@ let lq_kv__event_session_obj_li = liveQuery(
</a> </a>
</td> </td>
<td class="px-4 py-2"> <td class="px-4 py-2">
{ae_util.iso_datetime_formatter(event_session_obj?.start_datetime, 'datetime_us_no_seconds')} {ae_util.iso_datetime_formatter(event_session_obj?.start_datetime, 'datetime_12_no_seconds')}
</td> </td>
<td class="px-4 py-2"> <td class="px-4 py-2">
{event_session_obj?.event_location_name} {event_session_obj?.event_location_name}

19
src/routes/events_pres_mgmt/session_view.svelte
View File

@@ -252,7 +252,22 @@ $: if ($lq__event_session_obj) {
}} }}
> >
{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'dddd')}, {ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'dddd')},
{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, 'datetime_long')} <button
type="button"
on:click={() => {
if ($events_loc.launcher.time_hours == 12) {
$events_loc.launcher.time_hours = 24;
$events_loc.launcher.datetime_format = 'datetime_long';
$events_loc.launcher.time_format = 'time_short';
} else {
$events_loc.launcher.time_hours = 12;
$events_loc.launcher.datetime_format = 'datetime_12_long';
$events_loc.launcher.time_format = 'time_12_short';
}
}}
>
{ae_util.iso_datetime_formatter($lq__event_session_obj.start_datetime, $events_loc.launcher.datetime_format)}
</button>
</Element_ae_crud> </Element_ae_crud>
- -
<Element_ae_crud <Element_ae_crud
@@ -279,7 +294,7 @@ $: if ($lq__event_session_obj) {
// $events_trig_kv['event_session_id'] = $lq__event_session_obj?.event_session_id_random; // $events_trig_kv['event_session_id'] = $lq__event_session_obj?.event_session_id_random;
}} }}
> >
{ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, 'time_us_short')} {ae_util.iso_datetime_formatter($lq__event_session_obj.end_datetime, $events_loc.launcher.time_format)}
</Element_ae_crud> </Element_ae_crud>
</li> </li>
<li> <li>