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

14
src/routes/hosted_files/+layout.ts
View File

@@ -15,14 +15,14 @@ export async function load({ params, parent }) { // route
let ae_acct = data[account_id];
// console.log(`ae_acct = `, ae_acct);
if (!account_id) {
console.log(`ae Core - [account_id] +page.ts: The account_id was not found!!!`);
error(404, {
message: 'Account ID not found'
});
}
// if (!account_id) {
// console.log(`ae Core - [account_id] +page.ts: The account_id was not found!!!`);
// error(404, {
// message: 'Account ID not found'
// });
// }
ae_acct.slct.account_id = account_id;
// ae_acct.slct.account_id = account_id;
if (browser) {
let load_hosted_file_obj_li = core_func.load_ae_obj_li__hosted_file({

228
src/routes/hosted_files/+page.svelte
View File

@@ -1,5 +1,6 @@
<script lang="ts">
export let data;
import { run } from 'svelte/legacy';
// console.log(`ae_ Svelte Hosted Files +page data:`, data);
import { onMount } from 'svelte';
@@ -15,6 +16,7 @@ import Comp_hosted_files_clip_video from '$lib/ae_core/ae_comp__hosted_files_cli
import Comp_hosted_files_clip_video_li from '$lib/ae_core/ae_comp__hosted_files_clip_video_li.svelte';
import Element_manage_hosted_file_li_wrap from '$lib/element_manage_hosted_file_li_all.svelte';
let { data } = $props();
let log_lvl = 1;
@@ -31,7 +33,7 @@ let file_uploads_clip_post_promise;
let download_clip_src;
let download_clip_filename;
let hosted_file_upload: key_val = {
let hosted_file_upload: key_val = $state({
// link_to_type: 'account',
// link_to_id: ae_loc.account_id,
hosted_file_id_li: [],
@@ -39,13 +41,13 @@ let hosted_file_upload: key_val = {
clip_complete: false,
upload_complete: false,
submit_status: null,
};
});
let hosted_file_clip: key_val = {
let hosted_file_clip: key_val = $state({
video_clip_file_kv: {},
clip_complete: false,
submit_status: null,
};
});
if (!$ae_loc.files) {
$ae_loc.files = {};
@@ -59,162 +61,58 @@ if (!$ae_loc.files.processed_file_kv) {
$ae_loc.files.processed_file_kv = {};
}
$: if ($ae_sess.files.upload_complete && $ae_sess.files.uploaded_file_li) {
// Append this list to the $ae_loc.files.uploaded_file_li list
$ae_loc.files.uploaded_file_li = [
...$ae_loc.files.uploaded_file_li,
...$ae_sess.files.uploaded_file_li
];
}
$effect(() => {
// if ($ae_sess.files.upload_complete && $ae_sess.files.uploaded_file_li) {
// // Append this list to the $ae_loc.files.uploaded_file_li list
// $ae_loc.files.uploaded_file_li = [
// ...$ae_loc.files.uploaded_file_li,
// ...$ae_sess.files.uploaded_file_li
// ];
// }
$: if ($ae_sess.files.upload_complete && $ae_sess.files.uploaded_file_kv) {
// Add this key-value pair to the $ae_loc.files.uploaded_file_kv object
$ae_loc.files.uploaded_file_kv = {
...$ae_loc.files.uploaded_file_kv,
...$ae_sess.files.uploaded_file_kv
};
}
if ($ae_sess.files.upload_complete && $ae_sess.files.uploaded_file_kv) {
// Add this key-value pair to the $ae_loc.files.uploaded_file_kv object
$ae_loc.files.uploaded_file_kv = {
...$ae_loc.files.uploaded_file_kv,
...$ae_sess.files.uploaded_file_kv
};
$ae_sess.files.upload_complete = false;
}
$: if ($ae_sess.files.clip_complete && $ae_sess.files.video_clip_file_kv) {
// Add this key-value pair to the $ae_loc.files.video_clip_file_kv object
$ae_loc.files.video_clip_file_kv = {
...$ae_loc.files.video_clip_file_kv,
...$ae_sess.files.video_clip_file_kv
};
}
if ($ae_sess.files.clip_complete && $ae_sess.files.video_clip_file_kv) {
// Add this key-value pair to the $ae_loc.files.video_clip_file_kv object
$ae_loc.files.video_clip_file_kv = {
...$ae_loc.files.video_clip_file_kv,
...$ae_sess.files.video_clip_file_kv
};
$ae_sess.files.clip_complete = false;
}
});
// $effect(() => {
// if ($ae_sess.files.upload_complete && $ae_sess.files.uploaded_file_kv) {
// // Add this key-value pair to the $ae_loc.files.uploaded_file_kv object
// $ae_loc.files.uploaded_file_kv = {
// ...$ae_loc.files.uploaded_file_kv,
// ...$ae_sess.files.uploaded_file_kv
// };
// }
// });
// $effect(() => {
// if ($ae_sess.files.clip_complete && $ae_sess.files.video_clip_file_kv) {
// // Add this key-value pair to the $ae_loc.files.video_clip_file_kv object
// $ae_loc.files.video_clip_file_kv = {
// ...$ae_loc.files.video_clip_file_kv,
// ...$ae_sess.files.video_clip_file_kv
// };
// }
// });
onMount(() => {
console.log('Hosted Files: AV Utilities +page.svelte');
});
function handle_submit_form(event) {
// console.log('*** handle_submit_form() ***');
// console.log(event.target.file_list);
// const form_data = new FormData();
// form_data.append('title_part_1', event.target.title_part_1.value);
// form_data.append('title_part_2', event.target.title_part_2.value);
// form_data.append('subtitle_part_1', event.target.subtitle_part_1.value);
// form_data.append('subtitle_part_2', event.target.subtitle_part_2.value);
// form_data.append('font_color', event.target.font_color.value);
// form_data.append(`file`, event.target.audio_file.files[0]);
// if (event.target.title_image.files.length > 0) {
// form_data.append(`title_image`, event.target.title_image.files[0]);
// }
// download_filename = `${event.target.title_part_1.value}_${event.target.title_part_2.value}_${event.target.subtitle_part_1.value}_${event.target.subtitle_part_2.value}.mp4`
// // for (let i = 0; i < event.target.file_list.files.length; i++) {
// // form_data.append(`file_list`, event.target.event_file_upload_file_list.files[i]);
// // }
// let params = null;
// let endpoint = '/hosted_file/create_video';
// console.log(form_data);
// params = null;
// // Uncomment and the file_uploads_post_promise is not seen by the "await" below
// // file_uploads_post_promise = await api.post_object({api_cfg: $ae_api, endpoint: endpoint, params: params, data:form_data});
// // Uncomment so that the file_uploads_post_promise is not seen by the "await" below
// file_uploads_post_promise = api.post_object({api_cfg: $ae_api, endpoint: endpoint, params: params, form_data:form_data, return_blob: true, filename: 'test.mp4', auto_download: false})
// .then(function (result) {
// console.log(result);
// let file_blob = new Blob([result.data]);
// // console.log(file_blob);
// let file_obj_url = window.URL.createObjectURL(file_blob); // The img src
// // const url = window.URL.createObjectURL(new Blob([result.data]));
// download_src = file_obj_url;
// // download_filename = file_obj_url;
// });
// console.log(file_uploads_post_promise);
// // let file_blob = new Blob([file_uploads_post_promise.data]);
// // // console.log(file_blob);
// // let file_obj_url = URL.createObjectURL(file_blob); // The img src
// // download_src = file_obj_url;
// // dispatch(
// // 'event_file_obj_li_updated',
// // {
// // link_to_type: link_to_type,
// // link_to_id: link_to_id,
// // }
// // );
// return true;
}
// function handle_submit_form_clip(event) {
// console.log('*** handle_submit_form() ***');
// console.log(event.target.file_list);
// const form_data = new FormData();
// form_data.append('start_time', event.target.start_time.value);
// form_data.append('end_time', event.target.end_time.value);
// if (event.target.reencode.value == '1' || event.target.reencode.value == 'true') {
// form_data.append('reencode', 'true');
// } else {
// form_data.append('reencode', 'false');
// }
// // form_data.append('reencode', event.target.reencode.value);
// form_data.append(`video_file`, event.target.video_file.files[0]);
// download_filename = `clipped_file_test.mp4`
// // for (let i = 0; i < event.target.file_list.files.length; i++) {
// // form_data.append(`file_list`, event.target.event_file_upload_file_list.files[i]);
// // }
// let params = null;
// let endpoint = '/hosted_file/clip_video';
// console.log(form_data);
// params = null;
// file_uploads_clip_post_promise = api.post_object({
// api_cfg: $ae_api, endpoint: endpoint,
// params: params,
// form_data:form_data,
// return_blob: true,
// filename: 'test.mp4',
// auto_download: false
// })
// .then(function (result) {
// console.log(result);
// let file_blob = new Blob([result.data]);
// // console.log(file_blob);
// let file_obj_url = window.URL.createObjectURL(file_blob); // The img src
// // const url = window.URL.createObjectURL(new Blob([result.data]));
// download_src = file_obj_url;
// // download_filename = file_obj_url;
// });
// console.log(file_uploads_clip_post_promise);
// return true;
// }
</script>
@@ -237,16 +135,18 @@ function handle_submit_form(event) {
bind:upload_complete={$ae_sess.files.upload_complete}
log_lvl={log_lvl}
>
<span slot="label">
<div>
<span class="fas fa-upload"></span>
<strong class="bg-green-100 p-1">Upload video files</strong>
</div>
<span class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Aether hosted files only</strong><br>
Recommended: video (mp4, mkv)<br>
{#snippet label()}
<span >
<div>
<span class="fas fa-upload"></span>
<strong class="bg-green-100 p-1">Upload video files</strong>
</div>
<span class="text-sm text-gray-600 dark:text-gray-400 italic">
<strong>Aether hosted files only</strong><br>
Recommended: video (mp4, mkv)<br>
</span>
</span>
</span>
{/snippet}
</Comp_hosted_files_upload>
@@ -266,8 +166,6 @@ function handle_submit_form(event) {
class_li="border border-gray-300 rounded-md p-2 bg-gray-100 hover:bg-gray-200"
link_to_type="account"
link_to_id={$ae_loc.account_id}
bind:hosted_file_id_li={hosted_file_clip.hosted_file_id_li}
bind:hosted_file_obj_li={hosted_file_clip.hosted_file_obj_li}
bind:hosted_file_obj_kv={$ae_loc.files.uploaded_file_kv}
bind:video_clip_file_kv={$ae_loc.files.video_clip_file_kv}
bind:clip_complete={$ae_sess.files.clip_complete}