Simplify components, add sha256() for later
This commit is contained in:
parent
e5dbb0af39
commit
7b15b39d5f
|
@ -11,8 +11,6 @@ import 'leaflet/dist/leaflet.css';
|
||||||
import 'react-range-slider-input/dist/style.css';
|
import 'react-range-slider-input/dist/style.css';
|
||||||
|
|
||||||
|
|
||||||
let tzcache = {};
|
|
||||||
|
|
||||||
// num: number of steps per duration
|
// num: number of steps per duration
|
||||||
// secs: number of seconds per step
|
// secs: number of seconds per step
|
||||||
const durations = [
|
const durations = [
|
||||||
|
@ -38,6 +36,13 @@ const parseSlider = (end, duration, slider) => {
|
||||||
return [lowStr, highStr];
|
return [lowStr, highStr];
|
||||||
};
|
};
|
||||||
|
|
||||||
|
//async function sha256(source) {
|
||||||
|
// const sourceBytes = new TextEncoder().encode(source);
|
||||||
|
// const digest = await crypto.subtle.digest('SHA-256', sourceBytes);
|
||||||
|
// const resultBytes = [...new Uint8Array(digest)];
|
||||||
|
// return resultBytes.map(x => x.toString(16).padStart(2, '0')).join('');
|
||||||
|
//}
|
||||||
|
|
||||||
function useSensor(measurement, name, end, duration) {
|
function useSensor(measurement, name, end, duration) {
|
||||||
const [data, setData] = useState(false);
|
const [data, setData] = useState(false);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
|
@ -67,7 +72,7 @@ function useSensor(measurement, name, end, duration) {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
function Owntracks({end, duration, slider}) {
|
function Map({end, duration, slider}) {
|
||||||
const [data, loading] = useSensor('owntracks', 'OwnTracks', end, duration);
|
const [data, loading] = useSensor('owntracks', 'OwnTracks', end, duration);
|
||||||
|
|
||||||
const range = parseSlider(end, duration, slider);
|
const range = parseSlider(end, duration, slider);
|
||||||
|
@ -80,38 +85,29 @@ function Owntracks({end, duration, slider}) {
|
||||||
localStorage.setItem('api_key', api_key);
|
localStorage.setItem('api_key', api_key);
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{loading ?
|
|
||||||
<p>Loading...</p>
|
|
||||||
:
|
|
||||||
coords.length ?
|
|
||||||
<MapContainer center={coords[coords.length-1]} zoom={13} scrollWheelZoom={true} style={{ width: '100%', height: 'calc(100vh - 2.5rem)' }}>
|
|
||||||
<TileLayer
|
|
||||||
attribution='© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
|
|
||||||
url='https://maptiles.p.rapidapi.com/en/map/v1/{z}/{x}/{y}.png?rapidapi-key=4375b0b1d8msh0c9e7fa3efb9adfp1769dfjsnd603a0387fea'
|
|
||||||
/>
|
|
||||||
<Polyline pathOptions={{color: 'blue'}} positions={coords} />
|
|
||||||
</MapContainer>
|
|
||||||
:
|
|
||||||
<>
|
|
||||||
<p>No data</p>
|
|
||||||
<form onSubmit={handleSubmit}>
|
|
||||||
<p>
|
|
||||||
<input placeholder='API key' />
|
|
||||||
</p>
|
|
||||||
</form>
|
|
||||||
</>
|
|
||||||
}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
function Graphs({end, duration, slider}) {
|
|
||||||
return (
|
return (
|
||||||
<div className='container'>
|
<div className='container'>
|
||||||
<Owntracks end={end} duration={duration} slider={slider} />
|
{loading ?
|
||||||
|
<p>Loading...</p>
|
||||||
|
:
|
||||||
|
coords.length ?
|
||||||
|
<MapContainer center={coords[coords.length-1]} zoom={13} scrollWheelZoom={true} style={{ width: '100%', height: 'calc(100vh - 2.5rem)' }}>
|
||||||
|
<TileLayer
|
||||||
|
attribution='© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
|
||||||
|
url='https://maptiles.p.rapidapi.com/en/map/v1/{z}/{x}/{y}.png?rapidapi-key=4375b0b1d8msh0c9e7fa3efb9adfp1769dfjsnd603a0387fea'
|
||||||
|
/>
|
||||||
|
<Polyline pathOptions={{color: 'blue'}} positions={coords} />
|
||||||
|
</MapContainer>
|
||||||
|
:
|
||||||
|
<>
|
||||||
|
<p>No data</p>
|
||||||
|
<form onSubmit={handleSubmit}>
|
||||||
|
<p>
|
||||||
|
<input placeholder='API key' />
|
||||||
|
</p>
|
||||||
|
</form>
|
||||||
|
</>
|
||||||
|
}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -267,7 +263,7 @@ function App() {
|
||||||
setSlider={setSlider}
|
setSlider={setSlider}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Graphs
|
<Map
|
||||||
end={end}
|
end={end}
|
||||||
duration={duration}
|
duration={duration}
|
||||||
slider={slider}
|
slider={slider}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user