From afcdfe40e91901b204c2ca006e5e7372bb1ed3d5 Mon Sep 17 00:00:00 2001 From: Alban Date: Wed, 23 Sep 2020 17:35:12 +0200 Subject: [PATCH] redis update --- public/index.html | 33 +++++++++++++++----------- public/sym/dark.css | 32 ++++++++++++++++++++++--- server.js | 58 +++++++++++++++++++++++++++++++++++++++++---- 3 files changed, 101 insertions(+), 22 deletions(-) diff --git a/public/index.html b/public/index.html index 04e5fe3..223129d 100644 --- a/public/index.html +++ b/public/index.html @@ -24,10 +24,12 @@ socket.onclose = error => show_error('session timed out (refresh)') socket.onmessage = (e) => { console.log(e.data) - let msg = e.data.split(";", 2) + let msg = e.data.split(";", 3) if (msg[0] === 'error') show_error(msg[1]) - else if (msg[0] === 'led1') { - document.getElementById('led1_title').innerText = `LED 1 (currently ${msg[1]}):` + else if (msg[0] === 'device') { + 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() { @@ -48,18 +50,21 @@
ESP-IoT
-
LED 1:
-
-
on
-
-
-
off
+
+
+
LED 1:
+ + +
-
diff --git a/public/sym/dark.css b/public/sym/dark.css index 596de62..a6e5819 100644 --- a/public/sym/dark.css +++ b/public/sym/dark.css @@ -10,7 +10,7 @@ body{ padding-top: 20px; padding-bottom: 130px; min-height: calc(100% - 150px); - max-width: 70rem; + max-width: 90rem; min-width: 25rem; margin: auto; background-color: #1f262b; @@ -184,7 +184,7 @@ img.icon { font-family:"Roboto", regular, sans-serif; } .error{ - position: absolute; + position: fixed; bottom: 1rem; left: 1rem; height: 10rem; @@ -192,13 +192,31 @@ img.icon { background-color: #E53935; 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 { position: absolute; width: 10rem; margin-left: calc(50% - 5rem); - margin-top: 20px; + margin-top: 1rem; } #copy-btn { position: absolute; @@ -218,6 +236,9 @@ img.icon { #error-box{ display: none; } +#led1{ + /*display: none;*/ +} @keyframes slide-from-top{ @@ -242,6 +263,11 @@ img.icon { height: 8rem; width: calc(100% - 2rem); } + .device_box{ + left: 1.5rem; + margin: 1rem 0; + width: calc(100% - 3.3rem); + } #surl-popup{ width: calc(100% - 2rem); height: 14rem; diff --git a/server.js b/server.js index 4325633..026242b 100644 --- a/server.js +++ b/server.js @@ -24,12 +24,31 @@ redis_cli.on("error", function (error) { http.createServer(function (req, res) { const q = url.parse(req.url, true); 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"; 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.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(); } 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 wss.on('connection', ws => { ws.on('message', message => { @@ -81,14 +126,17 @@ wss.on('connection', ws => { wss.clients.forEach(clients => { clients.send(message) }) - led1_status = msg[1] } } xhr.open('GET', `http://192.168.1.210/${msg[1]}`, 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');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') } })