Dyomedea
/
dyomedea
1
1
Fork 0
Code Issues 4 Pull Requests Projects 3 Releases 1 Wiki Activity

Displaying thumbnails

This commit is contained in:
Eric van der Vlist 2023-04-04 19:33:22 +02:00
parent 5333e8053b
commit 59f266de37
1 changed files with 23 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/import/ImportSingleFile.tsx
View File

@ -30,6 +30,13 @@ interface StatsAndGpx {
stats: any; stats: any;
} }
interface Picture {
id: string;
date: string;
gpx: { Latitude: number; Longitude: number; Altitude: number };
thumbnailUrl: string;
}
const analyzeGpx = (gpx: Gpx | undefined) => { const analyzeGpx = (gpx: Gpx | undefined) => {
if (gpx === undefined) { if (gpx === undefined) {
return {}; return {};
@ -54,6 +61,7 @@ const analyzeGpx = (gpx: Gpx | undefined) => {
const ImportSingleFile: Component<Props> = ({ file: file }) => { const ImportSingleFile: Component<Props> = ({ file: file }) => {
const [t] = useI18n(); const [t] = useI18n();
const [statsAndGpx, setStatsAndGpx] = createSignal<StatsAndGpx>(); const [statsAndGpx, setStatsAndGpx] = createSignal<StatsAndGpx>();
const [picture, setPicture] = createSignal<Picture>();
const [state, setState] = createSignal('init'); const [state, setState] = createSignal('init');
const [gpxId, setGpxId] = createSignal<string>(''); const [gpxId, setGpxId] = createSignal<string>('');
createEffect(() => { createEffect(() => {
@ -102,7 +110,7 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
const id = exif?.ImageUniqueID?.value[0]; const id = exif?.ImageUniqueID?.value[0];
const gps = tags.gps; const gps = tags.gps;
const thumbnail = tags.Thumbnail; const thumbnail = tags.Thumbnail;
const thumbnailSrc = `data:${thumbnail?.type};base64,${thumbnail?.base64}`; const thumbnailUrl = `data:${thumbnail?.type};base64,${thumbnail?.base64}`;
console.log({ console.log({
caller: 'ImportSingleFile / Jpeg', caller: 'ImportSingleFile / Jpeg',
file, file,
@ -112,9 +120,9 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
date, date,
id, id,
gps, gps,
thumbnailSrc, thumbnailUrl,
}); });
//parseGpx(reader.result); setPicture({ id, gps, thumbnailUrl, date });
}, },
false false
); );
@ -237,6 +245,18 @@ const ImportSingleFile: Component<Props> = ({ file: file }) => {
</Button> </Button>
</CardActions> </CardActions>
</Show> </Show>
<Show when={picture() !== undefined}>
<img src={picture()?.thumbnailUrl} />
<CardActions>
<Button
variant='contained'
disabled={state() != 'init'}
onClick={doImport}
>
{t('import')}
</Button>
</CardActions>
</Show>
</CardContent> </CardContent>
</Card> </Card>
); );