kuhyx/WUT_Computer_Science
1
0
Fork 0
mirror of https://github.com/kuhyx/WUT_Computer_Science.git synced 2026-07-06 10:03:16 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: redo lab3

Browse Source
This commit is contained in:
PolishPigeon 2022-06-15 00:07:50 +02:00
parent 69ecbea0be
commit 5682fb4e1b
18 changed files with 0 additions and 31088 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
EGUI/lab3/.gitignore vendored
View File

@ -1,23 +0,0 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*

1
EGUI/lab3/README.md
View File

@ -1 +0,0 @@
Use run.sh script to install dependencies and run frontend and backend server using one script <br/> or use npm i and then npm start

16
EGUI/lab3/db.json
View File

@ -1,16 +0,0 @@
{
"users": [
{
"mail": "this.state",
"login": "this.state",
"blogTitle": "this.state",
"password": "1",
"blogData": {
"title": "this.state",
"listOfItems": [],
"dateTime": "12/6/2022 @ 21:35:32"
},
"id": 1
}
]
}

30607
EGUI/lab3/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

43
EGUI/lab3/package.json
View File

@ -1,43 +0,0 @@
{
"name": "lab3",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.4",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"bootstrap": "^5.1.3",
"concurrently": "^7.2.1",
"json-server": "^0.17.0",
"react": "^18.1.0",
"react-bootstrap": "^2.4.0",
"react-dom": "^18.1.0",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "concurrently \"json-server -p 8000 --watch db.json\" \"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"
]
}
}

BIN
EGUI/lab3/public/favicon.ico
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 3.8 KiB

43
EGUI/lab3/public/index.html
View File

@ -1,43 +0,0 @@
<!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>React App</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>

15
EGUI/lab3/public/manifest.json
View File

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

3
EGUI/lab3/public/robots.txt
View File

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

2
EGUI/lab3/run.sh
View File

@ -1,2 +0,0 @@
#!/bin/bash
npm i && npm start

47
EGUI/lab3/src/App.js
View File

@ -1,47 +0,0 @@
import 'bootstrap/dist/css/bootstrap.min.css';
import Container from 'react-bootstrap/Container';
import Nav from 'react-bootstrap/Nav';
import Navbar from 'react-bootstrap/Navbar';
import {
Outlet,
} from "react-router-dom";
import React from 'react';
import loginContext from './context.context';
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
login: "",
};
}
render() {
return (
<div>
<Navbar bg="light" expand="lg">
<Container>
<Navbar.Brand href="/">Lab 3</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav">
<Nav className="me-auto">
<Nav.Link href="/">Home</Nav.Link>
<Nav.Link href="/register">Register</Nav.Link>
<Nav.Link href="/login">Login</Nav.Link>
<Nav.Link href="/blog">Blog</Nav.Link>
</Nav>
</Navbar.Collapse>
</Container>
</Navbar>
<Outlet />
</div>
);
}
}

5
EGUI/lab3/src/context.context.jsx
View File

@ -1,5 +0,0 @@
import { createContext } from "react";
const loginContext = createContext('test');
export default loginContext;

24
EGUI/lab3/src/index.js
View File

@ -1,24 +0,0 @@
import {
BrowserRouter,
Route,
Routes,
} from "react-router-dom";
import App from "./App";
import Blog from "./routes/blog";
import Login from "./routes/login";
import ReactDOM from "react-dom/client";
import Register from "./routes/register";
const root = ReactDOM.createRoot(
document.getElementById("root")
);
root.render( <BrowserRouter>
<Routes>
<Route path="/" element={<App />} >
<Route path="register" element={<Register />} />
<Route path="login" element={<Login />} />
<Route path="blog" element={<Blog />} />
</Route>
</Routes>
</BrowserRouter>);

0
EGUI/lab3/src/registerFunctions.js
View File

18
EGUI/lab3/src/routes/blog.jsx
View File

@ -1,18 +0,0 @@
import Login from './login';
import React from 'react';
import loginContext from '../context.context';
export default class Blog extends React.Component {
constructor(props) {
super(props);
this.state = {
login: "",
};
}
render() {
return (
<div> You are not logged in {this.state.login} </div>
);
}
}

0
EGUI/lab3/src/routes/blogEntry.jsx
View File

84
EGUI/lab3/src/routes/login.jsx
View File

@ -1,84 +0,0 @@
import 'bootstrap/dist/css/bootstrap.min.css';
import Button from 'react-bootstrap/Button';
import Form from 'react-bootstrap/Form';
import React from 'react';
export default class Login extends React.Component {
constructor(props) {
super(props);
this.state = {
login: "",
password: "",
};
}
render () {
return (
<Form>
<Form.Group className="mb-3" controlId="formLogin">
<Form.Label>Login</Form.Label>
<Form.Control type="login" placeholder="Enter Login"
value={this.state.login}
onChange={evt => this.updateLogin(evt)}
/>
</Form.Group>
<Form.Group className="mb-3" controlId="formPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Enter Password"
value={this.state.password}
onChange={evt => this.updatePassword(evt)}
/>
</Form.Group>
<Button variant="primary" type="submit" onClick={async () => this.loginUser()}>
Submit
</Button>
</Form>
)
}
updateLogin(evt) {
const val = evt.target.value;
// ...
this.setState({
login: val
});
}
updatePassword(evt) {
const val = evt.target.value;
// ...
this.setState({
password: val
});
}
async loginUser() {
const fetchAddress = "http://localhost:8000/users/?login=" + this.state.login;
console.log(fetchAddress);
let response = await fetch(fetchAddress,
{
method: "GET",
headers: {
"Content-Type": "application/json"
},
mode: `cors`,
});
const allData = await response.json();
console.log(JSON.stringify(allData));
if(allData.length === 0)
{
alert("This login: \"" + this.state.login + "\" does not exist!");
return;
} if(allData[0].password !== this.state.password)
{
alert("Wrong password!");
return;
}
return this.state.login;
}
}

157
EGUI/lab3/src/routes/register.jsx
View File

@ -1,157 +0,0 @@
import 'bootstrap/dist/css/bootstrap.min.css';
import Button from 'react-bootstrap/Button';
import Form from 'react-bootstrap/Form';
import React from 'react';
export default class Register extends React.Component {
constructor(props) {
super(props);
this.state = {
mail: "",
login: "",
blogTitle: "",
password: "",
blogData: {
"title": "",
"listOfItems":
[
],
"dateTime": "",
},
};
}
render() {
return (
<div>
<Form>
<Form.Group className="mb-3" controlId="formBasicEmail">
<Form.Label>Email address</Form.Label>
<Form.Control type="email" placeholder="Enter email"
value={this.state.mail}
onChange={evt => this.updateMail(evt)}
/>
</Form.Group>
<Form.Group className="mb-3" controlId="formLogin">
<Form.Label>Login</Form.Label>
<Form.Control type="login" placeholder="Enter Login"
value={this.state.login}
onChange={evt => this.updateLogin(evt)}
/>
</Form.Group>
<Form.Group className="mb-3" controlId="formBlogTitle">
<Form.Label>Blog Title</Form.Label>
<Form.Control type="blogTitle" placeholder="Enter Blog Title"
value={this.state.blogTitle}
onChange={evt => this.updateBlogTitle(evt)}
/>
</Form.Group>
<Form.Group className="mb-3" controlId="formPassword">
<Form.Label>Password</Form.Label>
<Form.Control type="password" placeholder="Enter Password"
value={this.state.password}
onChange={evt => this.updatePassword(evt)}
/>
</Form.Group>
<Button variant="primary" type="submit" onClick={async () => this.registerUser()}>
Submit
</Button>
</Form>
</div>
);
}
updateMail(evt) {
const val = evt.target.value;
// ...
this.setState({
mail: val
});
}
updateLogin(evt) {
const val = evt.target.value;
// ...
this.setState({
login: val
});
}
updateBlogTitle(evt) {
const val = evt.target.value;
// ...
this.setState({
blogTitle: val
});
}
updatePassword(evt) {
const val = evt.target.value;
// ...
this.setState({
password: val
});
}
async registerUser() {
const fetchAddress = "http://localhost:8000/users/?login=" + this.state.login;
// console.log(this.state.inputValue);
const response = await fetch(fetchAddress,
{
method: "GET",
});
const allData = await response.json();
console.log(allData);
if(allData.length !== 0)
{
alert("This login: \"" + this.state.login + "\" is already taken!");
return;
}
if(this.state.password === undefined || this.state.password === "")
{
alert("Password cannot be empty! ");
return;
}
const currentDate = new Date();
const dateTime = currentDate.getDate() + "/"
+ (currentDate.getMonth()+1) + "/"
+ currentDate.getFullYear() + " @ "
+ currentDate.getHours() + ":"
+ currentDate.getMinutes() + ":"
+ currentDate.getSeconds();
const blogData = {
"title": this.state.blogTitle,
"listOfItems":
[
],
"dateTime": dateTime,
};
this.state.blogData = blogData;
await fetch("http://localhost:8000/users", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(this.state),
redirect: 'manual',
}).then(response => response.json())
.then(data => {
console.log('Success:', data);
})
.catch((error) => {
console.error('Error:', error);
});
}
}