Merge pull request #2 from lucaspalomodevelop/1-socketio-api-for-dashboard

add socket.io status updateing

dashboard/package.json

@@ -14,6 +14,7 @@
     "react-router-dom": "^6.2.2",
     "react-scripts": "5.0.0",
     "react-syntax-highlighter": "^15.4.5",
+    "socket.io-client": "^4.5.1",
     "web-vitals": "^2.1.4"
   },
   "scripts": {

dashboard/src/Dashboard/JssteStatus/index.js

@@ -3,33 +3,40 @@ import axiosInstance from "../../lib/axiosInstance";
 import { Card, Alert } from "react-bootstrap";
 import "bootstrap/dist/css/bootstrap.min.css";
 import statusConverter from "../../lib/statusConverter";
+import socketIOClient from "socket.io-client";
 // import "./Dashboard.css";
 
 function JssteStatus() {
+  const [JSSTEstatus, setJSSTEStatus] = useState([]);
+
   useEffect(() => {
     getStatus();
   }, []);
 
-  const [JSSTEstatus, setJSSTEStatus] = useState([]);
+  useEffect(() => {
+    const socket = socketIOClient();
+    socket.on("jssteState", (data) => {
+      setJSSTEStatus(data);
+    });
+  }, []);
 
   const getStatus = async () => {
     const response = await axiosInstance.get("/jsste/status");
     setJSSTEStatus(response.data);
   };
 
-  
-
   return (
     <Card>
       <Card.Body>
         <Card.Title>JSSTE Status</Card.Title>
         <Alert variant={statusConverter(JSSTEstatus).BootstrapClass}>
           Status: {JSSTEstatus.status}
-          <br></br>
-          {statusConverter(JSSTEstatus).msg}
+          {/* <br></br>
+          {statusConverter(JSSTEstatus).msg} */}
         </Alert>
         <Alert variant={statusConverter(JSSTEstatus).BootstrapClass}>
-          Message: {JSSTEstatus.statusMSG}
+          {/* Message: {JSSTEstatus.statusMSG} */}
+          {statusConverter(JSSTEstatus).msg}
         </Alert>
       </Card.Body>
     </Card>

dashboard/src/Dashboard/websrvStatus/index.js

@@ -3,14 +3,22 @@ import axiosInstance from "../../lib/axiosInstance";
 import { Card, Alert } from "react-bootstrap";
 import "bootstrap/dist/css/bootstrap.min.css";
 import statusConverter from "../../lib/statusConverter";
+import socketIOClient from "socket.io-client";
 // import "./Dashboard.css";
 
 function WebsrvStatus() {
+  const [websrvStatus, setwebsrvStatus] = useState([]);
+
   useEffect(() => {
     getStatus();
   }, []);
 
-  const [websrvStatus, setwebsrvStatus] = useState([]);
+  useEffect(() => {
+    const socket = socketIOClient();
+    socket.on("websrvState", (data) => {
+      setwebsrvStatus(data);
+    });
+  }, []);
 
   const getStatus = async () => {
     const response = await axiosInstance.get("/websrv/status");
@@ -26,7 +34,9 @@ function WebsrvStatus() {
           <br></br>
           {statusConverter(websrvStatus).msg}
         </Alert>
-        <Alert variant={statusConverter(websrvStatus).BootstrapClass}>Port: {websrvStatus.port}</Alert>
+        <Alert variant={statusConverter(websrvStatus).BootstrapClass}>
+          Port: {websrvStatus.port}
+        </Alert>
       </Card.Body>
     </Card>
   );

dashboard/src/lib/statusConverter.js

@@ -7,19 +7,19 @@ function StatusConverter(status) {
     result.msg = "OK";
     result.BootstrapClass = "success";
   } else if (status.status === 1) {
-    result.msg = "ERROR :: " + status.statusMSG;
+    result.msg = "ERROR: " + status.statusMSG;
     result.BootstrapClass = "danger";
   } else if (status.status === 2) {
-    result.msg = "WARNING :: " + status.statusMSG;
+    result.msg = "WARNING: " + status.statusMSG;
     result.BootstrapClass = "warning";
   } else if (status.status === 3) {
-    result.msg = "INFO :: " + status.statusMSG;
+    result.msg = "INFO: " + status.statusMSG;
     result.BootstrapClass = "info";
   } else if (status.status === 4) {
-    result.msg = "DEBUG :: " + status.statusMSG;
+    result.msg = "DEBUG: " + status.statusMSG;
     result.BootstrapClass = "secondary";
   } else {
-    result.msg = "UNKNOWN -> " + status.status;
+    result.msg = "UNKNOWN: " + status.status;
     result.BootstrapClass = "secondary";
   }
   return result;

package.json

@@ -8,8 +8,8 @@
     "start": "node ./src/index.js",
     "build": "cd ./dashboard && npm run build ",
     "install-full": "npm install && cd ./dashboard && npm install",
-    "setup":"npm run install-full && npm run build && npm run start",
-    "dev":"npm run build && npm run start"
+    "setup": "npm run install-full && npm run build && npm run start",
+    "dev": "npm run build && npm run start"
   },
   "dependencies": {
     "body-parser": "^1.19.2",
@@ -18,7 +18,8 @@
     "cron": "^1.8.2",
     "express": "^4.17.3",
     "moment": "^2.29.1",
-    "open": "^8.4.0"
+    "open": "^8.4.0",
+    "socket.io": "^4.5.1"
   },
   "devDependencies": {
     "chai": "^4.3.6",

src/helper/cronjobs.js

@@ -1,4 +1,4 @@
-var CronJob = require("cron").CronJob;
+let CronJob = require("cron").CronJob;
 let jobs = {};
 let jobsArray = [];
 

src/helper/socket.js

@@ -0,0 +1,17 @@
+let socket = undefined;
+
+function init(server) {
+  const { Server } = require("socket.io");
+  socket = new Server(server);
+
+  return socket;
+}
+
+function emitIfInit(event, ...args) {
+  if (socket != undefined) {
+    console.log("Emit " + event);
+    socket.emit(event, ...args);
+  }
+}
+
+module.exports = { socket, init, emitIfInit };

src/helper/states.js

@@ -1,3 +1,6 @@
+const { set } = require("express/lib/response");
+let { socket, emitIfInit } = require("../helper/socket");
+
 let JssteState = {
   statusMSG: "could not started JSSTE",
   status: 1,
@@ -5,7 +8,19 @@ let JssteState = {
 };
 let WebsrvState = { port: undefined, status: undefined };
 
+const io = require("../helper/socket").socket;
+
+function WebserverState() {
+  emitIfInit("websrvState", WebsrvState);
+  return WebsrvState;
+}
+
+function JSSTEState() {
+  emitIfInit("jssteState", JssteState);
+  return JssteState;
+}
+
 module.exports = {
-  JssteState,
-  WebsrvState,
+  WebserverState,
+  JSSTEState,
 };

src/index.js

@@ -13,9 +13,9 @@ let os = require("os");
  */
 websrv.slisten((host, port) => {
   console.log("Server started on http://" + host + ":" + port);
-  websrv.dashboardExist(()=>{
- //   open("http://" + host + ":" + port + "/dashboard");
-  })
+  websrv.dashboardExist(() => {
+    open("http://" + host + ":" + port + "/dashboard");
+  });
 });
 
 /**

src/jsste/index.js

@@ -1,14 +1,14 @@
 let conf = require("../helper/conf")();
-let { JssteState } = require("../helper/states");
+let State = require("../helper/states");
 const fs = require("fs");
 app = {};
 app.instance = {};
 app.static = function (constante, cb, instance = app.instance) {};
 app.specialvars = function (variable_regex, cb, instance = app.instance) {};
 
-JssteState.status = 2;
-JssteState.statusMSG = "JSSTE is only loaded";
-JssteState.pageStatus.push({
+State.JSSTEState().status = 2;
+State.JSSTEState().statusMSG = "JSSTE is only loaded";
+State.JSSTEState().pageStatus.push({
   page: "this",
   msg: "JSSTE is only loaded",
   status: 2,
@@ -20,11 +20,11 @@ JssteState.pageStatus.push({
  * @param {*} templatecode
  */
 app.render = function (pagecode, templatecode) {
-  JssteState.status = 0;
+  State.JSSTEState().status = 0;
   if (pagecode == undefined || pagecode == null) {
     console.log("pagecode is undefined or null");
-    JssteState.status = 1;
-    JssteState.statusMSG = "pagecode is undefined or null";
+    State.JSSTEState().status = 1;
+    State.JSSTEState().statusMSG = "pagecode is undefined or null";
   }
   if (typeof pagecode == "string") {
     pagecode = JSON.parse(pagecode);
@@ -32,8 +32,8 @@ app.render = function (pagecode, templatecode) {
 
   if (templatecode == undefined || templatecode == null) {
     templatecode = fs.readFileSync(pagecode["_template_"]);
-    JssteState.status = 3;
-    JssteState.statusMSG = "templatecode is undefined or null";
+    State.JSSTEState().status = 3;
+    State.JSSTEState().statusMSG = "templatecode is undefined or null";
   }
 
   templatecode = templatecode.replaceAll("<[VAR]>", "Hallo");

src/websrv/index.js

@@ -1,16 +1,18 @@
 const res = require("express/lib/response");
-const { JssteState } = require("../helper/states");
 
 module.exports = function (conf) {
   const websrvConfig = conf.webserver;
   const express = require("express");
   const app = express();
+  const http = require("http");
+  const server = http.createServer(app);
+  const io = require("../helper/socket").init(server);
   const bodyParser = require("body-parser");
   const cookieParser = require("cookie-parser");
   const cors = require("cors");
   const fs = require("fs");
   const path = require("path");
-  let State = require("../helper/states").WebsrvState;
+  let State = require("../helper/states");
   let jsste = require("../jsste");
 
   const internalRouter = require("./routes/internalRouter");
@@ -61,7 +63,7 @@ module.exports = function (conf) {
     jsste: "pages",
     css: "styles",
   };
-  
+
   function getFolderFromFileEnding(filename) {
     let regex_isAnDotfile = /\w+\.[a-z]*[A-Z]*/;
     if (regex_isAnDotfile.test(filename)) {
@@ -71,7 +73,6 @@ module.exports = function (conf) {
     }
     return "" + folders.jsste;
   }
-  
 
   function defaultUse(req, res, next) {
     let regex_isAnDotfile = /\w+\.[a-z]*[A-Z]*/;
@@ -96,16 +97,16 @@ module.exports = function (conf) {
   app.get("/*", defaultUse);
 
   app.slisten = function (cb) {
-    app.ServerInstance = app
+    app.ServerInstance = server
       .listen(websrvConfig.port, websrvConfig.host, () => {
-        State.status = 0;
-        State.statusMSG = "webserver is running";
-        State.port = websrvConfig.port;
+        State.WebserverState().status = 0;
+        State.WebserverState().statusMSG = "webserver is running";
+        State.WebserverState().port = websrvConfig.port;
         cb(websrvConfig.host, websrvConfig.port);
       })
       .on("error", (err) => {
-        State.status = 1;
-        State.statusMSG = "webserver could not started";
+        State.WebserverState().status = 1;
+        State.WebserverState().statusMSG = "webserver could not started";
         console.error(err);
       });
   };

src/websrv/routes/internalRouter.js

@@ -10,13 +10,13 @@ router.get("/conf", (req, res) => {
 });
 
 router.get("/jsste/status/obj/:obj", (req, res) => {
-  res.json(States.JssteState[req.params.obj]);
+  res.json(States.JSSTEState()[req.params.obj]);
 });
 router.get("/jsste/status", (req, res) => {
-  res.json(States.JssteState);
+  res.json(States.JSSTEState());
 });
 router.get("/websrv/status", (req, res) => {
-  res.json(States.WebsrvState);
+  res.json(States.WebserverState());
 });
 
 router.get("/logs/length/:leng", (req, res) => {

yarn.lock

@@ -2,12 +2,32 @@
 # yarn lockfile v1
 
 
+"@types/component-emitter@^1.2.10":
+  "integrity" "sha512-SRXjM+tfsSlA9VuG8hGO2nft2p8zjXCK1VcC6N4NXbBbYbSia9kzCChYQajIjzIqOOOuh5Ock6MmV2oux4jDZQ=="
+  "resolved" "https://registry.npmjs.org/@types/component-emitter/-/component-emitter-1.2.11.tgz"
+  "version" "1.2.11"
+
+"@types/cookie@^0.4.1":
+  "integrity" "sha512-XW/Aa8APYr6jSVVA1y/DEIZX0/GMKLEVekNG727R8cs56ahETkRAy/3DR7+fJyh7oUgGwNQaRfXCun0+KbWY7Q=="
+  "resolved" "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz"
+  "version" "0.4.1"
+
+"@types/cors@^2.8.12":
+  "integrity" "sha512-vt+kDhq/M2ayberEtJcIN/hxXy1Pk+59g2FV/ZQceeaTyCtCucjL2Q7FXlFjtWn4n15KCr1NE2lNNFhp0lEThw=="
+  "resolved" "https://registry.npmjs.org/@types/cors/-/cors-2.8.12.tgz"
+  "version" "2.8.12"
+
+"@types/node@>=10.0.0":
+  "integrity" "sha512-6bbDaETVi8oyIARulOE9qF1/Qdi/23z6emrUh0fNJRUmjznqrixD4MpGDdgOFk5Xb0m2H6Xu42JGdvAxaJR/wA=="
+  "resolved" "https://registry.npmjs.org/@types/node/-/node-18.7.14.tgz"
+  "version" "18.7.14"
+
 "@ungap/promise-all-settled@1.1.2":
   "integrity" "sha512-sL/cEvJWAnClXw0wHk85/2L0G6Sj8UB0Ctc1TEMbKSsmpRosqhwj9gWgFRZSrBr2f9tiXISwNhCPmlfqUqyb9Q=="
   "resolved" "https://registry.npmjs.org/@ungap/promise-all-settled/-/promise-all-settled-1.1.2.tgz"
   "version" "1.1.2"
 
-"accepts@~1.3.8":
+"accepts@~1.3.4", "accepts@~1.3.8":
   "integrity" "sha512-PYAthTa2m2VKxuvSD3DPC/Gy+U+sOA1LAuT8mkmRuvw+NACSaeXEQ+NHcVF7rONl6qcaxV3Uuemwawk+7+SJLw=="
   "resolved" "https://registry.npmjs.org/accepts/-/accepts-1.3.8.tgz"
   "version" "1.3.8"
@@ -60,6 +80,11 @@
   "resolved" "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz"
   "version" "1.0.2"
 
+"base64id@~2.0.0", "base64id@2.0.0":
+  "integrity" "sha512-lGe34o6EHj9y3Kts9R4ZYs/Gr+6N7MCaMlIFA3F1R2O5/m7K06AxfSeO5530PEERE6/WyEg3lsuyw4GHlPZHog=="
+  "resolved" "https://registry.npmjs.org/base64id/-/base64id-2.0.0.tgz"
+  "version" "2.0.0"
+
 "binary-extensions@^2.0.0":
   "integrity" "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA=="
   "resolved" "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz"
@@ -173,6 +198,11 @@
   "resolved" "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz"
   "version" "1.1.4"
 
+"component-emitter@~1.3.0":
+  "integrity" "sha512-Rd3se6QB+sO1TwqZjscQrurpEPIfO0/yYnSin6Q/rD3mOutHvUrCAhJub3r90uNb+SESBuE0QYoB90YdfatsRg=="
+  "resolved" "https://registry.npmjs.org/component-emitter/-/component-emitter-1.3.0.tgz"
+  "version" "1.3.0"
+
 "concat-map@0.0.1":
   "integrity" "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s= sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
   "resolved" "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz"
@@ -203,7 +233,7 @@
   "resolved" "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.0.6.tgz"
   "version" "1.0.6"
 
-"cookie@0.4.1":
+"cookie@~0.4.1", "cookie@0.4.1":
   "integrity" "sha512-ZwrFkGJxUR3EIoXtO+yVE69Eb7KlixbaeAWfBQB9vVsNn/o+Yw69gBWSSDK825hQNdN+wF8zELf3dFNl/kxkUA=="
   "resolved" "https://registry.npmjs.org/cookie/-/cookie-0.4.1.tgz"
   "version" "0.4.1"
@@ -213,7 +243,7 @@
   "resolved" "https://registry.npmjs.org/cookie/-/cookie-0.4.2.tgz"
   "version" "0.4.2"
 
-"cors@^2.8.5":
+"cors@^2.8.5", "cors@~2.8.5":
   "integrity" "sha512-KIHbLJqu73RGr/hnbrO9uBeixNGuvSQjul/jdFvS/KFSIH1hWVd1ng7zOHx+YrEfInLG7q4n6GHQ9cDtxv/P6g=="
   "resolved" "https://registry.npmjs.org/cors/-/cors-2.8.5.tgz"
   "version" "2.8.5"
@@ -228,6 +258,20 @@
   dependencies:
     "moment-timezone" "^0.5.x"
 
+"debug@~4.3.1":
+  "integrity" "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ=="
+  "resolved" "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz"
+  "version" "4.3.4"
+  dependencies:
+    "ms" "2.1.2"
+
+"debug@~4.3.2":
+  "integrity" "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ=="
+  "resolved" "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz"
+  "version" "4.3.4"
+  dependencies:
+    "ms" "2.1.2"
+
 "debug@2.6.9":
   "integrity" "sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA=="
   "resolved" "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz"
@@ -289,6 +333,27 @@
   "resolved" "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz"
   "version" "1.0.2"
 
+"engine.io-parser@~5.0.3":
+  "integrity" "sha512-+nVFp+5z1E3HcToEnO7ZIj3g+3k9389DvWtvJZz0T6/eOCPIyyxehFcedoYrZQrp0LgQbD9pPXhpMBKMd5QURg=="
+  "resolved" "https://registry.npmjs.org/engine.io-parser/-/engine.io-parser-5.0.4.tgz"
+  "version" "5.0.4"
+
+"engine.io@~6.2.0":
+  "integrity" "sha512-4KzwW3F3bk+KlzSOY57fj/Jx6LyRQ1nbcyIadehl+AnXjKT7gDO0ORdRi/84ixvMKTym6ZKuxvbzN62HDDU1Lg=="
+  "resolved" "https://registry.npmjs.org/engine.io/-/engine.io-6.2.0.tgz"
+  "version" "6.2.0"
+  dependencies:
+    "@types/cookie" "^0.4.1"
+    "@types/cors" "^2.8.12"
+    "@types/node" ">=10.0.0"
+    "accepts" "~1.3.4"
+    "base64id" "2.0.0"
+    "cookie" "~0.4.1"
+    "cors" "~2.8.5"
+    "debug" "~4.3.1"
+    "engine.io-parser" "~5.0.3"
+    "ws" "~8.2.3"
+
 "escalade@^3.1.1":
   "integrity" "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw=="
   "resolved" "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz"
@@ -839,6 +904,32 @@
   "resolved" "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz"
   "version" "1.2.0"
 
+"socket.io-adapter@~2.4.0":
+  "integrity" "sha512-W4N+o69rkMEGVuk2D/cvca3uYsvGlMwsySWV447y99gUPghxq42BxqLNMndb+a1mm/5/7NeXVQS7RLa2XyXvYg=="
+  "resolved" "https://registry.npmjs.org/socket.io-adapter/-/socket.io-adapter-2.4.0.tgz"
+  "version" "2.4.0"
+
+"socket.io-parser@~4.0.4":
+  "integrity" "sha512-sNjbT9dX63nqUFIOv95tTVm6elyIU4RvB1m8dOeZt+IgWwcWklFDOdmGcfo3zSiRsnR/3pJkjY5lfoGqEe4Eig=="
+  "resolved" "https://registry.npmjs.org/socket.io-parser/-/socket.io-parser-4.0.5.tgz"
+  "version" "4.0.5"
+  dependencies:
+    "@types/component-emitter" "^1.2.10"
+    "component-emitter" "~1.3.0"
+    "debug" "~4.3.1"
+
+"socket.io@^4.5.1":
+  "integrity" "sha512-0y9pnIso5a9i+lJmsCdtmTTgJFFSvNQKDnPQRz28mGNnxbmqYg2QPtJTLFxhymFZhAIn50eHAKzJeiNaKr+yUQ=="
+  "resolved" "https://registry.npmjs.org/socket.io/-/socket.io-4.5.1.tgz"
+  "version" "4.5.1"
+  dependencies:
+    "accepts" "~1.3.4"
+    "base64id" "~2.0.0"
+    "debug" "~4.3.2"
+    "engine.io" "~6.2.0"
+    "socket.io-adapter" "~2.4.0"
+    "socket.io-parser" "~4.0.4"
+
 "statuses@>= 1.5.0 < 2", "statuses@~1.5.0":
   "integrity" "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow= sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA=="
   "resolved" "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz"
@@ -945,6 +1036,11 @@
   "resolved" "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz"
   "version" "1.0.2"
 
+"ws@~8.2.3":
+  "integrity" "sha512-wBuoj1BDpC6ZQ1B7DWQBYVLphPWkm8i9Y0/3YdHjHKHiohOJ1ws+3OccDWtH+PoC9DZD5WOTrJvNbWvjS6JWaA=="
+  "resolved" "https://registry.npmjs.org/ws/-/ws-8.2.3.tgz"
+  "version" "8.2.3"
+
 "y18n@^5.0.5":
   "integrity" "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA=="
   "resolved" "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz"