MapComplete/UI/DownloadFlow/DownloadPdf.svelte

<script lang="ts">

    import DownloadButton from "./DownloadButton.svelte";
    import ThemeViewState from "../../Models/ThemeViewState";
    import {SvgToPdf} from "../../Utils/svgToPdf";
    import type {PdfTemplateInfo} from "../../Utils/svgToPdf";
    import Translations from "../i18n/Translations";
    import {Translation} from "../i18n/Translation";
    import {Utils} from "../../Utils";
    import {AvailableRasterLayers} from "../../Models/RasterLayers";
    import Constants from "../../Models/Constants";
    import Locale from "../i18n/Locale";
    import {UIEventSource} from "../../Logic/UIEventSource";
    import DownloadHelper from "./DownloadHelper";

    export let templateName: string
    export let state: ThemeViewState
    const template: PdfTemplateInfo = SvgToPdf.templates[templateName]
    console.log("template", template)
    let mainText: Translation = typeof template.description === "string" ? new Translation(template.description) : template.description
    let t = Translations.t.general.download
    const downloadHelper = new DownloadHelper(state)

    async function constructPdf(_, title: string, status: UIEventSource<string>) {
        title=title.substring(0, title.length - 4)+"_"+template.format+"_"+template.orientation
        const templateUrls = SvgToPdf.templates[templateName].pages
        const templates: string[] = await Promise.all(templateUrls.map(url => Utils.download(url)))
        console.log("Templates are", templates)
        const bg = state.mapProperties.rasterLayer.data ?? AvailableRasterLayers.maplibre
        const creator = new SvgToPdf(title, templates, {
            state,
            freeComponentId: "belowmap",
            createImage: (key: string, width: string, height: string) => downloadHelper.createImage(key, width, height),
            textSubstitutions: <Record<string, string>>{
                "layout.title": state.layout.title,
                layoutid: state.layout.id,
                title: state.layout.title,
                layoutImg: state.layout.icon,
                version: Constants.vNumber,
                date: new Date().toISOString().substring(0, 16),
                background: new Translation(bg.properties.name).txt
            }
        })

        const unsub = creator.status.addCallbackAndRunD(s => {
            console.log("SVG creator status:", s)
            status?.setData(s);
        })
        await creator.ExportPdf(Locale.language.data)
        unsub()
        return undefined
    }
</script>


<DownloadButton construct={constructPdf}
                extension="pdf"
                helperText={t.downloadAsPdfHelper}
                metaIsIncluded={false}
                {mainText}
                mimetype="application/pdf"
                {state}
/>