95508458f6
- event_page_menu: set events__session_search=false — the Session Search nav link was redundantly appearing on the Session Search page itself - element_manage_event_file_li: replace hardcoded gray hover colors with theme-aware surface tokens (hover:bg-surface-100-900, border-surface-200-800) and add transition-colors; fixes light-on-light in dark mode for the file list table rows and Event File Purpose select element - font size cycler (default → larger → smaller → default): - ae_stores: add font_size_mode: 'default' to ae_loc defaults - app.css: html.font-size-larger (112.5%) and html.font-size-smaller (87.5%) - +layout.svelte: DOM effect applies/removes font-size-* class on <html> - e_app_sys_menu: compact A / A+ / A− button cycles the mode
761 lines
44 KiB
Svelte
761 lines
44 KiB
Svelte
<script lang="ts">
|
|
import { onMount } from 'svelte';
|
|
// import { liveQuery } from "dexie";
|
|
import MyClipboard from '$lib/app_components/e_app_clipboard.svelte';
|
|
|
|
import type { key_val } from '$lib/stores/ae_stores';
|
|
import { ae_util } from '$lib/ae_utils/ae_utils';
|
|
import { api } from '$lib/api/api';
|
|
|
|
// import { core_func } from '$lib/ae_core_functions';
|
|
import {
|
|
ae_loc,
|
|
ae_sess,
|
|
ae_api,
|
|
ae_trig,
|
|
slct,
|
|
slct_trigger
|
|
} from '$lib/stores/ae_stores';
|
|
import { db_events } from '$lib/ae_events/db_events';
|
|
import {
|
|
events_loc,
|
|
events_sess,
|
|
events_slct,
|
|
events_trigger
|
|
} from '$lib/stores/ae_events_stores';
|
|
import { events_func } from '$lib/ae_events_functions';
|
|
import AE_Comp_Hosted_Files_Download_Button from '$lib/ae_core/ae_comp__hosted_files_download_button.svelte';
|
|
|
|
interface Props {
|
|
log_lvl?: number;
|
|
container_class_li?: string | Array<string>;
|
|
lq__event_file_obj_li: any;
|
|
link_to_type: string;
|
|
link_to_id: string;
|
|
allow_basic?: boolean;
|
|
allow_moderator?: boolean;
|
|
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
|
|
}
|
|
|
|
let {
|
|
log_lvl = 0,
|
|
container_class_li = [],
|
|
lq__event_file_obj_li,
|
|
link_to_type,
|
|
link_to_id,
|
|
allow_basic = false,
|
|
allow_moderator = false,
|
|
display_mode = 'default'
|
|
}: Props = $props();
|
|
|
|
// export let show_convert_btn: null|boolean = null;
|
|
|
|
// let ae_placeholder_li: key_val = {};
|
|
let ae_promises: key_val = $state({});
|
|
let ae_tmp: key_val = $state({});
|
|
ae_tmp.show__file_li = true;
|
|
ae_tmp.show__direct_download = $events_loc.pres_mgmt.show__direct_download;
|
|
// let ae_triggers: key_val = {};
|
|
|
|
onMount(() => {
|
|
if (log_lvl) {
|
|
console.log(
|
|
`Element - Manage Event File List: link_to_type: ${link_to_type}; link_to_id: ${link_to_id}`
|
|
);
|
|
console.log(
|
|
`allow_basic: ${allow_basic}; allow_moderator: ${allow_moderator}`
|
|
);
|
|
}
|
|
});
|
|
|
|
let clipboard_success = $state(false);
|
|
</script>
|
|
|
|
<div class="float-right flex flex-row items-center">
|
|
<button
|
|
type="button"
|
|
onclick={() => {
|
|
console.log('*** Refresh button clicked ***');
|
|
|
|
db_events.file.clear();
|
|
|
|
// let params = {
|
|
// qry__enabled: 'all',
|
|
// qry__hidden: 'all',
|
|
// }
|
|
|
|
events_func.load_ae_obj_li__event_file({
|
|
api_cfg: $ae_api,
|
|
for_obj_type: link_to_type,
|
|
for_obj_id: link_to_id,
|
|
enabled: 'all',
|
|
hidden: 'all',
|
|
// params: params,
|
|
try_cache: true
|
|
});
|
|
|
|
// ae_tmp.show__file_li = false;
|
|
// console.log(`$lq__event_file_obj_li:`, $lq__event_file_obj_li);
|
|
// $slct_trigger = 'load__event_file_obj_li';
|
|
// ae_tmp.show__file_li = true;
|
|
}}
|
|
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
|
class:hidden={!$ae_loc.edit_mode || !$ae_loc.authenticated_access}
|
|
title="Refresh the list of files"
|
|
>
|
|
<span class="fas fa-sync-alt m-1"></span>
|
|
<div class="hidden">Files</div>
|
|
</button>
|
|
|
|
<button
|
|
type="button"
|
|
onclick={() => {
|
|
console.log('*** Show Alt Download button clicked ***');
|
|
ae_tmp.show__direct_download = !ae_tmp.show__direct_download;
|
|
}}
|
|
class="btn btn-sm p-1 m-1 preset-tonal-tertiary hover:preset-tonal-warning border border-warning-500 transition hover:transition-all *:hover:inline"
|
|
class:hidden={!$ae_loc.edit_mode || !$ae_loc.trusted_access}
|
|
title="Toggle direct download link and copy link button"
|
|
>
|
|
<span class="fas fa-download m-1"></span>
|
|
<div class="hidden">
|
|
{ae_tmp.show__direct_download ? 'Alt On' : 'Alt Download Off'}
|
|
</div>
|
|
</button>
|
|
</div>
|
|
|
|
<section
|
|
class="svelte_component event_file_uploaded_manage {container_class_li}"
|
|
class:text-sm={display_mode != 'default'}
|
|
>
|
|
<h3
|
|
class="h6"
|
|
class:hidden={!$lq__event_file_obj_li?.length ||
|
|
display_mode != 'default'}
|
|
>
|
|
Manage Files:
|
|
<span
|
|
class="font-bold bg-success-100 px-4 border rounded-lg border-success-200"
|
|
title="Files for {link_to_type ?? '-- not set --'}: {link_to_id ??
|
|
'-- not set --'} (files: {$lq__event_file_obj_li?.length ??
|
|
'None'})"
|
|
>
|
|
<span class="fas fa-folder-open mx-1"></span>
|
|
{@html $lq__event_file_obj_li
|
|
? `${$lq__event_file_obj_li.length}×`
|
|
: '-- none --'}
|
|
</span>
|
|
</h3>
|
|
|
|
{#if $lq__event_file_obj_li && $lq__event_file_obj_li.length}
|
|
<div class="overflow-auto w-full">
|
|
<table class="table-auto w-full">
|
|
{#if display_mode === 'default'}
|
|
<thead>
|
|
<tr>
|
|
<th class="text-center">Download File</th>
|
|
{#if display_mode === 'default'}
|
|
<th
|
|
class="text-center"
|
|
class:hidden={!allow_basic &&
|
|
!$ae_loc.trusted_access}>Options</th
|
|
>
|
|
{/if}
|
|
{#if display_mode === 'default'}
|
|
<th
|
|
class="text-center"
|
|
class:hidden={!allow_basic &&
|
|
!$ae_loc.trusted_access}>Status</th
|
|
>
|
|
{/if}
|
|
<th class="text-center">Meta</th>
|
|
</tr>
|
|
</thead>
|
|
{/if}
|
|
|
|
<tbody>
|
|
{#each $lq__event_file_obj_li as event_file_obj (event_file_obj.event_file_id)}
|
|
<tr
|
|
class="ae_obj obj_event_file border-t border-b border-surface-200-800 hover:bg-surface-100-900 hover:border-surface-300-700 transition-colors duration-200"
|
|
class:dim={event_file_obj?.hide}
|
|
>
|
|
<td class="event_file__file align-middle">
|
|
{#if $events_sess.pres_mgmt?.show_field_edit__filename != event_file_obj.event_file_id}
|
|
<div class="flex flex-col gap-2">
|
|
<AE_Comp_Hosted_Files_Download_Button
|
|
hosted_file_id={event_file_obj?.hosted_file_id}
|
|
hosted_file_obj={event_file_obj}
|
|
show_divider={true}
|
|
show_direct_download={ae_tmp.show__direct_download}
|
|
max_filename={30}
|
|
classes="btn btn-sm lg:btn-md preset-tonal-primary hover:preset-filled-primary-500 min-w-72 lg:min-w-96"
|
|
/>
|
|
|
|
{#if ae_tmp.show__direct_download}
|
|
<div
|
|
class="px-4 py-2 flex flex-col gap-0.5 bg-surface-100/50 rounded-lg border border-surface-500/10"
|
|
>
|
|
<div
|
|
class="flex flex-row items-center gap-2"
|
|
>
|
|
<span
|
|
class="text-[10px] font-bold uppercase opacity-50 w-24"
|
|
>
|
|
Access Link:
|
|
</span>
|
|
<MyClipboard
|
|
value={encodeURI(
|
|
`${$ae_api.base_url}/v3/action/event_file/${event_file_obj?.event_file_id}/download?filename=${ae_util.clean_filename(event_file_obj?.filename)}&key=${$ae_api.account_id}`
|
|
)}
|
|
btn_text="Copy Original"
|
|
btn_title="Copy the direct download link to the clipboard."
|
|
btn_class="btn btn-xs preset-tonal-warning hover:preset-filled-warning-500"
|
|
></MyClipboard>
|
|
|
|
<MyClipboard
|
|
value={encodeURI(
|
|
`${$ae_api.base_url}/v3/action/event_file/${event_file_obj?.event_file_id}/download?filename=${event_file_obj?.event_session_code}-${ae_util.clean_filename(event_file_obj?.event_session_name).substring(0, 20)}-${ae_util.clean_filename(event_file_obj?.event_presenter_full_name)}.${event_file_obj?.extension}&key=${$ae_api.account_id}`
|
|
)}
|
|
btn_text="Copy Renamed"
|
|
btn_title="Copy the renamed download link to the clipboard."
|
|
btn_class="btn btn-xs preset-tonal-warning hover:preset-filled-warning-500"
|
|
></MyClipboard>
|
|
</div>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
{:else}
|
|
<!-- Show change filename input field here -->
|
|
<span class="flex flex-col gap-1 text-sm">
|
|
<input
|
|
type="text"
|
|
size="12"
|
|
placeholder="Filename"
|
|
bind:value={
|
|
$events_sess.pres_mgmt
|
|
.tmp_val__filename_no_ext
|
|
}
|
|
data-original_value={event_file_obj.filename}
|
|
class="input min-w-72 lg:min-w-96 text-sm bg-warning-100"
|
|
title="Rename this file. No extension."
|
|
/>
|
|
{#if $events_sess.pres_mgmt.tmp_val__filename_no_ext.trim() != event_file_obj.filename_no_ext}
|
|
<button
|
|
type="button"
|
|
onclick={async () => {
|
|
let new_filename =
|
|
$events_sess.pres_mgmt.tmp_val__filename_no_ext.trim();
|
|
// Remove possible double extension
|
|
new_filename =
|
|
new_filename.replace(
|
|
'.' +
|
|
event_file_obj.extension,
|
|
''
|
|
);
|
|
|
|
// Add the extension back
|
|
new_filename =
|
|
new_filename +
|
|
'.' +
|
|
event_file_obj.extension;
|
|
|
|
// Remove any double dots
|
|
new_filename =
|
|
new_filename.replace(
|
|
/\.\./g,
|
|
'.'
|
|
);
|
|
|
|
let event_file_data = {
|
|
filename: new_filename
|
|
};
|
|
|
|
ae_promises.update__event_file_obj =
|
|
events_func
|
|
.update_ae_obj__event_file(
|
|
{
|
|
api_cfg:
|
|
$ae_api,
|
|
event_file_id:
|
|
event_file_obj.event_file_id,
|
|
data_kv:
|
|
event_file_data,
|
|
log_lvl: 0
|
|
}
|
|
)
|
|
.then(
|
|
function (
|
|
update_results
|
|
) {
|
|
console.log(
|
|
`Update results:`,
|
|
update_results
|
|
);
|
|
$events_sess.pres_mgmt.show_field_edit__filename = false;
|
|
}
|
|
);
|
|
}}
|
|
class="btn btn-sm preset-tonal-tertiary hover:preset-tonal-success"
|
|
title="Save changes"
|
|
>
|
|
{#await ae_promises.update__event_file_obj}
|
|
<span
|
|
class="fas fa-spinner fa-spin mx-1"
|
|
></span>
|
|
<span class=""
|
|
>Saving {event_file_obj.extension}</span
|
|
>
|
|
{:then}
|
|
<span
|
|
class="fas fa-save mx-1"
|
|
></span>
|
|
Save {event_file_obj.extension}
|
|
filename?
|
|
{/await}
|
|
</button>
|
|
{/if}
|
|
</span>
|
|
{/if}
|
|
</td>
|
|
|
|
{#if display_mode === 'default'}
|
|
<td
|
|
class="event_file__options"
|
|
class:hidden={!allow_basic &&
|
|
!$ae_loc.trusted_access}
|
|
>
|
|
<div class="flex flex-col gap-1 text-sm">
|
|
<button
|
|
type="button"
|
|
disabled={!allow_basic &&
|
|
!$ae_loc.trusted_access}
|
|
onclick={() => {
|
|
if (
|
|
$events_sess.pres_mgmt
|
|
.show_field_edit__filename ==
|
|
event_file_obj.event_file_id
|
|
) {
|
|
$events_sess.pres_mgmt.tmp_val__filename_no_ext =
|
|
'';
|
|
$events_sess.pres_mgmt.show_field_edit__filename = false;
|
|
} else {
|
|
$events_sess.pres_mgmt.tmp_val__filename_no_ext =
|
|
event_file_obj.filename_no_ext;
|
|
$events_sess.pres_mgmt.show_field_edit__filename =
|
|
event_file_obj.event_file_id;
|
|
}
|
|
}}
|
|
class="btn btn-sm preset-tonal-tertiary hover:preset-tonal-success"
|
|
class:preset-tonal-warning={$events_sess
|
|
.pres_mgmt
|
|
.show_field_edit__filename ==
|
|
event_file_obj.event_file_id}
|
|
title={`Rename this file? "${event_file_obj.filename}"}`}
|
|
>
|
|
<span class="fas fa-edit mx-1"
|
|
></span>
|
|
{#if $events_sess.pres_mgmt?.show_field_edit__filename == event_file_obj.event_file_id}
|
|
Cancel?
|
|
{:else}
|
|
Rename
|
|
{/if}
|
|
</button>
|
|
|
|
<button
|
|
type="button"
|
|
disabled={!allow_basic &&
|
|
!$ae_loc.trusted_access}
|
|
onclick={async () => {
|
|
let event_file_data = {
|
|
hide: !event_file_obj.hide
|
|
};
|
|
|
|
ae_promises.update__event_file_obj =
|
|
events_func
|
|
.update_ae_obj__event_file(
|
|
{
|
|
api_cfg:
|
|
$ae_api,
|
|
event_file_id:
|
|
event_file_obj.event_file_id,
|
|
data_kv:
|
|
event_file_data,
|
|
log_lvl: 0
|
|
}
|
|
)
|
|
.then(
|
|
function (
|
|
update_results
|
|
) {
|
|
console.log(
|
|
`Update results:`,
|
|
update_results
|
|
);
|
|
|
|
// let params = {
|
|
// qry__enabled: 'all',
|
|
// qry__hidden: 'all',
|
|
// }
|
|
|
|
events_func.load_ae_obj_li__event_file(
|
|
{
|
|
api_cfg:
|
|
$ae_api,
|
|
for_obj_type:
|
|
link_to_type,
|
|
for_obj_id:
|
|
link_to_id,
|
|
enabled:
|
|
'all',
|
|
hidden: 'all',
|
|
// params: params,
|
|
try_cache: true
|
|
}
|
|
);
|
|
}
|
|
);
|
|
}}
|
|
class="btn btn-sm preset-tonal-tertiary hover:preset-tonal-success"
|
|
title="Hide this file from the presentation launcher"
|
|
>
|
|
<!-- Users see this as the "Archive" option button -->
|
|
<!-- {@html (event_file_obj?.hide ? '<span class="fas fa-archive m-1"></span> Unarchive' : '<span class="fas fa-archive m-1"></span> Archive')}
|
|
-->
|
|
|
|
{#await ae_promises.update__event_file_obj}
|
|
<span
|
|
class="fas fa-spinner fa-spin mx-1"
|
|
></span>
|
|
<span class=""
|
|
>Saving {event_file_obj.extension}</span
|
|
>
|
|
{:then}
|
|
{#if event_file_obj.hide}
|
|
<span class="fas fa-eye m-1"
|
|
></span> Unhide File
|
|
{:else}
|
|
<span
|
|
class="fas fa-eye-slash m-1"
|
|
></span> Hide
|
|
{/if}
|
|
{/await}
|
|
</button>
|
|
|
|
<button
|
|
type="button"
|
|
disabled={!allow_basic &&
|
|
!$ae_loc.trusted_access}
|
|
onclick={async () => {
|
|
if (
|
|
!confirm(
|
|
`Are you sure you want to delete this file?\n${event_file_obj.filename} [${event_file_obj.event_file_id}]`
|
|
)
|
|
) {
|
|
return false;
|
|
}
|
|
|
|
// ae_promises[event_file_obj.event_file_id] = handle_delete__event_file({event_file_id: event_file_obj.event_file_id});
|
|
|
|
ae_promises.delete__event_file_obj =
|
|
await events_func.delete_ae_obj_id__event_file(
|
|
{
|
|
api_cfg: $ae_api,
|
|
event_file_id:
|
|
event_file_obj.event_file_id,
|
|
log_lvl: 1
|
|
}
|
|
);
|
|
}}
|
|
class="btn btn-sm preset-tonal-tertiary hover:preset-tonal-success"
|
|
title="Delete this file"
|
|
>
|
|
<span class="fas fa-trash-alt mx-1"
|
|
></span>
|
|
<!-- <span class="fas fa-minus mx-1"></span> -->
|
|
Delete
|
|
</button>
|
|
</div>
|
|
</td>
|
|
{/if}
|
|
|
|
{#if display_mode === 'default'}
|
|
<td
|
|
class="event_file__status"
|
|
class:hidden={!allow_basic &&
|
|
!$ae_loc.trusted_access}
|
|
>
|
|
<div
|
|
class="flex flex-col gap-1 items-center justify-center text-sm"
|
|
>
|
|
<div class="">
|
|
{#if event_file_obj.open_in_os == 'win'}
|
|
MS Windows <span
|
|
class="fab fa-windows"
|
|
></span>
|
|
{:else if event_file_obj.open_in_os == 'mac'}
|
|
Apple macOS <span
|
|
class="fab fa-apple"
|
|
></span>
|
|
{/if}
|
|
</div>
|
|
|
|
<!-- Select from options for the purpose of this file -->
|
|
<div>
|
|
<label
|
|
for="file_purpose"
|
|
class="text-sm mx-1 hidden"
|
|
>
|
|
Purpose:
|
|
</label>
|
|
<select
|
|
id="file_purpose"
|
|
name="file_purpose"
|
|
disabled={!allow_basic &&
|
|
!allow_moderator &&
|
|
!$ae_loc.trusted_access}
|
|
value={event_file_obj.file_purpose}
|
|
onchange={(e) => {
|
|
// ae_tmp[event_file_obj.event_file_id].file_purpose = (e.target as HTMLInputElement).value;
|
|
console.log(
|
|
`Selected file_purpose: ${(e.target as HTMLInputElement).value}`
|
|
);
|
|
|
|
let event_file_data = {
|
|
event_file_id:
|
|
event_file_obj.event_file_id,
|
|
file_purpose: (
|
|
e.target as HTMLInputElement
|
|
).value
|
|
};
|
|
|
|
events_func
|
|
.update_ae_obj__event_file(
|
|
{
|
|
api_cfg:
|
|
$ae_api,
|
|
event_file_id:
|
|
event_file_obj.event_file_id,
|
|
data_kv:
|
|
event_file_data,
|
|
log_lvl: 1
|
|
}
|
|
)
|
|
.then(
|
|
function (
|
|
update_results
|
|
) {
|
|
console.log(
|
|
`Update results:`,
|
|
update_results
|
|
);
|
|
$slct_trigger =
|
|
'load__event_file_obj_li';
|
|
}
|
|
);
|
|
|
|
// ae_triggers.update_event_file_purpose = true;
|
|
}}
|
|
class="select min-w-fit max-w-fit text-xs mx-1 border border-surface-300-700 rounded-md p-1 bg-surface-50-900 hover:border-surface-400-600 transition-colors duration-200"
|
|
>
|
|
<option
|
|
value={null}
|
|
selected={!event_file_obj.file_purpose}
|
|
>-- purpose not set --</option
|
|
>
|
|
{#if $events_loc.pres_mgmt?.file_purpose_option_kv}
|
|
{#each Object.entries($events_loc.pres_mgmt.file_purpose_option_kv as any) as [key, file_purpose_option] (key)}
|
|
<option
|
|
value={key}
|
|
selected={event_file_obj.file_purpose ===
|
|
key}
|
|
disabled={(file_purpose_option as any)?.disabled &&
|
|
!$ae_loc.edit_mode}
|
|
class:hidden={(file_purpose_option as any)?.hidden &&
|
|
!$ae_loc.edit_mode}
|
|
>
|
|
{(file_purpose_option as any)?.name}
|
|
</option>
|
|
{/each}
|
|
{/if}
|
|
<!-- <option value="outline" selected={event_file_obj.file_purpose === 'outline'}>1. Outline</option> -->
|
|
<!-- <option value="draft" selected={event_file_obj.file_purpose === 'draft'}>2. Draft</option> -->
|
|
<!-- <option value="final" selected={event_file_obj.file_purpose === 'final'}>3. Final</option> -->
|
|
<!-- <option value="supporting">X. Supporting File (audio, video, data, etc)</option> -->
|
|
<!-- <option value="handout">X. Handout</option> -->
|
|
<!-- <option value="other">X. Other</option> -->
|
|
<!-- <option value="poster">Final - Poster</option> -->
|
|
<!-- <option value="presentation">Final - Presentation</option> -->
|
|
<!-- Shows in session room -->
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</td>
|
|
{/if}
|
|
|
|
<td class="event_file_info file_meta text-gray-500">
|
|
<div class="flex flex-col gap-0.5 text-xs">
|
|
<!-- {event_file_obj.hosted_file_content_type} -->
|
|
|
|
<span
|
|
class="w-full flex flex-col lg:flex-row justify-between"
|
|
>
|
|
<span
|
|
class:hidden={display_mode !=
|
|
'default'}
|
|
>
|
|
Type:
|
|
<strong
|
|
>{event_file_obj.extension}
|
|
<span
|
|
class="fas fa-{ae_util.file_extension_icon(
|
|
event_file_obj.extension
|
|
)}"
|
|
></span>
|
|
</strong>
|
|
<!-- {#if event_file_obj.open_in_os == 'win'}
|
|
<strong>
|
|
MS Windows <span class="fab fa-windows"></span>
|
|
</strong>
|
|
{:else if event_file_obj.open_in_os == 'mac'}
|
|
<strong>
|
|
Apple macOS <span class="fab fa-apple"></span>
|
|
</strong>
|
|
{/if} -->
|
|
</span>
|
|
<span>
|
|
<span
|
|
class:hidden={display_mode !=
|
|
'default'}
|
|
>
|
|
Size:
|
|
</span>
|
|
<strong
|
|
>{ae_util.format_bytes(
|
|
event_file_obj.file_size
|
|
)}</strong
|
|
>
|
|
</span>
|
|
</span>
|
|
|
|
<span
|
|
class="w-full flex flex-col lg:flex-row justify-between"
|
|
>
|
|
<span
|
|
title="SHA 256: {event_file_obj.hash_sha256}"
|
|
>
|
|
<span
|
|
class:hidden={display_mode !=
|
|
'default'}
|
|
>
|
|
Hash:
|
|
</span>
|
|
<strong
|
|
class:font-normal={display_mode !=
|
|
'default'}
|
|
>{event_file_obj.hash_sha256.slice(
|
|
0,
|
|
10
|
|
)}…</strong
|
|
>
|
|
</span>
|
|
<span
|
|
class:hidden={!$ae_loc.administrator_access ||
|
|
display_mode != 'default'}
|
|
>
|
|
<span
|
|
class:hidden={display_mode !=
|
|
'default'}
|
|
>
|
|
ID:
|
|
</span>
|
|
<strong
|
|
>{event_file_obj.hosted_file_id}</strong
|
|
>
|
|
</span>
|
|
</span>
|
|
|
|
<!-- If this file was uploaded (created) within the last 15 minutes we want to highlight it in blue. -->
|
|
<span
|
|
class:bg-yellow-200={ae_util.is_datetime_recent(
|
|
{
|
|
datetime:
|
|
event_file_obj?.created_on,
|
|
minutes: 30
|
|
}
|
|
)}
|
|
class:bg-green-200={ae_util.is_datetime_recent(
|
|
{
|
|
datetime:
|
|
event_file_obj?.created_on,
|
|
minutes: 240
|
|
}
|
|
)}
|
|
class:bg-blue-200={ae_util.is_datetime_recent(
|
|
{
|
|
datetime:
|
|
event_file_obj?.created_on,
|
|
minutes: 2880
|
|
}
|
|
)}
|
|
>
|
|
{#if display_mode == 'default'}
|
|
<!-- <span class="fas fa-cloud-upload-alt mx-1"></span> -->
|
|
<!-- Uploaded: -->
|
|
<!-- <span class="fas fa-calendar-day mx-1"></span> -->
|
|
<span class="fas fa-clock mx-1"
|
|
></span>
|
|
<strong>
|
|
{ae_util.iso_datetime_formatter(
|
|
event_file_obj.created_on,
|
|
'dddd'
|
|
)}
|
|
</strong>
|
|
{ae_util.iso_datetime_formatter(
|
|
event_file_obj.created_on,
|
|
'date_iso'
|
|
)}
|
|
at
|
|
<strong
|
|
>{ae_util.iso_datetime_formatter(
|
|
event_file_obj.created_on,
|
|
'time_12_short_no_leading'
|
|
)}</strong
|
|
>
|
|
<!-- {event_file_obj.updated_on} -->
|
|
{:else}
|
|
<!-- <span class="fas fa-calendar-day mx-1"></span> -->
|
|
<strong>
|
|
{ae_util.iso_datetime_formatter(
|
|
event_file_obj.created_on,
|
|
'date_short'
|
|
)}
|
|
<!-- at -->
|
|
<strong
|
|
>{ae_util.iso_datetime_formatter(
|
|
event_file_obj.created_on,
|
|
'time_12_short_no_leading'
|
|
)}</strong
|
|
>
|
|
</strong>
|
|
{/if}
|
|
</span>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{:else}
|
|
<p
|
|
class="w-96 text-center text-gray-500"
|
|
class:hidden={display_mode != 'default'}
|
|
>
|
|
No files uploaded to display
|
|
</p>
|
|
{/if}
|
|
</section>
|
|
|
|
<style>
|
|
</style>
|