Calling WptEditDialog to import pictures as wpts

This commit is contained in:
Eric van der Vlist 2023-04-23 18:06:10 +02:00
parent a84b813066
commit 014e58a31b
2 changed files with 69 additions and 1 deletions

View File

@ -22,6 +22,8 @@ import {
import piexif from 'piexifjs'; import piexif from 'piexifjs';
import { getDate, getGps } from '../../lib/exif'; import { getDate, getGps } from '../../lib/exif';
import { downsize } from '../../lib/image'; import { downsize } from '../../lib/image';
import { Coordinate } from 'ol/coordinate';
import WptEditDialog, { Category } from '../wpt/WptEditDialog';
interface Props { interface Props {
file: File; file: File;
@ -66,6 +68,40 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
const [picture, setPicture] = createSignal<Picture>(); const [picture, setPicture] = createSignal<Picture>();
const [state, setState] = createSignal('init'); const [state, setState] = createSignal('init');
const [gpxId, setGpxId] = createSignal<string>('new'); const [gpxId, setGpxId] = createSignal<string>('new');
const [open, setOpen] = createSignal<boolean>(false);
const [coordinate, setCoordinate] = createSignal<Coordinate>();
const [initialWpt, setInitialWpt] = createSignal({
$: { lat: 0, lon: 0 },
ele: undefined,
time: undefined,
magvar: undefined,
geoidheight: undefined,
name: undefined,
cmt: undefined,
desc: undefined,
src: undefined,
link: undefined,
sym: undefined,
type: undefined,
fix: undefined,
sat: undefined,
hdop: undefined,
vdop: undefined,
pdop: undefined,
ageofdgpsdata: undefined,
dgpsid: undefined,
extensions: {
address: undefined,
startTime: undefined,
endTime: undefined,
category: Category.PICTURE,
subCategory: undefined,
pictureId: '',
thumbnailUrl: '',
},
});
createEffect(() => { createEffect(() => {
setGpxId(currentGpxId()); setGpxId(currentGpxId());
}); });
@ -140,6 +176,18 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
bigThumbnailUrl, bigThumbnailUrl,
downsizedUrl, downsizedUrl,
}); });
setCoordinate([gps.longitude, gps.latitude]);
setInitialWpt({
...initialWpt(),
extensions: {
...initialWpt().extensions,
category: Category.PICTURE,
startTime: date.toISOString(),
endTime: date.toISOString(),
pictureId: id,
thumbnailUrl: thumbnailUrl,
},
});
}, },
false false
); );
@ -281,11 +329,22 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
<Button <Button
variant='contained' variant='contained'
disabled={state() != 'init'} disabled={state() != 'init'}
onClick={doImport} onClick={() => setOpen(true)}
> >
{t('import')} {t('import')}
</Button> </Button>
</CardActions> </CardActions>
<Show when={open()}>
<WptEditDialog
open={open}
closeHandler={() => {
setOpen(false);
setState('imported');
}}
coordinate={coordinate}
initialWpt={initialWpt}
/>
</Show>
</Show> </Show>
</CardContent> </CardContent>
</Card> </Card>

View File

@ -26,6 +26,7 @@ import { Coordinate } from 'ol/coordinate';
export enum Category { export enum Category {
NOTE = 'note', NOTE = 'note',
POI = 'poi', POI = 'poi',
PICTURE = 'picture',
UNKNOWN = '', UNKNOWN = '',
} }
@ -220,6 +221,14 @@ const WptEditDialog: Component<Props> = (props) => {
> >
Note Note
</option> </option>
<option
value={Category.PICTURE}
selected={
editedWpt()?.extensions?.category === Category.PICTURE
}
>
Picture
</option>
<option <option
value={undefined} value={undefined}
selected={!editedWpt()?.extensions?.category} selected={!editedWpt()?.extensions?.category}