<script>
    import { getLocaleFromNavigator, _ } from "svelte-i18n";
    import {
        RunnerOrganizationService,
        RunnerTeamService,
    } from "@odit/lfk-client-js";
    import Toastify from "toastify-js";
    export let sponsoring_contracts_show = false;
    export let generate_runners = [];
    export let generate_orgs = [];
    export let generate_teams = [];
    $: sponsoring_contracts_download_open = false;
    document.addEventListener("click", function (e) {
        if (
            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown" &&
            e.target.parentNode?.parentNode?.id != "sponsoring:dropdown:menu"
        ) {
            sponsoring_contracts_download_open = false;
        }
    });

    function generateSponsoringContract(locale) {
        sponsoring_contracts_download_open = false;

        if (generate_orgs.length > 0) {
            generateOrgContracts(locale);
        } else if (generate_teams.length > 0) {
            generateTeamContracts(locale);
        } else {
            generateRunnerContracts(locale);
        }
    }

    async function generateTeamContracts(locale) {
        const toast = Toastify({
            text: $_("generating-pdfs"),
            duration: -1,
        }).showToast();
        let count = 0;
        for (const t of generate_teams) {
            count++;
            const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
                t.id
            );
            fetch(
                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
                {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    body: JSON.stringify(runners),
                }
            )
                .then((response) => {
                    if (response.status != "200") {
                        toast.hideToast();
                        Toastify({
                            text: $_("pdf-generation-failed"),
                            duration: 3500,
                            backgroundColor:
                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
                        }).showToast();
                    } else {
                        return response.blob();
                    }
                })
                .then((blob) => {
                    const url = window.URL.createObjectURL(blob);
                    let a = document.createElement("a");
                    a.href = url;
                    a.download = "Sponsorings_" + t.name + ".pdf";
                    document.body.appendChild(a);
                    a.click();
                    a.remove();
                    if (count === generate_teams.length) {
                        toast.hideToast();
                        Toastify({
                            text: $_("pdfs-successfully-generated"),
                            duration: 3500,
                            backgroundColor:
                                "linear-gradient(to right, #00b09b, #96c93d)",
                        }).showToast();
                    }
                })
                .catch((err) => {});
        }
    }

    async function generateOrgContracts(locale) {
        const toast = Toastify({
            text: $_("generating-pdf"),
            duration: -1,
        }).showToast();
        for (const o of generate_orgs) {
            const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
                o.id
            );
            fetch(
                `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
                {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    body: JSON.stringify(runners),
                }
            )
                .then((response) => {
                    if (response.status != "200") {
                        toast.hideToast();
                        Toastify({
                            text: $_("pdf-generation-failed"),
                            duration: 3500,
                            backgroundColor:
                                "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
                        }).showToast();
                    } else {
                        return response.blob();
                    }
                })
                .then((blob) => {
                    count++;
                    const url = window.URL.createObjectURL(blob);
                    let a = document.createElement("a");
                    a.href = url;
                    a.download = "Sponsorings_" + o.name + ".pdf";
                    document.body.appendChild(a);
                    a.click();
                    a.remove();
                    if (count === generate_orgs.length) {
                        toast.hideToast();
                        Toastify({
                            text: $_("pdfs-successfully-generated"),
                            duration: 3500,
                            backgroundColor:
                                "linear-gradient(to right, #00b09b, #96c93d)",
                        }).showToast();
                    }
                })
                .catch((err) => {});
        }
    }

    function generateRunnerContracts(locale) {
        const toast = Toastify({
            text: $_("generating-pdf"),
            duration: -1,
        }).showToast();
        fetch(
            `${config.baseurl}/documents/contracts?locale=${locale}&download=true&key=${config.documentserver_key}`,
            {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                },
                body: JSON.stringify(generate_runners),
            }
        )
            .then((response) => {
                if (response.status != "200") {
                    toast.hideToast();
                    Toastify({
                        text: $_("pdf-generation-failed"),
                        duration: 3500,
                        backgroundColor:
                            "linear-gradient(90deg, hsla(281, 37%, 45%, 1) 0%, hsla(1, 62%, 48%, 1) 100%)",
                    }).showToast();
                } else {
                    return response.blob();
                }
            })
            .then((blob) => {
                const url = window.URL.createObjectURL(blob);
                let a = document.createElement("a");
                a.href = url;
                a.download = "Sponsoring.pdf";
                document.body.appendChild(a);
                a.click();
                a.remove();
                toast.hideToast();
                Toastify({
                    text: $_("pdf-successfully-generated"),
                    duration: 3500,
                    backgroundColor:
                        "linear-gradient(to right, #00b09b, #96c93d)",
                }).showToast();
            })
            .catch((err) => {
                console.error(err);
            });
    }
</script>

{#if sponsoring_contracts_show}
    <div id="sponsoring:dropdown" class="relative inline-block">
        <div>
            <button
                on:click={() => {
                    sponsoring_contracts_download_open = !sponsoring_contracts_download_open;
                }}
                type="button"
                class="w-full justify-center rounded-md border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-base font-medium text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 sm:ml-3 sm:w-auto sm:text-sm inline-flex"
                id="options-menu"
                aria-haspopup="true"
                aria-expanded="true">
                {$_('generate-sponsoring-contracts')}
                <svg
                    xmlns="http://www.w3.org/2000/svg"
                    width="24"
                    height="24"
                    viewBox="0 0 24 24"
                    class="-mr-1 ml-2 h-5 w-5"><path
                        fill="none"
                        d="M0 0h24v24H0z" />
                    <path
                        fill="currentColor"
                        d="M3 19h18v2H3v-2zm10-5.83l6.07-6.07 1.42 1.41L12 17 3.52 8.52l1.4-1.42L11 13.17V2h2v11.17z" /></svg>
            </button>
        </div>
        {#if sponsoring_contracts_download_open}
            <div
                class="origin-top-right absolute right-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5"
                id="sponsoring:dropdown:menu">
                <div
                    class="py-1"
                    role="menu"
                    aria-orientation="vertical"
                    aria-labelledby="options-menu">
                    <span
                        class="block w-full text-left px-4 py-2 text-sm text-gray-700">{$_('select-language')}</span>
                    <button
                        on:click={() => {
                            generateSponsoringContract('de');
                        }}
                        type="submit"
                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
                        role="menuitem">
                        {$_('german')}
                    </button>
                    <button
                        on:click={() => {
                            generateSponsoringContract('en');
                        }}
                        type="submit"
                        class="block w-full text-left px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 hover:text-gray-900 focus:outline-none focus:bg-gray-100 focus:text-gray-900"
                        role="menuitem">
                        {$_('english')}
                    </button>
                </div>
            </div>
        {/if}
    </div>
{/if}
