Now with new file manager
This commit is contained in:
Scott Idem
@@ -14,6 +14,7 @@ import { ae_util } from '$lib/ae_utils';
|
||||
import { api } from '$lib/api';
|
||||
import Element_ae_crud from '$lib/element_ae_crud.svelte';
|
||||
// import Element_data_store from '$lib/element_data_store.svelte';
|
||||
import Element_manage_event_file_li from '$lib/element_manage_event_file_li.svelte';
|
||||
|
||||
import { core_func } from '$lib/ae_core_functions';
|
||||
import { ae_loc, ae_sess, ae_api, ae_trig, slct, slct_trigger } from '$lib/ae_stores';
|
||||
@@ -850,212 +851,12 @@ WARNING: The file upload and management is a work in progress. You can upload an
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
{#if ae_tmp.show__file_li && $lq__event_file_obj_li && $lq__event_file_obj_li.length > 0}
|
||||
<ul
|
||||
class="space-y-2 px-4 w-full"
|
||||
>
|
||||
{#each $lq__event_file_obj_li as event_file_obj}
|
||||
<li class="flex flex-col lg:flex-row border border-gray-200 rounded-md p-2">
|
||||
<div class="flex flex-row max-h-8 w-full">
|
||||
|
||||
<button
|
||||
on:click={() => {
|
||||
// ae_promises[event_file_obj.event_file_id_random]
|
||||
ae_promises[event_file_obj.event_file_id_random] = api.download_hosted_file({
|
||||
api_cfg: $ae_api,
|
||||
hosted_file_id: event_file_obj.hosted_file_id_random,
|
||||
return_file: true,
|
||||
filename: event_file_obj.filename,
|
||||
auto_download: true,
|
||||
log_lvl: 1
|
||||
});
|
||||
|
||||
// window.postMessage({ type: 'download_event_file', event_file_id: event_file_obj.event_file_id_random, filename: event_file_obj.filename, auto_download: true }, '*');
|
||||
}}
|
||||
class="btn btn-md variant-ghost-primary hover:variant-filled-primary min-w-96"
|
||||
title={`Download this file: ${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 mx-1"></span>
|
||||
<span class="">
|
||||
Downloading
|
||||
{#if $ae_sess.api_download_kv[event_file_obj.hosted_file_id_random]}
|
||||
{$ae_sess.api_download_kv[event_file_obj.hosted_file_id_random].percent_completed}%
|
||||
{/if}
|
||||
:
|
||||
</span>
|
||||
{:then}
|
||||
<span class="fas fa-download mx-1"></span>
|
||||
<span class="text-sm">
|
||||
Download:
|
||||
</span>
|
||||
{/await}
|
||||
|
||||
<span class="grow">
|
||||
{ae_util.shorten_filename({filename: event_file_obj.filename, max_length: 25})}
|
||||
</span>
|
||||
|
||||
<span
|
||||
class="badge variant-glass-success hover:variant-filled-success text-sm"
|
||||
class:hidden={!event_file_obj.file_purpose}
|
||||
>
|
||||
{event_file_obj.file_purpose}
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<!-- Select from options for the purpose of this file -->
|
||||
{#if ae_tmp[event_file_obj.event_file_id_random] && ae_tmp[event_file_obj.event_file_id_random]?.show__edit_file_purpose === true}
|
||||
<Element_ae_crud
|
||||
trigger_patch={ae_triggers.update_event_file_purpose}
|
||||
api_cfg={$ae_api}
|
||||
object_type={'event_file'}
|
||||
object_id={event_file_obj.event_file_id_random}
|
||||
field_name={'file_purpose'}
|
||||
field_type={'button'}
|
||||
field_value={ae_tmp[event_file_obj.event_file_id_random].file_purpose}
|
||||
allow_null={false}
|
||||
hide_edit_btn={true}
|
||||
outline_element={false}
|
||||
show_crud={false}
|
||||
display_inline={false}
|
||||
class_li={'grow m-1 flex flex-row items-center'}
|
||||
on:ae_crud_updated={e => {
|
||||
console.log(`ae_crud_updated:`, e.detail);
|
||||
|
||||
events_func.handle_load_ae_obj_id__event_file({api_cfg: $ae_api, event_file_id: event_file_obj.event_file_id_random, log_lvl: 1})
|
||||
.then(function (load_results) {
|
||||
// We need to force reload the Indexed DB - Dexie.js?
|
||||
// Sometimes the changes are not seen. The file disappears when the Save button is pressed.
|
||||
|
||||
// Maybe reload page?
|
||||
// window.location.reload();
|
||||
})
|
||||
.finally(function () {
|
||||
// ae_tmp[event_file_obj.event_file_id_random].file_purpose = null;
|
||||
ae_tmp[event_file_obj.event_file_id_random].show__edit_file_purpose = false;
|
||||
// Careful with the trigger_patch. It will keep firing if not reset.
|
||||
ae_triggers.update_event_file_purpose = false;
|
||||
});
|
||||
}}
|
||||
>
|
||||
<label
|
||||
class="text-sm mx-1"
|
||||
>
|
||||
Purpose:
|
||||
<select
|
||||
bind:value={ae_tmp[event_file_obj.event_file_id_random].file_purpose}
|
||||
class="select min-w-fit max-w-fit text-sm mx-1"
|
||||
>
|
||||
<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>
|
||||
</label>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
on:click={() => {
|
||||
console.log('*** Save button clicked ***');
|
||||
// if (!confirm('Are you sure you want to save this event_presenter?')) {return false;}
|
||||
|
||||
console.log(`Selected event_file_id: ${event_file_obj.event_file_id_random}`);
|
||||
|
||||
ae_triggers.update_event_file_purpose = true;
|
||||
// ae_triggers.update_event_file_purpose = event_file_obj.event_file_id_random;
|
||||
|
||||
|
||||
|
||||
// ae_tmp.show__file_li = false;
|
||||
}}
|
||||
class="btn btn-sm variant-soft-success hover:variant-ghost-success mx-1"
|
||||
>
|
||||
<span class="fas fa-save mx-1"></span>
|
||||
Save
|
||||
</button>
|
||||
</Element_ae_crud>
|
||||
{:else}
|
||||
<button
|
||||
type="button"
|
||||
title="Edit the purpose of this file"
|
||||
on:click={() => {
|
||||
ae_tmp[event_file_obj.event_file_id_random] = {
|
||||
file_purpose: event_file_obj.file_purpose,
|
||||
show__edit_file_purpose: true
|
||||
}
|
||||
|
||||
// ae_tmp[event_file_obj.event_file_id_random].file_purpose = event_file_obj.file_purpose;
|
||||
// ae_tmp[event_file_obj.event_file_id_random].show__edit_file_purpose = true;
|
||||
}}
|
||||
class="btn btn-sm variant-soft-primary hover:variant-ghost-primary mx-1"
|
||||
>
|
||||
<span class="fas fa-edit mx-1"></span>
|
||||
Edit
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
|
||||
<button type="button"
|
||||
title="Delete this file"
|
||||
on:click={async () => {
|
||||
if (!confirm(`Are you sure you want to delete this file?\n${event_file_obj.filename} [${event_file_obj.event_file_id_random}]`)) {return false;}
|
||||
|
||||
ae_promises[event_file_obj.event_file_id_random] = handle_delete__event_file({event_file_id: event_file_obj.event_file_id_random});
|
||||
}}
|
||||
class="btn btn-sm variant-soft-warning event_file_delete_btn width_100"
|
||||
>
|
||||
<span class="fas fa-minus mx-1"></span>
|
||||
Delete
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col grow w-full text-xs">
|
||||
<span>
|
||||
Uploaded:
|
||||
{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'date_full')}
|
||||
{ae_util.iso_datetime_formatter(event_file_obj.created_on, 'time_short')}
|
||||
</span>
|
||||
<span>
|
||||
Size:
|
||||
{ae_util.format_bytes(event_file_obj.file_size)}
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
{/each}
|
||||
</ul>
|
||||
{:else}
|
||||
<p>No files uploaded</p>
|
||||
{/if}
|
||||
|
||||
|
||||
|
||||
<!-- <ul
|
||||
class="space-y-2 px-4"
|
||||
>
|
||||
{#if $events_slct.presenter_obj.file_li}
|
||||
{#each $events_slct.presenter_obj.file_li as file_obj}
|
||||
<li>
|
||||
<span class="fas fa-file"></span>
|
||||
<a
|
||||
href={file_obj.url}
|
||||
class="text-blue-500"
|
||||
>{file_obj.name}</a>
|
||||
</li>
|
||||
{/each}
|
||||
{:else}
|
||||
<li>
|
||||
<span class="fas fa-file"></span>
|
||||
No files uploaded
|
||||
</li>
|
||||
{/if}
|
||||
</ul> -->
|
||||
<Element_manage_event_file_li
|
||||
link_to_type={'event_presenter'}
|
||||
link_to_id={$lq__event_presenter_obj.event_presenter_id_random}
|
||||
allow_basic={$events_loc.auth__kv.session[$events_slct.event_session_id] || $events_loc.auth__kv.presenter[$events_slct.event_presenter_id]}
|
||||
allow_moderator={$events_loc.auth__kv.session[$events_slct.event_session_id]}
|
||||
/>
|
||||
|
||||
</section>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user