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

Lots of work on file management and video processing (ffmpeg).

Browse Source
This commit is contained in:
Scott Idem
2025-03-17 19:38:38 -04:00
parent ab055beaff
commit 39d0a210f3
9 changed files with 334 additions and 258 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
src/lib/element_manage_hosted_file_li.svelte
View File

@@ -1,5 +1,4 @@
<script lang="ts">
export let log_lvl: number = 0;
// import { onMount } from 'svelte';
// import { clipboard } from '@skeletonlabs/skeleton';
// import { liveQuery } from "dexie";
@@ -15,19 +14,32 @@ import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_st
import { db_core } from "$lib/ae_core/db_core";
import { core_func } from '$lib/ae_core/ae_core_functions';
export let container_class_li: string|Array<string> = [];
export let lq__hosted_file_obj_li: any;
export let link_to_type: string;
export let link_to_id: string;
// export let allow_basic: boolean = false;
// export let allow_moderator: boolean = false;
export let display_mode: string = 'default'; // 'default', 'compact', 'minimal', 'launcher'
interface Props {
log_lvl?: number;
container_class_li?: string|Array<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'
}
let {
log_lvl = 0,
container_class_li = [],
lq__hosted_file_obj_li = $bindable([]),
link_to_type,
link_to_id,
display_mode = 'default'
}: Props = $props();
// export let show_convert_btn: null|boolean = null;
// let ae_placeholder_li: key_val = {};
let ae_promises: key_val = {};
let ae_tmp: 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 = {};
@@ -40,7 +52,7 @@ ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
>
<button
type="button"
on:click={() => {
onclick={() => {
console.log('*** Refresh button clicked ***');
db_core.file.clear();
@@ -75,7 +87,7 @@ ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
<button
type="button"
on:click={() => {
onclick={() => {
console.log('*** Show Alt Download button clicked ***');
ae_tmp.show__direct_download = !ae_tmp.show__direct_download;
}}
@@ -113,13 +125,82 @@ ae_tmp.show__direct_download = $ae_loc.core?.show__direct_download ?? false;
<div class="overflow-auto w-full">
<ol>
{#each $lq__hosted_file_obj_li as hosted_file_obj}
<ol class="list-decimal list-inside">
{#each [...$lq__hosted_file_obj_li].reverse() as hosted_file_obj}
<li>
<a href="" class="underline text-blue-500">
<button
type="button"
disabled={!$ae_loc.trusted_access}
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]) {
delete $ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id];
$ae_loc.files.uploaded_file_kv = {...$ae_loc.files.uploaded_file_kv};
} 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;
}
}}
class="btn btn-sm variant-soft-secondary hover:variant-filled-secondary"
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]}
<span class="fas fa-minus-circle m-1"></span>
<span class="hidden">Remove</span>
{:else}
<span class="fas fa-plus-circle m-1"></span>
<span class="hidden">Add</span>
{/if}
</button>
<button
type="button"
disabled={!$ae_loc.administrator_access}
onclick={() => {
// This (uploaded_file_kv) is referenced by other AE components. Currently it is only used for the video clipper.
$ae_loc.files.uploaded_file_kv[hosted_file_obj.hosted_file_id] = hosted_file_obj;
}}
class:hidden={!$ae_loc.administrator_access}
class="btn btn-sm variant-soft-secondary hover:variant-filled-secondary"
title="Delete a file from the host server."
>
<span class="fas fa-trash-alt m-1"></span>
<span class="hidden">Delete</span>
</button>
<button
type="button"
disabled={!$ae_loc.administrator_access}
class:hidden={!$ae_loc.administrator_access}
onclick={() => {
// This should show/hide the editable fields for the file. This might need to be in a little modal.
}}
class="btn btn-sm variant-soft-primary hover:variant-filled-primary"
title="Edit file details"
>
<span class="fas fa-edit m-1"></span>
<span class="hidden">Edit</span>
</button>
<span class="text-xs text-gray-500">
<span class="fas fa-calendar-day mx-1"></span>
<span class="hidden">Created on:</span>
{ae_util.iso_datetime_formatter(hosted_file_obj.created_on, 'datetime_medium_sec')}
{#if hosted_file_obj.updated_on}
<span class="fas fa-sync-alt mx-1"></span>
Updated on
{ae_util.iso_datetime_formatter(hosted_file_obj.updated_on, 'datetime_medium_sec')}
{/if}
</span>
<!-- <a href="" class="underline text-blue-500"> -->
{hosted_file_obj.filename}
</a>
{ae_util.format_bytes(hosted_file_obj.size)}
<!-- </a> -->
<span class="text-xs text-gray-500">
{ae_util.format_bytes(hosted_file_obj.size)}
</span>
</li>
{/each}
</ol>