From e75afcba4225c93aad7327e6a5acde2f34b24022 Mon Sep 17 00:00:00 2001 From: Sergey Lyubka Date: Sun, 5 Jun 2022 17:17:19 +0100 Subject: [PATCH] Update dash UI --- examples/device-dashboard/packed_fs.c | 2091 +++++++++--------- examples/device-dashboard/web_root/main.js | 9 +- examples/device-dashboard/web_root/style.css | 9 +- 3 files changed, 1057 insertions(+), 1052 deletions(-) diff --git a/examples/device-dashboard/packed_fs.c b/examples/device-dashboard/packed_fs.c index 454757e1..207e8e85 100644 --- a/examples/device-dashboard/packed_fs.c +++ b/examples/device-dashboard/packed_fs.c @@ -151,1039 +151,1039 @@ static const unsigned char v2[] = { 96, 59, 10, 10, 10, 99, 111, 110, 115, 116, 32, 72, // `;...const H 101, 114, 111, 32, 61, 32, 112, 114, 111, 112, 115, 32, // ero = props 61, 62, 32, 104, 116, 109, 108, 96, 10, 60, 100, 105, // => html`.. - 32, 32, 60, 104, 49, 32, 115, 116, 121, 108, 101, 61, //

Inter - 97, 99, 116, 105, 118, 101, 32, 68, 101, 118, 105, 99, // active Devic - 101, 32, 68, 97, 115, 104, 98, 111, 97, 114, 100, 60, // e Dashboard< - 47, 104, 49, 62, 10, 10, 32, 32, 60, 112, 62, 10, // /h1>..

. - 32, 32, 84, 104, 105, 115, 32, 100, 101, 118, 105, 99, // This devic - 101, 32, 100, 97, 115, 104, 98, 111, 97, 114, 100, 32, // e dashboard - 105, 115, 32, 100, 101, 118, 101, 108, 111, 112, 101, 100, // is developed - 32, 119, 105, 116, 104, 32, 109, 111, 100, 101, 114, 110, // with modern - 32, 97, 110, 100, 32, 99, 111, 109, 112, 97, 99, 116, // and compact - 32, 80, 114, 101, 97, 99, 116, 32, 102, 114, 97, 109, // Preact fram - 101, 119, 111, 114, 107, 44, 10, 32, 32, 105, 110, 32, // ework,. in - 111, 114, 100, 101, 114, 32, 116, 111, 32, 102, 105, 116, // order to fit - 32, 111, 110, 32, 97, 32, 118, 101, 114, 121, 32, 115, // on a very s - 109, 97, 108, 108, 32, 100, 101, 118, 105, 99, 101, 115, // mall devices - 46, 32, 84, 104, 105, 115, 32, 105, 115, 10, 32, 32, // . This is. - 97, 32, 60, 97, 32, 104, 114, 101, 102, 61, 34, 104, // a hybri - 100, 32, 115, 101, 114, 118, 101, 114, 60, 47, 97, 62, // d server - 32, 119, 104, 105, 99, 104, 10, 32, 32, 112, 114, 111, // which. pro - 118, 105, 100, 101, 115, 32, 98, 111, 116, 104, 32, 115, // vides both s - 116, 97, 116, 105, 99, 32, 97, 110, 100, 32, 100, 121, // tatic and dy - 110, 97, 109, 105, 99, 32, 99, 111, 110, 116, 101, 110, // namic conten - 116, 46, 32, 32, 83, 116, 97, 116, 105, 99, 32, 102, // t. Static f - 105, 108, 101, 115, 44, 32, 108, 105, 107, 101, 32, 67, // iles, like C - 83, 83, 47, 74, 83, 47, 72, 84, 77, 76, 10, 32, // SS/JS/HTML. - 32, 111, 114, 32, 105, 109, 97, 103, 101, 115, 44, 32, // or images, - 97, 114, 101, 32, 99, 111, 109, 112, 105, 108, 101, 100, // are compiled - 32, 105, 110, 116, 111, 32, 116, 104, 101, 32, 115, 101, // into the se - 114, 118, 101, 114, 32, 98, 105, 110, 97, 114, 121, 46, // rver binary. - 10, 10, 32, 32, 84, 104, 105, 115, 32, 85, 73, 32, // .. This UI - 117, 115, 101, 115, 32, 116, 104, 101, 32, 82, 69, 83, // uses the RES - 84, 32, 65, 80, 73, 32, 105, 109, 112, 108, 101, 109, // T API implem - 101, 110, 116, 101, 100, 32, 98, 121, 32, 116, 104, 101, // ented by the - 32, 100, 101, 118, 105, 99, 101, 44, 32, 119, 104, 105, // device, whi - 99, 104, 32, 121, 111, 117, 32, 99, 97, 110, 32, 101, // ch you can e - 120, 97, 109, 105, 110, 101, 10, 32, 32, 117, 115, 105, // xamine. usi - 110, 103, 32, 32, 60, 99, 111, 100, 101, 62, 99, 117, // ng cu - 114, 108, 60, 47, 99, 111, 100, 101, 62, 32, 99, 111, // rl co - 109, 109, 97, 110, 100, 45, 108, 105, 110, 101, 32, 117, // mmand-line u - 116, 105, 108, 105, 116, 121, 58, 10, 32, 32, 60, 47, // tility:. ..

< + 118, 32, 99, 108, 97, 115, 115, 61, 34, 115, 101, 99, // v class="sec + 116, 105, 111, 110, 34, 62, 10, 60, 100, 105, 118, 32, // tion">.
. + 60, 104, 49, 32, 115, 116, 121, 108, 101, 61, 34, 109, //

Interac + 116, 105, 118, 101, 32, 68, 101, 118, 105, 99, 101, 32, // tive Device + 68, 97, 115, 104, 98, 111, 97, 114, 100, 60, 47, 104, // Dashboard..

. + 84, 104, 105, 115, 32, 100, 101, 118, 105, 99, 101, 32, // This device + 100, 97, 115, 104, 98, 111, 97, 114, 100, 32, 105, 115, // dashboard is + 32, 100, 101, 118, 101, 108, 111, 112, 101, 100, 32, 119, // developed w + 105, 116, 104, 32, 109, 111, 100, 101, 114, 110, 32, 97, // ith modern a + 110, 100, 32, 99, 111, 109, 112, 97, 99, 116, 32, 80, // nd compact P + 114, 101, 97, 99, 116, 32, 102, 114, 97, 109, 101, 119, // react framew + 111, 114, 107, 44, 10, 32, 32, 105, 110, 32, 111, 114, // ork,. in or + 100, 101, 114, 32, 116, 111, 32, 102, 105, 116, 32, 111, // der to fit o + 110, 32, 97, 32, 118, 101, 114, 121, 32, 115, 109, 97, // n a very sma + 108, 108, 32, 100, 101, 118, 105, 99, 101, 115, 46, 32, // ll devices. + 84, 104, 105, 115, 32, 105, 115, 10, 32, 32, 97, 32, // This is. a + 60, 97, 32, 104, 114, 101, 102, 61, 34, 104, 116, 116, // hybrid + 115, 101, 114, 118, 101, 114, 60, 47, 97, 62, 32, 119, // server w + 104, 105, 99, 104, 10, 32, 32, 112, 114, 111, 118, 105, // hich. provi + 100, 101, 115, 32, 98, 111, 116, 104, 32, 115, 116, 97, // des both sta + 116, 105, 99, 32, 97, 110, 100, 32, 100, 121, 110, 97, // tic and dyna + 109, 105, 99, 32, 99, 111, 110, 116, 101, 110, 116, 46, // mic content. + 32, 32, 83, 116, 97, 116, 105, 99, 32, 102, 105, 108, // Static fil + 101, 115, 44, 32, 108, 105, 107, 101, 32, 67, 83, 83, // es, like CSS + 47, 74, 83, 47, 72, 84, 77, 76, 10, 32, 32, 111, // /JS/HTML. o + 114, 32, 105, 109, 97, 103, 101, 115, 44, 32, 97, 114, // r images, ar + 101, 32, 99, 111, 109, 112, 105, 108, 101, 100, 32, 105, // e compiled i + 110, 116, 111, 32, 116, 104, 101, 32, 115, 101, 114, 118, // nto the serv + 101, 114, 32, 98, 105, 110, 97, 114, 121, 46, 10, 10, // er binary... + 32, 32, 84, 104, 105, 115, 32, 85, 73, 32, 117, 115, // This UI us + 101, 115, 32, 116, 104, 101, 32, 82, 69, 83, 84, 32, // es the REST + 65, 80, 73, 32, 105, 109, 112, 108, 101, 109, 101, 110, // API implemen + 116, 101, 100, 32, 98, 121, 32, 116, 104, 101, 32, 100, // ted by the d + 101, 118, 105, 99, 101, 44, 32, 119, 104, 105, 99, 104, // evice, which + 32, 121, 111, 117, 32, 99, 97, 110, 32, 101, 120, 97, // you can exa + 109, 105, 110, 101, 10, 32, 32, 117, 115, 105, 110, 103, // mine. using + 32, 32, 60, 99, 111, 100, 101, 62, 99, 117, 114, 108, // curl + 60, 47, 99, 111, 100, 101, 62, 32, 99, 111, 109, 109, // comm + 97, 110, 100, 45, 108, 105, 110, 101, 32, 117, 116, 105, // and-line uti + 108, 105, 116, 121, 58, 10, 32, 32, 60, 47, 112, 62, // lity:.

+ 10, 10, 32, 32, 60, 100, 105, 118, 62, 60, 99, 111, // ..
curl loca + 108, 104, 111, 115, 116, 58, 56, 48, 48, 48, 47, 97, // lhost:8000/a + 112, 105, 47, 99, 111, 110, 102, 105, 103, 47, 103, 101, // pi/config/ge + 116, 60, 47, 99, 111, 100, 101, 62, 32, 60, 47, 100, // t .
< 99, 111, 100, 101, 62, 99, 117, 114, 108, 32, 108, 111, // code>curl lo 99, 97, 108, 104, 111, 115, 116, 58, 56, 48, 48, 48, // calhost:8000 47, 97, 112, 105, 47, 99, 111, 110, 102, 105, 103, 47, // /api/config/ - 103, 101, 116, 60, 47, 99, 111, 100, 101, 62, 32, 60, // get < - 47, 100, 105, 118, 62, 10, 32, 32, 60, 100, 105, 118, // /div>.
curl - 108, 111, 99, 97, 108, 104, 111, 115, 116, 58, 56, 48, // localhost:80 - 48, 48, 47, 97, 112, 105, 47, 99, 111, 110, 102, 105, // 00/api/confi - 103, 47, 115, 101, 116, 32, 45, 100, 32, 39, 118, 97, // g/set -d 'va - 108, 117, 101, 49, 61, 55, 38, 118, 97, 108, 117, 101, // lue1=7&value - 50, 61, 104, 101, 108, 108, 111, 39, 60, 47, 99, 111, // 2=hello'
. - 32, 60, 100, 105, 118, 62, 60, 99, 111, 100, 101, 62, //
- 99, 117, 114, 108, 32, 108, 111, 99, 97, 108, 104, 111, // curl localho - 115, 116, 58, 56, 48, 48, 48, 47, 97, 112, 105, 47, // st:8000/api/ - 109, 101, 115, 115, 97, 103, 101, 47, 115, 101, 110, 100, // message/send - 32, 45, 100, 32, 39, 109, 115, 103, 61, 104, 101, 108, // -d 'msg=hel - 108, 111, 39, 60, 47, 99, 111, 100, 101, 62, 32, 60, // lo' < - 47, 100, 105, 118, 62, 10, 10, 32, 32, 60, 112, 62, // /div>..

- 10, 32, 32, 65, 32, 100, 101, 118, 105, 99, 101, 32, // . A device - 99, 97, 110, 32, 115, 101, 110, 100, 32, 110, 111, 116, // can send not - 105, 102, 105, 99, 97, 116, 105, 111, 110, 115, 32, 116, // ifications t - 111, 32, 116, 104, 105, 115, 32, 100, 97, 115, 104, 98, // o this dashb - 111, 97, 114, 100, 32, 97, 116, 32, 97, 110, 121, 116, // oard at anyt - 105, 109, 101, 46, 32, 78, 111, 116, 105, 102, 105, 99, // ime. Notific - 97, 116, 105, 111, 110, 115, 10, 32, 32, 97, 114, 101, // ations. are - 32, 115, 101, 110, 116, 32, 111, 118, 101, 114, 32, 87, // sent over W - 101, 98, 115, 111, 99, 107, 101, 116, 32, 97, 116, 32, // ebsocket at - 85, 82, 73, 32, 60, 99, 111, 100, 101, 62, 99, 117, // URI cu + 115, 101, 116, 32, 45, 100, 32, 39, 118, 97, 108, 117, // set -d 'valu + 101, 49, 61, 55, 38, 118, 97, 108, 117, 101, 50, 61, // e1=7&value2= + 104, 101, 108, 108, 111, 39, 60, 47, 99, 111, 100, 101, // hello'

. < + 100, 105, 118, 62, 60, 99, 111, 100, 101, 62, 99, 117, // div>cu 114, 108, 32, 108, 111, 99, 97, 108, 104, 111, 115, 116, // rl localhost - 58, 56, 48, 48, 48, 47, 97, 112, 105, 47, 119, 97, // :8000/api/wa - 116, 99, 104, 60, 47, 99, 111, 100, 101, 62, 10, 32, // tch. - 32, 97, 115, 32, 74, 83, 79, 78, 32, 115, 116, 114, // as JSON str - 105, 110, 103, 115, 32, 60, 99, 111, 100, 101, 62, 123, // ings { - 34, 110, 97, 109, 101, 34, 58, 32, 34, 46, 46, 34, // "name": ".." - 44, 32, 34, 100, 97, 116, 97, 34, 58, 32, 46, 46, // , "data": .. - 46, 125, 60, 47, 99, 111, 100, 101, 62, 10, 32, 32, // .}. - 60, 47, 112, 62, 10, 10, 60, 47, 100, 105, 118, 62, //

..
- 96, 59, 10, 10, 99, 111, 110, 115, 116, 32, 76, 111, // `;..const Lo - 103, 105, 110, 32, 61, 32, 102, 117, 110, 99, 116, 105, // gin = functi - 111, 110, 40, 112, 114, 111, 112, 115, 41, 32, 123, 10, // on(props) {. - 32, 32, 99, 111, 110, 115, 116, 32, 91, 117, 115, 101, // const [use - 114, 44, 32, 115, 101, 116, 85, 115, 101, 114, 93, 32, // r, setUser] - 61, 32, 117, 115, 101, 83, 116, 97, 116, 101, 40, 39, // = useState(' - 39, 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, 32, // ');. const - 91, 112, 97, 115, 115, 44, 32, 115, 101, 116, 80, 97, // [pass, setPa - 115, 115, 93, 32, 61, 32, 117, 115, 101, 83, 116, 97, // ss] = useSta + 58, 56, 48, 48, 48, 47, 97, 112, 105, 47, 109, 101, // :8000/api/me + 115, 115, 97, 103, 101, 47, 115, 101, 110, 100, 32, 45, // ssage/send - + 100, 32, 39, 109, 115, 103, 61, 104, 101, 108, 108, 111, // d 'msg=hello + 39, 60, 47, 99, 111, 100, 101, 62, 32, 60, 47, 100, // ' ..

. + 32, 65, 32, 100, 101, 118, 105, 99, 101, 32, 99, 97, // A device ca + 110, 32, 115, 101, 110, 100, 32, 110, 111, 116, 105, 102, // n send notif + 105, 99, 97, 116, 105, 111, 110, 115, 32, 116, 111, 32, // ications to + 116, 104, 105, 115, 32, 100, 97, 115, 104, 98, 111, 97, // this dashboa + 114, 100, 32, 97, 116, 32, 97, 110, 121, 116, 105, 109, // rd at anytim + 101, 46, 32, 78, 111, 116, 105, 102, 105, 99, 97, 116, // e. Notificat + 105, 111, 110, 115, 10, 32, 32, 97, 114, 101, 32, 115, // ions. are s + 101, 110, 116, 32, 111, 118, 101, 114, 32, 87, 101, 98, // ent over Web + 115, 111, 99, 107, 101, 116, 32, 97, 116, 32, 85, 82, // socket at UR + 73, 32, 60, 99, 111, 100, 101, 62, 99, 117, 114, 108, // I curl + 32, 108, 111, 99, 97, 108, 104, 111, 115, 116, 58, 56, // localhost:8 + 48, 48, 48, 47, 97, 112, 105, 47, 119, 97, 116, 99, // 000/api/watc + 104, 60, 47, 99, 111, 100, 101, 62, 10, 32, 32, 97, // h. a + 115, 32, 74, 83, 79, 78, 32, 115, 116, 114, 105, 110, // s JSON strin + 103, 115, 32, 60, 99, 111, 100, 101, 62, 123, 34, 110, // gs {"n + 97, 109, 101, 34, 58, 32, 34, 46, 46, 34, 44, 32, // ame": "..", + 34, 100, 97, 116, 97, 34, 58, 32, 46, 46, 46, 125, // "data": ...} + 60, 47, 99, 111, 100, 101, 62, 10, 32, 32, 60, 47, // . .

.`;..cons + 116, 32, 76, 111, 103, 105, 110, 32, 61, 32, 102, 117, // t Login = fu + 110, 99, 116, 105, 111, 110, 40, 112, 114, 111, 112, 115, // nction(props + 41, 32, 123, 10, 32, 32, 99, 111, 110, 115, 116, 32, // ) {. const + 91, 117, 115, 101, 114, 44, 32, 115, 101, 116, 85, 115, // [user, setUs + 101, 114, 93, 32, 61, 32, 117, 115, 101, 83, 116, 97, // er] = useSta 116, 101, 40, 39, 39, 41, 59, 10, 32, 32, 99, 111, // te('');. co - 110, 115, 116, 32, 108, 111, 103, 105, 110, 32, 61, 32, // nst login = - 101, 118, 32, 61, 62, 10, 32, 32, 32, 32, 32, 32, // ev =>. - 102, 101, 116, 99, 104, 40, 10, 32, 32, 32, 32, 32, // fetch(. - 32, 32, 32, 32, 32, 39, 47, 97, 112, 105, 47, 108, // '/api/l - 111, 103, 105, 110, 39, 44, 10, 32, 32, 32, 32, 32, // ogin',. - 32, 32, 32, 32, 32, 123, 104, 101, 97, 100, 101, 114, // {header - 115, 58, 32, 123, 65, 117, 116, 104, 111, 114, 105, 122, // s: {Authoriz - 97, 116, 105, 111, 110, 58, 32, 39, 66, 97, 115, 105, // ation: 'Basi - 99, 32, 39, 32, 43, 32, 98, 116, 111, 97, 40, 117, // c ' + btoa(u - 115, 101, 114, 32, 43, 32, 39, 58, 39, 32, 43, 32, // ser + ':' + - 112, 97, 115, 115, 41, 125, 125, 41, 10, 32, 32, 32, // pass)}}). - 32, 32, 32, 32, 32, 32, 32, 46, 116, 104, 101, 110, // .then - 40, 114, 32, 61, 62, 32, 114, 46, 106, 115, 111, 110, // (r => r.json - 40, 41, 41, 10, 32, 32, 32, 32, 32, 32, 32, 32, // ()). - 32, 32, 46, 116, 104, 101, 110, 40, 114, 32, 61, 62, // .then(r => - 32, 114, 32, 38, 38, 32, 112, 114, 111, 112, 115, 46, // r && props. - 108, 111, 103, 105, 110, 40, 114, 41, 41, 10, 32, 32, // login(r)). - 32, 32, 32, 32, 32, 32, 32, 32, 46, 99, 97, 116, // .cat - 99, 104, 40, 101, 114, 114, 32, 61, 62, 32, 101, 114, // ch(err => er - 114, 41, 59, 10, 32, 32, 114, 101, 116, 117, 114, 110, // r);. return - 32, 104, 116, 109, 108, 96, 10, 60, 100, 105, 118, 32, // html`.
.
- 10, 32, 32, 32, 32, 60, 104, 49, 32, 115, 116, 121, // .

Device - 32, 68, 97, 115, 104, 98, 111, 97, 114, 100, 32, 76, // Dashboard L - 111, 103, 105, 110, 32, 60, 47, 104, 49, 62, 10, 32, // ogin

. - 32, 32, 32, 60, 100, 105, 118, 32, 115, 116, 121, 108, //
. - 32, 32, 32, 32, 60, 105, 110, 112, 117, 116, 32, 116, // setUser(e - 118, 46, 116, 97, 114, 103, 101, 116, 46, 118, 97, 108, // v.target.val - 117, 101, 41, 125, 32, 118, 97, 108, 117, 101, 61, 36, // ue)} value=$ - 123, 117, 115, 101, 114, 125, 32, 47, 62, 10, 32, 32, // {user} />. + 110, 115, 116, 32, 91, 112, 97, 115, 115, 44, 32, 115, // nst [pass, s + 101, 116, 80, 97, 115, 115, 93, 32, 61, 32, 117, 115, // etPass] = us + 101, 83, 116, 97, 116, 101, 40, 39, 39, 41, 59, 10, // eState('');. + 32, 32, 99, 111, 110, 115, 116, 32, 108, 111, 103, 105, // const logi + 110, 32, 61, 32, 101, 118, 32, 61, 62, 10, 32, 32, // n = ev =>. + 32, 32, 32, 32, 102, 101, 116, 99, 104, 40, 10, 32, // fetch(. + 32, 32, 32, 32, 32, 32, 32, 32, 32, 39, 47, 97, // '/a + 112, 105, 47, 108, 111, 103, 105, 110, 39, 44, 10, 32, // pi/login',. + 32, 32, 32, 32, 32, 32, 32, 32, 32, 123, 104, 101, // {he + 97, 100, 101, 114, 115, 58, 32, 123, 65, 117, 116, 104, // aders: {Auth + 111, 114, 105, 122, 97, 116, 105, 111, 110, 58, 32, 39, // orization: ' + 66, 97, 115, 105, 99, 32, 39, 32, 43, 32, 98, 116, // Basic ' + bt + 111, 97, 40, 117, 115, 101, 114, 32, 43, 32, 39, 58, // oa(user + ': + 39, 32, 43, 32, 112, 97, 115, 115, 41, 125, 125, 41, // ' + pass)}}) + 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 46, // . . + 116, 104, 101, 110, 40, 114, 32, 61, 62, 32, 114, 46, // then(r => r. + 106, 115, 111, 110, 40, 41, 41, 10, 32, 32, 32, 32, // json()). + 32, 32, 32, 32, 32, 32, 46, 116, 104, 101, 110, 40, // .then( + 114, 32, 61, 62, 32, 114, 32, 38, 38, 32, 112, 114, // r => r && pr + 111, 112, 115, 46, 108, 111, 103, 105, 110, 40, 114, 41, // ops.login(r) + 41, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // ). + 46, 99, 97, 116, 99, 104, 40, 101, 114, 114, 32, 61, // .catch(err = + 62, 32, 101, 114, 114, 41, 59, 10, 32, 32, 114, 101, // > err);. re + 116, 117, 114, 110, 32, 104, 116, 109, 108, 96, 10, 60, // turn html`.< + 100, 105, 118, 32, 99, 108, 97, 115, 115, 61, 34, 114, // div class="r + 111, 117, 110, 100, 101, 100, 32, 98, 111, 114, 100, 101, // ounded borde + 114, 34, 32, 115, 116, 121, 108, 101, 61, 34, 109, 97, // r" style="ma + 120, 45, 119, 105, 100, 116, 104, 58, 32, 52, 56, 48, // x-width: 480 + 112, 120, 59, 32, 109, 97, 114, 103, 105, 110, 58, 32, // px; margin: + 48, 32, 97, 117, 116, 111, 59, 32, 109, 97, 114, 103, // 0 auto; marg + 105, 110, 45, 116, 111, 112, 58, 32, 53, 101, 109, 59, // in-top: 5em; + 32, 98, 97, 99, 107, 103, 114, 111, 117, 110, 100, 58, // background: + 32, 35, 101, 101, 101, 59, 32, 34, 62, 10, 32, 32, // #eee; ">. + 60, 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, 34, //
.

De + 118, 105, 99, 101, 32, 68, 97, 115, 104, 98, 111, 97, // vice Dashboa + 114, 100, 32, 76, 111, 103, 105, 110, 32, 60, 47, 104, // rd Login .
. setUs + 101, 114, 40, 101, 118, 46, 116, 97, 114, 103, 101, 116, // er(ev.target + 46, 118, 97, 108, 117, 101, 41, 125, 32, 118, 97, 108, // .value)} val + 117, 101, 61, 36, 123, 117, 115, 101, 114, 125, 32, 47, // ue=${user} / + 62, 10, 32, 32, 32, 32, 60, 47, 100, 105, 118, 62, // >.
+ 10, 32, 32, 32, 32, 60, 100, 105, 118, 32, 115, 116, // .
. + 32, 32, 32, 32, 32, 32, 60, 105, 110, 112, 117, 116, // + 32, 115, 101, 116, 80, 97, 115, 115, 40, 101, 118, 46, // setPass(ev. + 116, 97, 114, 103, 101, 116, 46, 118, 97, 108, 117, 101, // target.value + 41, 125, 32, 118, 97, 108, 117, 101, 61, 36, 123, 112, // )} value=${p + 97, 115, 115, 125, 10, 32, 32, 32, 32, 32, 32, 32, // ass}. + 32, 111, 110, 99, 104, 97, 110, 103, 101, 61, 36, 123, // onchange=${ + 108, 111, 103, 105, 110, 125, 32, 47, 62, 10, 32, 32, // login} />. 32, 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, 32, //
. 32, 60, 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, //
. - 32, 32, 60, 105, 110, 112, 117, 116, 32, 116, 121, 112, // set - 80, 97, 115, 115, 40, 101, 118, 46, 116, 97, 114, 103, // Pass(ev.targ - 101, 116, 46, 118, 97, 108, 117, 101, 41, 125, 32, 118, // et.value)} v - 97, 108, 117, 101, 61, 36, 123, 112, 97, 115, 115, 125, // alue=${pass} - 10, 32, 32, 32, 32, 32, 32, 32, 32, 111, 110, 99, // . onc - 104, 97, 110, 103, 101, 61, 36, 123, 108, 111, 103, 105, // hange=${logi - 110, 125, 32, 47, 62, 10, 32, 32, 32, 32, 60, 47, // n} />. . . - 76, 111, 103, 105, 110, 32, 60, 47, 98, 117, 116, 116, // Login . .
. Val - 105, 100, 32, 108, 111, 103, 105, 110, 115, 58, 32, 97, // id logins: a - 100, 109, 105, 110, 58, 112, 97, 115, 115, 48, 44, 32, // dmin:pass0, - 117, 115, 101, 114, 49, 58, 112, 97, 115, 115, 49, 44, // user1:pass1, - 32, 117, 115, 101, 114, 50, 58, 112, 97, 115, 115, 50, // user2:pass2 - 10, 32, 32, 32, 32, 60, 47, 100, 105, 118, 62, 10, // .
. - 32, 32, 60, 47, 100, 105, 118, 62, 10, 60, 47, 100, //
.`;.};...c - 111, 110, 115, 116, 32, 67, 111, 110, 102, 105, 103, 117, // onst Configu - 114, 97, 116, 105, 111, 110, 32, 61, 32, 102, 117, 110, // ration = fun - 99, 116, 105, 111, 110, 40, 112, 114, 111, 112, 115, 41, // ction(props) - 32, 123, 10, 32, 32, 99, 111, 110, 115, 116, 32, 91, // {. const [ - 117, 114, 108, 44, 32, 115, 101, 116, 85, 114, 108, 93, // url, setUrl] - 32, 61, 32, 117, 115, 101, 83, 116, 97, 116, 101, 40, // = useState( - 39, 39, 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, // '');. const - 32, 91, 112, 117, 98, 44, 32, 115, 101, 116, 80, 117, // [pub, setPu - 98, 93, 32, 61, 32, 117, 115, 101, 83, 116, 97, 116, // b] = useStat - 101, 40, 39, 39, 41, 59, 10, 32, 32, 99, 111, 110, // e('');. con - 115, 116, 32, 91, 115, 117, 98, 44, 32, 115, 101, 116, // st [sub, set - 83, 117, 98, 93, 32, 61, 32, 117, 115, 101, 83, 116, // Sub] = useSt - 97, 116, 101, 40, 39, 39, 41, 59, 10, 10, 32, 32, // ate('');.. - 117, 115, 101, 69, 102, 102, 101, 99, 116, 40, 40, 41, // useEffect(() - 32, 61, 62, 32, 123, 10, 32, 32, 32, 32, 99, 111, // => {. co - 110, 115, 116, 32, 105, 100, 32, 61, 32, 80, 117, 98, // nst id = Pub - 83, 117, 98, 46, 115, 117, 98, 115, 99, 114, 105, 98, // Sub.subscrib - 101, 40, 102, 117, 110, 99, 116, 105, 111, 110, 40, 109, // e(function(m - 115, 103, 41, 32, 123, 10, 32, 32, 32, 32, 32, 32, // sg) {. - 105, 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, 101, // if (msg.name - 32, 61, 61, 32, 39, 110, 101, 119, 99, 111, 110, 102, // == 'newconf - 105, 103, 39, 41, 32, 123, 10, 32, 32, 32, 32, 32, // ig') {. - 32, 32, 32, 115, 101, 116, 85, 114, 108, 40, 109, 115, // setUrl(ms - 103, 46, 100, 97, 116, 97, 46, 117, 114, 108, 41, 59, // g.data.url); - 10, 32, 32, 32, 32, 32, 32, 32, 32, 115, 101, 116, // . set - 80, 117, 98, 40, 109, 115, 103, 46, 100, 97, 116, 97, // Pub(msg.data - 46, 112, 117, 98, 41, 59, 10, 32, 32, 32, 32, 32, // .pub);. - 32, 32, 32, 115, 101, 116, 83, 117, 98, 40, 109, 115, // setSub(ms - 103, 46, 100, 97, 116, 97, 46, 115, 117, 98, 41, 59, // g.data.sub); - 10, 32, 32, 32, 32, 32, 32, 125, 10, 32, 32, 32, // . }. - 32, 125, 41, 59, 10, 32, 32, 32, 32, 114, 101, 116, // });. ret - 117, 114, 110, 32, 80, 117, 98, 83, 117, 98, 46, 117, // urn PubSub.u - 110, 115, 117, 98, 115, 99, 114, 105, 98, 101, 40, 105, // nsubscribe(i - 100, 41, 59, 10, 32, 32, 125, 44, 32, 91, 93, 41, // d);. }, []) - 59, 10, 10, 32, 32, 99, 111, 110, 115, 116, 32, 117, // ;.. const u - 112, 100, 97, 116, 101, 32, 61, 32, 40, 110, 97, 109, // pdate = (nam - 101, 44, 32, 118, 97, 108, 41, 32, 61, 62, 32, 102, // e, val) => f - 101, 116, 99, 104, 40, 39, 47, 97, 112, 105, 47, 99, // etch('/api/c - 111, 110, 102, 105, 103, 47, 115, 101, 116, 39, 44, 32, // onfig/set', - 123, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // {. + 34, 109, 97, 114, 103, 105, 110, 58, 32, 49, 101, 109, // "margin: 1em + 32, 48, 59, 34, 62, 10, 32, 32, 32, 32, 32, 32, // 0;">. + 60, 98, 117, 116, 116, 111, 110, 32, 99, 108, 97, 115, //

. < + 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, 34, 99, // div style="c + 111, 108, 111, 114, 58, 32, 35, 55, 55, 55, 59, 32, // olor: #777; + 109, 97, 114, 103, 105, 110, 45, 116, 111, 112, 58, 32, // margin-top: + 50, 101, 109, 59, 34, 62, 10, 32, 32, 32, 32, 32, // 2em;">. + 32, 86, 97, 108, 105, 100, 32, 108, 111, 103, 105, 110, // Valid login + 115, 58, 32, 97, 100, 109, 105, 110, 58, 112, 97, 115, // s: admin:pas + 115, 48, 44, 32, 117, 115, 101, 114, 49, 58, 112, 97, // s0, user1:pa + 115, 115, 49, 44, 32, 117, 115, 101, 114, 50, 58, 112, // ss1, user2:p + 97, 115, 115, 50, 10, 32, 32, 32, 32, 60, 47, 100, // ass2. .
+ 10, 60, 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, // .
`;.}; + 10, 10, 10, 99, 111, 110, 115, 116, 32, 67, 111, 110, // ...const Con + 102, 105, 103, 117, 114, 97, 116, 105, 111, 110, 32, 61, // figuration = + 32, 102, 117, 110, 99, 116, 105, 111, 110, 40, 112, 114, // function(pr + 111, 112, 115, 41, 32, 123, 10, 32, 32, 99, 111, 110, // ops) {. con + 115, 116, 32, 91, 117, 114, 108, 44, 32, 115, 101, 116, // st [url, set + 85, 114, 108, 93, 32, 61, 32, 117, 115, 101, 83, 116, // Url] = useSt + 97, 116, 101, 40, 39, 39, 41, 59, 10, 32, 32, 99, // ate('');. c + 111, 110, 115, 116, 32, 91, 112, 117, 98, 44, 32, 115, // onst [pub, s + 101, 116, 80, 117, 98, 93, 32, 61, 32, 117, 115, 101, // etPub] = use + 83, 116, 97, 116, 101, 40, 39, 39, 41, 59, 10, 32, // State('');. + 32, 99, 111, 110, 115, 116, 32, 91, 115, 117, 98, 44, // const [sub, + 32, 115, 101, 116, 83, 117, 98, 93, 32, 61, 32, 117, // setSub] = u + 115, 101, 83, 116, 97, 116, 101, 40, 39, 39, 41, 59, // seState(''); + 10, 10, 32, 32, 117, 115, 101, 69, 102, 102, 101, 99, // .. useEffec + 116, 40, 40, 41, 32, 61, 62, 32, 123, 10, 32, 32, // t(() => {. + 32, 32, 99, 111, 110, 115, 116, 32, 105, 100, 32, 61, // const id = + 32, 80, 117, 98, 83, 117, 98, 46, 115, 117, 98, 115, // PubSub.subs + 99, 114, 105, 98, 101, 40, 102, 117, 110, 99, 116, 105, // cribe(functi + 111, 110, 40, 109, 115, 103, 41, 32, 123, 10, 32, 32, // on(msg) {. + 32, 32, 32, 32, 105, 102, 32, 40, 109, 115, 103, 46, // if (msg. + 110, 97, 109, 101, 32, 61, 61, 32, 39, 110, 101, 119, // name == 'new + 99, 111, 110, 102, 105, 103, 39, 41, 32, 123, 10, 32, // config') {. + 32, 32, 32, 32, 32, 32, 32, 115, 101, 116, 85, 114, // setUr + 108, 40, 109, 115, 103, 46, 100, 97, 116, 97, 46, 117, // l(msg.data.u + 114, 108, 41, 59, 10, 32, 32, 32, 32, 32, 32, 32, // rl);. + 32, 115, 101, 116, 80, 117, 98, 40, 109, 115, 103, 46, // setPub(msg. + 100, 97, 116, 97, 46, 112, 117, 98, 41, 59, 10, 32, // data.pub);. + 32, 32, 32, 32, 32, 32, 32, 115, 101, 116, 83, 117, // setSu + 98, 40, 109, 115, 103, 46, 100, 97, 116, 97, 46, 115, // b(msg.data.s + 117, 98, 41, 59, 10, 32, 32, 32, 32, 32, 32, 125, // ub);. } + 10, 32, 32, 32, 32, 125, 41, 59, 10, 32, 32, 32, // . });. + 32, 114, 101, 116, 117, 114, 110, 32, 80, 117, 98, 83, // return PubS + 117, 98, 46, 117, 110, 115, 117, 98, 115, 99, 114, 105, // ub.unsubscri + 98, 101, 40, 105, 100, 41, 59, 10, 32, 32, 125, 44, // be(id);. }, + 32, 91, 93, 41, 59, 10, 10, 32, 32, 99, 111, 110, // []);.. con + 115, 116, 32, 117, 112, 100, 97, 116, 101, 32, 61, 32, // st update = + 40, 110, 97, 109, 101, 44, 32, 118, 97, 108, 41, 32, // (name, val) + 61, 62, 32, 102, 101, 116, 99, 104, 40, 39, 47, 97, // => fetch('/a + 112, 105, 47, 99, 111, 110, 102, 105, 103, 47, 115, 101, // pi/config/se + 116, 39, 44, 32, 123, 10, 32, 32, 32, 32, 32, 32, // t', {. 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 109, 101, 116, 104, 111, 100, 58, 32, 39, 112, 111, 115, // method: 'pos - 116, 39, 44, 10, 32, 32, 32, 32, 32, 32, 32, 32, // t',. + 32, 32, 32, 32, 109, 101, 116, 104, 111, 100, 58, 32, // method: + 39, 112, 111, 115, 116, 39, 44, 10, 32, 32, 32, 32, // 'post',. 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 98, 111, 100, 121, 58, 32, 96, 36, 123, 110, // body: `${n - 97, 109, 101, 125, 61, 36, 123, 101, 110, 99, 111, 100, // ame}=${encod - 101, 85, 82, 73, 67, 111, 109, 112, 111, 110, 101, 110, // eURIComponen - 116, 40, 118, 97, 108, 41, 125, 96, 10, 32, 32, 32, // t(val)}`. + 32, 32, 32, 32, 32, 32, 98, 111, 100, 121, 58, 32, // body: + 96, 36, 123, 110, 97, 109, 101, 125, 61, 36, 123, 101, // `${name}=${e + 110, 99, 111, 100, 101, 85, 82, 73, 67, 111, 109, 112, // ncodeURIComp + 111, 110, 101, 110, 116, 40, 118, 97, 108, 41, 125, 96, // onent(val)}` + 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // . 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 125, 41, 46, 99, 97, 116, 99, // }).catc - 104, 40, 101, 114, 114, 32, 61, 62, 32, 101, 114, 114, // h(err => err + 32, 32, 32, 32, 32, 32, 32, 32, 32, 125, 41, 46, // }). + 99, 97, 116, 99, 104, 40, 101, 114, 114, 32, 61, 62, // catch(err => + 32, 101, 114, 114, 41, 59, 10, 32, 32, 99, 111, 110, // err);. con + 115, 116, 32, 117, 112, 100, 97, 116, 101, 117, 114, 108, // st updateurl + 32, 61, 32, 101, 118, 32, 61, 62, 32, 117, 112, 100, // = ev => upd + 97, 116, 101, 40, 39, 117, 114, 108, 39, 44, 32, 117, // ate('url', u + 114, 108, 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, // rl);. const + 32, 117, 112, 100, 97, 116, 101, 112, 117, 98, 32, 61, // updatepub = + 32, 101, 118, 32, 61, 62, 32, 117, 112, 100, 97, 116, // ev => updat + 101, 40, 39, 112, 117, 98, 39, 44, 32, 112, 117, 98, // e('pub', pub 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, 32, 117, // );. const u - 112, 100, 97, 116, 101, 117, 114, 108, 32, 61, 32, 101, // pdateurl = e + 112, 100, 97, 116, 101, 115, 117, 98, 32, 61, 32, 101, // pdatesub = e 118, 32, 61, 62, 32, 117, 112, 100, 97, 116, 101, 40, // v => update( - 39, 117, 114, 108, 39, 44, 32, 117, 114, 108, 41, 59, // 'url', url); - 10, 32, 32, 99, 111, 110, 115, 116, 32, 117, 112, 100, // . const upd - 97, 116, 101, 112, 117, 98, 32, 61, 32, 101, 118, 32, // atepub = ev - 61, 62, 32, 117, 112, 100, 97, 116, 101, 40, 39, 112, // => update('p - 117, 98, 39, 44, 32, 112, 117, 98, 41, 59, 10, 32, // ub', pub);. - 32, 99, 111, 110, 115, 116, 32, 117, 112, 100, 97, 116, // const updat - 101, 115, 117, 98, 32, 61, 32, 101, 118, 32, 61, 62, // esub = ev => - 32, 117, 112, 100, 97, 116, 101, 40, 39, 115, 117, 98, // update('sub - 39, 44, 32, 115, 117, 98, 41, 59, 10, 10, 32, 32, // ', sub);.. - 114, 101, 116, 117, 114, 110, 32, 104, 116, 109, 108, 96, // return html` - 10, 60, 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, // .
. - 10, 32, 32, 32, 32, 68, 101, 118, 105, 99, 101, 32, // . Device - 67, 111, 110, 102, 105, 103, 117, 114, 97, 116, 105, 111, // Configuratio - 110, 60, 47, 104, 51, 62, 10, 32, 32, 60, 100, 105, // n

. . < - 115, 112, 97, 110, 32, 99, 108, 97, 115, 115, 61, 34, // span class=" - 97, 100, 100, 111, 110, 32, 110, 111, 119, 114, 97, 112, // addon nowrap - 34, 62, 77, 81, 84, 84, 32, 115, 101, 114, 118, 101, // ">MQTT serve - 114, 58, 60, 47, 115, 112, 97, 110, 62, 10, 32, 32, // r:. - 32, 32, 60, 105, 110, 112, 117, 116, 32, 116, 121, 112, // setUrl - 40, 101, 118, 46, 116, 97, 114, 103, 101, 116, 46, 118, // (ev.target.v - 97, 108, 117, 101, 41, 125, 32, 47, 62, 10, 32, 32, // alue)} />. - 32, 32, 60, 98, 117, 116, 116, 111, 110, 32, 99, 108, // - 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, // .
. - 60, 100, 105, 118, 32, 99, 108, 97, 115, 115, 61, 34, //
. De - 118, 105, 99, 101, 32, 107, 101, 101, 112, 115, 32, 97, // vice keeps a - 32, 112, 101, 114, 115, 105, 115, 116, 101, 110, 116, 32, // persistent - 99, 111, 110, 110, 101, 99, 116, 105, 111, 110, 32, 116, // connection t - 111, 32, 116, 104, 101, 32, 99, 111, 110, 102, 105, 103, // o the config - 117, 114, 101, 100, 32, 77, 81, 84, 84, 32, 115, 101, // ured MQTT se - 114, 118, 101, 114, 46, 10, 32, 32, 32, 32, 67, 104, // rver.. Ch - 97, 110, 103, 101, 115, 32, 116, 111, 32, 116, 104, 105, // anges to thi - 115, 32, 99, 111, 110, 102, 105, 103, 117, 114, 97, 116, // s configurat - 105, 111, 110, 32, 97, 114, 101, 32, 112, 114, 111, 112, // ion are prop - 97, 103, 97, 116, 101, 100, 32, 116, 111, 32, 97, 108, // agated to al - 108, 32, 100, 97, 115, 104, 98, 111, 97, 114, 100, 115, // l dashboards - 58, 32, 116, 114, 121, 10, 32, 32, 32, 32, 99, 104, // : try. ch - 97, 110, 103, 105, 110, 103, 32, 116, 104, 101, 109, 32, // anging them - 105, 110, 32, 116, 104, 105, 115, 32, 100, 97, 115, 104, // in this dash - 98, 111, 97, 114, 100, 32, 97, 110, 100, 32, 111, 98, // board and ob - 115, 101, 114, 118, 101, 32, 99, 104, 97, 110, 103, 101, // serve change - 115, 32, 105, 110, 32, 116, 104, 101, 32, 111, 116, 104, // s in the oth - 101, 114, 32, 111, 112, 101, 110, 101, 100, 10, 32, 32, // er opened. - 32, 32, 100, 97, 115, 104, 98, 111, 97, 114, 100, 46, // dashboard. - 10, 32, 32, 60, 47, 100, 105, 118, 62, 60, 100, 105, // .
. Note: - 32, 97, 100, 109, 105, 110, 105, 115, 116, 114, 97, 116, // administrat - 111, 114, 115, 32, 99, 97, 110, 32, 115, 101, 101, 32, // ors can see - 116, 104, 105, 115, 32, 115, 101, 99, 116, 105, 111, 110, // this section - 32, 97, 110, 100, 32, 99, 97, 110, 32, 99, 104, 97, // and can cha - 110, 103, 101, 32, 100, 101, 118, 105, 99, 101, 10, 32, // nge device. - 32, 32, 32, 99, 111, 110, 102, 105, 103, 117, 114, 97, // configura - 116, 105, 111, 110, 44, 32, 119, 104, 105, 108, 115, 116, // tion, whilst - 32, 117, 115, 101, 114, 115, 32, 99, 97, 110, 110, 111, // users canno - 116, 46, 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, // t..
. - 60, 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, 10, // `;.};. - 10, 10, 99, 111, 110, 115, 116, 32, 77, 101, 115, 115, // ..const Mess - 97, 103, 101, 32, 61, 32, 109, 32, 61, 62, 32, 104, // age = m => h - 116, 109, 108, 96, 60, 100, 105, 118, 32, 115, 116, 121, // tml`
. - 32, 60, 115, 112, 97, 110, 32, 99, 108, 97, 115, 115, // top - 105, 99, 58, 32, 36, 123, 109, 46, 109, 101, 115, 115, // ic: ${m.mess - 97, 103, 101, 46, 116, 111, 112, 105, 99, 125, 32, 60, // age.topic} < - 47, 115, 112, 97, 110, 62, 10, 32, 32, 60, 115, 112, // /span>. data: ${ - 109, 46, 109, 101, 115, 115, 97, 103, 101, 46, 100, 97, // m.message.da - 116, 97, 125, 60, 47, 115, 112, 97, 110, 62, 10, 60, // ta}.< - 47, 100, 105, 118, 62, 96, 59, 10, 10, 99, 111, 110, // /div>`;..con - 115, 116, 32, 77, 101, 115, 115, 97, 103, 101, 115, 32, // st Messages - 61, 32, 102, 117, 110, 99, 116, 105, 111, 110, 40, 112, // = function(p - 114, 111, 112, 115, 41, 32, 123, 10, 32, 32, 99, 111, // rops) {. co - 110, 115, 116, 32, 91, 109, 101, 115, 115, 97, 103, 101, // nst [message - 115, 44, 32, 115, 101, 116, 77, 101, 115, 115, 97, 103, // s, setMessag - 101, 115, 93, 32, 61, 32, 117, 115, 101, 83, 116, 97, // es] = useSta - 116, 101, 40, 91, 93, 41, 59, 10, 32, 32, 99, 111, // te([]);. co - 110, 115, 116, 32, 91, 99, 102, 103, 44, 32, 115, 101, // nst [cfg, se - 116, 67, 102, 103, 93, 32, 61, 32, 117, 115, 101, 83, // tCfg] = useS - 116, 97, 116, 101, 40, 123, 125, 41, 59, 10, 32, 32, // tate({});. - 99, 111, 110, 115, 116, 32, 91, 116, 120, 116, 44, 32, // const [txt, - 115, 101, 116, 84, 120, 116, 93, 32, 61, 32, 117, 115, // setTxt] = us - 101, 83, 116, 97, 116, 101, 40, 39, 39, 41, 59, 10, // eState('');. - 10, 32, 32, 117, 115, 101, 69, 102, 102, 101, 99, 116, // . useEffect - 40, 40, 41, 32, 61, 62, 32, 123, 10, 32, 32, 32, // (() => {. - 32, 99, 111, 110, 115, 116, 32, 105, 100, 32, 61, 32, // const id = - 80, 117, 98, 83, 117, 98, 46, 115, 117, 98, 115, 99, // PubSub.subsc - 114, 105, 98, 101, 40, 102, 117, 110, 99, 116, 105, 111, // ribe(functio - 110, 40, 109, 115, 103, 41, 32, 123, 10, 32, 32, 32, // n(msg) {. - 32, 32, 32, 105, 102, 32, 40, 109, 115, 103, 46, 110, // if (msg.n - 97, 109, 101, 32, 61, 61, 32, 39, 110, 101, 119, 99, // ame == 'newc - 111, 110, 102, 105, 103, 39, 41, 32, 115, 101, 116, 67, // onfig') setC - 102, 103, 40, 120, 32, 61, 62, 32, 109, 115, 103, 46, // fg(x => msg. - 100, 97, 116, 97, 41, 59, 10, 32, 32, 32, 32, 32, // data);. - 32, 105, 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, // if (msg.nam - 101, 32, 61, 61, 32, 39, 109, 101, 115, 115, 97, 103, // e == 'messag - 101, 39, 41, 32, 115, 101, 116, 77, 101, 115, 115, 97, // e') setMessa - 103, 101, 115, 40, 120, 32, 61, 62, 32, 120, 46, 99, // ges(x => x.c - 111, 110, 99, 97, 116, 40, 91, 109, 115, 103, 46, 100, // oncat([msg.d - 97, 116, 97, 93, 41, 41, 59, 10, 32, 32, 32, 32, // ata]));. - 125, 41, 59, 10, 32, 32, 32, 32, 114, 101, 116, 117, // });. retu - 114, 110, 32, 80, 117, 98, 83, 117, 98, 46, 117, 110, // rn PubSub.un - 115, 117, 98, 115, 99, 114, 105, 98, 101, 40, 105, 100, // subscribe(id - 41, 59, 10, 32, 32, 125, 44, 32, 91, 93, 41, 59, // );. }, []); - 10, 10, 32, 32, 99, 111, 110, 115, 116, 32, 115, 101, // .. const se - 110, 100, 109, 101, 115, 115, 97, 103, 101, 32, 61, 32, // ndmessage = - 101, 118, 32, 61, 62, 32, 102, 101, 116, 99, 104, 40, // ev => fetch( - 39, 47, 97, 112, 105, 47, 109, 101, 115, 115, 97, 103, // '/api/messag - 101, 47, 115, 101, 110, 100, 39, 44, 32, 123, 10, 32, // e/send', {. - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 109, 101, 116, 104, 111, 100, 58, // method: - 32, 39, 112, 111, 115, 116, 39, 44, 10, 32, 32, 32, // 'post',. - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 98, 111, 100, 121, 58, 32, 96, 109, 101, // body: `me - 115, 115, 97, 103, 101, 61, 36, 123, 101, 110, 99, 111, // ssage=${enco - 100, 101, 85, 82, 73, 67, 111, 109, 112, 111, 110, 101, // deURICompone - 110, 116, 40, 116, 120, 116, 41, 125, 96, 10, 32, 32, // nt(txt)}`. - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // - 32, 32, 125, 41, 46, 116, 104, 101, 110, 40, 114, 32, // }).then(r - 61, 62, 32, 115, 101, 116, 84, 120, 116, 40, 39, 39, // => setTxt('' - 41, 41, 59, 10, 10, 32, 32, 114, 101, 116, 117, 114, // ));.. retur - 110, 32, 104, 116, 109, 108, 96, 10, 60, 100, 105, 118, // n html`.
.

MQTT - 109, 101, 115, 115, 97, 103, 101, 115, 60, 47, 104, 51, // messages

.
. - 32, 32, 77, 81, 84, 84, 32, 115, 101, 114, 118, 101, // MQTT serve - 114, 32, 115, 116, 97, 116, 117, 115, 58, 32, 60, 98, // r status: ${cfg.conne - 99, 116, 101, 100, 32, 63, 32, 39, 99, 111, 110, 110, // cted ? 'conn - 101, 99, 116, 101, 100, 39, 32, 58, 32, 39, 100, 105, // ected' : 'di - 99, 111, 110, 110, 101, 99, 116, 101, 100, 39, 125, 60, // connected'}< - 47, 98, 62, 10, 32, 32, 60, 47, 100, 105, 118, 62, // /b>.
- 10, 32, 32, 60, 100, 105, 118, 32, 115, 116, 121, 108, // .
. $ - 123, 109, 101, 115, 115, 97, 103, 101, 115, 46, 109, 97, // {messages.ma - 112, 40, 109, 101, 115, 115, 97, 103, 101, 32, 61, 62, // p(message => - 32, 104, 40, 77, 101, 115, 115, 97, 103, 101, 44, 32, // h(Message, - 123, 109, 101, 115, 115, 97, 103, 101, 125, 41, 41, 125, // {message}))} 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, // .
. 60, 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, 34, //
. - 32, 60, 115, 112, 97, 110, 32, 99, 108, 97, 115, 115, // Publish - 109, 101, 115, 115, 97, 103, 101, 58, 60, 47, 115, 112, // message:. . + 32, 32, 32, 60, 115, 112, 97, 110, 32, 99, 108, 97, // Subscr + 105, 98, 101, 32, 116, 111, 112, 105, 99, 58, 60, 47, // ibe topic:. se + 116, 83, 117, 98, 40, 101, 118, 46, 116, 97, 114, 103, // tSub(ev.targ + 101, 116, 46, 118, 97, 108, 117, 101, 41, 125, 32, 47, // et.value)} / + 62, 10, 32, 32, 32, 32, 60, 98, 117, 116, 116, 111, // >. Update + 60, 47, 98, 117, 116, 116, 111, 110, 62, 10, 32, 32, // . + 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, 100, 105, //
. . < + 115, 112, 97, 110, 32, 99, 108, 97, 115, 115, 61, 34, // span class=" + 97, 100, 100, 111, 110, 32, 110, 111, 119, 114, 97, 112, // addon nowrap + 34, 62, 80, 117, 98, 108, 105, 115, 104, 32, 116, 111, // ">Publish to + 112, 105, 99, 58, 60, 47, 115, 112, 97, 110, 62, 10, // pic:. + 32, 32, 32, 32, 60, 105, 110, 112, 117, 116, 32, 116, // setT - 120, 116, 40, 101, 118, 46, 116, 97, 114, 103, 101, 116, // xt(ev.target + 36, 123, 101, 118, 32, 61, 62, 32, 115, 101, 116, 80, // ${ev => setP + 117, 98, 40, 101, 118, 46, 116, 97, 114, 103, 101, 116, // ub(ev.target 46, 118, 97, 108, 117, 101, 41, 125, 32, 47, 62, 10, // .value)} />. - 32, 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, //
. < - 100, 105, 118, 32, 99, 108, 97, 115, 115, 61, 34, 109, // div class="m - 115, 103, 34, 62, 10, 32, 32, 32, 32, 77, 101, 115, // sg">. Mes - 115, 97, 103, 101, 32, 103, 101, 116, 115, 32, 112, 97, // sage gets pa - 115, 115, 101, 100, 32, 116, 111, 32, 116, 104, 101, 32, // ssed to the - 100, 101, 118, 105, 99, 101, 32, 118, 105, 97, 32, 82, // device via R - 69, 83, 84, 46, 32, 84, 104, 101, 110, 32, 97, 32, // EST. Then a - 100, 101, 118, 105, 99, 101, 32, 115, 101, 110, 100, 115, // device sends - 32, 105, 116, 32, 116, 111, 10, 32, 32, 32, 32, 116, // it to. t - 104, 101, 32, 77, 81, 84, 84, 32, 115, 101, 114, 118, // he MQTT serv - 101, 114, 32, 111, 118, 101, 114, 32, 77, 81, 84, 84, // er over MQTT - 46, 32, 65, 108, 108, 32, 77, 81, 84, 84, 32, 109, // . All MQTT m - 101, 115, 115, 97, 103, 101, 115, 32, 111, 110, 32, 97, // essages on a - 32, 115, 117, 98, 115, 99, 114, 105, 98, 101, 100, 32, // subscribed - 116, 111, 112, 105, 99, 10, 32, 32, 32, 32, 114, 101, // topic. re - 99, 101, 105, 118, 101, 100, 32, 98, 121, 32, 97, 32, // ceived by a - 100, 101, 118, 105, 99, 101, 44, 32, 97, 114, 101, 32, // device, are - 112, 114, 111, 112, 97, 103, 97, 116, 101, 100, 32, 116, // propagated t - 111, 32, 116, 104, 105, 115, 32, 100, 97, 115, 104, 98, // o this dashb - 111, 97, 114, 100, 32, 118, 105, 97, 32, 116, 104, 101, // oard via the - 10, 32, 32, 32, 32, 47, 97, 112, 105, 47, 119, 97, // . /api/wa - 116, 99, 104, 46, 10, 32, 32, 60, 47, 100, 105, 118, // tch..
.`;.} - 59, 10, 10, 47, 47, 32, 69, 120, 112, 101, 99, 116, // ;..// Expect - 101, 100, 32, 97, 114, 103, 117, 109, 101, 110, 116, 115, // ed arguments - 58, 10, 47, 47, 32, 100, 97, 116, 97, 58, 32, 116, // :.// data: t - 105, 109, 101, 115, 101, 114, 105, 101, 115, 44, 32, 101, // imeseries, e - 46, 103, 46, 32, 91, 32, 91, 49, 54, 53, 52, 51, // .g. [ [16543 - 54, 49, 51, 53, 50, 44, 32, 49, 57, 93, 44, 32, // 61352, 19], - 91, 49, 54, 53, 52, 51, 54, 49, 51, 53, 51, 44, // [1654361353, - 32, 49, 56, 93, 44, 32, 46, 46, 46, 32, 93, 10, // 18], ... ]. - 47, 47, 32, 119, 105, 100, 116, 104, 44, 32, 104, 101, // // width, he - 105, 103, 104, 116, 44, 32, 121, 116, 105, 99, 107, 115, // ight, yticks - 44, 32, 120, 116, 105, 99, 107, 115, 44, 32, 121, 109, // , xticks, ym - 105, 110, 44, 32, 121, 109, 97, 120, 44, 32, 120, 109, // in, ymax, xm - 105, 110, 44, 32, 120, 109, 97, 120, 10, 99, 111, 110, // in, xmax.con - 115, 116, 32, 83, 86, 71, 32, 61, 32, 102, 117, 110, // st SVG = fun - 99, 116, 105, 111, 110, 40, 112, 114, 111, 112, 115, 41, // ction(props) - 32, 123, 10, 32, 32, 47, 47, 32, 32, 32, 32, 32, // {. // - 32, 32, 32, 32, 32, 32, 32, 119, 10, 32, 32, 47, // w. / - 47, 32, 32, 32, 43, 45, 45, 45, 45, 45, 45, 45, // / +------- - 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, // ------------ - 45, 45, 43, 10, 32, 32, 47, 47, 32, 32, 32, 124, // --+. // | - 32, 32, 32, 32, 32, 32, 32, 32, 104, 49, 32, 32, // h1 - 32, 32, 32, 32, 32, 32, 32, 32, 32, 124, 10, 32, // |. - 32, 47, 47, 32, 32, 32, 124, 32, 32, 32, 32, 43, // // | + - 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 43, // -----------+ - 32, 32, 32, 32, 124, 10, 32, 32, 47, 47, 32, 32, // |. // - 32, 124, 32, 32, 32, 32, 124, 32, 32, 32, 32, 32, // | | - 32, 32, 32, 32, 32, 32, 124, 32, 32, 32, 32, 124, // | | - 32, 32, 104, 10, 32, 32, 47, 47, 32, 32, 32, 124, // h. // | - 32, 119, 49, 32, 124, 32, 32, 32, 32, 32, 32, 32, // w1 | - 32, 32, 32, 32, 124, 32, 119, 50, 32, 124, 10, 32, // | w2 |. - 32, 47, 47, 32, 32, 32, 124, 32, 32, 32, 32, 43, // // | + - 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 43, // -----------+ - 32, 32, 32, 32, 124, 10, 32, 32, 47, 47, 32, 32, // |. // - 32, 124, 32, 32, 32, 32, 32, 32, 32, 32, 32, 104, // | h - 50, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 124, // 2 | - 10, 32, 32, 47, 47, 32, 32, 32, 43, 45, 45, 45, // . // +--- - 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, // ------------ - 45, 45, 45, 45, 45, 45, 43, 10, 32, 32, 47, 47, // ------+. // - 10, 32, 32, 108, 101, 116, 32, 119, 32, 61, 32, 112, // . let w = p - 114, 111, 112, 115, 46, 119, 105, 100, 116, 104, 44, 32, // rops.width, - 104, 32, 61, 32, 112, 114, 111, 112, 115, 46, 104, 101, // h = props.he - 105, 103, 104, 116, 44, 32, 119, 49, 32, 61, 32, 51, // ight, w1 = 3 - 48, 44, 32, 119, 50, 32, 61, 32, 48, 44, 32, 104, // 0, w2 = 0, h - 49, 32, 61, 32, 56, 44, 32, 104, 50, 32, 61, 32, // 1 = 8, h2 = - 49, 56, 59, 10, 32, 32, 108, 101, 116, 32, 121, 116, // 18;. let yt - 105, 99, 107, 115, 32, 61, 32, 112, 114, 111, 112, 115, // icks = props - 46, 121, 116, 105, 99, 107, 115, 32, 124, 124, 32, 52, // .yticks || 4 - 44, 32, 120, 116, 105, 99, 107, 115, 32, 61, 32, 112, // , xticks = p - 114, 111, 112, 115, 46, 120, 116, 105, 99, 107, 115, 32, // rops.xticks - 124, 124, 32, 53, 59, 10, 32, 32, 108, 101, 116, 32, // || 5;. let - 100, 97, 116, 97, 32, 61, 32, 112, 114, 111, 112, 115, // data = props - 46, 100, 97, 116, 97, 32, 124, 124, 32, 91, 93, 59, // .data || []; - 10, 32, 32, 108, 101, 116, 32, 121, 109, 105, 110, 32, // . let ymin - 61, 32, 112, 114, 111, 112, 115, 46, 121, 109, 105, 110, // = props.ymin - 32, 124, 124, 32, 48, 59, 10, 32, 32, 108, 101, 116, // || 0;. let - 32, 121, 109, 97, 120, 32, 61, 32, 112, 114, 111, 112, // ymax = prop - 115, 46, 121, 109, 97, 120, 32, 124, 124, 32, 77, 97, // s.ymax || Ma - 116, 104, 46, 109, 97, 120, 46, 97, 112, 112, 108, 121, // th.max.apply - 40, 110, 117, 108, 108, 44, 32, 100, 97, 116, 97, 46, // (null, data. - 109, 97, 112, 40, 112, 32, 61, 62, 32, 112, 91, 49, // map(p => p[1 - 93, 41, 41, 59, 10, 32, 32, 108, 101, 116, 32, 120, // ]));. let x - 109, 105, 110, 32, 61, 32, 112, 114, 111, 112, 115, 46, // min = props. - 120, 109, 105, 110, 32, 124, 124, 32, 77, 97, 116, 104, // xmin || Math - 46, 109, 105, 110, 46, 97, 112, 112, 108, 121, 40, 110, // .min.apply(n - 117, 108, 108, 44, 32, 100, 97, 116, 97, 46, 109, 97, // ull, data.ma - 112, 40, 112, 32, 61, 62, 32, 112, 91, 48, 93, 41, // p(p => p[0]) - 41, 59, 10, 32, 32, 108, 101, 116, 32, 120, 109, 97, // );. let xma - 120, 32, 61, 32, 112, 114, 111, 112, 115, 46, 120, 109, // x = props.xm - 97, 120, 32, 124, 124, 32, 77, 97, 116, 104, 46, 109, // ax || Math.m - 97, 120, 46, 97, 112, 112, 108, 121, 40, 110, 117, 108, // ax.apply(nul - 108, 44, 32, 100, 97, 116, 97, 46, 109, 97, 112, 40, // l, data.map( - 112, 32, 61, 62, 32, 112, 91, 48, 93, 41, 41, 59, // p => p[0])); - 10, 10, 32, 32, 47, 47, 32, 89, 45, 97, 120, 105, // .. // Y-axi - 115, 32, 116, 105, 99, 107, 32, 108, 105, 110, 101, 115, // s tick lines - 32, 97, 110, 100, 32, 108, 97, 98, 101, 108, 115, 10, // and labels. - 32, 32, 108, 101, 116, 32, 121, 116, 97, 32, 61, 32, // let yta = - 40, 110, 101, 119, 32, 65, 114, 114, 97, 121, 40, 121, // (new Array(y - 116, 105, 99, 107, 115, 32, 43, 32, 49, 41, 41, 46, // ticks + 1)). - 102, 105, 108, 108, 40, 48, 41, 46, 109, 97, 112, 40, // fill(0).map( - 40, 95, 44, 32, 105, 41, 32, 61, 62, 32, 105, 41, // (_, i) => i) - 59, 32, 32, 47, 47, 32, 105, 110, 100, 105, 99, 101, // ; // indice - 115, 10, 32, 32, 108, 101, 116, 32, 121, 116, 105, 32, // s. let yti - 61, 32, 105, 32, 61, 62, 32, 104, 32, 45, 32, 104, // = i => h - h - 50, 32, 45, 32, 40, 104, 32, 45, 32, 104, 49, 32, // 2 - (h - h1 - 45, 32, 104, 50, 41, 32, 42, 32, 105, 32, 47, 32, // - h2) * i / - 121, 116, 105, 99, 107, 115, 59, 32, 32, 32, 32, 32, // yticks; - 32, 32, 32, 32, 32, 47, 47, 32, 105, 110, 100, 101, // // inde - 120, 39, 115, 32, 89, 10, 32, 32, 108, 101, 116, 32, // x's Y. let - 121, 116, 118, 32, 61, 32, 105, 32, 61, 62, 32, 40, // ytv = i => ( - 121, 109, 97, 120, 32, 45, 32, 121, 109, 105, 110, 41, // ymax - ymin) - 32, 42, 32, 105, 32, 47, 32, 121, 116, 105, 99, 107, // * i / ytick - 115, 59, 10, 32, 32, 108, 101, 116, 32, 121, 116, 108, // s;. let ytl - 32, 61, 32, 121, 32, 61, 62, 32, 104, 116, 109, 108, // = y => html - 96, 60, 108, 105, 110, 101, 32, 120, 49, 61, 36, 123, // ``;. l - 101, 116, 32, 121, 116, 116, 32, 61, 32, 40, 121, 44, // et ytt = (y, - 32, 118, 41, 32, 61, 62, 32, 104, 116, 109, 108, 96, // v) => html` - 60, 116, 101, 120, 116, 32, 120, 61, 48, 32, 121, 61, // $ - 123, 118, 125, 60, 47, 116, 101, 120, 116, 62, 96, 59, // {v}`; - 10, 10, 32, 32, 47, 47, 32, 88, 45, 97, 120, 105, // .. // X-axi - 115, 32, 116, 105, 99, 107, 32, 108, 105, 110, 101, 115, // s tick lines - 32, 97, 110, 100, 32, 108, 97, 98, 101, 108, 115, 10, // and labels. - 32, 32, 108, 101, 116, 32, 100, 97, 116, 101, 102, 109, // let datefm - 116, 32, 61, 32, 117, 110, 105, 120, 32, 61, 62, 32, // t = unix => - 40, 110, 101, 119, 32, 68, 97, 116, 101, 40, 117, 110, // (new Date(un - 105, 120, 32, 42, 32, 49, 48, 48, 48, 41, 41, 46, // ix * 1000)). - 116, 111, 73, 83, 79, 83, 116, 114, 105, 110, 103, 40, // toISOString( - 41, 46, 115, 117, 98, 115, 116, 114, 40, 49, 52, 44, // ).substr(14, - 32, 53, 41, 59, 10, 32, 32, 108, 101, 116, 32, 120, // 5);. let x - 116, 97, 32, 61, 32, 40, 110, 101, 119, 32, 65, 114, // ta = (new Ar - 114, 97, 121, 40, 120, 116, 105, 99, 107, 115, 32, 43, // ray(xticks + - 32, 49, 41, 41, 46, 102, 105, 108, 108, 40, 48, 41, // 1)).fill(0) - 46, 109, 97, 112, 40, 40, 95, 44, 32, 105, 41, 32, // .map((_, i) - 61, 62, 32, 105, 41, 59, 32, 32, 47, 47, 32, 105, // => i); // i - 110, 100, 105, 99, 101, 115, 10, 32, 32, 108, 101, 116, // ndices. let - 32, 120, 116, 105, 32, 61, 32, 105, 32, 61, 62, 32, // xti = i => - 119, 49, 32, 43, 32, 40, 119, 32, 45, 32, 119, 49, // w1 + (w - w1 - 32, 45, 32, 119, 50, 41, 32, 42, 32, 105, 32, 47, // - w2) * i / - 32, 120, 116, 105, 99, 107, 115, 59, 32, 32, 32, 32, // xticks; - 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 47, 47, // // - 32, 105, 110, 100, 101, 120, 39, 115, 32, 88, 10, 32, // index's X. - 32, 108, 101, 116, 32, 120, 116, 118, 32, 61, 32, 105, // let xtv = i - 32, 61, 62, 32, 100, 97, 116, 101, 102, 109, 116, 40, // => datefmt( - 120, 109, 105, 110, 32, 43, 32, 40, 120, 109, 97, 120, // xmin + (xmax - 32, 45, 32, 120, 109, 105, 110, 41, 32, 42, 32, 105, // - xmin) * i - 32, 47, 32, 120, 116, 105, 99, 107, 115, 41, 59, 10, // / xticks);. - 32, 32, 108, 101, 116, 32, 120, 116, 108, 32, 61, 32, // let xtl = - 120, 32, 61, 62, 32, 104, 116, 109, 108, 96, 60, 112, // x => html`

`;. let - 32, 120, 116, 116, 32, 61, 32, 40, 120, 44, 32, 118, // xtt = (x, v - 41, 32, 61, 62, 10, 32, 32, 32, 32, 32, 32, 104, // ) =>. h - 116, 109, 108, 96, 60, 116, 101, 120, 116, 32, 120, 61, // tml`$ - 123, 118, 125, 60, 47, 116, 101, 120, 116, 62, 96, 59, // {v}`; - 10, 10, 32, 32, 47, 47, 32, 84, 114, 97, 110, 115, // .. // Trans - 102, 111, 114, 109, 32, 100, 97, 116, 97, 32, 112, 111, // form data po - 105, 110, 116, 115, 32, 97, 114, 114, 97, 121, 32, 105, // ints array i - 110, 116, 111, 32, 99, 111, 111, 114, 100, 105, 110, 97, // nto coordina - 116, 101, 10, 32, 32, 108, 101, 116, 32, 100, 120, 32, // te. let dx - 61, 32, 118, 32, 61, 62, 32, 119, 49, 32, 43, 32, // = v => w1 + - 40, 118, 32, 45, 32, 120, 109, 105, 110, 41, 32, 47, // (v - xmin) / - 32, 40, 40, 120, 109, 97, 120, 32, 45, 32, 120, 109, // ((xmax - xm - 105, 110, 41, 32, 124, 124, 32, 49, 41, 32, 42, 32, // in) || 1) * - 40, 119, 32, 45, 32, 119, 49, 32, 45, 32, 119, 50, // (w - w1 - w2 - 41, 59, 10, 32, 32, 108, 101, 116, 32, 100, 121, 32, // );. let dy - 61, 32, 118, 32, 61, 62, 32, 104, 32, 45, 32, 104, // = v => h - h - 50, 32, 45, 32, 40, 118, 32, 45, 32, 121, 109, 105, // 2 - (v - ymi - 110, 41, 32, 47, 32, 40, 40, 121, 109, 97, 120, 32, // n) / ((ymax - 45, 32, 121, 109, 105, 110, 41, 32, 124, 124, 32, 49, // - ymin) || 1 - 41, 32, 42, 32, 40, 104, 32, 45, 32, 104, 49, 32, // ) * (h - h1 - 45, 32, 104, 50, 41, 59, 10, 32, 32, 108, 101, 116, // - h2);. let - 32, 100, 100, 32, 61, 32, 100, 97, 116, 97, 46, 109, // dd = data.m - 97, 112, 40, 112, 32, 61, 62, 32, 91, 77, 97, 116, // ap(p => [Mat - 104, 46, 114, 111, 117, 110, 100, 40, 100, 120, 40, 112, // h.round(dx(p - 91, 48, 93, 41, 41, 44, 32, 77, 97, 116, 104, 46, // [0])), Math. - 114, 111, 117, 110, 100, 40, 100, 121, 40, 112, 91, 49, // round(dy(p[1 - 93, 41, 41, 93, 41, 59, 10, 32, 32, 108, 101, 116, // ]))]);. let - 32, 100, 100, 108, 32, 61, 32, 100, 100, 46, 108, 101, // ddl = dd.le - 110, 103, 116, 104, 59, 10, 32, 32, 47, 47, 32, 65, // ngth;. // A - 110, 100, 32, 112, 108, 111, 116, 32, 116, 104, 101, 32, // nd plot the - 100, 97, 116, 97, 32, 97, 115, 32, 60, 112, 97, 116, // data as element. - 32, 108, 101, 116, 32, 98, 101, 103, 105, 110, 48, 32, // let begin0 - 61, 32, 100, 100, 108, 32, 63, 32, 96, 77, 32, 36, // = ddl ? `M $ - 123, 100, 100, 91, 48, 93, 91, 48, 93, 125, 44, 36, // {dd[0][0]},$ - 123, 100, 100, 91, 48, 93, 91, 49, 93, 125, 96, 32, // {dd[0][1]}` - 58, 32, 96, 77, 32, 48, 44, 48, 96, 59, 10, 32, // : `M 0,0`;. - 32, 108, 101, 116, 32, 98, 101, 103, 105, 110, 32, 61, // let begin = - 32, 96, 77, 32, 36, 123, 119, 49, 125, 44, 36, 123, // `M ${w1},${ - 104, 32, 45, 32, 104, 50, 125, 96, 59, 32, 32, 47, // h - h2}`; / - 47, 32, 73, 110, 105, 116, 105, 97, 108, 32, 112, 111, // / Initial po - 105, 110, 116, 10, 32, 32, 108, 101, 116, 32, 101, 110, // int. let en - 100, 32, 61, 32, 100, 100, 108, 32, 63, 32, 96, 76, // d = ddl ? `L - 32, 36, 123, 100, 100, 91, 100, 100, 108, 32, 45, 32, // ${dd[ddl - - 49, 93, 91, 48, 93, 125, 44, 36, 123, 104, 32, 45, // 1][0]},${h - - 32, 104, 50, 125, 96, 32, 58, 32, 96, 76, 32, 36, // h2}` : `L $ - 123, 119, 49, 125, 44, 36, 123, 104, 32, 45, 32, 104, // {w1},${h - h - 50, 125, 96, 59, 10, 32, 32, 108, 101, 116, 32, 115, // 2}`;. let s - 101, 114, 105, 101, 115, 32, 61, 32, 100, 100, 108, 32, // eries = ddl - 63, 32, 100, 100, 46, 109, 97, 112, 40, 112, 32, 61, // ? dd.map(p = - 62, 32, 96, 76, 32, 36, 123, 112, 91, 48, 93, 125, // > `L ${p[0]} - 32, 36, 123, 112, 91, 49, 93, 125, 96, 41, 32, 58, // ${p[1]}`) : - 32, 91, 93, 59, 10, 10, 32, 32, 114, 101, 116, 117, // [];.. retu - 114, 110, 32, 104, 116, 109, 108, 96, 10, 60, 115, 118, // rn html`.. . - 36, 123, 121, 116, 97, 46, 109, 97, 112, 40, 105, 32, // ${yta.map(i - 61, 62, 32, 121, 116, 108, 40, 121, 116, 105, 40, 105, // => ytl(yti(i - 41, 41, 41, 125, 10, 32, 32, 36, 123, 121, 116, 97, // )))}. ${yta - 46, 109, 97, 112, 40, 105, 32, 61, 62, 32, 121, 116, // .map(i => yt - 116, 40, 121, 116, 105, 40, 105, 41, 44, 32, 121, 116, // t(yti(i), yt - 118, 40, 105, 41, 41, 41, 125, 10, 32, 32, 36, 123, // v(i)))}. ${ - 120, 116, 97, 46, 109, 97, 112, 40, 105, 32, 61, 62, // xta.map(i => - 32, 120, 116, 108, 40, 120, 116, 105, 40, 105, 41, 41, // xtl(xti(i)) - 41, 125, 10, 32, 32, 36, 123, 100, 97, 116, 97, 46, // )}. ${data. - 108, 101, 110, 103, 116, 104, 32, 63, 32, 120, 116, 97, // length ? xta - 46, 109, 97, 112, 40, 105, 32, 61, 62, 32, 120, 116, // .map(i => xt - 116, 40, 120, 116, 105, 40, 105, 41, 44, 32, 120, 116, // t(xti(i), xt - 118, 40, 105, 41, 41, 41, 32, 58, 32, 39, 39, 125, // v(i))) : ''} - 10, 32, 32, 60, 112, 97, 116, 104, 32, 100, 61, 34, // . . < - 112, 97, 116, 104, 32, 100, 61, 34, 36, 123, 98, 101, // path d="${be - 103, 105, 110, 48, 125, 32, 36, 123, 115, 101, 114, 105, // gin0} ${seri - 101, 115, 46, 106, 111, 105, 110, 40, 39, 32, 39, 41, // es.join(' ') - 125, 34, 32, 99, 108, 97, 115, 115, 61, 34, 115, 101, // }" class="se - 114, 105, 101, 115, 34, 32, 47, 62, 10, 60, 47, 115, // ries" />.`;.};...c - 111, 110, 115, 116, 32, 67, 104, 97, 114, 116, 32, 61, // onst Chart = - 32, 102, 117, 110, 99, 116, 105, 111, 110, 40, 112, 114, // function(pr - 111, 112, 115, 41, 32, 123, 10, 32, 32, 99, 111, 110, // ops) {. con - 115, 116, 32, 91, 100, 97, 116, 97, 44, 32, 115, 101, // st [data, se - 116, 68, 97, 116, 97, 93, 32, 61, 32, 117, 115, 101, // tData] = use - 83, 116, 97, 116, 101, 40, 91, 93, 41, 59, 10, 32, // State([]);. - 32, 117, 115, 101, 69, 102, 102, 101, 99, 116, 40, 40, // useEffect(( - 41, 32, 61, 62, 32, 123, 10, 32, 32, 32, 32, 99, // ) => {. c - 111, 110, 115, 116, 32, 105, 100, 32, 61, 32, 80, 117, // onst id = Pu - 98, 83, 117, 98, 46, 115, 117, 98, 115, 99, 114, 105, // bSub.subscri - 98, 101, 40, 102, 117, 110, 99, 116, 105, 111, 110, 40, // be(function( - 109, 115, 103, 41, 32, 123, 10, 32, 32, 32, 32, 32, // msg) {. - 32, 105, 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, // if (msg.nam - 101, 32, 33, 61, 32, 39, 109, 101, 116, 114, 105, 99, // e != 'metric - 115, 39, 41, 32, 114, 101, 116, 117, 114, 110, 59, 10, // s') return;. - 32, 32, 32, 32, 32, 32, 115, 101, 116, 68, 97, 116, // setDat - 97, 40, 120, 32, 61, 62, 32, 120, 46, 99, 111, 110, // a(x => x.con - 99, 97, 116, 40, 91, 109, 115, 103, 46, 100, 97, 116, // cat([msg.dat - 97, 93, 41, 46, 115, 112, 108, 105, 99, 101, 40, 45, // a]).splice(- - 77, 97, 120, 77, 101, 116, 114, 105, 99, 115, 68, 97, // MaxMetricsDa - 116, 97, 80, 111, 105, 110, 116, 115, 41, 41, 59, 10, // taPoints));. - 32, 32, 32, 32, 125, 41, 59, 10, 32, 32, 32, 32, // });. - 114, 101, 116, 117, 114, 110, 32, 80, 117, 98, 83, 117, // return PubSu - 98, 46, 117, 110, 115, 117, 98, 115, 99, 114, 105, 98, // b.unsubscrib - 101, 40, 105, 100, 41, 59, 10, 32, 32, 125, 44, 32, // e(id);. }, - 91, 93, 41, 59, 10, 10, 32, 32, 108, 101, 116, 32, // []);.. let - 120, 109, 97, 120, 32, 61, 32, 48, 44, 32, 109, 105, // xmax = 0, mi - 115, 115, 105, 110, 103, 32, 61, 32, 77, 97, 120, 77, // ssing = MaxM - 101, 116, 114, 105, 99, 115, 68, 97, 116, 97, 80, 111, // etricsDataPo - 105, 110, 116, 115, 32, 45, 32, 100, 97, 116, 97, 46, // ints - data. - 108, 101, 110, 103, 116, 104, 59, 10, 32, 32, 105, 102, // length;. if - 32, 40, 109, 105, 115, 115, 105, 110, 103, 32, 62, 32, // (missing > - 48, 41, 32, 120, 109, 97, 120, 32, 61, 32, 77, 97, // 0) xmax = Ma - 116, 104, 46, 114, 111, 117, 110, 100, 40, 68, 97, 116, // th.round(Dat - 101, 46, 110, 111, 119, 40, 41, 32, 47, 32, 49, 48, // e.now() / 10 - 48, 48, 41, 32, 43, 32, 109, 105, 115, 115, 105, 110, // 00) + missin - 103, 59, 10, 32, 32, 114, 101, 116, 117, 114, 110, 32, // g;. return - 104, 116, 109, 108, 96, 10, 60, 100, 105, 118, 32, 115, // html`.

- 10, 32, 32, 60, 104, 51, 32, 115, 116, 121, 108, 101, // .

Data Chart - 60, 47, 104, 51, 62, 10, 32, 32, 60, 100, 105, 118, //

.
. <${SV - 71, 125, 32, 104, 101, 105, 103, 104, 116, 61, 50, 52, // G} height=24 - 48, 32, 119, 105, 100, 116, 104, 61, 54, 48, 48, 32, // 0 width=600 - 121, 109, 105, 110, 61, 48, 32, 121, 109, 97, 120, 61, // ymin=0 ymax= - 50, 48, 32, 120, 109, 97, 120, 61, 36, 123, 120, 109, // 20 xmax=${xm - 97, 120, 125, 32, 100, 97, 116, 97, 61, 36, 123, 100, // ax} data=${d - 97, 116, 97, 125, 32, 47, 62, 10, 32, 32, 60, 47, // ata} />. Update. .
- 10, 32, 32, 32, 32, 84, 104, 105, 115, 32, 99, 104, // . This ch - 97, 114, 116, 32, 112, 108, 111, 116, 115, 32, 108, 105, // art plots li - 118, 101, 32, 115, 101, 110, 115, 111, 114, 32, 100, 97, // ve sensor da - 116, 97, 44, 32, 115, 101, 110, 116, 32, 98, 121, 32, // ta, sent by - 97, 32, 100, 101, 118, 105, 99, 101, 32, 118, 105, 97, // a device via - 32, 47, 97, 112, 105, 47, 119, 97, 116, 99, 104, 46, // /api/watch. - 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, 60, 47, // .
.`;.};..c - 111, 110, 115, 116, 32, 65, 112, 112, 32, 61, 32, 102, // onst App = f + 10, 32, 32, 32, 32, 68, 101, 118, 105, 99, 101, 32, // . Device + 107, 101, 101, 112, 115, 32, 97, 32, 112, 101, 114, 115, // keeps a pers + 105, 115, 116, 101, 110, 116, 32, 99, 111, 110, 110, 101, // istent conne + 99, 116, 105, 111, 110, 32, 116, 111, 32, 116, 104, 101, // ction to the + 32, 99, 111, 110, 102, 105, 103, 117, 114, 101, 100, 32, // configured + 77, 81, 84, 84, 32, 115, 101, 114, 118, 101, 114, 46, // MQTT server. + 10, 32, 32, 32, 32, 67, 104, 97, 110, 103, 101, 115, // . Changes + 32, 116, 111, 32, 116, 104, 105, 115, 32, 99, 111, 110, // to this con + 102, 105, 103, 117, 114, 97, 116, 105, 111, 110, 32, 97, // figuration a + 114, 101, 32, 112, 114, 111, 112, 97, 103, 97, 116, 101, // re propagate + 100, 32, 116, 111, 32, 97, 108, 108, 32, 100, 97, 115, // d to all das + 104, 98, 111, 97, 114, 100, 115, 58, 32, 116, 114, 121, // hboards: try + 10, 32, 32, 32, 32, 99, 104, 97, 110, 103, 105, 110, // . changin + 103, 32, 116, 104, 101, 109, 32, 105, 110, 32, 116, 104, // g them in th + 105, 115, 32, 100, 97, 115, 104, 98, 111, 97, 114, 100, // is dashboard + 32, 97, 110, 100, 32, 111, 98, 115, 101, 114, 118, 101, // and observe + 32, 99, 104, 97, 110, 103, 101, 115, 32, 105, 110, 32, // changes in + 116, 104, 101, 32, 111, 116, 104, 101, 114, 32, 111, 112, // the other op + 101, 110, 101, 100, 10, 32, 32, 32, 32, 100, 97, 115, // ened. das + 104, 98, 111, 97, 114, 100, 46, 10, 32, 32, 60, 47, // hboard..
. + 32, 32, 78, 111, 116, 101, 58, 32, 97, 100, 109, 105, // Note: admi + 110, 105, 115, 116, 114, 97, 116, 111, 114, 115, 32, 99, // nistrators c + 97, 110, 32, 115, 101, 101, 32, 116, 104, 105, 115, 32, // an see this + 115, 101, 99, 116, 105, 111, 110, 32, 97, 110, 100, 32, // section and + 99, 97, 110, 32, 99, 104, 97, 110, 103, 101, 32, 100, // can change d + 101, 118, 105, 99, 101, 10, 32, 32, 32, 32, 99, 111, // evice. co + 110, 102, 105, 103, 117, 114, 97, 116, 105, 111, 110, 44, // nfiguration, + 32, 119, 104, 105, 108, 115, 116, 32, 117, 115, 101, 114, // whilst user + 115, 32, 99, 97, 110, 110, 111, 116, 46, 10, 32, 32, // s cannot.. + 60, 47, 100, 105, 118, 62, 10, 60, 47, 100, 105, 118, //
.
`;.};...con + 115, 116, 32, 77, 101, 115, 115, 97, 103, 101, 32, 61, // st Message = + 32, 109, 32, 61, 62, 32, 104, 116, 109, 108, 96, 60, // m => html`< + 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, 34, 109, // div style="m + 97, 114, 103, 105, 110, 58, 32, 48, 46, 53, 101, 109, // argin: 0.5em + 32, 48, 59, 34, 62, 10, 32, 32, 60, 115, 112, 97, // 0;">. topic: $ + 123, 109, 46, 109, 101, 115, 115, 97, 103, 101, 46, 116, // {m.message.t + 111, 112, 105, 99, 125, 32, 60, 47, 115, 112, 97, 110, // opic} . d + 97, 116, 97, 58, 32, 36, 123, 109, 46, 109, 101, 115, // ata: ${m.mes + 115, 97, 103, 101, 46, 100, 97, 116, 97, 125, 60, 47, // sage.data}.
+ 96, 59, 10, 10, 99, 111, 110, 115, 116, 32, 77, 101, // `;..const Me + 115, 115, 97, 103, 101, 115, 32, 61, 32, 102, 117, 110, // ssages = fun + 99, 116, 105, 111, 110, 40, 112, 114, 111, 112, 115, 41, // ction(props) + 32, 123, 10, 32, 32, 99, 111, 110, 115, 116, 32, 91, // {. const [ + 109, 101, 115, 115, 97, 103, 101, 115, 44, 32, 115, 101, // messages, se + 116, 77, 101, 115, 115, 97, 103, 101, 115, 93, 32, 61, // tMessages] = + 32, 117, 115, 101, 83, 116, 97, 116, 101, 40, 91, 93, // useState([] + 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, 32, 91, // );. const [ + 99, 102, 103, 44, 32, 115, 101, 116, 67, 102, 103, 93, // cfg, setCfg] + 32, 61, 32, 117, 115, 101, 83, 116, 97, 116, 101, 40, // = useState( + 123, 125, 41, 59, 10, 32, 32, 99, 111, 110, 115, 116, // {});. const + 32, 91, 116, 120, 116, 44, 32, 115, 101, 116, 84, 120, // [txt, setTx + 116, 93, 32, 61, 32, 117, 115, 101, 83, 116, 97, 116, // t] = useStat + 101, 40, 39, 39, 41, 59, 10, 10, 32, 32, 117, 115, // e('');.. us + 101, 69, 102, 102, 101, 99, 116, 40, 40, 41, 32, 61, // eEffect(() = + 62, 32, 123, 10, 32, 32, 32, 32, 99, 111, 110, 115, // > {. cons + 116, 32, 105, 100, 32, 61, 32, 80, 117, 98, 83, 117, // t id = PubSu + 98, 46, 115, 117, 98, 115, 99, 114, 105, 98, 101, 40, // b.subscribe( + 102, 117, 110, 99, 116, 105, 111, 110, 40, 109, 115, 103, // function(msg + 41, 32, 123, 10, 32, 32, 32, 32, 32, 32, 105, 102, // ) {. if + 32, 40, 109, 115, 103, 46, 110, 97, 109, 101, 32, 61, // (msg.name = + 61, 32, 39, 110, 101, 119, 99, 111, 110, 102, 105, 103, // = 'newconfig + 39, 41, 32, 115, 101, 116, 67, 102, 103, 40, 120, 32, // ') setCfg(x + 61, 62, 32, 109, 115, 103, 46, 100, 97, 116, 97, 41, // => msg.data) + 59, 10, 32, 32, 32, 32, 32, 32, 105, 102, 32, 40, // ;. if ( + 109, 115, 103, 46, 110, 97, 109, 101, 32, 61, 61, 32, // msg.name == + 39, 109, 101, 115, 115, 97, 103, 101, 39, 41, 32, 115, // 'message') s + 101, 116, 77, 101, 115, 115, 97, 103, 101, 115, 40, 120, // etMessages(x + 32, 61, 62, 32, 120, 46, 99, 111, 110, 99, 97, 116, // => x.concat + 40, 91, 109, 115, 103, 46, 100, 97, 116, 97, 93, 41, // ([msg.data]) + 41, 59, 10, 32, 32, 32, 32, 125, 41, 59, 10, 32, // );. });. + 32, 32, 32, 114, 101, 116, 117, 114, 110, 32, 80, 117, // return Pu + 98, 83, 117, 98, 46, 117, 110, 115, 117, 98, 115, 99, // bSub.unsubsc + 114, 105, 98, 101, 40, 105, 100, 41, 59, 10, 32, 32, // ribe(id);. + 125, 44, 32, 91, 93, 41, 59, 10, 10, 32, 32, 99, // }, []);.. c + 111, 110, 115, 116, 32, 115, 101, 110, 100, 109, 101, 115, // onst sendmes + 115, 97, 103, 101, 32, 61, 32, 101, 118, 32, 61, 62, // sage = ev => + 32, 102, 101, 116, 99, 104, 40, 39, 47, 97, 112, 105, // fetch('/api + 47, 109, 101, 115, 115, 97, 103, 101, 47, 115, 101, 110, // /message/sen + 100, 39, 44, 32, 123, 10, 32, 32, 32, 32, 32, 32, // d', {. + 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // + 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // + 109, 101, 116, 104, 111, 100, 58, 32, 39, 112, 111, 115, // method: 'pos + 116, 39, 44, 10, 32, 32, 32, 32, 32, 32, 32, 32, // t',. + 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // + 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 98, 111, // bo + 100, 121, 58, 32, 96, 109, 101, 115, 115, 97, 103, 101, // dy: `message + 61, 36, 123, 101, 110, 99, 111, 100, 101, 85, 82, 73, // =${encodeURI + 67, 111, 109, 112, 111, 110, 101, 110, 116, 40, 116, 120, // Component(tx + 116, 41, 125, 96, 10, 32, 32, 32, 32, 32, 32, 32, // t)}`. + 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // + 32, 32, 32, 32, 32, 32, 32, 32, 32, 125, 41, 46, // }). + 116, 104, 101, 110, 40, 114, 32, 61, 62, 32, 115, 101, // then(r => se + 116, 84, 120, 116, 40, 39, 39, 41, 41, 59, 10, 10, // tTxt(''));.. + 32, 32, 114, 101, 116, 117, 114, 110, 32, 104, 116, 109, // return htm + 108, 96, 10, 60, 100, 105, 118, 32, 99, 108, 97, 115, // l`.
+ 10, 32, 32, 60, 104, 51, 32, 115, 116, 121, 108, 101, // .

MQTT me + 115, 115, 97, 103, 101, 115, 60, 47, 104, 51, 62, 10, // ssages

. + 32, 32, 60, 100, 105, 118, 62, 10, 32, 32, 32, 32, //
. + 77, 81, 84, 84, 32, 115, 101, 114, 118, 101, 114, 32, // MQTT server + 115, 116, 97, 116, 117, 115, 58, 32, 60, 98, 62, 36, // status: $ + 123, 99, 102, 103, 46, 99, 111, 110, 110, 101, 99, 116, // {cfg.connect + 101, 100, 32, 63, 32, 39, 99, 111, 110, 110, 101, 99, // ed ? 'connec + 116, 101, 100, 39, 32, 58, 32, 39, 100, 105, 99, 111, // ted' : 'dico + 110, 110, 101, 99, 116, 101, 100, 39, 125, 60, 47, 98, // nnected'}.
. + 32, 60, 100, 105, 118, 32, 115, 116, 121, 108, 101, 61, //
. ${m + 101, 115, 115, 97, 103, 101, 115, 46, 109, 97, 112, 40, // essages.map( + 109, 101, 115, 115, 97, 103, 101, 32, 61, 62, 32, 104, // message => h + 40, 77, 101, 115, 115, 97, 103, 101, 44, 32, 123, 109, // (Message, {m + 101, 115, 115, 97, 103, 101, 125, 41, 41, 125, 10, 32, // essage}))}. + 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, 100, //
. . < + 115, 112, 97, 110, 32, 99, 108, 97, 115, 115, 61, 34, // span class=" + 97, 100, 100, 111, 110, 32, 110, 111, 119, 114, 97, 112, // addon nowrap + 34, 62, 80, 117, 98, 108, 105, 115, 104, 32, 109, 101, // ">Publish me + 115, 115, 97, 103, 101, 58, 60, 47, 115, 112, 97, 110, // ssage:. setTxt + 40, 101, 118, 46, 116, 97, 114, 103, 101, 116, 46, 118, // (ev.target.v + 97, 108, 117, 101, 41, 125, 32, 47, 62, 10, 32, 32, // alue)} />. + 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, 100, 105, //
. . Messa + 103, 101, 32, 103, 101, 116, 115, 32, 112, 97, 115, 115, // ge gets pass + 101, 100, 32, 116, 111, 32, 116, 104, 101, 32, 100, 101, // ed to the de + 118, 105, 99, 101, 32, 118, 105, 97, 32, 82, 69, 83, // vice via RES + 84, 46, 32, 84, 104, 101, 110, 32, 97, 32, 100, 101, // T. Then a de + 118, 105, 99, 101, 32, 115, 101, 110, 100, 115, 32, 105, // vice sends i + 116, 32, 116, 111, 10, 32, 32, 32, 32, 116, 104, 101, // t to. the + 32, 77, 81, 84, 84, 32, 115, 101, 114, 118, 101, 114, // MQTT server + 32, 111, 118, 101, 114, 32, 77, 81, 84, 84, 46, 32, // over MQTT. + 65, 108, 108, 32, 77, 81, 84, 84, 32, 109, 101, 115, // All MQTT mes + 115, 97, 103, 101, 115, 32, 111, 110, 32, 97, 32, 115, // sages on a s + 117, 98, 115, 99, 114, 105, 98, 101, 100, 32, 116, 111, // ubscribed to + 112, 105, 99, 10, 32, 32, 32, 32, 114, 101, 99, 101, // pic. rece + 105, 118, 101, 100, 32, 98, 121, 32, 97, 32, 100, 101, // ived by a de + 118, 105, 99, 101, 44, 32, 97, 114, 101, 32, 112, 114, // vice, are pr + 111, 112, 97, 103, 97, 116, 101, 100, 32, 116, 111, 32, // opagated to + 116, 104, 105, 115, 32, 100, 97, 115, 104, 98, 111, 97, // this dashboa + 114, 100, 32, 118, 105, 97, 32, 116, 104, 101, 10, 32, // rd via the. + 32, 32, 32, 47, 97, 112, 105, 47, 119, 97, 116, 99, // /api/watc + 104, 46, 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, // h.. . + 60, 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, 10, // `;.};. + 10, 47, 47, 32, 69, 120, 112, 101, 99, 116, 101, 100, // .// Expected + 32, 97, 114, 103, 117, 109, 101, 110, 116, 115, 58, 10, // arguments:. + 47, 47, 32, 100, 97, 116, 97, 58, 32, 116, 105, 109, // // data: tim + 101, 115, 101, 114, 105, 101, 115, 44, 32, 101, 46, 103, // eseries, e.g + 46, 32, 91, 32, 91, 49, 54, 53, 52, 51, 54, 49, // . [ [1654361 + 51, 53, 50, 44, 32, 49, 57, 93, 44, 32, 91, 49, // 352, 19], [1 + 54, 53, 52, 51, 54, 49, 51, 53, 51, 44, 32, 49, // 654361353, 1 + 56, 93, 44, 32, 46, 46, 46, 32, 93, 10, 47, 47, // 8], ... ].// + 32, 119, 105, 100, 116, 104, 44, 32, 104, 101, 105, 103, // width, heig + 104, 116, 44, 32, 121, 116, 105, 99, 107, 115, 44, 32, // ht, yticks, + 120, 116, 105, 99, 107, 115, 44, 32, 121, 109, 105, 110, // xticks, ymin + 44, 32, 121, 109, 97, 120, 44, 32, 120, 109, 105, 110, // , ymax, xmin + 44, 32, 120, 109, 97, 120, 10, 99, 111, 110, 115, 116, // , xmax.const + 32, 83, 86, 71, 32, 61, 32, 102, 117, 110, 99, 116, // SVG = funct + 105, 111, 110, 40, 112, 114, 111, 112, 115, 41, 32, 123, // ion(props) { + 10, 32, 32, 47, 47, 32, 32, 32, 32, 32, 32, 32, // . // + 32, 32, 32, 32, 32, 119, 10, 32, 32, 47, 47, 32, // w. // + 32, 32, 43, 45, 45, 45, 45, 45, 45, 45, 45, 45, // +--------- + 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, // ------------ + 43, 10, 32, 32, 47, 47, 32, 32, 32, 124, 32, 32, // +. // | + 32, 32, 32, 32, 32, 32, 104, 49, 32, 32, 32, 32, // h1 + 32, 32, 32, 32, 32, 32, 32, 124, 10, 32, 32, 47, // |. / + 47, 32, 32, 32, 124, 32, 32, 32, 32, 43, 45, 45, // / | +-- + 45, 45, 45, 45, 45, 45, 45, 45, 45, 43, 32, 32, // ---------+ + 32, 32, 124, 10, 32, 32, 47, 47, 32, 32, 32, 124, // |. // | + 32, 32, 32, 32, 124, 32, 32, 32, 32, 32, 32, 32, // | + 32, 32, 32, 32, 124, 32, 32, 32, 32, 124, 32, 32, // | | + 104, 10, 32, 32, 47, 47, 32, 32, 32, 124, 32, 119, // h. // | w + 49, 32, 124, 32, 32, 32, 32, 32, 32, 32, 32, 32, // 1 | + 32, 32, 124, 32, 119, 50, 32, 124, 10, 32, 32, 47, // | w2 |. / + 47, 32, 32, 32, 124, 32, 32, 32, 32, 43, 45, 45, // / | +-- + 45, 45, 45, 45, 45, 45, 45, 45, 45, 43, 32, 32, // ---------+ + 32, 32, 124, 10, 32, 32, 47, 47, 32, 32, 32, 124, // |. // | + 32, 32, 32, 32, 32, 32, 32, 32, 32, 104, 50, 32, // h2 + 32, 32, 32, 32, 32, 32, 32, 32, 32, 124, 10, 32, // |. + 32, 47, 47, 32, 32, 32, 43, 45, 45, 45, 45, 45, // // +----- + 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, 45, // ------------ + 45, 45, 45, 45, 43, 10, 32, 32, 47, 47, 10, 32, // ----+. //. + 32, 108, 101, 116, 32, 119, 32, 61, 32, 112, 114, 111, // let w = pro + 112, 115, 46, 119, 105, 100, 116, 104, 44, 32, 104, 32, // ps.width, h + 61, 32, 112, 114, 111, 112, 115, 46, 104, 101, 105, 103, // = props.heig + 104, 116, 44, 32, 119, 49, 32, 61, 32, 51, 48, 44, // ht, w1 = 30, + 32, 119, 50, 32, 61, 32, 48, 44, 32, 104, 49, 32, // w2 = 0, h1 + 61, 32, 56, 44, 32, 104, 50, 32, 61, 32, 49, 56, // = 8, h2 = 18 + 59, 10, 32, 32, 108, 101, 116, 32, 121, 116, 105, 99, // ;. let ytic + 107, 115, 32, 61, 32, 112, 114, 111, 112, 115, 46, 121, // ks = props.y + 116, 105, 99, 107, 115, 32, 124, 124, 32, 52, 44, 32, // ticks || 4, + 120, 116, 105, 99, 107, 115, 32, 61, 32, 112, 114, 111, // xticks = pro + 112, 115, 46, 120, 116, 105, 99, 107, 115, 32, 124, 124, // ps.xticks || + 32, 53, 59, 10, 32, 32, 108, 101, 116, 32, 100, 97, // 5;. let da + 116, 97, 32, 61, 32, 112, 114, 111, 112, 115, 46, 100, // ta = props.d + 97, 116, 97, 32, 124, 124, 32, 91, 93, 59, 10, 32, // ata || [];. + 32, 108, 101, 116, 32, 121, 109, 105, 110, 32, 61, 32, // let ymin = + 112, 114, 111, 112, 115, 46, 121, 109, 105, 110, 32, 124, // props.ymin | + 124, 32, 48, 59, 10, 32, 32, 108, 101, 116, 32, 121, // | 0;. let y + 109, 97, 120, 32, 61, 32, 112, 114, 111, 112, 115, 46, // max = props. + 121, 109, 97, 120, 32, 124, 124, 32, 77, 97, 116, 104, // ymax || Math + 46, 109, 97, 120, 46, 97, 112, 112, 108, 121, 40, 110, // .max.apply(n + 117, 108, 108, 44, 32, 100, 97, 116, 97, 46, 109, 97, // ull, data.ma + 112, 40, 112, 32, 61, 62, 32, 112, 91, 49, 93, 41, // p(p => p[1]) + 41, 59, 10, 32, 32, 108, 101, 116, 32, 120, 109, 105, // );. let xmi + 110, 32, 61, 32, 112, 114, 111, 112, 115, 46, 120, 109, // n = props.xm + 105, 110, 32, 124, 124, 32, 77, 97, 116, 104, 46, 109, // in || Math.m + 105, 110, 46, 97, 112, 112, 108, 121, 40, 110, 117, 108, // in.apply(nul + 108, 44, 32, 100, 97, 116, 97, 46, 109, 97, 112, 40, // l, data.map( + 112, 32, 61, 62, 32, 112, 91, 48, 93, 41, 41, 59, // p => p[0])); + 10, 32, 32, 108, 101, 116, 32, 120, 109, 97, 120, 32, // . let xmax + 61, 32, 112, 114, 111, 112, 115, 46, 120, 109, 97, 120, // = props.xmax + 32, 124, 124, 32, 77, 97, 116, 104, 46, 109, 97, 120, // || Math.max + 46, 97, 112, 112, 108, 121, 40, 110, 117, 108, 108, 44, // .apply(null, + 32, 100, 97, 116, 97, 46, 109, 97, 112, 40, 112, 32, // data.map(p + 61, 62, 32, 112, 91, 48, 93, 41, 41, 59, 10, 10, // => p[0]));.. + 32, 32, 47, 47, 32, 89, 45, 97, 120, 105, 115, 32, // // Y-axis + 116, 105, 99, 107, 32, 108, 105, 110, 101, 115, 32, 97, // tick lines a + 110, 100, 32, 108, 97, 98, 101, 108, 115, 10, 32, 32, // nd labels. + 108, 101, 116, 32, 121, 116, 97, 32, 61, 32, 40, 110, // let yta = (n + 101, 119, 32, 65, 114, 114, 97, 121, 40, 121, 116, 105, // ew Array(yti + 99, 107, 115, 32, 43, 32, 49, 41, 41, 46, 102, 105, // cks + 1)).fi + 108, 108, 40, 48, 41, 46, 109, 97, 112, 40, 40, 95, // ll(0).map((_ + 44, 32, 105, 41, 32, 61, 62, 32, 105, 41, 59, 32, // , i) => i); + 32, 47, 47, 32, 105, 110, 100, 105, 99, 101, 115, 10, // // indices. + 32, 32, 108, 101, 116, 32, 121, 116, 105, 32, 61, 32, // let yti = + 105, 32, 61, 62, 32, 104, 32, 45, 32, 104, 50, 32, // i => h - h2 + 45, 32, 40, 104, 32, 45, 32, 104, 49, 32, 45, 32, // - (h - h1 - + 104, 50, 41, 32, 42, 32, 105, 32, 47, 32, 121, 116, // h2) * i / yt + 105, 99, 107, 115, 59, 32, 32, 32, 32, 32, 32, 32, // icks; + 32, 32, 32, 47, 47, 32, 105, 110, 100, 101, 120, 39, // // index' + 115, 32, 89, 10, 32, 32, 108, 101, 116, 32, 121, 116, // s Y. let yt + 118, 32, 61, 32, 105, 32, 61, 62, 32, 40, 121, 109, // v = i => (ym + 97, 120, 32, 45, 32, 121, 109, 105, 110, 41, 32, 42, // ax - ymin) * + 32, 105, 32, 47, 32, 121, 116, 105, 99, 107, 115, 59, // i / yticks; + 10, 32, 32, 108, 101, 116, 32, 121, 116, 108, 32, 61, // . let ytl = + 32, 121, 32, 61, 62, 32, 104, 116, 109, 108, 96, 60, // y => html`< + 108, 105, 110, 101, 32, 120, 49, 61, 36, 123, 119, 49, // line x1=${w1 + 125, 32, 121, 49, 61, 36, 123, 121, 125, 32, 120, 50, // } y1=${y} x2 + 61, 36, 123, 119, 125, 32, 121, 50, 61, 36, 123, 121, // =${w} y2=${y + 125, 32, 99, 108, 97, 115, 115, 61, 34, 116, 105, 99, // } class="tic + 107, 34, 47, 62, 96, 59, 10, 32, 32, 108, 101, 116, // k"/>`;. let + 32, 121, 116, 116, 32, 61, 32, 40, 121, 44, 32, 118, // ytt = (y, v + 41, 32, 61, 62, 32, 104, 116, 109, 108, 96, 60, 116, // ) => html`${v + 125, 60, 47, 116, 101, 120, 116, 62, 96, 59, 10, 10, // }`;.. + 32, 32, 47, 47, 32, 88, 45, 97, 120, 105, 115, 32, // // X-axis + 116, 105, 99, 107, 32, 108, 105, 110, 101, 115, 32, 97, // tick lines a + 110, 100, 32, 108, 97, 98, 101, 108, 115, 10, 32, 32, // nd labels. + 108, 101, 116, 32, 100, 97, 116, 101, 102, 109, 116, 32, // let datefmt + 61, 32, 117, 110, 105, 120, 32, 61, 62, 32, 40, 110, // = unix => (n + 101, 119, 32, 68, 97, 116, 101, 40, 117, 110, 105, 120, // ew Date(unix + 32, 42, 32, 49, 48, 48, 48, 41, 41, 46, 116, 111, // * 1000)).to + 73, 83, 79, 83, 116, 114, 105, 110, 103, 40, 41, 46, // ISOString(). + 115, 117, 98, 115, 116, 114, 40, 49, 52, 44, 32, 53, // substr(14, 5 + 41, 59, 10, 32, 32, 108, 101, 116, 32, 120, 116, 97, // );. let xta + 32, 61, 32, 40, 110, 101, 119, 32, 65, 114, 114, 97, // = (new Arra + 121, 40, 120, 116, 105, 99, 107, 115, 32, 43, 32, 49, // y(xticks + 1 + 41, 41, 46, 102, 105, 108, 108, 40, 48, 41, 46, 109, // )).fill(0).m + 97, 112, 40, 40, 95, 44, 32, 105, 41, 32, 61, 62, // ap((_, i) => + 32, 105, 41, 59, 32, 32, 47, 47, 32, 105, 110, 100, // i); // ind + 105, 99, 101, 115, 10, 32, 32, 108, 101, 116, 32, 120, // ices. let x + 116, 105, 32, 61, 32, 105, 32, 61, 62, 32, 119, 49, // ti = i => w1 + 32, 43, 32, 40, 119, 32, 45, 32, 119, 49, 32, 45, // + (w - w1 - + 32, 119, 50, 41, 32, 42, 32, 105, 32, 47, 32, 120, // w2) * i / x + 116, 105, 99, 107, 115, 59, 32, 32, 32, 32, 32, 32, // ticks; + 32, 32, 32, 32, 32, 32, 32, 32, 47, 47, 32, 105, // // i + 110, 100, 101, 120, 39, 115, 32, 88, 10, 32, 32, 108, // ndex's X. l + 101, 116, 32, 120, 116, 118, 32, 61, 32, 105, 32, 61, // et xtv = i = + 62, 32, 100, 97, 116, 101, 102, 109, 116, 40, 120, 109, // > datefmt(xm + 105, 110, 32, 43, 32, 40, 120, 109, 97, 120, 32, 45, // in + (xmax - + 32, 120, 109, 105, 110, 41, 32, 42, 32, 105, 32, 47, // xmin) * i / + 32, 120, 116, 105, 99, 107, 115, 41, 59, 10, 32, 32, // xticks);. + 108, 101, 116, 32, 120, 116, 108, 32, 61, 32, 120, 32, // let xtl = x + 61, 62, 32, 104, 116, 109, 108, 96, 60, 112, 97, 116, // => html``;. let x + 116, 116, 32, 61, 32, 40, 120, 44, 32, 118, 41, 32, // tt = (x, v) + 61, 62, 10, 32, 32, 32, 32, 32, 32, 104, 116, 109, // =>. htm + 108, 96, 60, 116, 101, 120, 116, 32, 120, 61, 36, 123, // l`${v + 125, 60, 47, 116, 101, 120, 116, 62, 96, 59, 10, 10, // }`;.. + 32, 32, 47, 47, 32, 84, 114, 97, 110, 115, 102, 111, // // Transfo + 114, 109, 32, 100, 97, 116, 97, 32, 112, 111, 105, 110, // rm data poin + 116, 115, 32, 97, 114, 114, 97, 121, 32, 105, 110, 116, // ts array int + 111, 32, 99, 111, 111, 114, 100, 105, 110, 97, 116, 101, // o coordinate + 10, 32, 32, 108, 101, 116, 32, 100, 120, 32, 61, 32, // . let dx = + 118, 32, 61, 62, 32, 119, 49, 32, 43, 32, 40, 118, // v => w1 + (v + 32, 45, 32, 120, 109, 105, 110, 41, 32, 47, 32, 40, // - xmin) / ( + 40, 120, 109, 97, 120, 32, 45, 32, 120, 109, 105, 110, // (xmax - xmin + 41, 32, 124, 124, 32, 49, 41, 32, 42, 32, 40, 119, // ) || 1) * (w + 32, 45, 32, 119, 49, 32, 45, 32, 119, 50, 41, 59, // - w1 - w2); + 10, 32, 32, 108, 101, 116, 32, 100, 121, 32, 61, 32, // . let dy = + 118, 32, 61, 62, 32, 104, 32, 45, 32, 104, 50, 32, // v => h - h2 + 45, 32, 40, 118, 32, 45, 32, 121, 109, 105, 110, 41, // - (v - ymin) + 32, 47, 32, 40, 40, 121, 109, 97, 120, 32, 45, 32, // / ((ymax - + 121, 109, 105, 110, 41, 32, 124, 124, 32, 49, 41, 32, // ymin) || 1) + 42, 32, 40, 104, 32, 45, 32, 104, 49, 32, 45, 32, // * (h - h1 - + 104, 50, 41, 59, 10, 32, 32, 108, 101, 116, 32, 100, // h2);. let d + 100, 32, 61, 32, 100, 97, 116, 97, 46, 109, 97, 112, // d = data.map + 40, 112, 32, 61, 62, 32, 91, 77, 97, 116, 104, 46, // (p => [Math. + 114, 111, 117, 110, 100, 40, 100, 120, 40, 112, 91, 48, // round(dx(p[0 + 93, 41, 41, 44, 32, 77, 97, 116, 104, 46, 114, 111, // ])), Math.ro + 117, 110, 100, 40, 100, 121, 40, 112, 91, 49, 93, 41, // und(dy(p[1]) + 41, 93, 41, 59, 10, 32, 32, 108, 101, 116, 32, 100, // )]);. let d + 100, 108, 32, 61, 32, 100, 100, 46, 108, 101, 110, 103, // dl = dd.leng + 116, 104, 59, 10, 32, 32, 47, 47, 32, 65, 110, 100, // th;. // And + 32, 112, 108, 111, 116, 32, 116, 104, 101, 32, 100, 97, // plot the da + 116, 97, 32, 97, 115, 32, 60, 112, 97, 116, 104, 62, // ta as + 32, 101, 108, 101, 109, 101, 110, 116, 10, 32, 32, 108, // element. l + 101, 116, 32, 98, 101, 103, 105, 110, 48, 32, 61, 32, // et begin0 = + 100, 100, 108, 32, 63, 32, 96, 77, 32, 36, 123, 100, // ddl ? `M ${d + 100, 91, 48, 93, 91, 48, 93, 125, 44, 36, 123, 100, // d[0][0]},${d + 100, 91, 48, 93, 91, 49, 93, 125, 96, 32, 58, 32, // d[0][1]}` : + 96, 77, 32, 48, 44, 48, 96, 59, 10, 32, 32, 108, // `M 0,0`;. l + 101, 116, 32, 98, 101, 103, 105, 110, 32, 61, 32, 96, // et begin = ` + 77, 32, 36, 123, 119, 49, 125, 44, 36, 123, 104, 32, // M ${w1},${h + 45, 32, 104, 50, 125, 96, 59, 32, 32, 47, 47, 32, // - h2}`; // + 73, 110, 105, 116, 105, 97, 108, 32, 112, 111, 105, 110, // Initial poin + 116, 10, 32, 32, 108, 101, 116, 32, 101, 110, 100, 32, // t. let end + 61, 32, 100, 100, 108, 32, 63, 32, 96, 76, 32, 36, // = ddl ? `L $ + 123, 100, 100, 91, 100, 100, 108, 32, 45, 32, 49, 93, // {dd[ddl - 1] + 91, 48, 93, 125, 44, 36, 123, 104, 32, 45, 32, 104, // [0]},${h - h + 50, 125, 96, 32, 58, 32, 96, 76, 32, 36, 123, 119, // 2}` : `L ${w + 49, 125, 44, 36, 123, 104, 32, 45, 32, 104, 50, 125, // 1},${h - h2} + 96, 59, 10, 32, 32, 108, 101, 116, 32, 115, 101, 114, // `;. let ser + 105, 101, 115, 32, 61, 32, 100, 100, 108, 32, 63, 32, // ies = ddl ? + 100, 100, 46, 109, 97, 112, 40, 112, 32, 61, 62, 32, // dd.map(p => + 96, 76, 32, 36, 123, 112, 91, 48, 93, 125, 32, 36, // `L ${p[0]} $ + 123, 112, 91, 49, 93, 125, 96, 41, 32, 58, 32, 91, // {p[1]}`) : [ + 93, 59, 10, 10, 32, 32, 114, 101, 116, 117, 114, 110, // ];.. return + 32, 104, 116, 109, 108, 96, 10, 60, 115, 118, 103, 32, // html`. + 10, 32, 32, 60, 115, 116, 121, 108, 101, 62, 10, 32, // . `;.};...con + 115, 116, 32, 67, 104, 97, 114, 116, 32, 61, 32, 102, // st Chart = f 117, 110, 99, 116, 105, 111, 110, 40, 112, 114, 111, 112, // unction(prop 115, 41, 32, 123, 10, 32, 32, 99, 111, 110, 115, 116, // s) {. const - 32, 91, 117, 115, 101, 114, 44, 32, 115, 101, 116, 85, // [user, setU - 115, 101, 114, 93, 32, 61, 32, 117, 115, 101, 83, 116, // ser] = useSt - 97, 116, 101, 40, 39, 39, 41, 59, 10, 10, 32, 32, // ate('');.. - 99, 111, 110, 115, 116, 32, 103, 101, 116, 99, 111, 110, // const getcon - 102, 105, 103, 32, 61, 32, 40, 41, 32, 61, 62, 10, // fig = () =>. - 32, 32, 32, 32, 32, 32, 102, 101, 116, 99, 104, 40, // fetch( - 39, 47, 97, 112, 105, 47, 99, 111, 110, 102, 105, 103, // '/api/config - 47, 103, 101, 116, 39, 44, 32, 123, 104, 101, 97, 100, // /get', {head - 101, 114, 115, 58, 32, 123, 65, 117, 116, 104, 111, 114, // ers: {Author - 105, 122, 97, 116, 105, 111, 110, 58, 32, 39, 39, 125, // ization: ''} - 125, 41, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, // }). - 32, 46, 116, 104, 101, 110, 40, 114, 32, 61, 62, 32, // .then(r => - 114, 46, 106, 115, 111, 110, 40, 41, 41, 10, 32, 32, // r.json()). - 32, 32, 32, 32, 32, 32, 32, 32, 46, 116, 104, 101, // .the - 110, 40, 114, 32, 61, 62, 32, 80, 117, 98, 83, 117, // n(r => PubSu - 98, 46, 112, 117, 98, 108, 105, 115, 104, 40, 123, 110, // b.publish({n - 97, 109, 101, 58, 32, 39, 110, 101, 119, 99, 111, 110, // ame: 'newcon - 102, 105, 103, 39, 44, 32, 100, 97, 116, 97, 58, 32, // fig', data: - 114, 125, 41, 41, 59, 10, 10, 32, 32, 99, 111, 110, // r}));.. con - 115, 116, 32, 108, 111, 103, 105, 110, 32, 61, 32, 102, // st login = f - 117, 110, 99, 116, 105, 111, 110, 40, 117, 41, 32, 123, // unction(u) { - 10, 32, 32, 32, 32, 100, 111, 99, 117, 109, 101, 110, // . documen - 116, 46, 99, 111, 111, 107, 105, 101, 32, 61, 32, 96, // t.cookie = ` - 97, 99, 99, 101, 115, 115, 95, 116, 111, 107, 101, 110, // access_token - 61, 36, 123, 117, 46, 116, 111, 107, 101, 110, 125, 59, // =${u.token}; - 112, 97, 116, 104, 61, 47, 59, 109, 97, 120, 45, 97, // path=/;max-a - 103, 101, 61, 51, 54, 48, 48, 96, 59, 10, 32, 32, // ge=3600`;. - 32, 32, 115, 101, 116, 85, 115, 101, 114, 40, 117, 46, // setUser(u. - 117, 115, 101, 114, 41, 59, 10, 32, 32, 32, 32, 114, // user);. r - 101, 116, 117, 114, 110, 32, 103, 101, 116, 99, 111, 110, // eturn getcon - 102, 105, 103, 40, 41, 59, 10, 32, 32, 125, 59, 10, // fig();. };. - 10, 32, 32, 99, 111, 110, 115, 116, 32, 108, 111, 103, // . const log - 111, 117, 116, 32, 61, 32, 101, 118, 32, 61, 62, 32, // out = ev => + 32, 91, 100, 97, 116, 97, 44, 32, 115, 101, 116, 68, // [data, setD + 97, 116, 97, 93, 32, 61, 32, 117, 115, 101, 83, 116, // ata] = useSt + 97, 116, 101, 40, 91, 93, 41, 59, 10, 32, 32, 117, // ate([]);. u + 115, 101, 69, 102, 102, 101, 99, 116, 40, 40, 41, 32, // seEffect(() + 61, 62, 32, 123, 10, 32, 32, 32, 32, 99, 111, 110, // => {. con + 115, 116, 32, 105, 100, 32, 61, 32, 80, 117, 98, 83, // st id = PubS + 117, 98, 46, 115, 117, 98, 115, 99, 114, 105, 98, 101, // ub.subscribe + 40, 102, 117, 110, 99, 116, 105, 111, 110, 40, 109, 115, // (function(ms + 103, 41, 32, 123, 10, 32, 32, 32, 32, 32, 32, 105, // g) {. i + 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, 101, 32, // f (msg.name + 33, 61, 32, 39, 109, 101, 116, 114, 105, 99, 115, 39, // != 'metrics' + 41, 32, 114, 101, 116, 117, 114, 110, 59, 10, 32, 32, // ) return;. + 32, 32, 32, 32, 115, 101, 116, 68, 97, 116, 97, 40, // setData( + 120, 32, 61, 62, 32, 120, 46, 99, 111, 110, 99, 97, // x => x.conca + 116, 40, 91, 109, 115, 103, 46, 100, 97, 116, 97, 93, // t([msg.data] + 41, 46, 115, 112, 108, 105, 99, 101, 40, 45, 77, 97, // ).splice(-Ma + 120, 77, 101, 116, 114, 105, 99, 115, 68, 97, 116, 97, // xMetricsData + 80, 111, 105, 110, 116, 115, 41, 41, 59, 10, 32, 32, // Points));. + 32, 32, 125, 41, 59, 10, 32, 32, 32, 32, 114, 101, // });. re + 116, 117, 114, 110, 32, 80, 117, 98, 83, 117, 98, 46, // turn PubSub. + 117, 110, 115, 117, 98, 115, 99, 114, 105, 98, 101, 40, // unsubscribe( + 105, 100, 41, 59, 10, 32, 32, 125, 44, 32, 91, 93, // id);. }, [] + 41, 59, 10, 10, 32, 32, 108, 101, 116, 32, 120, 109, // );.. let xm + 97, 120, 32, 61, 32, 48, 44, 32, 109, 105, 115, 115, // ax = 0, miss + 105, 110, 103, 32, 61, 32, 77, 97, 120, 77, 101, 116, // ing = MaxMet + 114, 105, 99, 115, 68, 97, 116, 97, 80, 111, 105, 110, // ricsDataPoin + 116, 115, 32, 45, 32, 100, 97, 116, 97, 46, 108, 101, // ts - data.le + 110, 103, 116, 104, 59, 10, 32, 32, 105, 102, 32, 40, // ngth;. if ( + 109, 105, 115, 115, 105, 110, 103, 32, 62, 32, 48, 41, // missing > 0) + 32, 120, 109, 97, 120, 32, 61, 32, 77, 97, 116, 104, // xmax = Math + 46, 114, 111, 117, 110, 100, 40, 68, 97, 116, 101, 46, // .round(Date. + 110, 111, 119, 40, 41, 32, 47, 32, 49, 48, 48, 48, // now() / 1000 + 41, 32, 43, 32, 109, 105, 115, 115, 105, 110, 103, 59, // ) + missing; + 10, 32, 32, 114, 101, 116, 117, 114, 110, 32, 104, 116, // . return ht + 109, 108, 96, 10, 60, 100, 105, 118, 32, 99, 108, 97, // ml`.
.

Data Char + 116, 60, 47, 104, 51, 62, 10, 32, 32, 60, 100, 105, // t

. . <${S + 86, 71, 125, 32, 104, 101, 105, 103, 104, 116, 61, 50, // VG} height=2 + 52, 48, 32, 119, 105, 100, 116, 104, 61, 54, 48, 48, // 40 width=600 + 32, 121, 109, 105, 110, 61, 48, 32, 121, 109, 97, 120, // ymin=0 ymax + 61, 50, 48, 32, 120, 109, 97, 120, 61, 36, 123, 120, // =20 xmax=${x + 109, 97, 120, 125, 32, 100, 97, 116, 97, 61, 36, 123, // max} data=${ + 100, 97, 116, 97, 125, 32, 47, 62, 10, 32, 32, 60, // data} />. < + 47, 100, 105, 118, 62, 10, 32, 32, 60, 100, 105, 118, // /div>.
. This c + 104, 97, 114, 116, 32, 112, 108, 111, 116, 115, 32, 108, // hart plots l + 105, 118, 101, 32, 115, 101, 110, 115, 111, 114, 32, 100, // ive sensor d + 97, 116, 97, 44, 32, 115, 101, 110, 116, 32, 98, 121, // ata, sent by + 32, 97, 32, 100, 101, 118, 105, 99, 101, 32, 118, 105, // a device vi + 97, 32, 47, 97, 112, 105, 47, 119, 97, 116, 99, 104, // a /api/watch + 46, 10, 32, 32, 60, 47, 100, 105, 118, 62, 10, 60, // ..
.< + 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, 10, 10, // /div>`;.};.. + 99, 111, 110, 115, 116, 32, 65, 112, 112, 32, 61, 32, // const App = + 102, 117, 110, 99, 116, 105, 111, 110, 40, 112, 114, 111, // function(pro + 112, 115, 41, 32, 123, 10, 32, 32, 99, 111, 110, 115, // ps) {. cons + 116, 32, 91, 117, 115, 101, 114, 44, 32, 115, 101, 116, // t [user, set + 85, 115, 101, 114, 93, 32, 61, 32, 117, 115, 101, 83, // User] = useS + 116, 97, 116, 101, 40, 39, 39, 41, 59, 10, 10, 32, // tate('');.. + 32, 99, 111, 110, 115, 116, 32, 103, 101, 116, 99, 111, // const getco + 110, 102, 105, 103, 32, 61, 32, 40, 41, 32, 61, 62, // nfig = () => + 10, 32, 32, 32, 32, 32, 32, 102, 101, 116, 99, 104, // . fetch + 40, 39, 47, 97, 112, 105, 47, 99, 111, 110, 102, 105, // ('/api/confi + 103, 47, 103, 101, 116, 39, 44, 32, 123, 104, 101, 97, // g/get', {hea + 100, 101, 114, 115, 58, 32, 123, 65, 117, 116, 104, 111, // ders: {Autho + 114, 105, 122, 97, 116, 105, 111, 110, 58, 32, 39, 39, // rization: '' + 125, 125, 41, 10, 32, 32, 32, 32, 32, 32, 32, 32, // }}). + 32, 32, 46, 116, 104, 101, 110, 40, 114, 32, 61, 62, // .then(r => + 32, 114, 46, 106, 115, 111, 110, 40, 41, 41, 10, 32, // r.json()). + 32, 32, 32, 32, 32, 32, 32, 32, 32, 46, 116, 104, // .th + 101, 110, 40, 114, 32, 61, 62, 32, 80, 117, 98, 83, // en(r => PubS + 117, 98, 46, 112, 117, 98, 108, 105, 115, 104, 40, 123, // ub.publish({ + 110, 97, 109, 101, 58, 32, 39, 110, 101, 119, 99, 111, // name: 'newco + 110, 102, 105, 103, 39, 44, 32, 100, 97, 116, 97, 58, // nfig', data: + 32, 114, 125, 41, 41, 59, 10, 10, 32, 32, 99, 111, // r}));.. co + 110, 115, 116, 32, 108, 111, 103, 105, 110, 32, 61, 32, // nst login = + 102, 117, 110, 99, 116, 105, 111, 110, 40, 117, 41, 32, // function(u) 123, 10, 32, 32, 32, 32, 100, 111, 99, 117, 109, 101, // {. docume 110, 116, 46, 99, 111, 111, 107, 105, 101, 32, 61, 32, // nt.cookie = 96, 97, 99, 99, 101, 115, 115, 95, 116, 111, 107, 101, // `access_toke - 110, 61, 59, 112, 97, 116, 104, 61, 47, 59, 109, 97, // n=;path=/;ma - 120, 45, 97, 103, 101, 61, 48, 96, 59, 10, 32, 32, // x-age=0`;. - 32, 32, 115, 101, 116, 85, 115, 101, 114, 40, 39, 39, // setUser('' - 41, 59, 10, 32, 32, 125, 59, 10, 10, 32, 32, 47, // );. };.. / - 47, 32, 87, 97, 116, 99, 104, 32, 102, 111, 114, 32, // / Watch for - 110, 111, 116, 105, 102, 105, 99, 97, 116, 105, 111, 110, // notification - 115, 46, 32, 65, 115, 32, 115, 111, 111, 110, 32, 97, // s. As soon a - 115, 32, 97, 32, 110, 111, 116, 105, 102, 105, 99, 97, // s a notifica - 116, 105, 111, 110, 32, 97, 114, 114, 105, 118, 101, 115, // tion arrives - 44, 32, 112, 97, 115, 115, 32, 105, 116, 32, 111, 110, // , pass it on - 10, 32, 32, 47, 47, 32, 116, 111, 32, 97, 108, 108, // . // to all - 32, 115, 117, 98, 115, 99, 114, 105, 98, 101, 100, 32, // subscribed - 99, 111, 109, 112, 111, 110, 101, 110, 116, 115, 10, 32, // components. - 32, 99, 111, 110, 115, 116, 32, 119, 97, 116, 99, 104, // const watch - 32, 61, 32, 102, 117, 110, 99, 116, 105, 111, 110, 40, // = function( - 41, 32, 123, 10, 32, 32, 32, 32, 118, 97, 114, 32, // ) {. var - 108, 32, 61, 32, 119, 105, 110, 100, 111, 119, 46, 108, // l = window.l - 111, 99, 97, 116, 105, 111, 110, 44, 32, 112, 114, 111, // ocation, pro - 116, 111, 32, 61, 32, 108, 46, 112, 114, 111, 116, 111, // to = l.proto - 99, 111, 108, 46, 114, 101, 112, 108, 97, 99, 101, 40, // col.replace( - 39, 104, 116, 116, 112, 39, 44, 32, 39, 119, 115, 39, // 'http', 'ws' - 41, 59, 10, 32, 32, 32, 32, 118, 97, 114, 32, 116, // );. var t - 105, 100, 44, 32, 119, 115, 85, 82, 73, 32, 61, 32, // id, wsURI = - 112, 114, 111, 116, 111, 32, 43, 32, 39, 47, 47, 39, // proto + '//' - 32, 43, 32, 108, 46, 104, 111, 115, 116, 32, 43, 32, // + l.host + - 39, 47, 97, 112, 105, 47, 119, 97, 116, 99, 104, 39, // '/api/watch' - 10, 32, 32, 32, 32, 118, 97, 114, 32, 114, 101, 99, // . var rec - 111, 110, 110, 101, 99, 116, 32, 61, 32, 102, 117, 110, // onnect = fun - 99, 116, 105, 111, 110, 40, 41, 32, 123, 10, 32, 32, // ction() {. - 32, 32, 32, 32, 118, 97, 114, 32, 119, 115, 32, 61, // var ws = - 32, 110, 101, 119, 32, 87, 101, 98, 83, 111, 99, 107, // new WebSock - 101, 116, 40, 119, 115, 85, 82, 73, 41, 59, 10, 32, // et(wsURI);. - 32, 32, 32, 32, 32, 119, 115, 46, 111, 110, 109, 101, // ws.onme - 115, 115, 97, 103, 101, 32, 61, 32, 102, 117, 110, 99, // ssage = func - 116, 105, 111, 110, 40, 101, 118, 41, 32, 123, 10, 32, // tion(ev) {. - 32, 32, 32, 32, 32, 32, 32, 116, 114, 121, 32, 123, // try { - 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 118, // . v - 97, 114, 32, 109, 115, 103, 32, 61, 32, 74, 83, 79, // ar msg = JSO - 78, 46, 112, 97, 114, 115, 101, 40, 101, 118, 46, 100, // N.parse(ev.d - 97, 116, 97, 41, 59, 10, 32, 32, 32, 32, 32, 32, // ata);. - 32, 32, 32, 32, 80, 117, 98, 83, 117, 98, 46, 112, // PubSub.p - 117, 98, 108, 105, 115, 104, 40, 109, 115, 103, 41, 59, // ublish(msg); - 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, 105, // . i - 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, 101, 32, // f (msg.name - 33, 61, 32, 39, 109, 101, 116, 114, 105, 99, 115, 39, // != 'metrics' - 41, 32, 99, 111, 110, 115, 111, 108, 101, 46, 108, 111, // ) console.lo - 103, 40, 39, 119, 115, 45, 62, 39, 44, 32, 109, 115, // g('ws->', ms - 103, 41, 59, 10, 32, 32, 32, 32, 32, 32, 32, 32, // g);. - 125, 32, 99, 97, 116, 99, 104, 32, 40, 101, 41, 32, // } catch (e) + 110, 61, 36, 123, 117, 46, 116, 111, 107, 101, 110, 125, // n=${u.token} + 59, 112, 97, 116, 104, 61, 47, 59, 109, 97, 120, 45, // ;path=/;max- + 97, 103, 101, 61, 51, 54, 48, 48, 96, 59, 10, 32, // age=3600`;. + 32, 32, 32, 115, 101, 116, 85, 115, 101, 114, 40, 117, // setUser(u + 46, 117, 115, 101, 114, 41, 59, 10, 32, 32, 32, 32, // .user);. + 114, 101, 116, 117, 114, 110, 32, 103, 101, 116, 99, 111, // return getco + 110, 102, 105, 103, 40, 41, 59, 10, 32, 32, 125, 59, // nfig();. }; + 10, 10, 32, 32, 99, 111, 110, 115, 116, 32, 108, 111, // .. const lo + 103, 111, 117, 116, 32, 61, 32, 101, 118, 32, 61, 62, // gout = ev => + 32, 123, 10, 32, 32, 32, 32, 100, 111, 99, 117, 109, // {. docum + 101, 110, 116, 46, 99, 111, 111, 107, 105, 101, 32, 61, // ent.cookie = + 32, 96, 97, 99, 99, 101, 115, 115, 95, 116, 111, 107, // `access_tok + 101, 110, 61, 59, 112, 97, 116, 104, 61, 47, 59, 109, // en=;path=/;m + 97, 120, 45, 97, 103, 101, 61, 48, 96, 59, 10, 32, // ax-age=0`;. + 32, 32, 32, 115, 101, 116, 85, 115, 101, 114, 40, 39, // setUser(' + 39, 41, 59, 10, 32, 32, 125, 59, 10, 10, 32, 32, // ');. };.. + 47, 47, 32, 87, 97, 116, 99, 104, 32, 102, 111, 114, // // Watch for + 32, 110, 111, 116, 105, 102, 105, 99, 97, 116, 105, 111, // notificatio + 110, 115, 46, 32, 65, 115, 32, 115, 111, 111, 110, 32, // ns. As soon + 97, 115, 32, 97, 32, 110, 111, 116, 105, 102, 105, 99, // as a notific + 97, 116, 105, 111, 110, 32, 97, 114, 114, 105, 118, 101, // ation arrive + 115, 44, 32, 112, 97, 115, 115, 32, 105, 116, 32, 111, // s, pass it o + 110, 10, 32, 32, 47, 47, 32, 116, 111, 32, 97, 108, // n. // to al + 108, 32, 115, 117, 98, 115, 99, 114, 105, 98, 101, 100, // l subscribed + 32, 99, 111, 109, 112, 111, 110, 101, 110, 116, 115, 10, // components. + 32, 32, 99, 111, 110, 115, 116, 32, 119, 97, 116, 99, // const watc + 104, 32, 61, 32, 102, 117, 110, 99, 116, 105, 111, 110, // h = function + 40, 41, 32, 123, 10, 32, 32, 32, 32, 118, 97, 114, // () {. var + 32, 108, 32, 61, 32, 119, 105, 110, 100, 111, 119, 46, // l = window. + 108, 111, 99, 97, 116, 105, 111, 110, 44, 32, 112, 114, // location, pr + 111, 116, 111, 32, 61, 32, 108, 46, 112, 114, 111, 116, // oto = l.prot + 111, 99, 111, 108, 46, 114, 101, 112, 108, 97, 99, 101, // ocol.replace + 40, 39, 104, 116, 116, 112, 39, 44, 32, 39, 119, 115, // ('http', 'ws + 39, 41, 59, 10, 32, 32, 32, 32, 118, 97, 114, 32, // ');. var + 116, 105, 100, 44, 32, 119, 115, 85, 82, 73, 32, 61, // tid, wsURI = + 32, 112, 114, 111, 116, 111, 32, 43, 32, 39, 47, 47, // proto + '// + 39, 32, 43, 32, 108, 46, 104, 111, 115, 116, 32, 43, // ' + l.host + + 32, 39, 47, 97, 112, 105, 47, 119, 97, 116, 99, 104, // '/api/watch + 39, 10, 32, 32, 32, 32, 118, 97, 114, 32, 114, 101, // '. var re + 99, 111, 110, 110, 101, 99, 116, 32, 61, 32, 102, 117, // connect = fu + 110, 99, 116, 105, 111, 110, 40, 41, 32, 123, 10, 32, // nction() {. + 32, 32, 32, 32, 32, 118, 97, 114, 32, 119, 115, 32, // var ws + 61, 32, 110, 101, 119, 32, 87, 101, 98, 83, 111, 99, // = new WebSoc + 107, 101, 116, 40, 119, 115, 85, 82, 73, 41, 59, 10, // ket(wsURI);. + 32, 32, 32, 32, 32, 32, 119, 115, 46, 111, 110, 109, // ws.onm + 101, 115, 115, 97, 103, 101, 32, 61, 32, 102, 117, 110, // essage = fun + 99, 116, 105, 111, 110, 40, 101, 118, 41, 32, 123, 10, // ction(ev) {. + 32, 32, 32, 32, 32, 32, 32, 32, 116, 114, 121, 32, // try 123, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // {. - 99, 111, 110, 115, 111, 108, 101, 46, 108, 111, 103, 40, // console.log( - 39, 73, 110, 118, 97, 108, 105, 100, 32, 119, 115, 32, // 'Invalid ws - 102, 114, 97, 109, 101, 58, 39, 44, 32, 101, 118, 46, // frame:', ev. - 100, 97, 116, 97, 41, 59, 32, 32, 47, 47, 32, 101, // data); // e - 115, 108, 105, 110, 116, 45, 100, 105, 115, 97, 98, 108, // slint-disabl - 101, 45, 108, 105, 110, 101, 10, 32, 32, 32, 32, 32, // e-line. - 32, 32, 32, 125, 10, 32, 32, 32, 32, 32, 32, 125, // }. } - 59, 10, 32, 32, 32, 32, 32, 32, 119, 115, 46, 111, // ;. ws.o - 110, 99, 108, 111, 115, 101, 32, 61, 32, 102, 117, 110, // nclose = fun - 99, 116, 105, 111, 110, 40, 41, 32, 123, 10, 32, 32, // ction() {. - 32, 32, 32, 32, 32, 32, 99, 108, 101, 97, 114, 84, // clearT - 105, 109, 101, 111, 117, 116, 40, 116, 105, 100, 41, 59, // imeout(tid); - 10, 32, 32, 32, 32, 32, 32, 32, 32, 116, 105, 100, // . tid - 32, 61, 32, 115, 101, 116, 84, 105, 109, 101, 111, 117, // = setTimeou - 116, 40, 114, 101, 99, 111, 110, 110, 101, 99, 116, 44, // t(reconnect, - 32, 49, 48, 48, 48, 41, 59, 10, 32, 32, 32, 32, // 1000);. - 32, 32, 125, 59, 10, 32, 32, 32, 32, 125, 59, 10, // };. };. - 32, 32, 32, 32, 114, 101, 99, 111, 110, 110, 101, 99, // reconnec - 116, 40, 41, 59, 10, 32, 32, 125, 59, 10, 10, 32, // t();. };.. - 32, 117, 115, 101, 69, 102, 102, 101, 99, 116, 40, 40, // useEffect(( - 41, 32, 61, 62, 32, 123, 10, 32, 32, 32, 32, 47, // ) => {. / - 47, 32, 67, 97, 108, 108, 101, 100, 32, 111, 110, 99, // / Called onc - 101, 32, 97, 116, 32, 105, 110, 105, 116, 32, 116, 105, // e at init ti - 109, 101, 10, 32, 32, 32, 32, 102, 101, 116, 99, 104, // me. fetch - 40, 39, 47, 97, 112, 105, 47, 108, 111, 103, 105, 110, // ('/api/login - 39, 44, 32, 123, 104, 101, 97, 100, 101, 114, 115, 58, // ', {headers: - 32, 123, 65, 117, 116, 104, 111, 114, 105, 122, 97, 116, // {Authorizat - 105, 111, 110, 58, 32, 39, 39, 125, 125, 41, 10, 32, // ion: ''}}). - 32, 32, 32, 32, 32, 32, 32, 46, 116, 104, 101, 110, // .then - 40, 114, 32, 61, 62, 32, 114, 46, 106, 115, 111, 110, // (r => r.json - 40, 41, 41, 10, 32, 32, 32, 32, 32, 32, 32, 32, // ()). - 46, 116, 104, 101, 110, 40, 114, 32, 61, 62, 32, 108, // .then(r => l - 111, 103, 105, 110, 40, 114, 41, 41, 10, 32, 32, 32, // ogin(r)). - 32, 32, 32, 32, 32, 46, 99, 97, 116, 99, 104, 40, // .catch( - 101, 114, 114, 32, 61, 62, 32, 115, 101, 116, 85, 115, // err => setUs - 101, 114, 40, 39, 39, 41, 41, 59, 10, 32, 32, 32, // er(''));. - 32, 119, 97, 116, 99, 104, 40, 41, 59, 10, 32, 32, // watch();. - 32, 32, 80, 117, 98, 83, 117, 98, 46, 115, 117, 98, // PubSub.sub - 115, 99, 114, 105, 98, 101, 40, 109, 115, 103, 32, 61, // scribe(msg = - 62, 32, 109, 115, 103, 46, 110, 97, 109, 101, 32, 61, // > msg.name = - 61, 32, 39, 99, 111, 110, 102, 105, 103, 39, 32, 38, // = 'config' & - 38, 32, 103, 101, 116, 99, 111, 110, 102, 105, 103, 40, // & getconfig( - 41, 41, 59, 10, 32, 32, 125, 44, 32, 91, 93, 41, // ));. }, []) - 59, 10, 10, 32, 32, 105, 102, 32, 40, 33, 117, 115, // ;.. if (!us - 101, 114, 41, 32, 114, 101, 116, 117, 114, 110, 32, 104, // er) return h - 116, 109, 108, 96, 60, 36, 123, 76, 111, 103, 105, 110, // tml`<${Login - 125, 32, 108, 111, 103, 105, 110, 61, 36, 123, 108, 111, // } login=${lo - 103, 105, 110, 125, 32, 47, 62, 96, 59, 10, 10, 32, // gin} />`;.. - 32, 114, 101, 116, 117, 114, 110, 32, 104, 116, 109, 108, // return html - 96, 10, 60, 36, 123, 78, 97, 118, 125, 32, 117, 115, // `.<${Nav} us - 101, 114, 61, 36, 123, 117, 115, 101, 114, 125, 32, 108, // er=${user} l - 111, 103, 111, 117, 116, 61, 36, 123, 108, 111, 103, 111, // ogout=${logo - 117, 116, 125, 32, 47, 62, 10, 60, 100, 105, 118, 32, // ut} />.
. .
<${Her - 111, 125, 32, 47, 62, 60, 47, 100, 105, 118, 62, 10, // o} />
. - 32, 32, 32, 32, 60, 100, 105, 118, 32, 99, 108, 97, //
<${Chart} - 32, 47, 62, 60, 47, 100, 105, 118, 62, 10, 32, 32, // />
. - 32, 32, 60, 100, 105, 118, 32, 99, 108, 97, 115, 115, //
${user == ' - 97, 100, 109, 105, 110, 39, 32, 38, 38, 32, 104, 40, // admin' && h( - 67, 111, 110, 102, 105, 103, 117, 114, 97, 116, 105, 111, // Configuratio - 110, 41, 125, 60, 47, 100, 105, 118, 62, 10, 32, 32, // n)}
. - 32, 32, 60, 100, 105, 118, 32, 99, 108, 97, 115, 115, //
<${Messages + 118, 97, 114, 32, 109, 115, 103, 32, 61, 32, 74, 83, // var msg = JS + 79, 78, 46, 112, 97, 114, 115, 101, 40, 101, 118, 46, // ON.parse(ev. + 100, 97, 116, 97, 41, 59, 10, 32, 32, 32, 32, 32, // data);. + 32, 32, 32, 32, 32, 80, 117, 98, 83, 117, 98, 46, // PubSub. + 112, 117, 98, 108, 105, 115, 104, 40, 109, 115, 103, 41, // publish(msg) + 59, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, 32, // ;. + 105, 102, 32, 40, 109, 115, 103, 46, 110, 97, 109, 101, // if (msg.name + 32, 33, 61, 32, 39, 109, 101, 116, 114, 105, 99, 115, // != 'metrics + 39, 41, 32, 99, 111, 110, 115, 111, 108, 101, 46, 108, // ') console.l + 111, 103, 40, 39, 119, 115, 45, 62, 39, 44, 32, 109, // og('ws->', m + 115, 103, 41, 59, 10, 32, 32, 32, 32, 32, 32, 32, // sg);. + 32, 125, 32, 99, 97, 116, 99, 104, 32, 40, 101, 41, // } catch (e) + 32, 123, 10, 32, 32, 32, 32, 32, 32, 32, 32, 32, // {. + 32, 99, 111, 110, 115, 111, 108, 101, 46, 108, 111, 103, // console.log + 40, 39, 73, 110, 118, 97, 108, 105, 100, 32, 119, 115, // ('Invalid ws + 32, 102, 114, 97, 109, 101, 58, 39, 44, 32, 101, 118, // frame:', ev + 46, 100, 97, 116, 97, 41, 59, 32, 32, 47, 47, 32, // .data); // + 101, 115, 108, 105, 110, 116, 45, 100, 105, 115, 97, 98, // eslint-disab + 108, 101, 45, 108, 105, 110, 101, 10, 32, 32, 32, 32, // le-line. + 32, 32, 32, 32, 125, 10, 32, 32, 32, 32, 32, 32, // }. + 125, 59, 10, 32, 32, 32, 32, 32, 32, 119, 115, 46, // };. ws. + 111, 110, 99, 108, 111, 115, 101, 32, 61, 32, 102, 117, // onclose = fu + 110, 99, 116, 105, 111, 110, 40, 41, 32, 123, 10, 32, // nction() {. + 32, 32, 32, 32, 32, 32, 32, 99, 108, 101, 97, 114, // clear + 84, 105, 109, 101, 111, 117, 116, 40, 116, 105, 100, 41, // Timeout(tid) + 59, 10, 32, 32, 32, 32, 32, 32, 32, 32, 116, 105, // ;. ti + 100, 32, 61, 32, 115, 101, 116, 84, 105, 109, 101, 111, // d = setTimeo + 117, 116, 40, 114, 101, 99, 111, 110, 110, 101, 99, 116, // ut(reconnect + 44, 32, 49, 48, 48, 48, 41, 59, 10, 32, 32, 32, // , 1000);. + 32, 32, 32, 125, 59, 10, 32, 32, 32, 32, 125, 59, // };. }; + 10, 32, 32, 32, 32, 114, 101, 99, 111, 110, 110, 101, // . reconne + 99, 116, 40, 41, 59, 10, 32, 32, 125, 59, 10, 10, // ct();. };.. + 32, 32, 117, 115, 101, 69, 102, 102, 101, 99, 116, 40, // useEffect( + 40, 41, 32, 61, 62, 32, 123, 10, 32, 32, 32, 32, // () => {. + 47, 47, 32, 67, 97, 108, 108, 101, 100, 32, 111, 110, // // Called on + 99, 101, 32, 97, 116, 32, 105, 110, 105, 116, 32, 116, // ce at init t + 105, 109, 101, 10, 32, 32, 32, 32, 102, 101, 116, 99, // ime. fetc + 104, 40, 39, 47, 97, 112, 105, 47, 108, 111, 103, 105, // h('/api/logi + 110, 39, 44, 32, 123, 104, 101, 97, 100, 101, 114, 115, // n', {headers + 58, 32, 123, 65, 117, 116, 104, 111, 114, 105, 122, 97, // : {Authoriza + 116, 105, 111, 110, 58, 32, 39, 39, 125, 125, 41, 10, // tion: ''}}). + 32, 32, 32, 32, 32, 32, 32, 32, 46, 116, 104, 101, // .the + 110, 40, 114, 32, 61, 62, 32, 114, 46, 106, 115, 111, // n(r => r.jso + 110, 40, 41, 41, 10, 32, 32, 32, 32, 32, 32, 32, // n()). + 32, 46, 116, 104, 101, 110, 40, 114, 32, 61, 62, 32, // .then(r => + 108, 111, 103, 105, 110, 40, 114, 41, 41, 10, 32, 32, // login(r)). + 32, 32, 32, 32, 32, 32, 46, 99, 97, 116, 99, 104, // .catch + 40, 101, 114, 114, 32, 61, 62, 32, 115, 101, 116, 85, // (err => setU + 115, 101, 114, 40, 39, 39, 41, 41, 59, 10, 32, 32, // ser(''));. + 32, 32, 119, 97, 116, 99, 104, 40, 41, 59, 10, 32, // watch();. + 32, 32, 32, 80, 117, 98, 83, 117, 98, 46, 115, 117, // PubSub.su + 98, 115, 99, 114, 105, 98, 101, 40, 109, 115, 103, 32, // bscribe(msg + 61, 62, 32, 109, 115, 103, 46, 110, 97, 109, 101, 32, // => msg.name + 61, 61, 32, 39, 99, 111, 110, 102, 105, 103, 39, 32, // == 'config' + 38, 38, 32, 103, 101, 116, 99, 111, 110, 102, 105, 103, // && getconfig + 40, 41, 41, 59, 10, 32, 32, 125, 44, 32, 91, 93, // ());. }, [] + 41, 59, 10, 10, 32, 32, 105, 102, 32, 40, 33, 117, // );.. if (!u + 115, 101, 114, 41, 32, 114, 101, 116, 117, 114, 110, 32, // ser) return + 104, 116, 109, 108, 96, 60, 36, 123, 76, 111, 103, 105, // html`<${Logi + 110, 125, 32, 108, 111, 103, 105, 110, 61, 36, 123, 108, // n} login=${l + 111, 103, 105, 110, 125, 32, 47, 62, 96, 59, 10, 10, // ogin} />`;.. + 32, 32, 114, 101, 116, 117, 114, 110, 32, 104, 116, 109, // return htm + 108, 96, 10, 60, 36, 123, 78, 97, 118, 125, 32, 117, // l`.<${Nav} u + 115, 101, 114, 61, 36, 123, 117, 115, 101, 114, 125, 32, // ser=${user} + 108, 111, 103, 111, 117, 116, 61, 36, 123, 108, 111, 103, // logout=${log + 111, 117, 116, 125, 32, 47, 62, 10, 60, 100, 105, 118, // out} />.
. .
<${He + 114, 111, 125, 32, 47, 62, 60, 47, 100, 105, 118, 62, // ro} />
+ 10, 32, 32, 32, 32, 60, 100, 105, 118, 32, 99, 108, // .
<${Chart 125, 32, 47, 62, 60, 47, 100, 105, 118, 62, 10, 32, // } />
. - 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, 36, //
. <$ - 123, 70, 111, 111, 116, 101, 114, 125, 32, 47, 62, 10, // {Footer} />. - 60, 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, 10, //
`;.};. - 10, 119, 105, 110, 100, 111, 119, 46, 111, 110, 108, 111, // .window.onlo - 97, 100, 32, 61, 32, 40, 41, 32, 61, 62, 32, 114, // ad = () => r - 101, 110, 100, 101, 114, 40, 104, 40, 65, 112, 112, 41, // ender(h(App) - 44, 32, 100, 111, 99, 117, 109, 101, 110, 116, 46, 98, // , document.b - 111, 100, 121, 41, 59, 10, 0 // ody);. + 32, 32, 32, 60, 100, 105, 118, 32, 99, 108, 97, 115, //
${user == + 39, 97, 100, 109, 105, 110, 39, 32, 38, 38, 32, 104, // 'admin' && h + 40, 67, 111, 110, 102, 105, 103, 117, 114, 97, 116, 105, // (Configurati + 111, 110, 41, 125, 60, 47, 100, 105, 118, 62, 10, 32, // on)}
. + 32, 32, 32, 60, 100, 105, 118, 32, 99, 108, 97, 115, //
<${Message + 115, 125, 32, 47, 62, 60, 47, 100, 105, 118, 62, 10, // s} />
. + 32, 32, 60, 47, 100, 105, 118, 62, 10, 32, 32, 60, //
. < + 36, 123, 70, 111, 111, 116, 101, 114, 125, 32, 47, 62, // ${Footer} /> + 10, 60, 47, 100, 105, 118, 62, 96, 59, 10, 125, 59, // .
`;.}; + 10, 10, 119, 105, 110, 100, 111, 119, 46, 111, 110, 108, // ..window.onl + 111, 97, 100, 32, 61, 32, 40, 41, 32, 61, 62, 32, // oad = () => + 114, 101, 110, 100, 101, 114, 40, 104, 40, 65, 112, 112, // render(h(App + 41, 44, 32, 100, 111, 99, 117, 109, 101, 110, 116, 46, // ), document. + 98, 111, 100, 121, 41, 59, 10, 0 // body);. }; static const unsigned char v3[] = { 118, 97, 114, 32, 101, 44, 110, 44, 95, 44, 116, 44, // var e,n,_,t, @@ -2379,62 +2379,65 @@ static const unsigned char v4[] = { 109, 59, 32, 102, 111, 110, 116, 45, 115, 105, 122, 101, // m; font-size 58, 32, 57, 48, 37, 59, 32, 109, 97, 114, 103, 105, // : 90%; margi 110, 58, 32, 49, 101, 109, 32, 48, 59, 32, 125, 10, // n: 1em 0; }. - 46, 114, 111, 119, 32, 123, 32, 100, 105, 115, 112, 108, // .row { displ - 97, 121, 58, 32, 102, 108, 101, 120, 59, 32, 102, 108, // ay: flex; fl - 101, 120, 45, 119, 114, 97, 112, 58, 32, 119, 114, 97, // ex-wrap: wra - 112, 59, 32, 125, 10, 46, 99, 111, 108, 32, 123, 32, // p; }..col { - 109, 97, 114, 103, 105, 110, 58, 32, 48, 59, 32, 112, // margin: 0; p - 97, 100, 100, 105, 110, 103, 58, 32, 48, 59, 32, 111, // adding: 0; o - 118, 101, 114, 102, 108, 111, 119, 58, 32, 97, 117, 116, // verflow: aut - 111, 59, 32, 125, 10, 46, 99, 111, 108, 45, 49, 50, // o; }..col-12 - 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, 48, // { width: 10 - 48, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, 49, // 0%; }..col-1 - 49, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 57, // 1 { width: 9 - 49, 46, 54, 54, 37, 59, 32, 125, 10, 46, 99, 111, // 1.66%; }..co - 108, 45, 49, 48, 32, 123, 32, 119, 105, 100, 116, 104, // l-10 { width - 58, 32, 56, 51, 46, 51, 51, 37, 59, 32, 125, 10, // : 83.33%; }. - 46, 99, 111, 108, 45, 57, 32, 123, 32, 119, 105, 100, // .col-9 { wid - 116, 104, 58, 32, 55, 53, 37, 59, 32, 125, 10, 46, // th: 75%; }.. - 99, 111, 108, 45, 56, 32, 123, 32, 119, 105, 100, 116, // col-8 { widt - 104, 58, 32, 54, 54, 46, 54, 54, 37, 59, 32, 125, // h: 66.66%; } - 10, 46, 99, 111, 108, 45, 55, 32, 123, 32, 119, 105, // ..col-7 { wi - 100, 116, 104, 58, 32, 53, 56, 46, 51, 51, 37, 59, // dth: 58.33%; - 32, 125, 10, 46, 99, 111, 108, 45, 54, 32, 123, 32, // }..col-6 { - 119, 105, 100, 116, 104, 58, 32, 53, 48, 37, 59, 32, // width: 50%; - 125, 10, 46, 99, 111, 108, 45, 53, 32, 123, 32, 119, // }..col-5 { w - 105, 100, 116, 104, 58, 32, 52, 49, 46, 54, 54, 37, // idth: 41.66% - 59, 32, 125, 10, 46, 99, 111, 108, 45, 52, 32, 123, // ; }..col-4 { - 32, 119, 105, 100, 116, 104, 58, 32, 51, 51, 46, 51, // width: 33.3 - 51, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, 51, // 3%; }..col-3 - 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 50, 53, // { width: 25 - 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, 50, 32, // %; }..col-2 - 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, 54, 46, // { width: 16. - 54, 54, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, // 66%; }..col- - 49, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 56, // 1 { width: 8 - 46, 51, 51, 37, 59, 32, 125, 10, 10, 46, 116, 111, // .33%; }...to - 112, 105, 99, 32, 123, 32, 98, 97, 99, 107, 103, 114, // pic { backgr - 111, 117, 110, 100, 58, 32, 35, 102, 101, 97, 59, 32, // ound: #fea; - 112, 97, 100, 100, 105, 110, 103, 58, 32, 48, 46, 50, // padding: 0.2 - 101, 109, 32, 49, 101, 109, 59, 32, 98, 111, 114, 100, // em 1em; bord - 101, 114, 45, 114, 97, 100, 105, 117, 115, 58, 32, 48, // er-radius: 0 - 46, 52, 101, 109, 59, 32, 125, 10, 46, 100, 97, 116, // .4em; }..dat - 97, 32, 123, 32, 98, 97, 99, 107, 103, 114, 111, 117, // a { backgrou - 110, 100, 58, 32, 35, 97, 101, 102, 59, 32, 112, 97, // nd: #aef; pa - 100, 100, 105, 110, 103, 58, 32, 48, 46, 50, 101, 109, // dding: 0.2em - 32, 49, 101, 109, 59, 32, 98, 111, 114, 100, 101, 114, // 1em; border - 45, 114, 97, 100, 105, 117, 115, 58, 32, 48, 46, 52, // -radius: 0.4 - 101, 109, 59, 32, 125, 10, 10, 64, 109, 101, 100, 105, // em; }..@medi - 97, 32, 40, 109, 105, 110, 45, 119, 105, 100, 116, 104, // a (min-width - 58, 32, 49, 51, 49, 48, 112, 120, 41, 32, 123, 32, // : 1310px) { - 46, 99, 111, 110, 116, 97, 105, 110, 101, 114, 32, 123, // .container { - 32, 109, 97, 114, 103, 105, 110, 58, 32, 97, 117, 116, // margin: aut - 111, 59, 32, 119, 105, 100, 116, 104, 58, 32, 49, 50, // o; width: 12 - 55, 48, 112, 120, 59, 32, 125, 32, 125, 10, 64, 109, // 70px; } }.@m - 101, 100, 105, 97, 32, 40, 109, 97, 120, 45, 119, 105, // edia (max-wi - 100, 116, 104, 58, 32, 57, 50, 48, 112, 120, 41, 32, // dth: 920px) - 123, 32, 46, 114, 111, 119, 32, 46, 99, 111, 108, 32, // { .row .col - 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, 48, 48, // { width: 100 - 37, 59, 32, 125, 32, 125, 10, 0 // %; } }. + 46, 115, 101, 99, 116, 105, 111, 110, 32, 123, 32, 109, // .section { m + 97, 114, 103, 105, 110, 58, 32, 48, 32, 49, 101, 109, // argin: 0 1em + 59, 32, 125, 10, 46, 116, 111, 112, 105, 99, 32, 123, // ; }..topic { + 32, 98, 97, 99, 107, 103, 114, 111, 117, 110, 100, 58, // background: + 32, 35, 102, 101, 97, 59, 32, 112, 97, 100, 100, 105, // #fea; paddi + 110, 103, 58, 32, 48, 46, 50, 101, 109, 32, 49, 101, // ng: 0.2em 1e + 109, 59, 32, 98, 111, 114, 100, 101, 114, 45, 114, 97, // m; border-ra + 100, 105, 117, 115, 58, 32, 48, 46, 52, 101, 109, 59, // dius: 0.4em; + 32, 125, 10, 46, 100, 97, 116, 97, 32, 123, 32, 98, // }..data { b + 97, 99, 107, 103, 114, 111, 117, 110, 100, 58, 32, 35, // ackground: # + 97, 101, 102, 59, 32, 112, 97, 100, 100, 105, 110, 103, // aef; padding + 58, 32, 48, 46, 50, 101, 109, 32, 49, 101, 109, 59, // : 0.2em 1em; + 32, 98, 111, 114, 100, 101, 114, 45, 114, 97, 100, 105, // border-radi + 117, 115, 58, 32, 48, 46, 52, 101, 109, 59, 32, 125, // us: 0.4em; } + 10, 10, 47, 42, 32, 71, 114, 105, 100, 32, 42, 47, // ../* Grid */ + 10, 46, 114, 111, 119, 32, 123, 32, 100, 105, 115, 112, // ..row { disp + 108, 97, 121, 58, 32, 102, 108, 101, 120, 59, 32, 102, // lay: flex; f + 108, 101, 120, 45, 119, 114, 97, 112, 58, 32, 119, 114, // lex-wrap: wr + 97, 112, 59, 32, 125, 10, 46, 99, 111, 108, 32, 123, // ap; }..col { + 32, 109, 97, 114, 103, 105, 110, 58, 32, 48, 59, 32, // margin: 0; + 112, 97, 100, 100, 105, 110, 103, 58, 32, 48, 59, 32, // padding: 0; + 111, 118, 101, 114, 102, 108, 111, 119, 58, 32, 97, 117, // overflow: au + 116, 111, 59, 32, 125, 10, 46, 99, 111, 108, 45, 49, // to; }..col-1 + 50, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, // 2 { width: 1 + 48, 48, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, // 00%; }..col- + 49, 49, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, // 11 { width: + 57, 49, 46, 54, 54, 37, 59, 32, 125, 10, 46, 99, // 91.66%; }..c + 111, 108, 45, 49, 48, 32, 123, 32, 119, 105, 100, 116, // ol-10 { widt + 104, 58, 32, 56, 51, 46, 51, 51, 37, 59, 32, 125, // h: 83.33%; } + 10, 46, 99, 111, 108, 45, 57, 32, 123, 32, 119, 105, // ..col-9 { wi + 100, 116, 104, 58, 32, 55, 53, 37, 59, 32, 125, 10, // dth: 75%; }. + 46, 99, 111, 108, 45, 56, 32, 123, 32, 119, 105, 100, // .col-8 { wid + 116, 104, 58, 32, 54, 54, 46, 54, 54, 37, 59, 32, // th: 66.66%; + 125, 10, 46, 99, 111, 108, 45, 55, 32, 123, 32, 119, // }..col-7 { w + 105, 100, 116, 104, 58, 32, 53, 56, 46, 51, 51, 37, // idth: 58.33% + 59, 32, 125, 10, 46, 99, 111, 108, 45, 54, 32, 123, // ; }..col-6 { + 32, 119, 105, 100, 116, 104, 58, 32, 53, 48, 37, 59, // width: 50%; + 32, 125, 10, 46, 99, 111, 108, 45, 53, 32, 123, 32, // }..col-5 { + 119, 105, 100, 116, 104, 58, 32, 52, 49, 46, 54, 54, // width: 41.66 + 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, 52, 32, // %; }..col-4 + 123, 32, 119, 105, 100, 116, 104, 58, 32, 51, 51, 46, // { width: 33. + 51, 51, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, // 33%; }..col- + 51, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 50, // 3 { width: 2 + 53, 37, 59, 32, 125, 10, 46, 99, 111, 108, 45, 50, // 5%; }..col-2 + 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, 54, // { width: 16 + 46, 54, 54, 37, 59, 32, 125, 10, 46, 99, 111, 108, // .66%; }..col + 45, 49, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, // -1 { width: + 56, 46, 51, 51, 37, 59, 32, 125, 10, 64, 109, 101, // 8.33%; }.@me + 100, 105, 97, 32, 40, 109, 105, 110, 45, 119, 105, 100, // dia (min-wid + 116, 104, 58, 32, 49, 51, 49, 48, 112, 120, 41, 32, // th: 1310px) + 123, 32, 46, 99, 111, 110, 116, 97, 105, 110, 101, 114, // { .container + 32, 123, 32, 109, 97, 114, 103, 105, 110, 58, 32, 97, // { margin: a + 117, 116, 111, 59, 32, 119, 105, 100, 116, 104, 58, 32, // uto; width: + 49, 50, 55, 48, 112, 120, 59, 32, 125, 32, 125, 10, // 1270px; } }. + 64, 109, 101, 100, 105, 97, 32, 40, 109, 97, 120, 45, // @media (max- + 119, 105, 100, 116, 104, 58, 32, 57, 50, 48, 112, 120, // width: 920px + 41, 32, 123, 32, 46, 114, 111, 119, 32, 46, 99, 111, // ) { .row .co + 108, 32, 123, 32, 119, 105, 100, 116, 104, 58, 32, 49, // l { width: 1 + 48, 48, 37, 59, 32, 125, 32, 125, 10, 0 // 00%; } }. }; static const unsigned char v5[] = { 137, 80, 78, 71, 13, 10, 26, 10, 0, 0, 0, 13, // .PNG........ @@ -2767,10 +2770,10 @@ static const struct packed_file { size_t size; time_t mtime; } packed_files[] = { - {"/web_root/index.html", v1, sizeof(v1), 1654357482}, - {"/web_root/main.js", v2, sizeof(v2), 1654437405}, + {"/web_root/index.html", v1, sizeof(v1), 1654437619}, + {"/web_root/main.js", v2, sizeof(v2), 1654445508}, {"/web_root/preact.min.js", v3, sizeof(v3), 1652374364}, - {"/web_root/style.css", v4, sizeof(v4), 1654436558}, + {"/web_root/style.css", v4, sizeof(v4), 1654445635}, {"/web_root/user.png", v5, sizeof(v5), 1626172939}, {NULL, NULL, 0, 0} }; diff --git a/examples/device-dashboard/web_root/main.js b/examples/device-dashboard/web_root/main.js index c1f2deb7..7828fd79 100644 --- a/examples/device-dashboard/web_root/main.js +++ b/examples/device-dashboard/web_root/main.js @@ -44,6 +44,7 @@ const Footer = props => html` const Hero = props => html` +

Interactive Device Dashboard

@@ -67,7 +68,7 @@ const Hero = props => html` are sent over Websocket at URI curl localhost:8000/api/watch as JSON strings {"name": "..", "data": ...}

- +
`; const Login = function(props) { @@ -130,7 +131,7 @@ const Configuration = function(props) { const updatesub = ev => update('sub', sub); return html` -
+

Device Configuration

@@ -194,7 +195,7 @@ const Messages = function(props) { }).then(r => setTxt('')); return html` -
+

MQTT messages

MQTT server status: ${cfg.connected ? 'connected' : 'diconnected'} @@ -298,7 +299,7 @@ const Chart = function(props) { let xmax = 0, missing = MaxMetricsDataPoints - data.length; if (missing > 0) xmax = Math.round(Date.now() / 1000) + missing; return html` -
+

Data Chart

<${SVG} height=240 width=600 ymin=0 ymax=20 xmax=${xmax} data=${data} /> diff --git a/examples/device-dashboard/web_root/style.css b/examples/device-dashboard/web_root/style.css index 215ddf50..9725a089 100644 --- a/examples/device-dashboard/web_root/style.css +++ b/examples/device-dashboard/web_root/style.css @@ -18,6 +18,11 @@ a, a:visited, a:active { color: #55f; } .rounded { border-radius: 0.5em; } .nowrap { white-space: nowrap; } .msg { background: #def; border-left: 5px solid #59d; padding: 0.5em; font-size: 90%; margin: 1em 0; } +.section { margin: 0 1em; } +.topic { background: #fea; padding: 0.2em 1em; border-radius: 0.4em; } +.data { background: #aef; padding: 0.2em 1em; border-radius: 0.4em; } + +/* Grid */ .row { display: flex; flex-wrap: wrap; } .col { margin: 0; padding: 0; overflow: auto; } .col-12 { width: 100%; } @@ -32,9 +37,5 @@ a, a:visited, a:active { color: #55f; } .col-3 { width: 25%; } .col-2 { width: 16.66%; } .col-1 { width: 8.33%; } - -.topic { background: #fea; padding: 0.2em 1em; border-radius: 0.4em; } -.data { background: #aef; padding: 0.2em 1em; border-radius: 0.4em; } - @media (min-width: 1310px) { .container { margin: auto; width: 1270px; } } @media (max-width: 920px) { .row .col { width: 100%; } }