tanner
/
critical-leddemo
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add support for DIN

Browse Source
master
Tanner Collin 7 years ago
parent 45d88f1ddc
commit df5521d323
2 changed files with 64 additions and 24 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 35
      server.js
  2. 53
      src/app.js

35
server.js
Unescape View File

@ -1,8 +1,17 @@
const express = require('express') const express = require('express');
const app = express() const app = express();
const DOUT_LUT = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'];
const server = app.listen(3000, function () {
console.log('Example app listening on port 3000!');
})
const io = require('socket.io').listen(server);
var ioState = { var ioState = {
dout: [false], dout: [false, false, false, false],
din: [false, false, false, false]
} }
const updateState = data => { const updateState = data => {
@ -14,15 +23,21 @@ const updateState = data => {
app.use('/', express.static('dist')) app.use('/', express.static('dist'))
app.get('/api/dout/:pin', function (req, res) { app.get('/api/dio/:data', function (req, res) {
res.send(ioState.dout[req.params.pin]) const doutNum = ioState.dout.reduce((total, x, i) => x ? total + Math.pow(2, i) : total, 0);
}) const doutChar = DOUT_LUT[doutNum];
res.send(doutChar);
const server = app.listen(3000, function () { const dinChar = req.params.data || '0';
console.log('Example app listening on port 3000!') const dinArray = parseInt(dinChar, 16).toString(2).split('').reverse();
}) const din = new Array(4).fill(false).map((x, i) => dinArray[i] != '1').reverse();
const io = require('socket.io').listen(server); if (ioState.din.toString() != din.toString()) {
ioState.din = din;
io.emit('ioState', ioState);
console.log(din);
}
})
io.on('connection', socket => { io.on('connection', socket => {
socket.emit('ioState', ioState); socket.emit('ioState', ioState);

53
src/app.js
Unescape View File

@ -13,6 +13,11 @@ export default class App extends React.Component {
componentDidMount() { componentDidMount() {
this.connect(); this.connect();
this.setState({ioState: {
dout: [false, true, false, false],
din: [false, false, true, false]
}});
} }
componentWillUnmount() { componentWillUnmount() {
@ -48,28 +53,48 @@ export default class App extends React.Component {
<div className="center aligned column"> <div className="center aligned column">
<div className="ui basic segment"> <div className="ui basic segment">
<img className="ui left floated small image" src="http://criticalcontrol.com/wp-content/themes/cces/images/logo.png" /> <img className="ui left floated small image" src="http://criticalcontrol.com/wp-content/themes/cces/images/logo.png" />
<span className="ui medium header">LED Toggle Demo</span> <span className="ui medium header">Modem I/O Demo</span>
</div> </div>
</div> </div>
</div> </div>
{this.state.ioState && <div className="column"> {this.state.ioState && <div className="column">
<div className="ui segment"> <div className="ui segment">
<div className="ui top attached label">Digital Out</div> <div className="ui top attached label">Digital Out</div>
<div className="ui two column middle aligned grid"> {this.state.ioState.dout.map((x, i) => (
<div className="twelve wide column"> <div className="ui two column middle aligned grid">
<div className="ui right pointing label"> <div className="twelve wide column">
DO1 <div className="ui right pointing label">
DO{i+1}
</div>
<div className="ui buttons">
<button onClick={() => this.sendUpdate('dout', i, true)} className="ui red button">On</button>
<button onClick={() => this.sendUpdate('dout', i, false)} className="ui button">Off</button>
</div>
</div>
<div className="four wide right aligned column">
{!x && <i className="bordered inverted disabled idea big icon"></i>}
{x && <i className="bordered inverted red idea big icon"></i>}
</div>
</div> </div>
<div className="ui buttons"> ))}
<button onClick={() => this.sendUpdate('dout', 0, true)} className="ui red button">On</button> </div>
<button onClick={() => this.sendUpdate('dout', 0, false)} className="ui button">Off</button> </div>}
{this.state.ioState && <div className="column">
<div className="ui segment">
<div className="ui top attached label">Digital In</div>
{this.state.ioState.din.map((x, i) => (
<div className="ui two column middle aligned grid">
<div className="four wide column">
<div className="ui right pointing label">
DI{i+1}
</div>
</div>
<div className="twelve wide center aligned column">
{!x && <i className="bordered inverted disabled circle big icon"></i>}
{x && <i className="bordered inverted red circle thin big icon"></i>}
</div>
</div> </div>
</div> ))}
<div className="four wide right aligned column">
{!this.state.ioState.dout[0] && <i className="bordered inverted disabled idea big icon"></i>}
{this.state.ioState.dout[0] && <i className="bordered inverted red idea big icon"></i>}
</div>
</div>
</div> </div>
</div>} </div>}
</div> </div>

Write Preview
Loading…
Cancel
Save