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

Last round of prettier: npx prettier --write src/

Browse Source
This commit is contained in:
Scott Idem
2026-03-24 13:27:40 -04:00
parent 23d25bf65a
commit a8f3c29b9f
146 changed files with 13201 additions and 9277 deletions
Download Patch File Download Diff File Expand all files Collapse all files

179
src/lib/elements/element_manage_hosted_file_li.svelte
View File

@@ -1,65 +1,84 @@
<script lang="ts">
import type { key_val } from '$lib/stores/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
// import { api } from '$lib/api';
// import Element_data_store from '$lib/element_data_store.svelte';
import type { key_val } from '$lib/stores/ae_stores';
import { ae_util } from '$lib/ae_utils/ae_utils';
// import { api } from '$lib/api';
// import Element_data_store from '$lib/element_data_store.svelte';
// 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_core } from '$lib/ae_core/db_core';
import { core_func } from '$lib/ae_core/ae_core_functions';
import { CalendarDays, Download, FolderOpen, MinusCircle, Pencil, PlusCircle, RefreshCw, Trash2 } from '@lucide/svelte';
// export let allow_basic: boolean = false;
// 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_core } from '$lib/ae_core/db_core';
import { core_func } from '$lib/ae_core/ae_core_functions';
import {
CalendarDays,
Download,
FolderOpen,
MinusCircle,
Pencil,
PlusCircle,
RefreshCw,
Trash2
} from '@lucide/svelte';
// export let allow_basic: boolean = false;
interface Props {
log_lvl?: number;
class_li_default?: string;
class_li?: string;
lq__hosted_file_obj_li: any;
link_to_type: string;
link_to_id: string;
// export let allow_moderator: boolean = false;
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
max_file_count?: number;
file_type?: string; // 'image', 'video', 'audio', 'document', 'other'
slct_hosted_file_kv?: key_val;
slct_hosted_file_id?: any;
slct_hosted_file_obj?: any;
}
interface Props {
log_lvl?: number;
class_li_default?: string;
class_li?: string;
lq__hosted_file_obj_li: any;
link_to_type: string;
link_to_id: string;
// export let allow_moderator: boolean = false;
display_mode?: string; // 'default', 'compact', 'minimal', 'launcher'
max_file_count?: number;
file_type?: string; // 'image', 'video', 'audio', 'document', 'other'
slct_hosted_file_kv?: key_val;
slct_hosted_file_id?: any;
slct_hosted_file_obj?: any;
}
let {
log_lvl = 0,
class_li_default = 'flex flex-col gap-1 items-center justify-center w-fit max-w-4xl mx-auto my-1 max-h-96 overflow-auto',
class_li = '',
lq__hosted_file_obj_li = $bindable([]),
link_to_type,
link_to_id,
display_mode = 'default',
max_file_count = $bindable(49),
file_type = $bindable('all'),
slct_hosted_file_kv = $bindable({}),
slct_hosted_file_id = $bindable(null),
slct_hosted_file_obj = $bindable(null)
}: Props = $props();
let {
log_lvl = 0,
class_li_default = 'flex flex-col gap-1 items-center justify-center w-fit max-w-4xl mx-auto my-1 max-h-96 overflow-auto',
class_li = '',
lq__hosted_file_obj_li = $bindable([]),
link_to_type,
link_to_id,
display_mode = 'default',
max_file_count = $bindable(49),
file_type = $bindable('all'),
slct_hosted_file_kv = $bindable({}),
slct_hosted_file_id = $bindable(null),
slct_hosted_file_obj = $bindable(null)
}: Props = $props();
// export let show_convert_btn: null|boolean = null;
// export let show_convert_btn: null|boolean = null;
// let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {};
let ae_tmp: key_val = $state({});
ae_tmp.show__file_li = true;
ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
// let ae_triggers: key_val = {};
// let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {};
let ae_tmp: key_val = $state({});
ae_tmp.show__file_li = true;
ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
// let ae_triggers: key_val = {};
</script>
<section class="{class_li_default} {class_li}">
<h3 class="h3" class:hidden={!$lq__hosted_file_obj_li?.length || display_mode != 'default'}>
<h3
class="h3"
class:hidden={!$lq__hosted_file_obj_li?.length ||
display_mode != 'default'}>
Manage Files:
<span
class="font-bold bg-success-100 px-4 border rounded-lg border-success-200"
class="bg-success-100 border-success-200 rounded-lg border px-4 font-bold"
title="Files for {link_to_type ?? '-- not set --'}: {link_to_id ??
'-- not set --'} (files: {$lq__hosted_file_obj_li?.length ?? 'None'})"
>
'-- not set --'} (files: {$lq__hosted_file_obj_li?.length ??
'None'})">
<FolderOpen size="1em" class="mx-1" />
{@html $lq__hosted_file_obj_li
? `${$lq__hosted_file_obj_li.length}&times;`
@@ -97,10 +116,9 @@
// $slct_trigger = 'load__hosted_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="btn btn-sm preset-tonal-tertiary hover:preset-tonal-warning border-warning-500 m-1 border p-1 transition hover:transition-all *:hover:inline"
class:hidden={!$ae_loc.edit_mode || !$ae_loc.authenticated_access}
title="Refresh the list of files"
>
title="Refresh the list of files">
<RefreshCw size="1em" class="m-1" />
<div class="hidden">Files</div>
</button>
@@ -111,10 +129,9 @@
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="btn btn-sm preset-tonal-tertiary hover:preset-tonal-warning border-warning-500 m-1 border p-1 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"
>
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'}
@@ -123,8 +140,8 @@
</div>
{#if $lq__hosted_file_obj_li && $lq__hosted_file_obj_li.length}
<div class="overflow-auto w-full">
<ol class="list-decimal list-inside">
<div class="w-full overflow-auto">
<ol class="list-inside list-decimal">
{#each [...$lq__hosted_file_obj_li]
.reverse()
.slice(0, max_file_count) as hosted_file_obj (hosted_file_obj.hosted_file_id)}
@@ -135,7 +152,9 @@
onclick={() => {
// This (uploaded_file_kv) is referenced by other AE components. Currently it is only used for the video clipper. This should be a toggle of Add/Remove.
if (
$ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]
$ae_loc.files.uploaded_file_kv[
hosted_file_obj.hosted_file_id
]
) {
delete $ae_loc.files.uploaded_file_kv[
hosted_file_obj.hosted_file_id
@@ -144,24 +163,29 @@
...$ae_loc.files.uploaded_file_kv
};
delete slct_hosted_file_kv[hosted_file_obj.hosted_file_id];
delete slct_hosted_file_kv[
hosted_file_obj.hosted_file_id
];
slct_hosted_file_id = null;
slct_hosted_file_obj = null;
} else {
$ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id] =
hosted_file_obj;
lq__hosted_file_obj_li[hosted_file_obj.hosted_file_id] =
hosted_file_obj;
$ae_loc.files.uploaded_file_kv[
hosted_file_obj.hosted_file_id
] = hosted_file_obj;
lq__hosted_file_obj_li[
hosted_file_obj.hosted_file_id
] = hosted_file_obj;
slct_hosted_file_kv[hosted_file_obj.hosted_file_id] =
hosted_file_obj;
slct_hosted_file_id = hosted_file_obj.hosted_file_id;
slct_hosted_file_kv[
hosted_file_obj.hosted_file_id
] = hosted_file_obj;
slct_hosted_file_id =
hosted_file_obj.hosted_file_id;
slct_hosted_file_obj = hosted_file_obj;
}
}}
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
title="Add/Remove file to/from the locally stored uploaded file list. This is referenced by other AE components."
>
title="Add/Remove file to/from the locally stored uploaded file list. This is referenced by other AE components.">
{#if $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id]}
<MinusCircle size="1em" class="m-1" />
<span class="hidden">Remove</span>
@@ -186,7 +210,8 @@
ae_promises.delete__hosted_file_obj =
core_func.delete_ae_obj_id__hosted_file({
api_cfg: $ae_api,
hosted_file_id: hosted_file_obj.hosted_file_id,
hosted_file_id:
hosted_file_obj.hosted_file_id,
link_to_type: link_to_type,
link_to_id: link_to_id,
rm_orphan: true,
@@ -196,8 +221,7 @@
}}
class:hidden={!$ae_loc.administrator_access}
class="btn btn-sm preset-tonal-secondary hover:preset-filled-secondary-500"
title="Delete a file from the host server."
>
title="Delete a file from the host server.">
<Trash2 size="1em" class="m-1" />
<span class="hidden">Delete</span>
</button>
@@ -210,8 +234,7 @@
// This should show/hide the editable fields for the file. This might need to be in a little modal.
}}
class="btn btn-sm preset-tonal-primary hover:preset-filled-primary-500"
title="Edit file details"
>
title="Edit file details">
<Pencil size="1em" class="m-1" />
<span class="hidden">Edit</span>
</button>
@@ -242,7 +265,9 @@
{ae_util.format_bytes(hosted_file_obj.size)}
</span>
<span class:hidden={!$ae_loc.edit_mode} class="text-xs text-gray-500">
<span
class:hidden={!$ae_loc.edit_mode}
class="text-xs text-gray-500">
{hosted_file_obj.hash_sha256?.slice(0, 5)}...
</span>
</li>
@@ -250,7 +275,9 @@
</ol>
</div>
{:else}
<p class="w-96 text-center text-gray-500" class:hidden={display_mode != 'default'}>
<p
class="w-96 text-center text-gray-500"
class:hidden={display_mode != 'default'}>
No files available to display
</p>
{/if}