forked from MapComplete/MapComplete
Chore: reformat all files with prettier
This commit is contained in:
parent
5757ae5dea
commit
d008dcb54d
214 changed files with 8926 additions and 8196 deletions
|
|
@ -1,98 +1,95 @@
|
|||
<script lang="ts">
|
||||
import type { SpecialVisualizationState } from "../SpecialVisualization"
|
||||
import { ArrowDownTrayIcon } from "@babeard/svelte-heroicons/mini"
|
||||
import Tr from "../Base/Tr.svelte"
|
||||
import Translations from "../i18n/Translations"
|
||||
import type { FeatureCollection } from "geojson"
|
||||
import Loading from "../Base/Loading.svelte"
|
||||
import { Translation } from "../i18n/Translation"
|
||||
import DownloadHelper from "./DownloadHelper"
|
||||
import { Utils } from "../../Utils"
|
||||
import type { PriviligedLayerType } from "../../Models/Constants"
|
||||
import { UIEventSource } from "../../Logic/UIEventSource"
|
||||
|
||||
import type {SpecialVisualizationState} from "../SpecialVisualization";
|
||||
import {ArrowDownTrayIcon} from "@babeard/svelte-heroicons/mini";
|
||||
import Tr from "../Base/Tr.svelte";
|
||||
import Translations from "../i18n/Translations";
|
||||
import type {FeatureCollection} from "geojson";
|
||||
import Loading from "../Base/Loading.svelte";
|
||||
import {Translation} from "../i18n/Translation";
|
||||
import DownloadHelper from "./DownloadHelper";
|
||||
import {Utils} from "../../Utils";
|
||||
import type {PriviligedLayerType} from "../../Models/Constants";
|
||||
import {UIEventSource} from "../../Logic/UIEventSource";
|
||||
export let state: SpecialVisualizationState
|
||||
|
||||
export let state: SpecialVisualizationState
|
||||
export let extension: string
|
||||
export let mimetype: string
|
||||
export let construct: (
|
||||
geojsonCleaned: FeatureCollection,
|
||||
title: string,
|
||||
status?: UIEventSource<string>
|
||||
) => (Blob | string) | Promise<void>
|
||||
export let mainText: Translation
|
||||
export let helperText: Translation
|
||||
export let metaIsIncluded: boolean
|
||||
let downloadHelper: DownloadHelper = new DownloadHelper(state)
|
||||
|
||||
export let extension: string
|
||||
export let mimetype: string
|
||||
export let construct: (geojsonCleaned: FeatureCollection, title: string, status?: UIEventSource<string>) => (Blob | string) | Promise<void>
|
||||
export let mainText: Translation
|
||||
export let helperText: Translation
|
||||
export let metaIsIncluded: boolean
|
||||
let downloadHelper: DownloadHelper = new DownloadHelper(state)
|
||||
const t = Translations.t.general.download
|
||||
|
||||
const t = Translations.t.general.download
|
||||
let isExporting = false
|
||||
let isError = false
|
||||
|
||||
let isExporting = false
|
||||
let isError = false
|
||||
let status: UIEventSource<string> = new UIEventSource<string>(undefined)
|
||||
|
||||
let status: UIEventSource<string> = new UIEventSource<string>(undefined)
|
||||
async function clicked() {
|
||||
isExporting = true
|
||||
const gpsLayer = state.layerState.filteredLayers.get(<PriviligedLayerType>"gps_location")
|
||||
state.lastClickObject.features.setData([])
|
||||
|
||||
async function clicked() {
|
||||
isExporting = true
|
||||
const gpsLayer = state.layerState.filteredLayers.get(
|
||||
<PriviligedLayerType>"gps_location"
|
||||
)
|
||||
state.lastClickObject.features.setData([])
|
||||
|
||||
const gpsIsDisplayed = gpsLayer.isDisplayed.data
|
||||
try {
|
||||
gpsLayer.isDisplayed.setData(false)
|
||||
const geojson: FeatureCollection = downloadHelper.getCleanGeoJson(metaIsIncluded)
|
||||
const name = state.layout.id
|
||||
|
||||
const title = `MapComplete_${name}_export_${new Date().toISOString().substr(0, 19)}.${extension}`
|
||||
const promise = construct(geojson, title, status)
|
||||
let data: Blob | string
|
||||
if (typeof promise === "string") {
|
||||
data = promise
|
||||
} else if (typeof promise["then"] === "function") {
|
||||
data = await <Promise<Blob | string>>promise
|
||||
} else {
|
||||
data = <Blob>promise
|
||||
}
|
||||
if (!data) {
|
||||
return
|
||||
}
|
||||
console.log("Got data", data)
|
||||
Utils.offerContentsAsDownloadableFile(
|
||||
data,
|
||||
title,
|
||||
{
|
||||
mimetype,
|
||||
}
|
||||
)
|
||||
} catch (e) {
|
||||
isError = true
|
||||
console.error(e)
|
||||
} finally {
|
||||
isExporting = false
|
||||
gpsLayer.isDisplayed.setData(gpsIsDisplayed)
|
||||
}
|
||||
const gpsIsDisplayed = gpsLayer.isDisplayed.data
|
||||
try {
|
||||
gpsLayer.isDisplayed.setData(false)
|
||||
const geojson: FeatureCollection = downloadHelper.getCleanGeoJson(metaIsIncluded)
|
||||
const name = state.layout.id
|
||||
|
||||
const title = `MapComplete_${name}_export_${new Date()
|
||||
.toISOString()
|
||||
.substr(0, 19)}.${extension}`
|
||||
const promise = construct(geojson, title, status)
|
||||
let data: Blob | string
|
||||
if (typeof promise === "string") {
|
||||
data = promise
|
||||
} else if (typeof promise["then"] === "function") {
|
||||
data = await (<Promise<Blob | string>>promise)
|
||||
} else {
|
||||
data = <Blob>promise
|
||||
}
|
||||
if (!data) {
|
||||
return
|
||||
}
|
||||
console.log("Got data", data)
|
||||
Utils.offerContentsAsDownloadableFile(data, title, {
|
||||
mimetype,
|
||||
})
|
||||
} catch (e) {
|
||||
isError = true
|
||||
console.error(e)
|
||||
} finally {
|
||||
isExporting = false
|
||||
gpsLayer.isDisplayed.setData(gpsIsDisplayed)
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if isError}
|
||||
<Tr cls="alert" t={Translations.t.general.error}/>
|
||||
<Tr cls="alert" t={Translations.t.general.error} />
|
||||
{:else if isExporting}
|
||||
<Loading>
|
||||
{#if $status}
|
||||
{$status}
|
||||
{:else}
|
||||
<Tr t={t.exporting}/>
|
||||
{/if}
|
||||
</Loading>
|
||||
<Loading>
|
||||
{#if $status}
|
||||
{$status}
|
||||
{:else}
|
||||
<Tr t={t.exporting} />
|
||||
{/if}
|
||||
</Loading>
|
||||
{:else}
|
||||
<button class="flex w-full" on:click={clicked}>
|
||||
<slot name="image">
|
||||
<ArrowDownTrayIcon class="w-12 h-12 mr-2 shrink-0"/>
|
||||
</slot>
|
||||
<span class="flex flex-col items-start">
|
||||
<Tr t={mainText}/>
|
||||
<Tr t={helperText} cls="subtle"/>
|
||||
</span>
|
||||
</button>
|
||||
<button class="flex w-full" on:click={clicked}>
|
||||
<slot name="image">
|
||||
<ArrowDownTrayIcon class="w-12 h-12 mr-2 shrink-0" />
|
||||
</slot>
|
||||
<span class="flex flex-col items-start">
|
||||
<Tr t={mainText} />
|
||||
<Tr t={helperText} cls="subtle" />
|
||||
</span>
|
||||
</button>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import {SpecialVisualizationState} from "../SpecialVisualization";
|
||||
import {Feature, FeatureCollection} from "geojson";
|
||||
import {BBox} from "../../Logic/BBox";
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig";
|
||||
import {Utils} from "../../Utils";
|
||||
import { SpecialVisualizationState } from "../SpecialVisualization"
|
||||
import { Feature, FeatureCollection } from "geojson"
|
||||
import { BBox } from "../../Logic/BBox"
|
||||
import LayerConfig from "../../Models/ThemeConfig/LayerConfig"
|
||||
import { Utils } from "../../Utils"
|
||||
import SimpleMetaTagger from "../../Logic/SimpleMetaTagger"
|
||||
import geojson2svg from "geojson2svg"
|
||||
|
||||
|
|
@ -10,11 +10,10 @@ import geojson2svg from "geojson2svg"
|
|||
* Exposes the download-functionality
|
||||
*/
|
||||
export default class DownloadHelper {
|
||||
private readonly _state: SpecialVisualizationState;
|
||||
private readonly _state: SpecialVisualizationState
|
||||
|
||||
constructor(state: SpecialVisualizationState) {
|
||||
this._state = state;
|
||||
|
||||
this._state = state
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -23,8 +22,8 @@ export default class DownloadHelper {
|
|||
private static cleanFeature(f: Feature): Feature {
|
||||
f = {
|
||||
type: f.type,
|
||||
geometry: {...f.geometry},
|
||||
properties: {...f.properties},
|
||||
geometry: { ...f.geometry },
|
||||
properties: { ...f.properties },
|
||||
}
|
||||
|
||||
for (const key in f.properties) {
|
||||
|
|
@ -46,9 +45,7 @@ export default class DownloadHelper {
|
|||
return f
|
||||
}
|
||||
|
||||
public getCleanGeoJson(
|
||||
includeMetaData: boolean
|
||||
): FeatureCollection {
|
||||
public getCleanGeoJson(includeMetaData: boolean): FeatureCollection {
|
||||
const featuresPerLayer = this.getCleanGeoJsonPerLayer(includeMetaData)
|
||||
const features = [].concat(...Array.from(featuresPerLayer.values()))
|
||||
return {
|
||||
|
|
@ -79,15 +76,13 @@ export default class DownloadHelper {
|
|||
* perLayer.set("testlayer", features)
|
||||
* new DownloadHelper(<any> {perLayer}).asSvg().replace(/\n/g, "") // => `<svg width="1000px" height="1000px" viewBox="0 0 1000 1000"> <g id="testlayer" inkscape:groupmode="layer" inkscape:label="testlayer"> <path d="M0,27.77777777777778 1000,472.22222222222223" style="fill:none;stroke-width:1" stroke="#ff0000"/> </g></svg>`
|
||||
*/
|
||||
public asSvg(
|
||||
options?: {
|
||||
layers?: LayerConfig[]
|
||||
width?: 1000 | number
|
||||
height?: 1000 | number
|
||||
mapExtent?: BBox
|
||||
unit?: "px" | "mm" | string
|
||||
}
|
||||
) {
|
||||
public asSvg(options?: {
|
||||
layers?: LayerConfig[]
|
||||
width?: 1000 | number
|
||||
height?: 1000 | number
|
||||
mapExtent?: BBox
|
||||
unit?: "px" | "mm" | string
|
||||
}) {
|
||||
const perLayer = this._state.perLayer
|
||||
options = options ?? {}
|
||||
const width = options.width ?? 1000
|
||||
|
|
@ -96,7 +91,7 @@ export default class DownloadHelper {
|
|||
throw "Invalid width of height, they should be > 0"
|
||||
}
|
||||
const unit = options.unit ?? "px"
|
||||
const mapExtent = {left: -180, bottom: -90, right: 180, top: 90}
|
||||
const mapExtent = { left: -180, bottom: -90, right: 180, top: 90 }
|
||||
if (options.mapExtent !== undefined) {
|
||||
const bbox = options.mapExtent
|
||||
mapExtent.left = bbox.minLon
|
||||
|
|
@ -104,7 +99,7 @@ export default class DownloadHelper {
|
|||
mapExtent.bottom = bbox.minLat
|
||||
mapExtent.top = bbox.maxLat
|
||||
}
|
||||
console.log("Generateing svg, extent:", {mapExtent, width, height})
|
||||
console.log("Generateing svg, extent:", { mapExtent, width, height })
|
||||
const elements: string[] = []
|
||||
|
||||
for (const layer of Array.from(perLayer.keys())) {
|
||||
|
|
@ -117,7 +112,7 @@ export default class DownloadHelper {
|
|||
const rendering = layerDef?.lineRendering[0]
|
||||
|
||||
const converter = geojson2svg({
|
||||
viewportSize: {width, height},
|
||||
viewportSize: { width, height },
|
||||
mapExtent,
|
||||
output: "svg",
|
||||
attributes: [
|
||||
|
|
@ -140,7 +135,7 @@ export default class DownloadHelper {
|
|||
feature.properties.stroke = Utils.colorAsHex(Utils.color(stroke))
|
||||
}
|
||||
|
||||
const groupPaths: string[] = converter.convert({type: "FeatureCollection", features})
|
||||
const groupPaths: string[] = converter.convert({ type: "FeatureCollection", features })
|
||||
const group =
|
||||
` <g id="${layer}" inkscape:groupmode="layer" inkscape:label="${layer}">\n` +
|
||||
groupPaths.map((p) => " " + p).join("\n") +
|
||||
|
|
@ -154,9 +149,7 @@ export default class DownloadHelper {
|
|||
return header + "\n" + elements.join("\n") + "\n</svg>"
|
||||
}
|
||||
|
||||
public getCleanGeoJsonPerLayer(
|
||||
includeMetaData: boolean
|
||||
): Map<string, Feature[]> {
|
||||
public getCleanGeoJsonPerLayer(includeMetaData: boolean): Map<string, Feature[]> {
|
||||
const state = this._state
|
||||
const featuresPerLayer = new Map<string, any[]>()
|
||||
const neededLayers = state.layout.layers.filter((l) => l.source !== null).map((l) => l.id)
|
||||
|
|
@ -188,15 +181,20 @@ export default class DownloadHelper {
|
|||
createImage(key: string, width: string, height: string): HTMLImageElement {
|
||||
const img = document.createElement("img")
|
||||
const sources = {
|
||||
"layouticon":this._state.layout.icon
|
||||
layouticon: this._state.layout.icon,
|
||||
}
|
||||
img.src = sources[key]
|
||||
if(!img.src){
|
||||
throw "Invalid key for 'createImage': "+key+"; try one of: "+Object.keys(sources).join(", ")
|
||||
if (!img.src) {
|
||||
throw (
|
||||
"Invalid key for 'createImage': " +
|
||||
key +
|
||||
"; try one of: " +
|
||||
Object.keys(sources).join(", ")
|
||||
)
|
||||
}
|
||||
img.style.width = width
|
||||
img.style.height = height
|
||||
console.log("Fetching an image with src", img.src)
|
||||
return img;
|
||||
return img
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,98 +1,96 @@
|
|||
<script lang="ts">
|
||||
import Loading from "../Base/Loading.svelte"
|
||||
import Translations from "../i18n/Translations"
|
||||
import Tr from "../Base/Tr.svelte"
|
||||
import DownloadHelper from "./DownloadHelper"
|
||||
import DownloadButton from "./DownloadButton.svelte"
|
||||
import { GeoOperations } from "../../Logic/GeoOperations"
|
||||
import { SvgToPdf } from "../../Utils/svgToPdf"
|
||||
import ThemeViewState from "../../Models/ThemeViewState"
|
||||
import DownloadPdf from "./DownloadPdf.svelte"
|
||||
|
||||
import Loading from "../Base/Loading.svelte";
|
||||
import Translations from "../i18n/Translations";
|
||||
import Tr from "../Base/Tr.svelte";
|
||||
import DownloadHelper from "./DownloadHelper";
|
||||
import DownloadButton from "./DownloadButton.svelte";
|
||||
import {GeoOperations} from "../../Logic/GeoOperations";
|
||||
import {SvgToPdf} from "../../Utils/svgToPdf";
|
||||
import ThemeViewState from "../../Models/ThemeViewState";
|
||||
import DownloadPdf from "./DownloadPdf.svelte";
|
||||
export let state: ThemeViewState
|
||||
let isLoading = state.dataIsLoading
|
||||
|
||||
export let state: ThemeViewState
|
||||
let isLoading = state.dataIsLoading
|
||||
const t = Translations.t.general.download
|
||||
|
||||
const t = Translations.t.general.download
|
||||
|
||||
const downloadHelper = new DownloadHelper(state)
|
||||
|
||||
let metaIsIncluded = false
|
||||
const name = state.layout.id
|
||||
|
||||
|
||||
function offerSvg(): string {
|
||||
const maindiv = document.getElementById("maindiv")
|
||||
const layers = state.layout.layers.filter((l) => l.source !== null)
|
||||
return downloadHelper.asSvg({
|
||||
layers,
|
||||
mapExtent: state.mapProperties.bounds.data,
|
||||
width: maindiv.offsetWidth,
|
||||
height: maindiv.offsetHeight,
|
||||
})
|
||||
}
|
||||
const downloadHelper = new DownloadHelper(state)
|
||||
|
||||
let metaIsIncluded = false
|
||||
const name = state.layout.id
|
||||
|
||||
function offerSvg(): string {
|
||||
const maindiv = document.getElementById("maindiv")
|
||||
const layers = state.layout.layers.filter((l) => l.source !== null)
|
||||
return downloadHelper.asSvg({
|
||||
layers,
|
||||
mapExtent: state.mapProperties.bounds.data,
|
||||
width: maindiv.offsetWidth,
|
||||
height: maindiv.offsetHeight,
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
{#if $isLoading}
|
||||
<Loading/>
|
||||
<Loading />
|
||||
{:else}
|
||||
<div class="w-full flex flex-col" />
|
||||
<h3>
|
||||
<Tr t={t.title} />
|
||||
</h3>
|
||||
|
||||
<div class="w-full flex flex-col"></div>
|
||||
<h3>
|
||||
<Tr t={t.title}/>
|
||||
</h3>
|
||||
<DownloadButton
|
||||
{state}
|
||||
extension="geojson"
|
||||
mimetype="application/vnd.geo+json"
|
||||
construct={(geojson) => JSON.stringify(geojson)}
|
||||
mainText={t.downloadGeojson}
|
||||
helperText={t.downloadGeoJsonHelper}
|
||||
{metaIsIncluded}
|
||||
/>
|
||||
|
||||
<DownloadButton {state}
|
||||
extension="geojson"
|
||||
mimetype="application/vnd.geo+json"
|
||||
construct={(geojson) => JSON.stringify(geojson)}
|
||||
mainText={t.downloadGeojson}
|
||||
helperText={t.downloadGeoJsonHelper}
|
||||
{metaIsIncluded}/>
|
||||
<DownloadButton
|
||||
{state}
|
||||
extension="csv"
|
||||
mimetype="text/csv"
|
||||
construct={(geojson) => GeoOperations.toCSV(geojson)}
|
||||
mainText={t.downloadCSV}
|
||||
helperText={t.downloadCSVHelper}
|
||||
{metaIsIncluded}
|
||||
/>
|
||||
|
||||
<DownloadButton {state}
|
||||
extension="csv"
|
||||
mimetype="text/csv"
|
||||
construct={(geojson) => GeoOperations.toCSV(geojson)}
|
||||
mainText={t.downloadCSV}
|
||||
helperText={t.downloadCSVHelper}
|
||||
{metaIsIncluded}/>
|
||||
<label class="mb-8 mt-2">
|
||||
<input type="checkbox" bind:value={metaIsIncluded} />
|
||||
<Tr t={t.includeMetaData} />
|
||||
</label>
|
||||
|
||||
<DownloadButton
|
||||
{state}
|
||||
{metaIsIncluded}
|
||||
extension="svg"
|
||||
mimetype="image/svg+xml"
|
||||
mainText={t.downloadAsSvg}
|
||||
helperText={t.downloadAsSvgHelper}
|
||||
construct={offerSvg}
|
||||
/>
|
||||
|
||||
<label class="mb-8 mt-2">
|
||||
<input type="checkbox" bind:value={metaIsIncluded}>
|
||||
<Tr t={t.includeMetaData}/>
|
||||
</label>
|
||||
<DownloadButton
|
||||
{state}
|
||||
{metaIsIncluded}
|
||||
extension="png"
|
||||
mimetype="image/png"
|
||||
mainText={t.downloadAsPng}
|
||||
helperText={t.downloadAsPngHelper}
|
||||
construct={(_) => state.mapProperties.exportAsPng(4)}
|
||||
/>
|
||||
|
||||
<DownloadButton {state} {metaIsIncluded}
|
||||
extension="svg"
|
||||
mimetype="image/svg+xml"
|
||||
mainText={t.downloadAsSvg}
|
||||
helperText={t.downloadAsSvgHelper}
|
||||
construct={offerSvg}
|
||||
/>
|
||||
<div class="flex flex-col">
|
||||
{#each Object.keys(SvgToPdf.templates) as key}
|
||||
{#if SvgToPdf.templates[key].isPublic}
|
||||
<DownloadPdf {state} templateName={key} />
|
||||
{/if}
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<DownloadButton {state} {metaIsIncluded}
|
||||
extension="png"
|
||||
mimetype="image/png"
|
||||
mainText={t.downloadAsPng}
|
||||
helperText={t.downloadAsPngHelper}
|
||||
construct={_ => state.mapProperties.exportAsPng(4)}
|
||||
/>
|
||||
|
||||
|
||||
<div class="flex flex-col">
|
||||
{#each Object.keys(SvgToPdf.templates) as key}
|
||||
{#if SvgToPdf.templates[key].isPublic}
|
||||
<DownloadPdf {state} templateName={key}/>
|
||||
{/if}
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
|
||||
<Tr cls="link-underline" t={t.licenseInfo}/>
|
||||
<Tr cls="link-underline" t={t.licenseInfo} />
|
||||
{/if}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,63 +1,67 @@
|
|||
<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"
|
||||
|
||||
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)
|
||||
|
||||
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,
|
||||
},
|
||||
})
|
||||
|
||||
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
|
||||
}
|
||||
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}
|
||||
<DownloadButton
|
||||
construct={constructPdf}
|
||||
extension="pdf"
|
||||
helperText={t.downloadAsPdfHelper}
|
||||
metaIsIncluded={false}
|
||||
{mainText}
|
||||
mimetype="application/pdf"
|
||||
{state}
|
||||
/>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue