1 |
a7ae217f
|
Vaclav Honzik
|
import { Button } from '@mui/material'
|
2 |
|
|
import { useEffect, useState } from 'react'
|
3 |
|
|
import { useSelector } from 'react-redux'
|
4 |
|
|
import { RootState } from '../../redux/store'
|
5 |
|
|
import { isMapPointDisplayable, PathVariant } from '../pathUtils'
|
6 |
|
|
import { exportAsGeoJsonString } from './GeoJsonIo'
|
7 |
|
|
|
8 |
|
|
const GeoJsonExportButton = () => {
|
9 |
|
|
const [path, setPath] = useState<PathVariant | undefined>(undefined)
|
10 |
|
|
const primaryPathIdx = useSelector(
|
11 |
|
|
(state: RootState) => state.trackingTool.primaryPathIdx
|
12 |
|
|
)
|
13 |
|
|
const pathVariants = useSelector(
|
14 |
|
|
(state: RootState) => state.trackingTool.pathVariants
|
15 |
|
|
)
|
16 |
|
|
useEffect(() => {
|
17 |
|
|
if (
|
18 |
|
|
!pathVariants ||
|
19 |
|
|
pathVariants.length === 0 ||
|
20 |
|
|
pathVariants.length <= primaryPathIdx
|
21 |
|
|
) {
|
22 |
|
|
setPath(undefined)
|
23 |
|
|
return
|
24 |
|
|
}
|
25 |
|
|
|
26 |
|
|
setPath(pathVariants[primaryPathIdx])
|
27 |
|
|
}, [primaryPathIdx, pathVariants])
|
28 |
|
|
|
29 |
|
|
const exportPath = () => {
|
30 |
|
|
if (!path) {
|
31 |
|
|
return
|
32 |
|
|
}
|
33 |
|
|
|
34 |
|
|
const exportPath = path.filter(
|
35 |
|
|
(vertex) => isMapPointDisplayable(vertex) && vertex.active
|
36 |
|
|
)
|
37 |
|
|
const exportPathString = exportAsGeoJsonString(exportPath)
|
38 |
|
|
const blob = new Blob([exportPathString], { type: 'application/json' })
|
39 |
|
|
const url = window.URL.createObjectURL(blob)
|
40 |
|
|
const link = document.createElement('a')
|
41 |
|
|
link.href = url
|
42 |
|
|
link.setAttribute('download', 'path.json')
|
43 |
|
|
document.body.appendChild(link)
|
44 |
|
|
link.click()
|
45 |
|
|
document.body.removeChild(link)
|
46 |
|
|
}
|
47 |
|
|
|
48 |
|
|
return (
|
49 |
|
|
<Button variant="contained" onClick={exportPath}>
|
50 |
|
|
Export
|
51 |
|
|
</Button>
|
52 |
|
|
)
|
53 |
|
|
}
|
54 |
|
|
|
55 |
|
|
export default GeoJsonExportButton
|