b543c8a930
- Replaced all active FontAwesome <span class="fas fa-*"> icons with
Lucide components across 145 files (excluding /idaa/ which is intentional)
- Fixed merge script bug: consolidated lucide-svelte imports into @lucide/svelte
- Replaced dynamic toggle patterns (fa-toggle-on/off) with ToggleRight/ToggleLeft
- Replaced fa-eye/fa-eye-slash with Eye/EyeOff
- Replaced fa-bug/fa-bug-slash with Bug/BugOff
- Replaced fa-sync fa-spin with RefreshCw + animate-spin
- Replaced fa-microchip with Cpu
- Fixed {@const} placement in element_manage_event_file_li.svelte
- Removed obsolete CSS hover rules for .unlock_icon/.lock_icon
- svelte-check: 0 errors, 0 warnings
834 lines
50 KiB
Svelte
834 lines
50 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';
|
|
import { Check, Clock, Download, Eye, EyeOff, FileImage, FolderOpen, Laptop, LoaderCircle, Monitor, Pencil, RefreshCw, Save, Trash2, TriangleAlert } from '@lucide/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'
|
|
// WHY: event_file.event_session_type_code is NULL for presenter-linked files because
|
|
// v_event_file joins event_session only via event_file.event_session_id, which is NULL
|
|
// when for_type='event_presenter'. The wrapper derives the correct type from the
|
|
// presenter → presentation → session chain and passes it here as context.
|
|
context_session_type_code?: string | null;
|
|
}
|
|
|
|
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',
|
|
context_session_type_code = null
|
|
}: 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);
|
|
|
|
// PDF → Image conversion state (keyed by event_file_id)
|
|
// WHY: Poster sessions display files in the Launcher modal via <img> tag — PDFs can't render there.
|
|
// Presenters upload PDFs which must be converted server-side to high-res webp images.
|
|
// Button is only shown in edit_mode for PDF files linked to a poster-type session.
|
|
// Backend: /v3/action/hosted_file/{id}/convert_file runs pdf2image (3840px wide, first page only)
|
|
// and saves the result as a new hosted_file record linked to the same parent object.
|
|
type ConvertStatus = 'idle' | 'converting' | 'done' | 'error';
|
|
let convert_status_kv: Record<string, ConvertStatus> = $state({});
|
|
let convert_result_kv: key_val = $state({});
|
|
|
|
async function handle_convert_pdf_to_image(event_file_obj: key_val) {
|
|
const file_id = event_file_obj.event_file_id;
|
|
convert_status_kv[file_id] = 'converting';
|
|
try {
|
|
// Link the new image to the most specific parent available
|
|
const link_to_type_val = event_file_obj.event_session_id ? 'event_session'
|
|
: event_file_obj.event_presentation_id ? 'event_presentation'
|
|
: 'event';
|
|
const link_to_id_val = event_file_obj.event_session_id
|
|
|| event_file_obj.event_presentation_id
|
|
|| event_file_obj.event_id;
|
|
const filename_no_ext = (event_file_obj.filename ?? 'poster_image').replace(/\.pdf$/i, '');
|
|
const url = `${$ae_api.base_url}/v3/hosted_file/${event_file_obj.hosted_file_id}/convert_file`
|
|
+ `?link_to_type=${encodeURIComponent(link_to_type_val)}`
|
|
+ `&link_to_id=${encodeURIComponent(link_to_id_val)}`
|
|
+ `&filename_no_ext=${encodeURIComponent(filename_no_ext)}`
|
|
+ `&to_type=webp`;
|
|
const resp = await fetch(url, {
|
|
headers: {
|
|
'x-aether-api-key': $ae_api.api_secret_key,
|
|
'x-account-id': String($ae_api.account_id ?? '')
|
|
}
|
|
});
|
|
const body = await resp.json();
|
|
if (resp.ok && body?.data) {
|
|
convert_result_kv[file_id] = body.data;
|
|
convert_status_kv[file_id] = 'done';
|
|
} else {
|
|
console.error('[convert_pdf] API error:', body);
|
|
convert_status_kv[file_id] = 'error';
|
|
}
|
|
} catch (err) {
|
|
console.error('[convert_pdf] Fetch failed:', err);
|
|
convert_status_kv[file_id] = 'error';
|
|
}
|
|
}
|
|
</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"
|
|
>
|
|
<RefreshCw size="1em" class="m-1" />
|
|
<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"
|
|
>
|
|
<Download size="1em" class="m-1" />
|
|
<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'})"
|
|
>
|
|
<FolderOpen size="1em" class="mx-1" />
|
|
{@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)}
|
|
{@const ExtIcon = ae_util.file_extension_icon_lucide(event_file_obj.extension)}
|
|
<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"
|
|
/>
|
|
|
|
<!-- PDF → webp convert button: only for poster sessions in edit mode -->
|
|
{#if $ae_loc.edit_mode && event_file_obj?.extension === 'pdf' && (event_file_obj?.event_session_type_code === 'poster' || context_session_type_code === 'poster')}
|
|
<div>
|
|
{#if !convert_status_kv[event_file_obj.event_file_id] || convert_status_kv[event_file_obj.event_file_id] === 'idle'}
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm preset-tonal-warning border border-warning-500"
|
|
title="Convert this PDF to a high-res webp image for use in the Launcher poster display."
|
|
onclick={() => handle_convert_pdf_to_image(event_file_obj)}
|
|
>
|
|
<FileImage size="1em" class="mx-1" />
|
|
Convert PDF → Image
|
|
</button>
|
|
{:else if convert_status_kv[event_file_obj.event_file_id] === 'converting'}
|
|
<span class="btn btn-sm preset-tonal-surface opacity-60 cursor-wait">
|
|
<LoaderCircle size="1em" class="mx-1 animate-spin" />
|
|
Converting…
|
|
</span>
|
|
{:else if convert_status_kv[event_file_obj.event_file_id] === 'done'}
|
|
<span class="btn btn-sm preset-tonal-success" title="Conversion complete. New webp hosted_file created: {convert_result_kv[event_file_obj.event_file_id]?.filename ?? ''}">
|
|
<Check size="1em" class="mx-1" />
|
|
Done — {convert_result_kv[event_file_obj.event_file_id]?.filename ?? 'image created'}
|
|
</span>
|
|
{:else if convert_status_kv[event_file_obj.event_file_id] === 'error'}
|
|
<button
|
|
type="button"
|
|
class="btn btn-sm preset-tonal-error border border-error-500"
|
|
title="Conversion failed. Click to retry."
|
|
onclick={() => {
|
|
convert_status_kv[event_file_obj.event_file_id] = 'idle';
|
|
}}
|
|
>
|
|
<TriangleAlert size="1em" class="mx-1" />
|
|
Failed — Retry?
|
|
</button>
|
|
{/if}
|
|
</div>
|
|
{/if}
|
|
|
|
{#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}
|
|
<LoaderCircle size="1em" class="mx-1 animate-spin" />
|
|
<span class=""
|
|
>Saving {event_file_obj.extension}</span
|
|
>
|
|
{:then}
|
|
<Save size="1em" class="mx-1" />
|
|
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}"}`}
|
|
>
|
|
<Pencil size="1em" class="mx-1" />
|
|
{#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}
|
|
<LoaderCircle size="1em" class="mx-1 animate-spin" />
|
|
<span class=""
|
|
>Saving {event_file_obj.extension}</span
|
|
>
|
|
{:then}
|
|
{#if event_file_obj.hide}
|
|
<Eye size="1em" class="m-1" /> Unhide File
|
|
{:else}
|
|
<EyeOff size="1em" class="m-1" /> 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"
|
|
>
|
|
<Trash2 size="1em" class="mx-1" />
|
|
<!-- <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 <Monitor size="1em" class="inline-block" />
|
|
{:else if event_file_obj.open_in_os == 'mac'}
|
|
Apple macOS <Laptop size="1em" class="inline-block" />
|
|
{/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}
|
|
<ExtIcon size="1em" class="inline-block" />
|
|
</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> -->
|
|
<Clock size="1em" class="mx-1" />
|
|
<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>
|