Addedlocation functions to main
This commit is contained in:
parent
c59a75b24e
commit
7e6eab1ee7
2 changed files with 53 additions and 49 deletions
|
|
@ -1,16 +1,18 @@
|
|||
import { useState, useEffect } from 'react';
|
||||
import ScanBlock from './ScanBlock';
|
||||
import Table from './Table';
|
||||
import { getLocation } from './main';
|
||||
|
||||
const LocationBlock = () => {
|
||||
const [locationData, setLocationData] = useState('');
|
||||
const [data, setData] = useState([]);
|
||||
const [display, setDisplay] = useState('');
|
||||
const mapUrl = `https://maps.googleapis.com/maps/api/staticmap?center=${data.lat},${data.lon}&markers=color:red%7Clabel:%7C${data.lat},${data.lon}&size=500x200&zoom=10&key=AIzaSyB-YN-X8PGBSPd7NOaQu4csVhgJUnF3ZGk`;
|
||||
|
||||
useEffect(() => {
|
||||
fetch('https://api.vytal.io/ip/')
|
||||
.then((response) => response.json())
|
||||
.then((data) => {
|
||||
setLocationData(data);
|
||||
.then((json) => {
|
||||
setData(getLocation(json));
|
||||
setDisplay(1);
|
||||
})
|
||||
.catch(() => {
|
||||
|
|
@ -18,41 +20,6 @@ const LocationBlock = () => {
|
|||
});
|
||||
}, []);
|
||||
|
||||
const mapUrl = `https://maps.googleapis.com/maps/api/staticmap?center=${locationData.lat},${locationData.lon}&markers=color:red%7Clabel:%7C${locationData.lat},${locationData.lon}&size=500x200&zoom=10&key=AIzaSyB-YN-X8PGBSPd7NOaQu4csVhgJUnF3ZGk`;
|
||||
|
||||
const data = [
|
||||
{
|
||||
key: 'country',
|
||||
title: 'Country',
|
||||
value: locationData.country,
|
||||
},
|
||||
{
|
||||
key: 'regionName',
|
||||
title: 'Region',
|
||||
value: locationData.regionName,
|
||||
},
|
||||
{
|
||||
key: 'lat',
|
||||
title: 'City',
|
||||
value: locationData.city,
|
||||
},
|
||||
{
|
||||
key: 'zip',
|
||||
title: 'Zip code',
|
||||
value: locationData.zip,
|
||||
},
|
||||
{
|
||||
key: 'lat',
|
||||
title: 'Latitude',
|
||||
value: locationData.lat,
|
||||
},
|
||||
{
|
||||
key: 'lon',
|
||||
title: 'Longitude',
|
||||
value: locationData.lon,
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<ScanBlock>
|
||||
<h1>Location</h1>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,54 @@ import md5 from 'crypto-js/md5';
|
|||
import Bowser from 'bowser';
|
||||
import axios from 'axios';
|
||||
|
||||
export {
|
||||
getLocation,
|
||||
getSoftware,
|
||||
getHardware,
|
||||
getWebGL,
|
||||
getBattery,
|
||||
getFingerprint,
|
||||
getHash,
|
||||
getName,
|
||||
handleSave,
|
||||
};
|
||||
|
||||
const getLocation = (locationData) => {
|
||||
const data = [
|
||||
{
|
||||
key: 'country',
|
||||
title: 'Country',
|
||||
value: locationData.country,
|
||||
},
|
||||
{
|
||||
key: 'regionName',
|
||||
title: 'Region',
|
||||
value: locationData.regionName,
|
||||
},
|
||||
{
|
||||
key: 'lat',
|
||||
title: 'City',
|
||||
value: locationData.city,
|
||||
},
|
||||
{
|
||||
key: 'zip',
|
||||
title: 'Zip code',
|
||||
value: locationData.zip,
|
||||
},
|
||||
{
|
||||
key: 'lat',
|
||||
title: 'Latitude',
|
||||
value: locationData.lat,
|
||||
},
|
||||
{
|
||||
key: 'lon',
|
||||
title: 'Longitude',
|
||||
value: locationData.lon,
|
||||
},
|
||||
];
|
||||
return data;
|
||||
};
|
||||
|
||||
const getHardware = () => {
|
||||
const data = [
|
||||
{
|
||||
|
|
@ -229,14 +277,3 @@ const handleSave = (e, hash, setSaved) => {
|
|||
});
|
||||
setSaved(true);
|
||||
};
|
||||
|
||||
export {
|
||||
getSoftware,
|
||||
getHardware,
|
||||
getWebGL,
|
||||
getBattery,
|
||||
getFingerprint,
|
||||
getHash,
|
||||
getName,
|
||||
handleSave,
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue