Move the current location on the map while recording (#12)
This commit is contained in:
parent
e103e928b6
commit
924dd47395
|
@ -23,8 +23,10 @@ import {
|
||||||
startBackgroundGeolocation,
|
startBackgroundGeolocation,
|
||||||
stopBackgroundGeolocation,
|
stopBackgroundGeolocation,
|
||||||
} from '../../lib/background-geolocation';
|
} from '../../lib/background-geolocation';
|
||||||
import { deleteCurrent, saveCurrent } from '../../db/gpx';
|
import { appendTrkpt, deleteCurrent, saveCurrent } from '../../db/gpx';
|
||||||
import { enterAnimation, leaveAnimation } from '../../lib/animation';
|
import { enterAnimation, leaveAnimation } from '../../lib/animation';
|
||||||
|
import { useDispatch } from 'react-redux';
|
||||||
|
import { mapActions } from '../../store/map';
|
||||||
|
|
||||||
const GpxRecord: React.FC<{}> = () => {
|
const GpxRecord: React.FC<{}> = () => {
|
||||||
const db = useDB();
|
const db = useDB();
|
||||||
|
@ -54,8 +56,31 @@ const GpxRecord: React.FC<{}> = () => {
|
||||||
modal.current?.dismiss();
|
modal.current?.dismiss();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
|
||||||
|
const newLocationHandler = (location: any) => {
|
||||||
|
appendTrkpt(db, {
|
||||||
|
$: {
|
||||||
|
lat: location.latitude,
|
||||||
|
lon: location.longitude,
|
||||||
|
},
|
||||||
|
ele: location.altitude,
|
||||||
|
time: new Date(location.time).toISOString(),
|
||||||
|
extensions: {
|
||||||
|
speed: location.speed,
|
||||||
|
accuracy: location.accuracy,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
dispatch(
|
||||||
|
mapActions.setCurrent({
|
||||||
|
lat: location.latitude,
|
||||||
|
lon: location.longitude,
|
||||||
|
})
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const startRecording = () => {
|
const startRecording = () => {
|
||||||
startBackgroundGeolocation(db).then((result) => {
|
startBackgroundGeolocation(newLocationHandler).then((result) => {
|
||||||
setWatcher_id(result);
|
setWatcher_id(result);
|
||||||
});
|
});
|
||||||
setIsRecording(true);
|
setIsRecording(true);
|
||||||
|
@ -80,7 +105,6 @@ const GpxRecord: React.FC<{}> = () => {
|
||||||
pauseRecording();
|
pauseRecording();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Fragment>
|
<Fragment>
|
||||||
<IonButton id='open-RecordDialog'>
|
<IonButton id='open-RecordDialog'>
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
import { BackgroundGeolocationPlugin } from '@capacitor-community/background-geolocation';
|
import { BackgroundGeolocationPlugin } from '@capacitor-community/background-geolocation';
|
||||||
import { registerPlugin } from '@capacitor/core';
|
import { registerPlugin } from '@capacitor/core';
|
||||||
import { appendTrkpt } from '../db/gpx';
|
|
||||||
|
|
||||||
const BackgroundGeolocation = registerPlugin<BackgroundGeolocationPlugin>(
|
const BackgroundGeolocation = registerPlugin<BackgroundGeolocationPlugin>(
|
||||||
'BackgroundGeolocation'
|
'BackgroundGeolocation'
|
||||||
|
@ -35,7 +34,7 @@ const backgroundGeolocationConfig = {
|
||||||
distanceFilter: 5,
|
distanceFilter: 5,
|
||||||
};
|
};
|
||||||
|
|
||||||
export const startBackgroundGeolocation = async (db: any) => {
|
export const startBackgroundGeolocation = async (newLocationHandler: any) => {
|
||||||
const locationHandler = (location: any, error: any) => {
|
const locationHandler = (location: any, error: any) => {
|
||||||
console.log('com.dyomedea.dyomedea LOG', ' - Callback');
|
console.log('com.dyomedea.dyomedea LOG', ' - Callback');
|
||||||
if (error) {
|
if (error) {
|
||||||
|
@ -58,33 +57,8 @@ export const startBackgroundGeolocation = async (db: any) => {
|
||||||
}
|
}
|
||||||
console.log(location);
|
console.log(location);
|
||||||
if (location !== undefined) {
|
if (location !== undefined) {
|
||||||
appendTrkpt(db, {
|
newLocationHandler(location);
|
||||||
$: {
|
}
|
||||||
lat: location.latitude,
|
|
||||||
lon: location.longitude,
|
|
||||||
},
|
|
||||||
ele: location.altitude,
|
|
||||||
time: new Date(location.time).toISOString(),
|
|
||||||
extensions: {
|
|
||||||
speed: location.speed,
|
|
||||||
accuracy: location.accuracy,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
//setCenter([location.latitude, location.longitude]);
|
|
||||||
//setPosition([location.latitude, location.longitude]);
|
|
||||||
// dispatch(
|
|
||||||
// gpxActions.appendTrkpt({
|
|
||||||
// trkKey: 'current',
|
|
||||||
// trkpt: {
|
|
||||||
// $: {
|
|
||||||
// lat: location.latitude,
|
|
||||||
// lon: location.longitude,
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// })
|
|
||||||
// );
|
|
||||||
}
|
|
||||||
|
|
||||||
return console.log('com.dyomedea.dyomedea LOG', ' - location: ', location);
|
return console.log('com.dyomedea.dyomedea LOG', ' - location: ', location);
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue