Merge pull request #4 from lucaspalomodevelop/dev

Dev - first version
This commit is contained in:
Lucas Manuel Palomo Lauterbach 2022-11-03 19:49:58 +01:00 committed by GitHub
commit b7a712bd47
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
58 changed files with 43446 additions and 1 deletions

11
.gitignore vendored
View File

@ -1,3 +1,14 @@
cache
dashboard/build
.jssteconfig
files/sites
files/templates
files/media
planung
# Logs
logs
*.log

12
.jssteconfig_basic Normal file
View File

@ -0,0 +1,12 @@
{
"webserver":{
"port":8081,
"host":"127.0.0.1",
"caching":false
},
"jsste":{
"paths":{
"files":"./files"
}
}
}

View File

@ -1 +1,3 @@
# JSSTE_APP
# JSSTE_APP
The full application from the [JSSTE](https://github.com/lucaspalomodevelop/JSSTE) project.

View File

@ -0,0 +1,2 @@
REACT_APP_BASENAME=/
REACT_APP_APIURL=http://localhost:5000/api

View File

@ -0,0 +1,3 @@
PUBLIC_URL=/dashboard
REACT_APP_BASENAME=/dashboard
REACT_APP_APIURL=/api

70
dashboard/README.md Normal file
View File

@ -0,0 +1,70 @@
# Getting Started with Create React App
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
The page will reload when you make changes.\
You may also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can't go back!**
If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
### Code Splitting
This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
### Analyzing the Bundle Size
This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
### Making a Progressive Web App
This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
### Advanced Configuration
This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
### Deployment
This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
### `npm run build` fails to minify
This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)

28493
dashboard/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

44
dashboard/package.json Normal file
View File

@ -0,0 +1,44 @@
{
"name": "jsstedashboard",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.2",
"@testing-library/react": "^12.1.4",
"@testing-library/user-event": "^13.5.0",
"axios": "^0.26.1",
"bootstrap": "^5.1.3",
"react": "^17.0.2",
"react-bootstrap": "^2.2.0",
"react-dom": "^17.0.2",
"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": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

View File

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>JSSTE - Dashboard</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.4 KiB

View File

@ -0,0 +1,25 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

View File

@ -0,0 +1,3 @@
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:

View File

@ -0,0 +1,3 @@
#Container{
background-color: rgba(red, green, blue, 0,1);
}

View File

@ -0,0 +1,8 @@
import { render, screen } from '@testing-library/react';
import App from '.';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
expect(linkElement).toBeInTheDocument();
});

View File

@ -0,0 +1,28 @@
import { Container, Row, Col, Nav } from "react-bootstrap";
import { Link, BrowserRouter, Layout } from "react-router-dom";
import Routes from "./routes";
import Navbar from "./navbar";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";
import Dashboard from "../Dashboard";
import Log from "../Log";
import Settings from "../Settings";
function App() {
return (
<BrowserRouter basename={process.env.REACT_APP_BASENAME}>
<Container id="Container" className="p-3 " fluid="md">
<Navbar />
<Row>
<Col>
<div className="App p-1">
<Routes />
</div>
</Col>
</Row>
</Container>
</BrowserRouter>
);
}
export default App;

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

View File

@ -0,0 +1,30 @@
import { Container, Navbar as BNavbar, Nav } from "react-bootstrap";
import { Link } from "react-router-dom";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";
function Navbar() {
return (
<BNavbar className="mb-4" bg="light" variant="light">
<Container>
<BNavbar.Brand as={Link} to="/">
JSSTE-Dashboard
</BNavbar.Brand>
<Nav className="me-auto">
<Nav.Link as={Link} to="/">
Dashboard
</Nav.Link>
<Nav.Link as={Link} to="/log">
Log
</Nav.Link>
{/* <Nav.Link as={Link} to="/settings">
Settings
</Nav.Link> */}
</Nav>
</Container>
</BNavbar>
);
}
export default Navbar;

View File

@ -0,0 +1,19 @@
import { Container, Row, Col, Navbar, Nav } from "react-bootstrap";
import { Routes as RRoutes, Route, Link, BrowserRouter, Layout } from "react-router-dom";
import "bootstrap/dist/css/bootstrap.min.css";
import "./App.css";
import Dashboard from "../Dashboard";
import Log from "../Log";
import Settings from "../Settings";
function Routes() {
return (
<RRoutes>
<Route exact path="/" element={<Dashboard />} />
<Route path="/log" element={<Log />} />
<Route path="/settings" element={<Settings />} />
</RRoutes>
);
}
export default Routes;

View File

View File

@ -0,0 +1,49 @@
import React, { useState, useEffect } from "react";
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();
}, []);
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} */}
</Alert>
<Alert variant={statusConverter(JSSTEstatus).BootstrapClass}>
{/* Message: {JSSTEstatus.statusMSG} */}
{statusConverter(JSSTEstatus).msg}
</Alert>
<Alert variant={statusConverter(JSSTEstatus).BootstrapClass}>
Message: {JSSTEstatus.statusMSG}
</Alert>
</Card.Body>
</Card>
);
}
export default JssteStatus;

View File

@ -0,0 +1,32 @@
import React, { useState, useEffect } from "react";
import axiosInstance from "../../lib/axiosInstance";
import { Card, Alert } from "react-bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
// import "./Dashboard.css";
function AppStatus() {
useEffect(() => {
getStatus();
}, []);
const [appStatus, setappStatus] = useState([]);
const getStatus = async () => {
const response = await axiosInstance.get("/app/status");
setappStatus(response.data);
};
return (
<Card>
<Card.Body>
<Card.Title>App Status</Card.Title>
<Alert>Memory usage: {appStatus.memusage} MB</Alert>
<Alert>Processor usage: {appStatus.procusage} %</Alert>
</Card.Body>
</Card>
);
}
export default AppStatus;

View File

@ -0,0 +1,48 @@
import React, { useState, useEffect } from "react";
import axiosInstance from "../../lib/axiosInstance";
import SyntaxHighlighter from "react-syntax-highlighter";
import { github as CodeStyle } from "react-syntax-highlighter/dist/esm/styles/hljs";
import { Card, Accordion } from "react-bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
import "prismjs/themes/prism.css";
// import "./Dashboard.css";
function ConfigStatus() {
useEffect(() => {
getStatus();
}, []);
const [configStatus, setconfigStatus] = useState({});
const getStatus = async () => {
const response = await axiosInstance.get("/conf");
setconfigStatus(response.data);
};
return (
// <Card>
// <Card.Body>
// <Card.Title>Current Config</Card.Title>
// <Card.Text>
// <SyntaxHighlighter language="json" style={CodeStyle}>
// {JSON.stringify(configStatus, null, 2)}
// </SyntaxHighlighter>
// </Card.Text>
// </Card.Body>
// </Card>
<Accordion>
<Accordion.Item eventKey="0">
<Accordion.Header>
Config ({configStatus.meta ? configStatus.meta.confloadtype : "?"})
</Accordion.Header>
<Accordion.Body>
<SyntaxHighlighter language="log" style={CodeStyle}>
{JSON.stringify(configStatus, null, 2)}
</SyntaxHighlighter>
</Accordion.Body>
</Accordion.Item>
</Accordion>
);
}
export default ConfigStatus;

View File

@ -0,0 +1,21 @@
import { Stack, Card, Alert } from "react-bootstrap";
import "bootstrap/dist/css/bootstrap.min.css";
import "./Dashboard.css";
import JssteStatus from "./JssteStatus";
import WebsrvStatus from "./websrvStatus";
import AppStatus from "./appStatus";
import ConfigStatus from "./configStatus";
import LogStatus from "./logStatus";
function Dashboard() {
return (
<Stack gap={1}>
<JssteStatus></JssteStatus>
<WebsrvStatus></WebsrvStatus>
<ConfigStatus></ConfigStatus>
<LogStatus></LogStatus>
</Stack>
);
}
export default Dashboard;

View File

View File

@ -0,0 +1,55 @@
import React, { useState, useEffect } from "react";
import axiosInstance from "../../lib/axiosInstance";
import { Card, Accordion, Spinner } from "react-bootstrap";
import SyntaxHighlighter from "react-syntax-highlighter";
import { github as CodeStyle } from "react-syntax-highlighter/dist/esm/styles/hljs";
import "bootstrap/dist/css/bootstrap.min.css";
import "prismjs/themes/prism.css";
// import "./Dashboard.css";
function LogStatus() {
useEffect(() => {
getStatus();
}, []);
const [Logstatus, setLogStatus] = useState(null);
const getStatus = async () => {
const response = await axiosInstance.get("/logs/length/" + 32);
setLogStatus(response.data);
};
return (
// <Card>
// <Card.Body>
// <Card.Title>Log</Card.Title>
// <Card.Text>
// <SyntaxHighlighter language="log" style={CodeStyle}>
// {String(Logstatus)}
// </SyntaxHighlighter>
// </Card.Text>
// </Card.Body>
// </Card>
<Accordion>
<Accordion.Item eventKey="0">
<Accordion.Header>Log</Accordion.Header>
<Accordion.Body>
{Logstatus ? (
<SyntaxHighlighter language="log" style={CodeStyle}>
{String(Logstatus)}
</SyntaxHighlighter>
) : (
<Spinner
className="center col-md-5 mx-auto"
animation="border"
variant="dark"
/>
)}
</Accordion.Body>
</Accordion.Item>
</Accordion>
);
}
export default LogStatus;

View File

@ -0,0 +1,45 @@
import React, { useState, useEffect } from "react";
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();
}, []);
useEffect(() => {
const socket = socketIOClient();
socket.on("websrvState", (data) => {
setwebsrvStatus(data);
});
}, []);
const getStatus = async () => {
const response = await axiosInstance.get("/websrv/status");
setwebsrvStatus(response.data);
};
return (
<Card>
<Card.Body>
<Card.Title>Webserver Status</Card.Title>
<Alert variant={statusConverter(websrvStatus).BootstrapClass}>
Status: {websrvStatus.status}
<br></br>
{statusConverter(websrvStatus).msg}
</Alert>
<Alert variant={statusConverter(websrvStatus).BootstrapClass}>
Port: {websrvStatus.port}
</Alert>
</Card.Body>
</Card>
);
}
export default WebsrvStatus;

View File

@ -0,0 +1,43 @@
import { Stack, Card, Alert, Spinner } from "react-bootstrap";
import { useEffect, useState } from "react";
import SyntaxHighlighter from "react-syntax-highlighter";
import { github as CodeStyle } from "react-syntax-highlighter/dist/esm/styles/hljs";
import axiosInstance from "../lib/axiosInstance";
import "bootstrap/dist/css/bootstrap.min.css";
import "prismjs/themes/prism.css";
function Log() {
useEffect(() => {
getStatus();
}, []);
const [Logstatus, setLogStatus] = useState(null);
const getStatus = async () => {
const response = await axiosInstance.get("/logs");
setLogStatus(response.data);
};
return (
<Card>
<Card.Body>
<Card.Title>Log</Card.Title>
<Card.Text>
{Logstatus ? (
<SyntaxHighlighter language="log" style={CodeStyle}>
{String(Logstatus)}
</SyntaxHighlighter>
) : (
<Spinner
className="center col-md-5 mx-auto"
animation="border"
variant="dark"
/>
)}
</Card.Text>
</Card.Body>
</Card>
);
}
export default Log;

View File

@ -0,0 +1,54 @@
import { Form, Button } from "react-bootstrap";
import { useEffect, useState } from "react";
import SyntaxHighlighter from "react-syntax-highlighter";
import { github as CodeStyle } from "react-syntax-highlighter/dist/esm/styles/hljs";
import axiosInstance from "../lib/axiosInstance";
import "bootstrap/dist/css/bootstrap.min.css";
import "prismjs/themes/prism.css";
function Log() {
useEffect(() => {
getStatus();
}, []);
const [configstatus, setConfigStatus] = useState(null);
const getStatus = async () => {
const response = await axiosInstance.get("/conf");
setConfigStatus(response.data);
};
return (
<Form>
<Form.Group className="mb-3" controlId="formBasicEmail">
<Form.Label>Port:</Form.Label>
<Form.Control
type="Number"
min="3000"
max="8000"
placeholder="PORT"
onChange={(e) => {
setConfigStatus({
...configstatus,
webserver: { ...configstatus.webserver, port: e.target.value },
});
}}
value={configstatus ? configstatus.webserver.port : -1}
/>
</Form.Group>
<Form.Group className="mb-3" controlId="formBasicPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Password" />
</Form.Group>
<Form.Group className="mb-3" controlId="formBasicCheckbox">
<Form.Check type="checkbox" label="Check me out" />
</Form.Group>
<Button variant="primary" type="submit">
Submit
</Button>
</Form>
);
}
export default Log;

13
dashboard/src/index.css Normal file
View File

@ -0,0 +1,13 @@
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}

17
dashboard/src/index.js Normal file
View File

@ -0,0 +1,17 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

View File

@ -0,0 +1,19 @@
import axios from "axios";
const instance = axios.create({
baseURL: process.env.REACT_APP_APIURL,
// timeout: 1000,
// headers: { "X-Custom-Header": "foobar" },
});
// const axiosInstance = function () {
// // let conf = await axios.get("/api/conf");
// // return [];
// // if (conf.statuscode === 200) {
// // return axios.create({
// // baseURL: window.location.origin,
// // });
// // }
// };
export default instance;

View File

@ -0,0 +1,28 @@
function StatusConverter(status) {
console.log("StatusConverter: status: ", status);
var result = {};
result.msg = "";
result.BootstrapClass = "";
if (status.status === 0) {
result.msg = "OK";
result.BootstrapClass = "success";
} else if (status.status === 1) {
result.msg = "ERROR: " + status.statusMSG;
result.BootstrapClass = "danger";
} else if (status.status === 2) {
result.msg = "WARNING: " + status.statusMSG;
result.BootstrapClass = "warning";
} else if (status.status === 3) {
result.msg = "INFO: " + status.statusMSG;
result.BootstrapClass = "info";
} else if (status.status === 4) {
result.msg = "DEBUG: " + status.statusMSG;
result.BootstrapClass = "secondary";
} else {
result.msg = "UNKNOWN: " + status.status;
result.BootstrapClass = "secondary";
}
return result;
}
export default StatusConverter;

View File

@ -0,0 +1,13 @@
const reportWebVitals = onPerfEntry => {
if (onPerfEntry && onPerfEntry instanceof Function) {
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
getCLS(onPerfEntry);
getFID(onPerfEntry);
getFCP(onPerfEntry);
getLCP(onPerfEntry);
getTTFB(onPerfEntry);
});
}
};
export default reportWebVitals;

View File

@ -0,0 +1,5 @@
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';

9313
dashboard/yarn.lock Normal file

File diff suppressed because it is too large Load Diff

8
docker-compose.yml Normal file
View File

@ -0,0 +1,8 @@
version: '3'
services:
jsste:
build: .
ports:
- "8080:8081"
volumes:
- .:/app

7
dockerfile Normal file
View File

@ -0,0 +1,7 @@
FROM node:16
COPY . /app
WORKDIR /app
RUN npm run install-full
RUN npm run build
EXPOSE 8081
CMD ["npm", "start"]

0
files/.gitkeep Normal file
View File

3083
package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

29
package.json Normal file
View File

@ -0,0 +1,29 @@
{
"name": "JSSTE_APP",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"test": "mocha ./test/index.js",
"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"
},
"dependencies": {
"body-parser": "^1.19.2",
"cookie-parser": "^1.4.6",
"cors": "^2.8.5",
"cron": "^1.8.2",
"express": "^4.17.3",
"jsste": "^1.2.3",
"moment": "^2.29.1",
"open": "^8.4.0",
"socket.io": "^4.5.1"
},
"devDependencies": {
"chai": "^4.3.6",
"mocha": "^9.2.1"
}
}

84
src/helper/conf.js Normal file
View File

@ -0,0 +1,84 @@
const { time } = require("console");
const { get } = require("express/lib/request");
const res = require("express/lib/response");
let fs = require("fs");
let path = require("path");
let process = require("process");
let instance = null;
/**
*
* @param {*} optPath
* @returns
*/
module.exports = function (optPath) {
let timestemp = Math.round(new Date().getTime() / 1000);
if (instance !== null) {
if (instance.meta.timestemp + 60 >= timestemp) return instance;
}
console.log("creating new config instance");
let cname = ".jssteconfig";
let cpath = path.join(__dirname, "..", "..");
let conf = getCurrentConfig(cpath);
if (conf.jsste.paths.files) {
conf.jsste.paths.files = path.join(cpath, conf.jsste.paths.files);
}
instance = conf;
return conf;
};
function getMeta(el) {
return {
confloadtype: el.name,
timestemp: Math.round(new Date().getTime() / 1000),
workingdir: process.cwd(),
};
}
/**
*
* @param {*} cpath
* @returns
*/
function getCurrentConfig(cpath) {
let result = {};
let confbundle = [
{
name: "cwd",
path: path.join(process.cwd(), ".jssteconfig"),
prio: 4,
},
{
name: "cwd_basic",
path: path.join(process.cwd(), ".jssteconfig_basic"),
prio: 3,
},
{
name: "cpath",
path: path.join(cpath, ".jssteconfig"),
prio: 2,
},
{
name: "cpath_basic",
path: path.join(cpath, ".jssteconfig_basic"),
prio: 1,
},
];
confbundle.sort((a, b) => {
return b.prio - a.prio;
});
for (const [index, el] of confbundle.entries()) {
if (fs.existsSync(el.path)) {
console.log(`found ${el.name}`);
result = JSON.parse(fs.readFileSync(el.path));
result.meta = getMeta(el);
break;
}
}
return result;
}

32
src/helper/cronjobs.js Normal file
View File

@ -0,0 +1,32 @@
let CronJob = require("cron").CronJob;
let jobs = {};
let jobsArray = [];
let logger = require("./logger");
jobs.addJob = function (cron, func) {
let job = new CronJob(cron, func, null, true, "Europe/Berlin");
jobsArray.push(job);
return job;
};
jobs.addJob("0 * * * *", function () {
logger.DeleteOldLogs();
});
jobs.Start = function () {
console.log("Starting Cronjobs");
jobsArray.forEach((job) => {
job.start();
});
};
jobs.Stop = function () {
jobsArray.forEach((job) => {
job.stop();
});
};
jobs.Start();
module.exports = jobs;

66
src/helper/logger.js Normal file
View File

@ -0,0 +1,66 @@
var fs = require("fs");
var util = require("util");
var moment = require("moment");
let name;
var log_file;
updateData();
var log_stdout = process.stdout;
var currentuuid = uuid();
function uuid() {
return "xxxxx".replace(/[xy]/g, function (c) {
var r = (Math.random() * 16) | 0,
v = c == "x" ? r : (r & 0x3) | 0x8;
return v.toString(16);
});
}
function updateData() {
name = "log_" + moment().format("YYYY-MM-DD") + ".log";
log_file = fs.createWriteStream(__dirname + "/../../logs/" + name, {
flags: "a",
});
}
console.log = function (d) {
name = "log_" + moment().format("YYYY-MM-DD") + ".log";
d = `[ ${moment().format("YYYY-MM-DD HH:mm:ss")}] ${util.format(d)} \n`;
log_file.write(d);
log_stdout.write(d);
};
console.error = (d) => {
console.log("[ERROR] " + util.format(d));
};
function DeleteOldLogs(olderThan = 30) {
let files = fs.readdirSync(__dirname + "/../../logs/");
for (file of files) {
let date = file.split("_")[1].split(".")[0];
if (
moment(date, "YYYY-MM-DD").isBefore(moment().subtract(olderThan, "days"))
) {
fs.unlinkSync(__dirname + "/../../logs/" + file);
console.log(
"Deleted " + file + " because it is older than " + olderThan + " days"
);
}
}
}
function getCurrentlog(num = -1) {
if (num > 0) {
let log = fs
.readFileSync(__dirname + "/../../logs/" + name, "utf8")
.toString()
.split("\n");
return log.slice(-num).join("\n");
} else {
return fs
.readFileSync(__dirname + "/../../logs/" + name, "utf8")
.toString();
}
}
module.exports = { getCurrentlog, DeleteOldLogs };

17
src/helper/socket.js Normal file
View File

@ -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 };

26
src/helper/states.js Normal file
View File

@ -0,0 +1,26 @@
const { set } = require("express/lib/response");
let { socket, emitIfInit } = require("../helper/socket");
let JssteState = {
statusMSG: "could not started JSSTE",
status: 1,
pageStatus: [],
};
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 = {
WebserverState,
JSSTEState,
};

32
src/index.js Normal file
View File

@ -0,0 +1,32 @@
let logger = require("./helper/logger");
let conf = require("./helper/conf")();
let websrv = require("./websrv")(conf);
let jobs = require("./helper/cronjobs");
let open = require("open");
let os = require("os");
//os.setPriority(os.constants.priority.PRIORITY_HIGHEST);
/**
* @description
* Starts the server
*/
websrv.slisten((host, port) => {
console.log("Server started on http://" + host + ":" + port);
websrv.dashboardExist(() => {
open("http://" + host + ":" + port + "/dashboard");
});
});
/**
* @description
* Stops the server
*/
process.on("SIGINT", () => {
console.log("Web-Server Beenden ...");
websrv.close();
logger.DeleteOldLogs();
console.log("Cronjob Beenden ...");
jobs.Stop();
process.exit();
});

128
src/websrv/index.js Normal file
View File

@ -0,0 +1,128 @@
const res = require("express/lib/response");
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");
let jsste = require("jsste");
jsste.setStateFunction(({ status, statusMSG }) => {
State.JSSTEState().status = status;
State.JSSTEState().statusMSG = statusMSG;
});
const internalRouter = require("./routes/internalRouter");
app.dashboardExist = (cb) => {
let result = fs.existsSync(path.join(__dirname, "../../dashboard/"));
if (result) {
cb();
}
return result;
};
app.use((req, res, next) => {
var start = process.hrtime();
res.on("finish", () => {
var elapsed = process.hrtime(start)[1] / 1000000;
let time = elapsed.toFixed(3).replace(".", ",") + " ms";
console.log(
`${req.method} ${req.baseUrl + req.path} ${res.statusCode} | ${time}`
);
});
next();
});
app.use(cors());
app.use(bodyParser.json());
app.use(cookieParser());
app.use("/api", internalRouter);
app.dashboardExist(() => {
app.use("/dashboard", express.static(__dirname + "/../../dashboard/build"));
app.get("/dashboard/*", (req, res) => {
let indexPath = path.join(
__dirname + "/../../dashboard/build/index.html"
);
res.sendFile(indexPath);
});
console.log(
"Dashboard is enabled on http://" +
websrvConfig.host +
":" +
websrvConfig.port +
"/dashboard"
);
});
let folders = {
jsste: "pages",
css: "styles",
};
function getFolderFromFileEnding(filename) {
let regex_isAnDotfile = /\w+\.[a-z]*[A-Z]*/;
if (regex_isAnDotfile.test(filename)) {
let ending = filename.split(".").pop();
// let ending = path.extname(filename).replace(".", "");
return "" + folders[ending];
}
return "" + folders.jsste;
}
function defaultUse(req, res, next) {
let regex_isAnDotfile = /\w+\.[a-z]*[A-Z]*/;
let filePath = path.join(
__dirname.toString(),
getFolderFromFileEnding(req.url),
req.url.toString()
);
if (regex_isAnDotfile.test(req.url) && !filePath.endsWith(".jsste")) {
res.sendFile(filePath);
} else if (fs.existsSync(filePath + ".jsste")) {
let content = jsste.renderFile(filePath + ".jsste");
res.send(content);
} else if (fs.lstatSync(filePath).isDirectory()) {
let content = jsste.renderFile(
decode(path.join(filePath, "index.jsste"))
);
res.send(content);
} else next();
}
app.get("/*", defaultUse);
app.slisten = function (cb) {
app.ServerInstance = server
.listen(websrvConfig.port, websrvConfig.host, () => {
State.WebserverState().status = 0;
State.WebserverState().statusMSG = "webserver is running";
State.WebserverState().port = websrvConfig.port;
cb(websrvConfig.host, websrvConfig.port);
})
.on("error", (err) => {
State.WebserverState().status = 1;
State.WebserverState().statusMSG = "webserver could not started";
console.error(err);
});
};
/**
* @function
* @name close
* @description
* Stops the server
*/
app.close = function () {
app.ServerInstance.close();
};
return app;
};

View File

@ -0,0 +1,29 @@
let conf = require("../../helper/conf")();
const express = require("express");
const router = express.Router();
const States = require("../../helper/states");
const logger = require("../../helper/logger");
router.get("/conf", (req, res) => {
conf = require("../../helper/conf")();
res.json(conf);
});
router.get("/jsste/status/obj/:obj", (req, res) => {
res.json(States.JSSTEState()[req.params.obj]);
});
router.get("/jsste/status", (req, res) => {
res.json(States.JSSTEState());
});
router.get("/websrv/status", (req, res) => {
res.json(States.WebserverState());
});
router.get("/logs/length/:leng", (req, res) => {
res.json(logger.getCurrentlog(req.params.leng));
});
router.get("/logs", (req, res) => {
res.json(logger.getCurrentlog(-1));
});
module.exports = router;

13
test/core.jsste.test.js Normal file
View File

@ -0,0 +1,13 @@
let core_render = require("./core.render.test");
//let core_scriptexec = require("./scriptexec.jsste.test");
//let core_includeJSSTE = require("./includeJSSTE.test");
function test() {
describe("JSSTE CORE", function () {
core_render();
// core_scriptexec();
// core_includeJSSTE();
});
}
module.exports = test;

101
test/core.render.test.js Normal file
View File

@ -0,0 +1,101 @@
let libfolder = "../src/jsste";
let JSSTE_Engine = require(libfolder);
function test() {
describe("render", function () {
it(" should return Hallo! -> JSON as Page", function () {
let template = "<[VAR]>!";
let page = { VAR: "Hallo" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("Hallo!");
});
it("should return Hallo! -> String as Page", function () {
let template = "<[VAR]>!";
let page = '{"VAR":"Hallo"}';
let result = JSSTE_Engine.render(page, template);
result.should.equal("Hallo!");
});
it("should retrun one var two times", function () {
let template = "<[VAR]><[VAR]>!";
let page = { VAR: "Hallo" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("HalloHallo!");
});
it("should retrun EXAMPLE EXAMPLE", function () {
let template = "<[VAR]> <[VAR]>";
let page = { VAR: "EXAMPLE" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("EXAMPLE EXAMPLE");
});
it("should delete useless var", function () {
let template = "<[VAR]><[VAR2]><[VAR]>";
let page = { VAR: "EXAMPLE" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("EXAMPLEEXAMPLE");
});
it.skip("blub", function () {
let result = JSSTE_Engine.render(
{
js$test: `out('<h1>'+ Date.now().toString() + '</h1>')`,
test: "hallo",
js$test2: `test2`,
_STYLES_: ["./test/style"],
},
`<html>
<head>
<title><[test]></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<[js$test2]>
</body>
</html>`
);
});
it("should not rendern _VAR_", function () {
let template = "<[_VAR_]>";
let page = { VAR: "EXAMPLE" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("");
});
it("should not rendern _var_", function () {
let template = "<[_var_]>";
let page = { var: "EXAMPLE" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("");
});
it("should not rendern _var2_", function () {
let template = "<[_var2_]>";
let page = { var2: "EXAMPLE" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("");
});
it("should render in href a tag", function () {
let template = "<a href='<[LINK]>'></a>";
let page = { LINK: "www.nodejs.com" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("<a href='www.nodejs.com'></a>");
});
it("should render a tag", function () {
let template = "<a href='<[LINK]>'><[VAR]></a>";
let page = { VAR: "EXAMPLE", LINK: "www.nodejs.com" };
let result = JSSTE_Engine.render(page, template);
result.should.equal("<a href='www.nodejs.com'>EXAMPLE</a>");
});
});
}
module.exports = test;

21
test/express.test.js Normal file
View File

@ -0,0 +1,21 @@
// //mocha chai test
// require("../src");
// var assert = require("assert");
// var express = require("express");
// var app = express();
// var chai = require("chai");
// var expect = chai.expect;
// function test() {
// describe("express engine", function () {
// it("set view-engine", async function (done) {
// app.set("view-enigne", "jsste");
// app.done();
// });
// });
// }
// module.exports = test;

13
test/includeJSSTE.test.js Normal file
View File

@ -0,0 +1,13 @@
let libfolder = "../src/";
let JSSTE_Engine = require(libfolder);
var chai = require("chai");
var expect = chai.expect;
function test() {
describe("should include JSSTE File", function () {
// JSSTE_Engine.
});
}
module.exports = test;

9
test/index.js Normal file
View File

@ -0,0 +1,9 @@
require("chai").should();
//let test_jsonMerger = require("./jsonMerger.test");
let test_core = require("./core.jsste.test");
describe("Core Tests", function () {
// test_jsonMerger();
test_core();
});

77
test/jsonMerger.test.js Normal file
View File

@ -0,0 +1,77 @@
let libfolder = "../src/";
let jsonmerger = require(libfolder + "jsonMerger");
function test() {
describe("Test JsonMerger", function () {
it("should return merged json", function () {
let json1 = { a: "wert1" };
let json2 = { b: "wert2" };
let result = jsonmerger.mergeJson(json1, json2);
result = JSON.stringify(result);
result.should.equal(JSON.stringify({ a: "wert1", b: "wert2" }));
});
it("should return merged json override b", function () {
let json1 = { a: "wert1", b: "wert3" };
let json2 = { b: "wert2" };
let result = jsonmerger.mergeJson(json1, json2);
result = JSON.stringify(result);
result.should.equal(JSON.stringify({ a: "wert1", b: "wert2" }));
});
it("should merge 3 JSONs ", function () {
let json1 = { a: "wert1" };
let json2 = { b: "wert2" };
let json3 = { c: "wert3" };
let result = jsonmerger.mergeJsons(json1, json2, json3);
result = JSON.stringify(result);
result.should.equal(
JSON.stringify({ a: "wert1", b: "wert2", c: "wert3" })
);
});
it("should merge 4 JSONs", function () {
let json1 = { a: "wert1" };
let json2 = { b: "wert2" };
let json3 = { c: "wert3" };
let json4 = { d: "wert4" };
let result = jsonmerger.mergeJsons(json1, json2, json3, json4);
result = JSON.stringify(result);
result.should.equal(
JSON.stringify({ a: "wert1", b: "wert2", c: "wert3", d: "wert4" })
);
});
it("should merge 2 jsons with array", function () {
let json1 = { a: ["a", "b"] };
let json2 = { a: ["c"], b: "hallo" };
let result = jsonmerger.mergeJsons(json1, json2);
result = JSON.stringify(result);
result.should.equal(JSON.stringify({ a: ["a", "b", "c"], b: "hallo" }));
});
it("should merge 2 jsons with array only in secound json", function () {
let json1 = {};
let json2 = { a: ["c"], b: "hallo" };
let result = jsonmerger.mergeJsons(json1, json2);
result = JSON.stringify(result);
result.should.equal(JSON.stringify({ a: ["c"], b: "hallo" }));
});
it("should merge 2 jsons with array with only in first json", function () {
let json1 = { a: ["a", "b"] };
let json2 = { b: "hallo" };
let result = jsonmerger.mergeJsons(json1, json2);
result = JSON.stringify(result);
result.should.equal(JSON.stringify({ a: ["a", "b"], b: "hallo" }));
});
});
}
module.exports = test;

View File

@ -0,0 +1,33 @@
let libfolder = "../src";
let scriptExecuter = require(libfolder + "/scriptExecuter");
function test() {
describe("test scriptexecuter", () => {
it("should return script result 'HalloWelt'", function () {
let script = "return 'HalloWelt';";
let result = scriptExecuter(script);
result.should.equal("HalloWelt");
});
it("should return script result out()", function () {
let script = "out('HalloWelt')";
let result = scriptExecuter(script);
result.should.equal("HalloWelt");
});
it("should return script result outLine()", function () {
let script = "outLine('HalloWelt'); outLine('HalloWelt')";
let result = scriptExecuter(script);
result.should.equal("\nHalloWelt\nHalloWelt");
});
// it("should return script result outLine()", function () {
// let script = "Helloworld";
// let result = scriptExecuter(script);
// result.should.equal("HalloWelt");
// });
});
}
module.exports = test;

1085
yarn.lock Normal file

File diff suppressed because it is too large Load Diff