From 5355d81fc9d0f16a76a58a6ceca59955aa22a2d1 Mon Sep 17 00:00:00 2001
From: Anton Tananaev <anton@traccar.org>
Date: Wed, 4 Jan 2023 14:16:55 -0800
Subject: Support current location

---
 modern/src/settings/ServerPage.js | 61 +++++++++++++++++++++++++++------------
 modern/src/settings/UserPage.js   | 61 +++++++++++++++++++++++++++------------
 2 files changed, 86 insertions(+), 36 deletions(-)

(limited to 'modern')

diff --git a/modern/src/settings/ServerPage.js b/modern/src/settings/ServerPage.js
index dccb52c6..d0810e5a 100644
--- a/modern/src/settings/ServerPage.js
+++ b/modern/src/settings/ServerPage.js
@@ -31,6 +31,7 @@ import useCommonUserAttributes from '../common/attributes/useCommonUserAttribute
 import { useCatch } from '../reactHelper';
 import useServerAttributes from '../common/attributes/useServerAttributes';
 import useMapStyles from '../map/core/useMapStyles';
+import { map } from '../map/core/MapView';
 
 const useStyles = makeStyles((theme) => ({
   container: {
@@ -118,24 +119,6 @@ const ServerPage = () => {
                     ))}
                   </Select>
                 </FormControl>
-                <TextField
-                  type="number"
-                  value={item.latitude || 0}
-                  onChange={(event) => setItem({ ...item, latitude: Number(event.target.value) })}
-                  label={t('positionLatitude')}
-                />
-                <TextField
-                  type="number"
-                  value={item.longitude || 0}
-                  onChange={(event) => setItem({ ...item, longitude: Number(event.target.value) })}
-                  label={t('positionLongitude')}
-                />
-                <TextField
-                  type="number"
-                  value={item.zoom || 0}
-                  onChange={(event) => setItem({ ...item, zoom: Number(event.target.value) })}
-                  label={t('serverZoom')}
-                />
                 <FormControl>
                   <InputLabel>{t('settingsCoordinateFormat')}</InputLabel>
                   <Select
@@ -226,6 +209,48 @@ const ServerPage = () => {
                 </FormGroup>
               </AccordionDetails>
             </Accordion>
+            <Accordion>
+              <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+                <Typography variant="subtitle1">
+                  {t('sharedLocation')}
+                </Typography>
+              </AccordionSummary>
+              <AccordionDetails className={classes.details}>
+                <TextField
+                  type="number"
+                  value={item.latitude || 0}
+                  onChange={(event) => setItem({ ...item, latitude: Number(event.target.value) })}
+                  label={t('positionLatitude')}
+                />
+                <TextField
+                  type="number"
+                  value={item.longitude || 0}
+                  onChange={(event) => setItem({ ...item, longitude: Number(event.target.value) })}
+                  label={t('positionLongitude')}
+                />
+                <TextField
+                  type="number"
+                  value={item.zoom || 0}
+                  onChange={(event) => setItem({ ...item, zoom: Number(event.target.value) })}
+                  label={t('serverZoom')}
+                />
+                <Button
+                  variant="outlined"
+                  color="primary"
+                  onClick={() => {
+                    const { lng, lat } = map.getCenter();
+                    setItem({
+                      ...item,
+                      latitude: Number(lat.toFixed(6)),
+                      longitude: Number(lng.toFixed(6)),
+                      zoom: Number(map.getZoom().toFixed(1)),
+                    });
+                  }}
+                >
+                  {t('mapCurrentLocation')}
+                </Button>
+              </AccordionDetails>
+            </Accordion>
             <Accordion>
               <AccordionSummary expandIcon={<ExpandMoreIcon />}>
                 <Typography variant="subtitle1">
diff --git a/modern/src/settings/UserPage.js b/modern/src/settings/UserPage.js
index 9b69cacd..582e63eb 100644
--- a/modern/src/settings/UserPage.js
+++ b/modern/src/settings/UserPage.js
@@ -34,6 +34,7 @@ import useQuery from '../common/util/useQuery';
 import { useCatch } from '../reactHelper';
 import { formatNotificationTitle } from '../common/util/formatter';
 import useMapStyles from '../map/core/useMapStyles';
+import { map } from '../map/core/MapView';
 
 const useStyles = makeStyles((theme) => ({
   details: {
@@ -169,24 +170,6 @@ const UserPage = () => {
                   ))}
                 </Select>
               </FormControl>
-              <TextField
-                type="number"
-                value={item.latitude || 0}
-                onChange={(event) => setItem({ ...item, latitude: Number(event.target.value) })}
-                label={t('positionLatitude')}
-              />
-              <TextField
-                type="number"
-                value={item.longitude || 0}
-                onChange={(event) => setItem({ ...item, longitude: Number(event.target.value) })}
-                label={t('positionLongitude')}
-              />
-              <TextField
-                type="number"
-                value={item.zoom || 0}
-                onChange={(event) => setItem({ ...item, zoom: Number(event.target.value) })}
-                label={t('serverZoom')}
-              />
               <FormControl>
                 <InputLabel>{t('settingsCoordinateFormat')}</InputLabel>
                 <Select
@@ -268,6 +251,48 @@ const UserPage = () => {
               </FormGroup>
             </AccordionDetails>
           </Accordion>
+          <Accordion>
+            <AccordionSummary expandIcon={<ExpandMoreIcon />}>
+              <Typography variant="subtitle1">
+                {t('sharedLocation')}
+              </Typography>
+            </AccordionSummary>
+            <AccordionDetails className={classes.details}>
+              <TextField
+                type="number"
+                value={item.latitude || 0}
+                onChange={(event) => setItem({ ...item, latitude: Number(event.target.value) })}
+                label={t('positionLatitude')}
+              />
+              <TextField
+                type="number"
+                value={item.longitude || 0}
+                onChange={(event) => setItem({ ...item, longitude: Number(event.target.value) })}
+                label={t('positionLongitude')}
+              />
+              <TextField
+                type="number"
+                value={item.zoom || 0}
+                onChange={(event) => setItem({ ...item, zoom: Number(event.target.value) })}
+                label={t('serverZoom')}
+              />
+              <Button
+                variant="outlined"
+                color="primary"
+                onClick={() => {
+                  const { lng, lat } = map.getCenter();
+                  setItem({
+                    ...item,
+                    latitude: Number(lat.toFixed(6)),
+                    longitude: Number(lng.toFixed(6)),
+                    zoom: Number(map.getZoom().toFixed(1)),
+                  });
+                }}
+              >
+                {t('mapCurrentLocation')}
+              </Button>
+            </AccordionDetails>
+          </Accordion>
           <Accordion>
             <AccordionSummary expandIcon={<ExpandMoreIcon />}>
               <Typography variant="subtitle1">
-- 
cgit v1.2.3