Try without timer.

This commit is contained in:
Andrés Uribe Stengel 2020-07-16 15:07:54 +02:00
parent 40c5dc2cb0
commit 76eb9012fa
2 changed files with 94 additions and 90 deletions

View File

@ -29,7 +29,5 @@ Meteor.startup(() => {
Meteor.subscribe('activeDeviceCollection');
}
Meteor.setTimeout(function() {
ReactDOM.render(<App />, document.getElementById('root'));
}, 1250);
ReactDOM.render(<App />, document.getElementById('root'));
});

View File

@ -6,11 +6,11 @@ import {useTracker} from 'meteor/react-meteor-data';
import {Col, Form, Row} from "react-bootstrap";
export default function Home() {
export default function Home() {
const uniqueEspNames = _.uniq(SensorDataCollection.find({}, {
sort: {device_id: 1}, fields: {device_id: true}
}).fetch().map(function(x) {
}).fetch().map(function (x) {
return x.device_id;
}), true);
@ -19,18 +19,23 @@ export default function Home() {
});
const sensorData = useTracker(() => {
return SensorDataCollection.find({ device_id: deviceName.deviceName }, { sort: { timestamp: -1 }, limit: 61 }).fetch().reverse();
return SensorDataCollection.find({device_id: deviceName.deviceName}, {
sort: {timestamp: -1},
limit: 61
}).fetch().reverse();
});
const handleChange = (e) => {
if (e.target.value === "") {console.log("No device selected!");} else {
var doc = ActiveDeviceCollection.findOne({ deviceName: deviceName.deviceName });
ActiveDeviceCollection.update({ _id: doc._id }, {$set:{deviceName: e.target.value}});
if (e.target.value === "") {
console.log("No device selected!");
} else {
var doc = ActiveDeviceCollection.findOne({deviceName: deviceName.deviceName});
ActiveDeviceCollection.update({_id: doc._id}, {$set: {deviceName: e.target.value}});
}
}
/*if (sensorData.length <= 0) {
if ((sensorData.length <= 0) || (deviceName.length <= 0) || (uniqueEspNames.length <= 0)) {
return (
<CardDeck>
<Card>
@ -41,85 +46,86 @@ export default function Home() {
</Card>
</CardDeck>
)
} else {}*/
return (
<>
<Row>
<Col xs lg="2">
<h4>Devices:</h4>
</Col>
</Row>
<Row>
<Col xs lg="2">
<Form>
<Form.Group>
<Form.Control as="select" type="text" onChange={handleChange}>
<option></option>
{uniqueEspNames.map((espName, index) =>{
return <option key={index} value={espName}>{espName}</option>
})}
</Form.Control>
</Form.Group>
</Form>
</Col>
<Col>
<h6>active device: {deviceName.deviceName}</h6>
</Col>
</Row>
} else {
return (
<>
<Row>
<Col xs lg="2">
<h4>Devices:</h4>
</Col>
</Row>
<Row>
<Col xs lg="2">
<Form>
<Form.Group>
<Form.Control as="select" type="text" onChange={handleChange}>
<option></option>
{uniqueEspNames.map((espName, index) => {
return <option key={index} value={espName}>{espName}</option>
})}
</Form.Control>
</Form.Group>
</Form>
</Col>
<Col>
<h6>active device: {deviceName.deviceName}</h6>
</Col>
</Row>
<SensorCardDeck/>
<Row>
<Col>
<ResponsiveContainer width='100%' height={350}>
<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>
</>
)
<SensorCardDeck/>
<Row>
<Col>
<ResponsiveContainer width='100%' height={350}>
<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>
</>
)
}
}