MapComplete/src/UI/Popup/ExportFeatureButton.svelte

39 lines
1.4 KiB
Svelte

<script lang="ts">
import ArrowDownTray from "@babeard/svelte-heroicons/mini/ArrowDownTray"
import Tr from "../Base/Tr.svelte"
import Translations from "../i18n/Translations"
import { Store } from "../../Logic/UIEventSource"
import LayerConfig from "../../Models/ThemeConfig/LayerConfig"
import type { Feature, LineString } from "geojson"
import { Utils } from "../../Utils"
import { Translation } from "../i18n/Translation"
const t = Translations.t.general.download
export let tags: Store<Record<string, string>>
export let layer: LayerConfig
export let feature: Feature
export let mimetype: string
export let extension: string
export let maintext: Translation
export let helpertext: Translation
export let construct: (feature: Feature, title: string) => Blob | string
function exportGpx() {
console.log("Exporting as GPX!")
const tgs = tags.data
const title = layer.title?.GetRenderValue(tgs)?.Subs(tgs)?.txt ?? "gpx_track"
const data = construct(feature, title)
Utils.offerContentsAsDownloadableFile(data, title + "_mapcomplete_export." + extension, {
mimetype,
})
}
</script>
<button class="w-full" on:click={() => exportGpx()}>
<ArrowDownTray class="mr-2 h-11 w-11" />
<div class="flex w-full flex-col items-start">
<Tr t={maintext} cls="font-bold text-lg" />
<Tr t={helpertext} cls="subtle text-start" />
</div>
</button>