<script lang="ts">
    interface Props {
        log_lvl?: number;
        event_file_id: string;
        event_file_obj: any;
        max_filename_length?: number;
        hide_launch_icon?: boolean;
        hide_meta?: boolean;
        hide_created_on?: boolean;
        hide_os?: boolean;
        hide_size?: boolean;
        hide_draft?: boolean;
        show_bak_download?: boolean;
        btn_size?: string;
        btn_text_align?: string;
        text_size?: string;
        text_size_md?: string;
        session_type?: string;
        open_method?: null | string;
        modal_title?: string;

        modal__title?: any;
        modal__open_event_file_id?: any;
        modal__event_file_obj?: any;
    }

    let {
        log_lvl = $bindable(0),
        event_file_id,
        event_file_obj = $bindable({}),
        max_filename_length = $bindable(50),
        hide_launch_icon = $bindable(false),
        hide_meta = $bindable(false),
        hide_created_on = $bindable(false),
        hide_os = $bindable(false),
        hide_size = $bindable(false),
        hide_draft = $bindable(false),
        show_bak_download = false,
        btn_size = $bindable('btn-sm'),
        btn_text_align = $bindable('text-left'),
        text_size = $bindable('text-sm'),
        text_size_md = $bindable('md:text-base'),
        session_type = $bindable('oral'),
        open_method = $bindable('download'),
        modal_title = $bindable(''),

        modal__title = $bindable(''),
        modal__open_event_file_id = $bindable(null),
        modal__event_file_obj = $bindable(null)
    }: Props = $props();

    import { onMount } from 'svelte';
    import { fade } from 'svelte/transition';

    import type { key_val } from '$lib/stores/ae_stores';
    import { ae_util } from '$lib/ae_utils/ae_utils';
    import { api } from '$lib/api/api';
    import { ae_loc, ae_api, ae_sess, slct } from '$lib/stores/ae_stores';
    import { core_func } from '$lib/ae_core/ae_core_functions';
    import {
        events_loc,
        events_sess,
        events_slct
    } from '$lib/stores/ae_events_stores';
    import { events_func } from '$lib/ae_events_functions';

    import AE_Comp_Hosted_Files_Download_Button from '$lib/ae_core/ae_comp__hosted_files_download_button.svelte';
    import Element_ae_crud from '$lib/elements/element_ae_crud.svelte';

    // Import the relay
    import * as native from '$lib/electron/electron_relay';

    let ae_promises: key_val = $state({});
    let ae_tmp: key_val = $state({});
    let ae_triggers: key_val = $state({});

    let open_file_clicked: null | boolean = $state(null);
    let open_file_status: null | string = $state(null);
    let open_file_status_message: null | string = $state(null);

    let screen_saver_exts = ['jpg', 'png', 'PNG', 'webp'];

    onMount(() => {
        if (screen_saver_exts.includes(event_file_obj.extension)) {
            if (!$events_loc.launcher.screen_saver_img_kv)
                $events_loc.launcher.screen_saver_img_kv = {};
            $events_loc.launcher.screen_saver_img_kv[event_file_id] = {
                ...event_file_obj
            };
        }
    });

    async function handle_open_file() {
        if (log_lvl) console.log('*** handle_open_file() ***');
        if (open_file_clicked) return; // Hard Guard: Already processing

        $events_slct.event_file_id = event_file_id;
        $events_slct.event_file_obj = event_file_obj;

        // 1. NATIVE MODE (Electron)
        if ($ae_loc.is_native && $events_loc.launcher.app_mode === 'native') {
            const cache_root = $ae_loc.local_file_cache_path;
            const temp_root = $ae_loc.host_file_temp_path;

            open_file_clicked = true;
            open_file_status = 'checking_cache';
            open_file_status_message = 'Checking local cache...';

            const exists = await native.check_hash_file_cache({
                cache_root,
                hash: event_file_obj.hash_sha256,
                verify_hash: true // Hardened: Trust No One!
            });

            if (!exists) {
                open_file_status = 'downloading_file';
                open_file_status_message = 'Downloading file to cache...';

                // Use the PROVEN endpoint path from api.ts that is known to work in Default Mode.
                const url = `${$ae_api.base_url}/v3/action/hosted_file/${event_file_obj.hosted_file_id}/download?return_file=true&filename=${encodeURIComponent(event_file_obj.filename)}&key=${$ae_api.account_id}`;

                const dl_result = await native.download_to_cache({
                    url,
                    cache_root,
                    hash: event_file_obj.hash_sha256,
                    api_key: $ae_api.api_secret_key,
                    account_id: $ae_api.account_id
                });

                if (!dl_result.success) {
                    open_file_status = 'error';
                    open_file_status_message = `Download failed: ${dl_result.error}`;
                    setTimeout(() => (open_file_clicked = false), 5000);
                    return false;
                }
            }

            open_file_status = 'opening_file';
            open_file_status_message = 'Opening Application';

            // Phase 2/5: Use the atomic copy-and-launch operation.
            // The main process handler (file_handlers.ts) now handles the
            // specialized LibreOffice/AppleScript logic internally after copying.
            const launch_result = await native.launch_from_cache({
                cache_root,
                hash: event_file_obj.hash_sha256,
                temp_root,
                filename: event_file_obj.filename
            });

            if (!launch_result.success) {
                open_file_status = 'error';
                open_file_status_message = `Failed to open: ${launch_result.error}`;
            }

            setTimeout(() => (open_file_clicked = false), 5000);
            return launch_result.success;
        }
        // 2. ONSITE MODE (Browser with Modified Extensions)
        else if ($events_loc.launcher.app_mode === 'onsite') {
            open_file_clicked = true;
            open_file_status = 'downloading_onsite';
            open_file_status_message = 'Downloading (Onsite Mode)...';

            let filename = event_file_obj.filename;
            if (
                (event_file_obj.extension === 'ppt' ||
                    event_file_obj.extension === 'pptx') &&
                event_file_obj.open_in_os === 'win'
            ) {
                filename = event_file_obj.filename + 'win';
            }

            const dl_promise = api.get_object({
                api_cfg: $ae_api,
                endpoint: `/v3/action/hosted_file/${event_file_obj.hosted_file_id}/download`,
                params: {
                    filename: filename,
                    x_no_account_id_token: 'direct-download'
                },
                filename: filename,
                return_blob: true,
                auto_download: true,
                log_lvl: 1
            });

            setTimeout(() => (open_file_clicked = false), 5000);
            return dl_promise;
        }
        // 3. DEFAULT MODE (Standard Browser)
        else {
            open_file_clicked = true;
            open_file_status = 'downloading_default';
            open_file_status_message = 'Downloading...';

            const dl_promise = api.get_object({
                api_cfg: $ae_api,
                endpoint: `/v3/action/hosted_file/${event_file_obj.hosted_file_id}/download`,
                params: {
                    filename: event_file_obj.filename,
                    x_no_account_id_token: 'direct-download'
                },
                filename: event_file_obj.filename,
                return_blob: true,
                auto_download: true,
                log_lvl: 1
            });

            if ($events_loc.launcher.controller == 'local_push') {
                $events_sess.launcher.controller_cmd = `ae_download:hosted_file=${event_file_obj.hosted_file_id}:${event_file_obj.filename}:${event_file_obj.extension}`;
                $events_sess.launcher.controller_trigger_send = true;
            }

            setTimeout(() => (open_file_clicked = false), 5000);
            return dl_promise;
        }
    }

    function prevent_default<T extends Event>(fn: (event: T) => void) {
        return function (event: T) {
            event.preventDefault();
            fn(event);
        };
    }
</script>

<div
    class:justify-between={!hide_meta}
    class:justify-center={hide_meta}
    class:hidden={hide_draft &&
        (event_file_obj.file_purpose == 'outline' ||
            event_file_obj.file_purpose == 'draft')}
    class="event_launcher_file_cont grow flex flex-col md:flex-row flex-wrap gap-1 items-center justify-center max-w-full transition-all"
>
    {#if open_file_clicked}
        <div
            class="open_file_clicked alert"
            in:fade={{ duration: 250 }}
            out:fade={{ duration: 2000 }}
        >
            <div class="alert_msg_pulse">
                <strong
                    >*** {open_file_status_message ||
                        'Please wait while this file downloads...'} ***</strong
                >
            </div>
            {#if $ae_loc.is_native && $events_loc.launcher.app_mode === 'native'}
                <p>Most files will automatically be opened full screen.</p>
                <p>
                    PowerPoint or KeyNote will attempt to display in presenter view.
                </p>
                <p>Please close the file when finished.</p>
            {/if}
        </div>
    {/if}

    <span
        class="event_file_action grow max-w-full flex flex-row flex-wrap gap-1 items-center justify-center"
    >
        {#if session_type == 'poster' || open_method == 'modal'}
            <AE_Comp_Hosted_Files_Download_Button
                hosted_file_id={event_file_id}
                hosted_file_obj={event_file_obj}
                classes="btn btn-sm md:btn-md lg:btn-lg preset-tonal-primary border border-primary-500 min-w-96"
                click={() => {
                    modal__open_event_file_id = event_file_id;
                    modal__event_file_obj = event_file_obj;
                    if (!modal__title) modal__title = event_file_obj.filename;
                    $events_slct.event_file_id = event_file_id;
                    $events_slct.event_file_obj = event_file_obj;
                }}
            >
                {#snippet label()}
                    {#if screen_saver_exts.includes(event_file_obj.extension)}
                        <span
                            class="fas fa-chart-bar m-1"
                            class:hidden={hide_launch_icon}
                        ></span> Open Poster
                    {:else}
                        <span
                            class="fas fa-paper-plane m-1"
                            class:hidden={hide_launch_icon}
                        ></span>
                        {ae_util.shorten_filename({
                            filename: event_file_obj.filename,
                            max_length: max_filename_length
                        })}
                    {/if}
                {/snippet}
            </AE_Comp_Hosted_Files_Download_Button>
        {:else}
            <AE_Comp_Hosted_Files_Download_Button
                hosted_file_id={event_file_id}
                hosted_file_obj={event_file_obj}
                classes="btn {btn_size} gap-1 justify-between min-w-full w-full max-w-96 preset-tonal-primary border border-primary-500"
                click={handle_open_file}
            >
                {#snippet label()}
                    {@const file_id = event_file_obj.hosted_file_id}
                    <span class="shrink text-xs border-r border-gray-400 pr-1">
                        {#await ae_promises[event_file_id]}
                            <span class="fas fa-spinner fa-spin mx-0.5"></span>
                            <span>
                                {#if $ae_sess.api_download_kv[file_id]}
                                    {$ae_sess.api_download_kv[file_id]
                                        .percent_completed}%
                                {:else}
                                    ...
                                {/if}
                            </span>
                        {:then result}
                            <span
                                class="fas fa-{ae_util.file_extension_icon(
                                    event_file_obj.extension
                                )} mx-0.5"
                            ></span>
                            {event_file_obj.extension}
                            {#if result === null || result === false}
                                <span class="text-error-500"
                                    ><span
                                        class="fas fa-exclamation-triangle mx-1"
                                    ></span>Failed!</span
                                >
                            {/if}
                        {:catch error}
                            <span class="text-error-500" title={error?.message}
                                ><span class="fas fa-exclamation-circle mx-0.5"
                                ></span>Error!</span
                            >
                        {/await}
                    </span>

                    <span
                        class="grow {text_size} {text_size_md} w-full max-w-full overflow-hidden text-ellipsis {btn_text_align}"
                    >
                        {ae_util.shorten_string({
                            string: event_file_obj.filename_no_ext,
                            begin_length: 45,
                            max_length: 65
                        })}
                    </span>

                    <span
                        class="badge my-0 py-0.5 preset-tonal-success hover:preset-filled-success-500 text-xs xl:text-sm"
                        class:hidden={!event_file_obj.file_purpose}
                    >
                        {event_file_obj.file_purpose}
                    </span>
                {/snippet}
            </AE_Comp_Hosted_Files_Download_Button>
        {/if}
    </span>

    <span
        class="event_file_meta grow text-sm text-gray-500 flex flex-col sm:flex-row gap-1 wrap items-center justify-between w-64 max-w-80 font-mono"
        class:hidden={hide_meta}
    >
        <Element_ae_crud
            trigger_patch={ae_triggers.open_in_os}
            api_cfg={$ae_api}
            object_type={'event_file'}
            object_id={event_file_id}
            field_name={'open_in_os'}
            field_type={'button'}
            field_value={ae_tmp.value__open_in_os}
            on:ae_crud_updated={() => {
                events_func.load_ae_obj_id__event_file({
                    api_cfg: $ae_api,
                    event_file_id: event_file_obj?.event_file_id,
                    log_lvl
                });
            }}
        >
            <button
                type="button"
                onclick={() => {
                    if (!event_file_obj?.open_in_os)
                        ae_tmp.value__open_in_os = 'win';
                    else if (event_file_obj?.open_in_os == 'win')
                        ae_tmp.value__open_in_os = 'mac';
                    else ae_tmp.value__open_in_os = null;
                    ae_triggers.open_in_os = true;
                }}
                class="btn btn-sm transition-all group"
                class:preset-tonal-success={event_file_obj?.open_in_os == 'win'}
                class:preset-tonal-warning={event_file_obj?.open_in_os == 'mac'}
                disabled={!$ae_loc.trusted_access}
            >
                {#if event_file_obj?.open_in_os == 'win'}<span
                        class="fab fa-windows m-1"
                    ></span>
                {:else if event_file_obj?.open_in_os == 'mac'}<span
                        class="fab fa-apple m-1"
                    ></span>
                {:else}<span class="fas fa-folder-open m-1"></span>{/if}
            </button>
        </Element_ae_crud>

        <span
            class="event_file_created_on text-xs text-center flex flex-row gap-1 items-center justify-end w-24 md:w-44 preset-filled-surface-100-900 rounded px-1 py-0.5"
            class:hidden={hide_created_on}
        >
            <span class="fas fa-calendar-day"></span>
            <span class="w-18"
                >{ae_util.iso_datetime_formatter(
                    event_file_obj.created_on,
                    'date_short'
                )}</span
            >
        </span>

        <span
            class="event_file_size text-xs text-center flex flex-row gap-1 items-center justify-end preset-filled-surface-100-900 w-22 max-w-28 rounded py-0.5"
            class:hidden={hide_size}
        >
            <span class="fas fa-save"></span>
            {#if event_file_obj.file_size}{ae_util.format_bytes(
                    event_file_obj.file_size
                )}{/if}
        </span>
    </span>
</div>
