Merge branch 'develop' into sherzog_dev
This commit is contained in:
commit
8a7aac6625
@ -21,3 +21,4 @@ shell-server@0.5.0 # Server-side component of the `meteor shell` comm
|
|||||||
insecure@1.0.7 # Allow all DB writes from clients (for prototyping)
|
insecure@1.0.7 # Allow all DB writes from clients (for prototyping)
|
||||||
static-html
|
static-html
|
||||||
react-meteor-data
|
react-meteor-data
|
||||||
|
underscore
|
||||||
|
|||||||
@ -6,6 +6,7 @@ import 'bootstrap/dist/css/bootstrap.min.css';
|
|||||||
|
|
||||||
export const PlantTypesCollection = new Meteor.Collection('plantTypes');
|
export const PlantTypesCollection = new Meteor.Collection('plantTypes');
|
||||||
export const SensorDataCollection = new Meteor.Collection('sensorData');
|
export const SensorDataCollection = new Meteor.Collection('sensorData');
|
||||||
|
export const ActiveDeviceCollection = new Meteor.Collection('activeDevice');
|
||||||
|
|
||||||
Meteor.startup(() => {
|
Meteor.startup(() => {
|
||||||
if(Meteor.isServer) {
|
if(Meteor.isServer) {
|
||||||
@ -16,14 +17,17 @@ Meteor.startup(() => {
|
|||||||
Meteor.publish('sensorDataCollection', function() {
|
Meteor.publish('sensorDataCollection', function() {
|
||||||
return SensorDataCollection.find();
|
return SensorDataCollection.find();
|
||||||
})
|
})
|
||||||
|
|
||||||
|
Meteor.publish('activeDeviceCollection', function() {
|
||||||
|
return ActiveDeviceCollection.find();
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
if (Meteor.isClient) {
|
if (Meteor.isClient) {
|
||||||
Meteor.subscribe('plantTypesCollection');
|
Meteor.subscribe('plantTypesCollection');
|
||||||
Meteor.subscribe('sensorDataCollection');
|
Meteor.subscribe('sensorDataCollection');
|
||||||
|
Meteor.subscribe('activeDeviceCollection');
|
||||||
}
|
}
|
||||||
|
|
||||||
Meteor.setTimeout(function() {
|
ReactDOM.render(<App />, document.getElementById('root'));
|
||||||
ReactDOM.render(<App />, document.getElementById('root'));
|
|
||||||
}, 1000);
|
|
||||||
});
|
});
|
||||||
@ -1,5 +1,5 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { Button, Form, Container, Row, Col, Table } from 'react-bootstrap';
|
import { Button, Form } from 'react-bootstrap';
|
||||||
|
|
||||||
class AddPlant extends React.Component{
|
class AddPlant extends React.Component{
|
||||||
|
|
||||||
@ -69,5 +69,4 @@ class AddPlant extends React.Component{
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export default AddPlant;
|
export default AddPlant;
|
||||||
|
|
||||||
@ -1,71 +1,134 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {CartesianGrid, Legend, Line, LineChart, ResponsiveContainer, Tooltip, XAxis, YAxis} from 'recharts';
|
import {CartesianGrid, Legend, Line, LineChart, ResponsiveContainer, Tooltip, XAxis, YAxis} from 'recharts';
|
||||||
import SensorCardDeck from './SensorCardDeck'
|
import SensorCardDeck from './SensorCardDeck'
|
||||||
import {SensorDataCollection} from "../../client/main";
|
import {SensorDataCollection, ActiveDeviceCollection} from "../../client/main";
|
||||||
import {useTracker} from 'meteor/react-meteor-data';
|
import {useTracker} from 'meteor/react-meteor-data';
|
||||||
import {Col, Row} from "react-bootstrap";
|
import {Col, Form, Row, Card, CardDeck} from "react-bootstrap";
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
const sensorData = useTracker(() => {
|
|
||||||
return SensorDataCollection.find({ device_id: 'esp-andy' }, { sort: { timestamp: -1 }, limit: 10 }).fetch().reverse();
|
const uniqueEspNames = _.uniq(SensorDataCollection.find({}, {
|
||||||
|
sort: {device_id: 1}, fields: {device_id: true}
|
||||||
|
}).fetch().map(function (x) {
|
||||||
|
return x.device_id;
|
||||||
|
}), true);
|
||||||
|
|
||||||
|
const deviceName = useTracker(() => {
|
||||||
|
return ActiveDeviceCollection.find().fetch()[0];
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
const sensorData = useTracker(() => {
|
||||||
<>
|
if (deviceName === null || deviceName === undefined) {
|
||||||
<SensorCardDeck/>
|
return [];
|
||||||
|
} else {
|
||||||
|
return SensorDataCollection.find({device_id: deviceName.deviceName}, {
|
||||||
|
sort: {timestamp: -1},
|
||||||
|
limit: 61
|
||||||
|
}).fetch().reverse();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
<Row>
|
const handleChange = (e) => {
|
||||||
<Col>
|
if (e.target.value === "") {
|
||||||
<ResponsiveContainer width='100%' height={375}>
|
console.log("No device selected!");
|
||||||
<LineChart data={sensorData} margin={{ top: 60, right: 60, bottom: 30, left: 5 }}>
|
} else {
|
||||||
<Line type="monotone" dataKey="temperature" stroke="#10b5de" />
|
var doc = ActiveDeviceCollection.findOne({deviceName: deviceName.deviceName});
|
||||||
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
ActiveDeviceCollection.update({_id: doc._id}, {$set: {deviceName: e.target.value}});
|
||||||
<XAxis dataKey="timestamp" />
|
}
|
||||||
<YAxis />
|
}
|
||||||
<Tooltip />
|
|
||||||
<Legend />
|
|
||||||
</LineChart>
|
if ((sensorData.length <= 0) || (deviceName.length <= 0)) {
|
||||||
</ResponsiveContainer>
|
return (
|
||||||
</Col>
|
<CardDeck>
|
||||||
<Col>
|
<Card>
|
||||||
<ResponsiveContainer width='100%' height={375}>
|
<Card.Body>
|
||||||
<LineChart data={sensorData} margin={{ top: 60, right: 60, bottom: 30, left: 5 }}>
|
<Card.Title>Loading!</Card.Title>
|
||||||
<Line type="monotone" dataKey="humidity" stroke="#ff6f00" />
|
<Card.Text>Please wait...</Card.Text>
|
||||||
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
</Card.Body>
|
||||||
<XAxis dataKey="timestamp" />
|
</Card>
|
||||||
<YAxis />
|
</CardDeck>
|
||||||
<Tooltip />
|
)
|
||||||
<Legend />
|
} else {
|
||||||
</LineChart>
|
return (
|
||||||
</ResponsiveContainer>
|
<>
|
||||||
</Col>
|
<Row>
|
||||||
</Row>
|
<Col xs lg="2">
|
||||||
<Row>
|
<h4>Devices:</h4>
|
||||||
<Col>
|
</Col>
|
||||||
<ResponsiveContainer width='100%' height={375}>
|
</Row>
|
||||||
<LineChart data={sensorData} margin={{ top: 60, right: 60, bottom: 30, left: 5 }}>
|
<Row>
|
||||||
<Line type="monotone" dataKey="brightness" stroke="#ffd500" />
|
<Col xs lg="2">
|
||||||
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
<Form>
|
||||||
<XAxis dataKey="timestamp" />
|
<Form.Group>
|
||||||
<YAxis />
|
<Form.Control as="select" type="text" onChange={handleChange}>
|
||||||
<Tooltip />
|
<option></option>
|
||||||
<Legend />
|
{uniqueEspNames.map((espName, index) => {
|
||||||
</LineChart>
|
return <option key={index} value={espName}>{espName}</option>
|
||||||
</ResponsiveContainer>
|
})}
|
||||||
</Col>
|
</Form.Control>
|
||||||
<Col>
|
</Form.Group>
|
||||||
<ResponsiveContainer width='100%' height={375}>
|
</Form>
|
||||||
<LineChart data={sensorData} margin={{ top: 60, right: 60, bottom: 30, left: 5 }}>
|
</Col>
|
||||||
<Line type="monotone" dataKey="moisture" stroke="#1c4399" />
|
<Col>
|
||||||
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
<h6>active device: {deviceName.deviceName}</h6>
|
||||||
<XAxis dataKey="timestamp" />
|
</Col>
|
||||||
<YAxis />
|
</Row>
|
||||||
<Tooltip />
|
|
||||||
<Legend />
|
<SensorCardDeck/>
|
||||||
</LineChart>
|
<Row>
|
||||||
</ResponsiveContainer>
|
<Col>
|
||||||
</Col>
|
<ResponsiveContainer width='100%' height={350}>
|
||||||
</Row>
|
<LineChart data={sensorData} margin={{top: 50, right: 50, bottom: 25, left: 5}}>
|
||||||
</>
|
<Line type="monotone" dataKey="temperature" stroke="#10b5de"/>
|
||||||
)
|
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
||||||
|
<XAxis dataKey="timeAsString"/>
|
||||||
|
<YAxis/>
|
||||||
|
<Tooltip/>
|
||||||
|
<Legend/>
|
||||||
|
</LineChart>
|
||||||
|
</ResponsiveContainer>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<ResponsiveContainer width='100%' height={350}>
|
||||||
|
<LineChart data={sensorData} margin={{top: 50, right: 50, bottom: 25, left: 5}}>
|
||||||
|
<Line type="monotone" dataKey="humidity" stroke="#ff6f00"/>
|
||||||
|
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
||||||
|
<XAxis dataKey="timeAsString"/>
|
||||||
|
<YAxis/>
|
||||||
|
<Tooltip/>
|
||||||
|
<Legend/>
|
||||||
|
</LineChart>
|
||||||
|
</ResponsiveContainer>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<ResponsiveContainer width='100%' height={350}>
|
||||||
|
<LineChart data={sensorData} margin={{top: 50, right: 50, bottom: 25, left: 5}}>
|
||||||
|
<Line type="monotone" dataKey="brightness" stroke="#ffd500"/>
|
||||||
|
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
||||||
|
<XAxis dataKey="timeAsString"/>
|
||||||
|
<YAxis/>
|
||||||
|
<Tooltip/>
|
||||||
|
<Legend/>
|
||||||
|
</LineChart>
|
||||||
|
</ResponsiveContainer>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<ResponsiveContainer width='100%' height={350}>
|
||||||
|
<LineChart data={sensorData} margin={{top: 50, right: 50, bottom: 25, left: 5}}>
|
||||||
|
<Line type="monotone" dataKey="moisture" stroke="#1c4399"/>
|
||||||
|
<CartesianGrid stroke="#ccc" strokeDasharray="5 5"/>
|
||||||
|
<XAxis dataKey="timeAsString"/>
|
||||||
|
<YAxis/>
|
||||||
|
<Tooltip/>
|
||||||
|
<Legend/>
|
||||||
|
</LineChart>
|
||||||
|
</ResponsiveContainer>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@ -1,39 +1,55 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { Card, CardDeck } from 'react-bootstrap';
|
import { Card, CardDeck } from 'react-bootstrap';
|
||||||
import {SensorDataCollection} from "../../client/main";
|
import {ActiveDeviceCollection, SensorDataCollection} from "../../client/main";
|
||||||
import {useTracker} from 'meteor/react-meteor-data';
|
import {useTracker} from 'meteor/react-meteor-data';
|
||||||
|
|
||||||
export default function SensorCardDeck() {
|
export default function SensorCardDeck() {
|
||||||
const sensorData = useTracker(() => {
|
const deviceName = useTracker(() => {
|
||||||
return SensorDataCollection.find({ device_id: 'esp-andy' }, { sort: { timestamp: -1 }, limit: 1 }).fetch();
|
return ActiveDeviceCollection.find().fetch()[0];
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
const sensorData = useTracker(() => {
|
||||||
<CardDeck>
|
return SensorDataCollection.find({ device_id: deviceName.deviceName }, { sort: { timestamp: -1 }, limit: 1 }).fetch();
|
||||||
<Card>
|
});
|
||||||
<Card.Body>
|
if (sensorData.length <= 0) {
|
||||||
<Card.Title>Temperature</Card.Title>
|
return (
|
||||||
<Card.Text>{sensorData[0].temperature} °C</Card.Text>
|
<CardDeck>
|
||||||
</Card.Body>
|
<Card>
|
||||||
</Card>
|
<Card.Body>
|
||||||
<Card>
|
<Card.Title>Loading!</Card.Title>
|
||||||
<Card.Body>
|
<Card.Text>Please wait...</Card.Text>
|
||||||
<Card.Title>Humidity</Card.Title>
|
</Card.Body>
|
||||||
<Card.Text>{sensorData[0].humidity} %</Card.Text>
|
</Card>
|
||||||
</Card.Body>
|
</CardDeck>
|
||||||
</Card>
|
)
|
||||||
<Card>
|
} else {
|
||||||
<Card.Body>
|
return (
|
||||||
<Card.Title>Brightness</Card.Title>
|
<CardDeck>
|
||||||
<Card.Text>{sensorData[0].brightness} lux</Card.Text>
|
<Card>
|
||||||
</Card.Body>
|
<Card.Body>
|
||||||
</Card>
|
<Card.Title>Temperature</Card.Title>
|
||||||
<Card>
|
<Card.Text>{sensorData[0].temperature} °C</Card.Text>
|
||||||
<Card.Body>
|
</Card.Body>
|
||||||
<Card.Title>Moisture</Card.Title>
|
</Card>
|
||||||
<Card.Text>{sensorData[0].moisture} %</Card.Text>
|
<Card>
|
||||||
</Card.Body>
|
<Card.Body>
|
||||||
</Card>
|
<Card.Title>Humidity</Card.Title>
|
||||||
</CardDeck>
|
<Card.Text>{sensorData[0].humidity} %</Card.Text>
|
||||||
)
|
</Card.Body>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<Card.Body>
|
||||||
|
<Card.Title>Brightness</Card.Title>
|
||||||
|
<Card.Text>{sensorData[0].brightness} lux</Card.Text>
|
||||||
|
</Card.Body>
|
||||||
|
</Card>
|
||||||
|
<Card>
|
||||||
|
<Card.Body>
|
||||||
|
<Card.Title>Moisture</Card.Title>
|
||||||
|
<Card.Text>{sensorData[0].moisture} %</Card.Text>
|
||||||
|
</Card.Body>
|
||||||
|
</Card>
|
||||||
|
</CardDeck>
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@ -28,10 +28,24 @@ function messageCallback(collection) {
|
|||||||
const id = topicElements.pop();
|
const id = topicElements.pop();
|
||||||
|
|
||||||
var date = new Date;
|
var date = new Date;
|
||||||
|
var time;
|
||||||
|
|
||||||
|
if (date.getHours() <= 9) {time = "0" + date.getHours();} else {
|
||||||
|
time = date.getHours();
|
||||||
|
}
|
||||||
|
if (date.getMinutes() <= 9) {time = time + ":0" + date.getMinutes();} else {
|
||||||
|
time = time + ":" + date.getMinutes();
|
||||||
|
}
|
||||||
|
/*
|
||||||
|
if (date.getSeconds() <= 9) {time = time + ":0" + date.getSeconds();} else {
|
||||||
|
time = time + ":" + date.getSeconds();
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
let doc = {
|
let doc = {
|
||||||
device_id: id,
|
device_id: id,
|
||||||
timestamp: date,
|
timestamp: date,
|
||||||
|
timeAsString: time,
|
||||||
}
|
}
|
||||||
try {
|
try {
|
||||||
doc = _.merge(doc, JSON.parse(message));
|
doc = _.merge(doc, JSON.parse(message));
|
||||||
|
|||||||
@ -2,7 +2,8 @@
|
|||||||
"name": "smart_garden_server",
|
"name": "smart_garden_server",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "meteor run",
|
"start": "MONGO_URL=mongodb://garden:99009911@cloud.timovolkmann.de:27017/Smart_Garden meteor run",
|
||||||
|
"plainstart": "meteor run",
|
||||||
"test": "meteor test --once --driver-package meteortesting:mocha",
|
"test": "meteor test --once --driver-package meteortesting:mocha",
|
||||||
"test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
|
"test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
|
||||||
"visualize": "meteor --production --extra-packages bundle-visualizer"
|
"visualize": "meteor --production --extra-packages bundle-visualizer"
|
||||||
|
|||||||
@ -2,6 +2,7 @@ import { Meteor } from 'meteor/meteor';
|
|||||||
|
|
||||||
var PlantTypesCollection = new Meteor.Collection('plantTypes');
|
var PlantTypesCollection = new Meteor.Collection('plantTypes');
|
||||||
var SensorDataCollection = new Meteor.Collection('sensorData');
|
var SensorDataCollection = new Meteor.Collection('sensorData');
|
||||||
|
var ActiveDeviceCollection = new Meteor.Collection('activeDevice');
|
||||||
|
|
||||||
Meteor.startup(() => {
|
Meteor.startup(() => {
|
||||||
if(Meteor.isServer) {
|
if(Meteor.isServer) {
|
||||||
@ -12,10 +13,15 @@ Meteor.startup(() => {
|
|||||||
Meteor.publish('sensorDataCollection', function() {
|
Meteor.publish('sensorDataCollection', function() {
|
||||||
return SensorDataCollection.find();
|
return SensorDataCollection.find();
|
||||||
})
|
})
|
||||||
|
|
||||||
|
Meteor.publish('activeDeviceCollection', function() {
|
||||||
|
return ActiveDeviceCollection.find();
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
if (Meteor.isClient) {
|
if (Meteor.isClient) {
|
||||||
Meteor.subscribe('plantTypesCollection');
|
Meteor.subscribe('plantTypesCollection');
|
||||||
Meteor.subscribe('sensorDataCollection');
|
Meteor.subscribe('sensorDataCollection');
|
||||||
|
Meteor.subscribe('activeDeviceCollection');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
Loading…
Reference in New Issue
Block a user