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

Lots of work on the new Launcher. Also general reorganizing of files.

Browse Source
This commit is contained in:
Scott Idem
2024-09-24 16:55:23 -04:00
parent bd2583fde3
commit 476b303da4
23 changed files with 2221 additions and 684 deletions
Download Patch File Download Diff File Expand all files Collapse all files

421
src/routes/events/[event_id]/(launcher)/launcher_file_cont.svelte Normal file
View File

@@ -0,0 +1,421 @@
<script lang="ts">
// *** Import Svelte core
import { onMount, tick } from 'svelte';
import { fade, scale, fly } from 'svelte/transition';
type key_val = {
[key: string]: any;
};
// *** Import Aether core variables and functions
// import { ae } from 'aether_npm_lib';
// import { } from '../../mods/electron.js';
// import { ae_event_launcher, event_file_obj_def, open_event_file_as_modal, ae_screen_saver_img_list } from '../../stores_mod_events';
// *** Import Aether core components
// *** Import Aether module variables and functions
// import { ae_event_launcher } from '../stores_event.js';
// import { download_event_file } from '../stores_event_api.js';
// *** Import Aether module components
// *** Export/Exposed variables and functions for component
export let event_file_obj = $event_file_obj_def;
// export let use_os: boolean = false;
// export let os: string = null;
export let max_filename_length: number = 50;
export let hide_launch_icon: boolean = false;
export let hide_meta: boolean = false;
export let hide_created_on: boolean = false;
export let hide_os: boolean = false;
export let hide_size: boolean = false;
export let show_bak_download: boolean = false;
// export let hide_api_download: boolean = true;
export let btn_size: string = 'btn_md';
export let open_file_as: string = '';
export let poster_title: string = '';
// *** Set initial variables
let ae_promises: key_val = {};
let ae_downloads: key_val = {};
let open_file_clicked = null;
let open_file_status = null; // null, 'checking_cache', 'checking_cache_failed', 'downloading_file', 'downloading_file_failed', 'opening_file', 'opening_file_failed', 'opening_file_success'
let open_file_status_message = null;
let screen_saver_exts = ['jpg', 'png', 'PNG', 'webp'];
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $ae_event_launcher.screen_saver_img_list.push(event_file_obj);
// $ae_event_launcher.screen_saver_img_list[event_file_obj.event_file_id_random] = event_file_obj;
$ae_screen_saver_img_list[event_file_obj.event_file_id_random] = Object.create(event_file_obj);
// let temp_obj = Object.create(event_file_obj)
// $ae_event_launcher.screen_saver_img_list[temp_obj.event_file_id_random] = Object.create(temp_obj);
// $ae_event_launcher = $ae_event_launcher;
}
onMount(() => {
console.log('** Component Mounted: ** Event Launcher File Container (Hash Open)');
if (screen_saver_exts.includes(event_file_obj.extension)) {
// $ae_event_launcher.screen_saver_img_list[event_file_obj.event_file_id_random] = event_file_obj;
let temp_obj = Object.create(event_file_obj)
$ae_event_launcher.screen_saver_img_list[temp_obj.event_file_id_random] = Object.create(temp_obj);
$ae_event_launcher = $ae_event_launcher;
}
window.addEventListener('message', function(event) {
console.log('Message received in event file uploaded manage component:');
console.log(event);
if (event.data.type == 'api_download_blob') {
console.log('Download blob (file) message received:');
console.log(event.data);
// Get the event_file_id from the event.data.endpoint value.
// Example: /event/file/abc123/download
let endpoint = event.data.endpoint;
let event_file_id = endpoint.split('/')[3];
ae_downloads[event_file_id] = {
'size_total': event.data.size_total,
'size_loaded': event.data.size_loaded,
'percent_completed': event.data.percent_completed,
};
// let event_file_id = event.data.event_file_id;
// let filename = event.data.filename;
// let auto_download = event.data.auto_download;
// ae_promises[event_file_id]
// ae_promises[event_file_id] = download_event_file({ 'event_file_id': event_file_id, 'return_file': true, filename: filename, auto_download: auto_download, log_lvl: 1 });
}
});
});
async function handle_open_file() {
console.log('*** handle_open_file() ***');
console.log(`App Mode: ${$ae_event_launcher.app_mode}; Cache Path: ${$ae_event_launcher.local_file_cache_path}; Temp Path: ${$ae_event_launcher.host_file_temp_path}`);
// null or "default" is for regular use in their preferred browser.
// "app" mode is for Electron and node.js.
// "onsite" mode is for Chrome or Firefox and downloading files with modified extensions and other slight changes.
if ($ae_event_launcher.app_mode == 'native' && native_app) {
console.log('* ** *** **** BEGIN TESTING **** *** ** *');
console.log('Process: Check local hash file cache, Download hash file to cache, and Open cached hash file after copying to temp directory');
open_file_clicked = true;
// await tick();
// setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
open_file_status = 'checking_cache';
open_file_status_message = 'Checking local cache...';
let check_hash_file_cache_result = await native_app.check_hash_file_cache_v2({local_file_cache_path: $ae_event_launcher.local_file_cache_path, hash: event_file_obj.hash_sha256, check_hash: true});
if (check_hash_file_cache_result) {
console.log('Cached hash file found.');
} else if (check_hash_file_cache_result == null) {
console.log(`Cached hash file not found. Need to download from API server. Base URL ${$ae_event_launcher.api.base_url}`);
open_file_status = 'downloading_file';
open_file_status_message = 'Downloading file...';
let download_hash_file_to_cache_result = await native_app.download_hash_file_to_cache_v2({api_base_url: $ae_event_launcher.api.base_url, api_base_url_backup: $ae_event_launcher.api.base_url_backup, local_file_cache_path: $ae_event_launcher.local_file_cache_path, event_file_id: event_file_obj.event_file_id_random, hash: event_file_obj.hash_sha256, verify_hash: true, overwrite_existing: false});
// console.log(download_hash_file_to_cache_result);
if (download_hash_file_to_cache_result) {
console.log('Hash file downloaded to cache.');
} else if (download_hash_file_to_cache_result == null) {
console.log('Hash file was not found in cache and or could not be downloaded.');
open_file_status = 'file_not_found';
open_file_status_message = 'File was not found in cache and could not be downloaded.';
setTimeout(() => {console.log(`Hiding Open File Message: ${open_file_status_message}`); open_file_clicked = false;}, 10000); // Default 15 seconds (15000)
return null;
} else {
console.log('Hash file may be in the process of being downloaded or something went wrong.');
open_file_status = 'downloading_file_or_failed';
open_file_status_message = 'Hash file may be in the process of being downloaded or something went wrong.';
setTimeout(() => {console.log(`Hiding Open File Message: ${open_file_status_message}`); open_file_clicked = false;}, 10000); // Default 15 seconds (15000)
return false;
}
} else {
console.log(`Cached hash file found, but hash did not match. May still be downloading from the API server. Base URL ${$ae_event_launcher.api.base_url}`);
open_file_status = 'try_again';
open_file_status_message = 'Please try again...';
return null;
}
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000); // Default 15 seconds (15000)
console.log('Cached hash file found and ready to be opened from the temp directory.');
open_file_status = 'opening_file';
open_file_status_message = 'Opening file...';
let filename = '';
if ((event_file_obj.extension == 'ppt' || event_file_obj.extension == 'pptx') && event_file_obj.open_in_os == 'win') {
if (event_file_obj.extension == 'ppt') {
filename = event_file_obj.filename.replace('.ppt', '.pptwin');
} else if (event_file_obj.extension == 'pptx') {
filename = event_file_obj.filename.replace('.pptx', '.pptxwin');
}
} else {
filename = event_file_obj.filename;
}
console.log(`Opening ${filename}`);
let electron_open_hash_file_to_temp_result = await native_app.open_hash_file_to_temp_v2({local_file_cache_path: $ae_event_launcher.local_file_cache_path, hash: event_file_obj.hash_sha256, host_file_temp_path: $ae_event_launcher.host_file_temp_path, filename: filename, verify_hash: true});
if (electron_open_hash_file_to_temp_result) {
console.log('Local hash file was opened to temp.');
open_file_status = 'opening_file_success';
open_file_status_message = 'Opening Application';
} else if (electron_open_hash_file_to_temp_result == null) {
console.log('Local hash file was not found. It may still be downloading.');
open_file_status = 'file_not_found';
open_file_status_message = 'File not found!';
} else {
console.log('Local hash file was not opened to temp. Something went wrong.');
open_file_status = 'opening_file_failed';
open_file_status_message = 'Failed to open the file!';
return false;
}
console.log('Done with test of cache check, download file, and open cached file from temp directory.');
} else if ($ae_event_launcher.app_mode == 'onsite') {
open_file_clicked = true;
await tick();
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
} else {
// NOTE: Add first test controller command here.
// $ae_event_launcher.controller_cmd = `ae:open:event_file_id=${$slct.event_file_id}`;
// $ae_event_launcher.controller_trigger_send = true; // Trigger the controller to send.
// $ae_event_launcher.controller_cmd = null; // Reset command to null
open_file_clicked = true;
await tick();
setTimeout(() => {console.log('Finished waiting to hide the message.'); open_file_clicked = false;}, 15000);
}
}
// function handle_open_file_as_poster() {
// console.log('*** handle_open_file_as_poster() ***');
// $ae_event_launcher.show_modal_event_poster = true;
// if (event_file_obj.extension == 'png' || event_file_obj.extension == 'jpg') {
// $ae_event_launcher.event_poster_file_type = 'image';
// } else if (event_file_obj.extension == 'mp4' || event_file_obj.extension == 'mov') {
// $ae_event_launcher.event_poster_file_type = 'video';
// }
// $ae_event_launcher.event_poster_src = `/event/file/${event_file_obj.event_file_id_random}/download`;
// $ae_event_launcher.event_poster_title = poster_title;
// }
</script>
<div class="event_launcher_file_cont">
<span class="event_file_action">
{#if open_file_clicked}
<div class="open_file_clicked alert" in:fade="{{ duration: 250 }}" out:fade="{{ duration: 2000 }}">
{#if ($ae_event_launcher.app_mode == 'native')}
{#if (open_file_status)}
<div class="alert_msg_pulse"><strong>*** {open_file_status_message} ***</strong></div>
{/if}
<!-- <strong>*** Please wait while this file is cached... ***</strong> -->
<p>Most files will automatically be opened full screen.</p>
<p>PowerPoint or KeyNote will attempt to display in presenter view.</p>
<p>PDFs, videos, and images will attempt to be displayed mirrored.</p>
<p>Please close the file when finished.</p>
{:else if ($ae_event_launcher.app_mode == 'onsite')}
<strong>*** Please wait while this file loads... ***</strong>
<p>Most files will automatically be opened full screen.</p>
<p>PowerPoint or KeyNote will attempt to display in presenter view.</p>
<p>PDFs, videos, and images will attempt to be displayed mirrored.</p>
<p>Please close the file when finished.</p>
{:else}
<strong>*** Please wait while this file downloads... ***</strong>
<p>Onsite in the Speaker Ready Room and conference session rooms:
<ul>
<li>Most files will automatically be opened full screen.</li>
<li>PowerPoint or KeyNote will attempt to display in presenter view.</li>
<li>PDFs, videos, and images will attempt to be displayed mirrored.</li>
<li>Please close the file when finished.</li>
</ul>
{/if}
</div>
{/if}
{#if (open_file_as == 'poster')}
<!-- <a
href="/event/file/{event_file_obj.event_file_id_random}/download"
download
class="ae_btn btn_info {btn_size}"
on:click|preventDefault={() => {handle_open_file_as_poster();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={event_file_obj.filename}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a> -->
<button
class="ae_btn btn_info {btn_size}"
on:click={() => {
let as_modal_result = open_event_file_as_modal({
event_file_id: event_file_obj.event_file_id_random,
filename: event_file_obj.filename,
extension: event_file_obj.extension,
modal_title: poster_title
});
if (as_modal_result) {
console.log($ae_event_launcher);
console.log(event_file_obj);
ae_event_launcher.set({...$ae_event_launcher, ...as_modal_result});
}
if ($ae_event_launcher.controller == 'local_push') {
$ae_event_launcher.controller_cmd = `ae_open:event_file=${event_file_obj.event_file_id_random}`;
$ae_event_launcher.controller_trigger_send = true;
}
}}
title={`${event_file_obj.filename} [BTN] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
{#if (screen_saver_exts.includes(event_file_obj.extension))}
<span class="fas fa-chart-bar" class:d_none="{hide_launch_icon}"></span>
Open Poster
{:else}
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
{/if}
</button>
<!-- {#if ($ae_event_launcher.app_mode == 'native')} -->
{:else if ($ae_event_launcher.app_mode == 'native')}
<a
href="/event/file/{event_file_obj.event_file_id_random}/download?use_os=true"
download
class="ae_btn btn_info {btn_size}"
on:click|preventDefault={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={`${event_file_obj.filename} [A] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a>
{:else if ($ae_event_launcher.app_mode == 'onsite' && (event_file_obj.extension == 'ppt' || event_file_obj.extension == 'pptx') && event_file_obj.open_in_os == 'win')}
<a
href="/event/file/{event_file_obj.event_file_id_random}/download?use_os=true" download
class="ae_btn btn_info {btn_size}"
on:click={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={`${event_file_obj.filename} [A] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a>
{:else}
<button
class="ae_btn btn_info {btn_size}"
on:click={() => {
ae_promises[event_file_obj.event_file_id_random]
ae_promises[event_file_obj.event_file_id_random] = download_event_file({ 'event_file_id': event_file_obj.event_file_id_random, 'return_file': true, filename: event_file_obj.filename, auto_download: true, log_lvl: 1 })
.then((result) => {
console.log('Downloaded file:');
console.log(result);
if (result === null) {
ae_promises[event_file_obj.event_file_id_random] = null;
}
})
}}
title={`${event_file_obj.filename} [API] -- SHA256 hash: ${event_file_obj.hash_sha256.slice(0, 10)}...`}
>
{#await ae_promises[event_file_obj.event_file_id_random]}
<span class="fas fa-spinner fa-spin"></span>
Downloading...
<span>
{#if ae_downloads[event_file_obj.event_file_id_random]}
{ae_downloads[event_file_obj.event_file_id_random].percent_completed}%
{/if}
</span>
{:then}
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
{#if ae_promises[event_file_obj.event_file_id_random] === null}
<span class="fas fa-exclamation-triangle"></span>
Download failed!
{/if}
{/await}
</button>
<!-- <a
href="/event/file/{event_file_obj.event_file_id_random}/download"
download
class="ae_btn btn_info {btn_size}"
on:click={() => {handle_open_file();}}
data-hash_sha256={event_file_obj.hash_sha256}
data-filename={event_file_obj.filename}
title={event_file_obj.filename}
>
<span class="fas fa-paper-plane" class:d_none="{hide_launch_icon}"></span> {ae.util.shorten_filename(event_file_obj.filename, max_filename_length)}
</a> -->
{/if}
<!-- <a href="/event/file/{event_file_obj.event_file_id_random}/download?filename={event_file_obj.filename}&use_os=true" class="ae_btn btn_info {btn_size}">{event_file_obj.filename}</a> -->
</span>
<span class="event_file_meta" class:d_none="{hide_meta}">
<span class="event_file_created_on" class:d_none="{hide_created_on}">
{ae.util.iso_datetime_formatter(event_file_obj.created_on, 'datetime_short')}
</span>
<span class="event_file_size" class:d_none="{hide_size}">
{#if event_file_obj.file_size}{ae.util.format_bytes(event_file_obj.file_size)}{/if}
</span>
<span class="event_file_os" class:d_none="{hide_os}">
{#if event_file_obj.open_in_os == 'win'}
<span class="fab fa-windows"></span> Win
{:else if event_file_obj.open_in_os == 'mac'}
<span class="fab fa-apple"></span> Mac
{:else}
<!-- <span class="fas fa-folder-open"></span> -->
{/if}
</span>
<!-- {#if ($ae_event_launcher.app_mode == 'native' || $ae_event_launcher.app_mode == 'onsite')} -->
<!-- {#if (show_bak_download)} -->
<a href="/event/file/{event_file_obj.event_file_id_random}/download" class="event_file_download" class:d_none="{!show_bak_download}" title="Download with original filename and extension"><span class="fas fa-download"></span></a>
<!-- {/if} -->
</span>
<!-- <button
class="ae_btn btn_xs btn_outline_debug"
class:d_none="{hide_api_download}"
on:click={() => {
// if (!confirm('Download file from API server?')) {
// return false;
// }
download_event_file({ 'event_file_id': event_file_obj.event_file_id_random, 'return_file': true, filename: event_file_obj.filename, auto_download: true, log_lvl: 1 });
}}
title="Download file from API server?"
>
<span class="fas fa-download"></span>
</button> -->
</div>
<style>
</style>