adb/esp-smarthome_server
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

redis update

Browse Source
This commit is contained in:
Alban 2020-09-23 17:35:12 +02:00
parent 66141472e1
commit afcdfe40e9
3 changed files with 101 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
public/index.html
View File

@ -24,10 +24,12 @@
socket.onclose = error => show_error('session timed out (refresh)') socket.onclose = error => show_error('session timed out (refresh)')
socket.onmessage = (e) => { socket.onmessage = (e) => {
console.log(e.data) console.log(e.data)
let msg = e.data.split(";", 2) let msg = e.data.split(";", 3)
if (msg[0] === 'error') show_error(msg[1]) if (msg[0] === 'error') show_error(msg[1])
else if (msg[0] === 'led1') { else if (msg[0] === 'device') {
document.getElementById('led1_title').innerText = `LED 1 (currently ${msg[1]}):` if (msg[2] === 'online') document.getElementById(msg[1]).style.display = "block"
else if (msg[2] === 'offline') document.getElementById(msg[1]).style.display = "none"
else document.getElementById('led1_title').innerText = `LED 1 (currently ${msg[1]}):`
} }
} }
function copy_url() { function copy_url() {
@ -48,18 +50,21 @@
</head> </head>
<body> <body>
<div class="title">ESP-IoT</div> <div class="title">ESP-IoT</div>
<div class="title2" id="led1_title">LED 1:</div> <div class="devices">
<div class="btn-green" <div id="led1" class="device_box">
style="width: 10rem; position:relative; margin-top: 1rem; margin-left: calc(50% - 5rem);" <div class="title2" id="led1_title">LED 1:</div>
onclick="socket.send('led1;on')"> <button class="btn-green"
<div class="btn-text">on</div> style="width: 10rem; position:relative; margin-top: 1rem; margin-left: calc(50% - 5rem);"
onclick="socket.send('led1;on')">
<div class="btn-text">on</div>
</button>
<button class="btn-red"
style="width: 10rem; position:relative; margin-top: 1rem; margin-left: calc(50% - 5rem);"
onclick="socket.send('led1;off')">
<div class="btn-text">off</div>
</button>
</div>
</div> </div>
<div class="btn-red"
style="width: 10rem; position:relative; margin-top: 1rem; margin-left: calc(50% - 5rem);"
onclick="socket.send('led1;off')">
<div class="btn-text">off</div>
</div>
<div id="error-box" class="error"> <div id="error-box" class="error">
<div onclick="this.parentNode.style.display = 'none'" style="position: absolute; top:5px; right: 5px;" class="sym_btn-invisible"> <div onclick="this.parentNode.style.display = 'none'" style="position: absolute; top:5px; right: 5px;" class="sym_btn-invisible">
<img class="icon" src="./sym/ic_close_white_24px.svg"> <img class="icon" src="./sym/ic_close_white_24px.svg">

32
public/sym/dark.css
View File

@ -10,7 +10,7 @@ body{
padding-top: 20px; padding-top: 20px;
padding-bottom: 130px; padding-bottom: 130px;
min-height: calc(100% - 150px); min-height: calc(100% - 150px);
max-width: 70rem; max-width: 90rem;
min-width: 25rem; min-width: 25rem;
margin: auto; margin: auto;
background-color: #1f262b; background-color: #1f262b;
@ -184,7 +184,7 @@ img.icon {
font-family:"Roboto", regular, sans-serif; font-family:"Roboto", regular, sans-serif;
} }
.error{ .error{
position: absolute; position: fixed;
bottom: 1rem; bottom: 1rem;
left: 1rem; left: 1rem;
height: 10rem; height: 10rem;
@ -192,13 +192,31 @@ img.icon {
background-color: #E53935; background-color: #E53935;
border-radius: 15px; border-radius: 15px;
} }
.devices{
position: relative;
width: auto;
}
.device_box{
display: table;
position: relative;
float: left;
margin: 1rem;
height: 12rem;
width: 25rem;
background-color: #546E7A;
border: 0.15rem solid #fff;
border-radius: 1rem;
}
.devices_end{
clear: both;
}
#short-btn { #short-btn {
position: absolute; position: absolute;
width: 10rem; width: 10rem;
margin-left: calc(50% - 5rem); margin-left: calc(50% - 5rem);
margin-top: 20px; margin-top: 1rem;
} }
#copy-btn { #copy-btn {
position: absolute; position: absolute;
@ -218,6 +236,9 @@ img.icon {
#error-box{ #error-box{
display: none; display: none;
} }
#led1{
/*display: none;*/
}
@keyframes slide-from-top{ @keyframes slide-from-top{
@ -242,6 +263,11 @@ img.icon {
height: 8rem; height: 8rem;
width: calc(100% - 2rem); width: calc(100% - 2rem);
} }
.device_box{
left: 1.5rem;
margin: 1rem 0;
width: calc(100% - 3.3rem);
}
#surl-popup{ #surl-popup{
width: calc(100% - 2rem); width: calc(100% - 2rem);
height: 14rem; height: 14rem;

58
server.js
View File

@ -24,12 +24,31 @@ redis_cli.on("error", function (error) {
http.createServer(function (req, res) { http.createServer(function (req, res) {
const q = url.parse(req.url, true); const q = url.parse(req.url, true);
let filename = "./public" + q.pathname; let filename = "./public" + q.pathname;
let path_split = q.pathname.split("/", 3); let path_split = q.pathname.split("/", 4);
if (path_split[path_split.length - 1] === "") filename += "/index.html"; if (path_split[path_split.length - 1] === "") filename += "/index.html";
let file_type = mime.getType(filename) let file_type = mime.getType(filename)
if (path_split[1] === "connect") { if (path_split[1] === "connect" && path_split[2] !== "") { //device registration
res.writeHead(200, {'Content-Type': file_type}); res.writeHead(200, {'Content-Type': file_type});
res.write(""); redis_cli.hmset("device;" + path_split[3], "status", "online", "ip", path_split[2], "time", Date.now())
wss.clients.forEach(clients => {
clients.send("device;"+path_split[3]+";online")
})
res.write("200");
/*let check = setInterval(to => {
let xhr = new XMLHttpRequest();
xhr.open('GET', `http://192.168.1.210/info`, true);
xhr.timeout = 1000;
xhr.ontimeout = function(e) {ws.send('error;device "led1" is offline')}
xhr.send();
setTimeout(to => {if (xhr.readyState !== 4){
//ws.send('error;device "led1" took too long to reach')
wss.clients.forEach(clients => {
clients.send('device;led1;offline')
})
xhr.abort()
clearInterval(check)
}}, 2000)
}, 5000)*/
return res.end(); return res.end();
} }
fs.readFile(filename, function(err, data) { fs.readFile(filename, function(err, data) {
@ -67,6 +86,32 @@ const wss = new ws.Server({
} }
}); });
//check available devices
let checkstat = setInterval(to => {
redis_cli.keys("device;*", function(err, keys) { if(err) console.log(err)
if(keys){ keys.forEach(key => {
redis_cli.hgetall(key, function(err, device) { if(err) console.log(err)
if (device){
let device_available = "online"
let xhr = new XMLHttpRequest();
xhr.open('GET', `http://${device[3]}/info`, true);
xhr.timeout = 1000;
xhr.ontimeout = function(e) {ws.send('error;device "led1" is offline')}
xhr.send();
setTimeout(to => {if (xhr.readyState !== 4){
wss.clients.forEach(clients => clients.send(`${key};offline`))
device_available = "offline"
xhr.abort()
}
if (device_available !== device[1]){
wss.clients.forEach(clients => clients.send(`${key};${device_available}`))
}}, 2000)
}
})
})}
})
}, 5000)
//WS handler //WS handler
wss.on('connection', ws => { wss.on('connection', ws => {
ws.on('message', message => { ws.on('message', message => {
@ -81,14 +126,17 @@ wss.on('connection', ws => {
wss.clients.forEach(clients => { wss.clients.forEach(clients => {
clients.send(message) clients.send(message)
}) })
led1_status = msg[1]
} }
} }
xhr.open('GET', `http://192.168.1.210/${msg[1]}`, true); xhr.open('GET', `http://192.168.1.210/${msg[1]}`, true);
xhr.timeout = 1000; xhr.timeout = 1000;
xhr.ontimeout = function(e) {ws.send('error;device "led1" is offline')} xhr.ontimeout = function(e) {ws.send('error;device "led1" is offline')}
xhr.send(); xhr.send();
setTimeout(to => {if (xhr.readyState !== 4) ws.send('error;device "led1" took too long to reach');xhr.abort()}, 1500) setTimeout(to => {if (xhr.readyState !== 4){
ws.send('error;device "led1" took too long to reach')
ws.send('device;led1;offline')
xhr.abort()
}}, 1500)
}else ws.send('error;try again') }else ws.send('error;try again')
} }
}) })