Add Maps plugin

This commit is contained in:
Ceda EI 2021-01-04 14:54:45 +05:30
parent 17a3436017
commit df7470f147
4 changed files with 59 additions and 5 deletions

View File

@ -16,7 +16,6 @@ function Core() {
data: coreState.data,
close: () => dispatch(setPlugin(false))
};
const dummyButtons = ["Maps", "Phone"];
return <>
<Box height="5vh" background="light-1" justify="center" direction="row">
{voiceState.recording ? <VoiceBars style={{height: "100%"}}/>:
@ -41,9 +40,8 @@ function Core() {
label="Pet Mode" />
<Button onClick={() => dispatch(setPlugin("smartHome"))} primary
label="Smart Home" margin="0 0 0 1em" />
{dummyButtons.map(i =>
<Button primary label={i} key={i} margin="0 0 0 1em" />
)}
<Button onClick={() => dispatch(setPlugin("maps"))} primary
label="Maps" margin="0 0 0 1em" />
</Box>
</Box>)
}

53
src/plugins/Maps.js Normal file
View File

@ -0,0 +1,53 @@
import React, { useState, useEffect } from "react";
import PropTypes from "prop-types";
import { Box, Button } from "grommet";
import { MAPS_API } from "../config";
function Maps(props) {
const [ location, setLocation ] = useState([null, null]);
useEffect(() => {
navigator.geolocation.getCurrentPosition(
position => setLocation([position.coords.latitude, position.coords.longitude]),
() => {}
);
});
const mapsEmbedUrl = new URL("https://www.google.com/maps/embed/v1/view");
mapsEmbedUrl.searchParams.append("key", MAPS_API);
mapsEmbedUrl.searchParams.append("center", `${location[0]},${location[1]}`);
mapsEmbedUrl.searchParams.append("zoom", 14);
return (
<Box
align="center"
background="light-1"
width="100vw"
justify="center"
direction="column"
alignContent="center"
height="95vh"
>
{location[0] === null ?
"Loading Location":
<iframe
width="650"
height="300"
frameBorder="0"
style={{ border: 0 }}
src={mapsEmbedUrl.href}>
</iframe>
}
<Button primary size="large" onClick={props.close}
label="Dismiss" margin="1.5em" />
</Box>
);
}
Maps.propTypes = {
data: PropTypes.object,
close: PropTypes.func
};
Maps.pluginName = "Maps";
export default Maps;

View File

@ -4,6 +4,7 @@ import Temperature from "./Temperature";
import Accident from "./Accident";
import PetMode from "./PetMode";
import SmartHome from "./SmartHome";
import Maps from "./Maps";
export default {
warning: Warning,
@ -12,4 +13,5 @@ export default {
accident: Accident,
petMode: PetMode,
smartHome: SmartHome,
maps: Maps,
};

View File

@ -3,5 +3,6 @@ const TG_API = "xxxxxxxxx:xxxxxxxxxxxxxxxxxxxxxx";
const TG_USERID = 123456789;
const CAR_API = "http://localhost:5000/";
const CAMERA_URL = "http://path.to/still/image.jpg";
const MAPS_API = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
export { WS_BASE, TG_API, TG_USERID, CAR_API, CAMERA_URL };
export { WS_BASE, TG_API, TG_USERID, CAR_API, CAMERA_URL, MAPS_API };