feat: ekran rejestracji na turniej

This commit is contained in:
Lewy 2022-06-15 15:43:30 +02:00
parent 5e645ea930
commit 411a03501c
11 changed files with 375 additions and 0 deletions

View File

@ -0,0 +1,77 @@
function checkRole() {
fetch('https://dragonmaster.pl/inz/user', {
headers: {
Authorization: ("Bearer " + localStorage.getItem("token"))
}
})
.then(res => res.json())
.then(json => {
if (json['role'] == '1') {
window.location.href = '../index.html'
}
else {
window.location.href = '../../panel_organizatora/dodawanie turnieju/index.html'
}
})
}
function login() {
localStorage.clear()
fetch('https://dragonmaster.pl/inz/user/login', {
method: "POST",
headers: {
'Content-type': 'application/json'
},
body: JSON.stringify(
{
"username": document.getElementById("loginusername").value,
"password": document.getElementById("loginpassword").value
}
)
}
)
.then(res => {
if (res.ok) {
// alert("Teraz mozesz się zalogować!")
}
else { console.log("Coś poszło nie tak!") }
return res
})
.then(res => res.json())
.then(data => {
console.log(data['token']?.length > 0 ? localStorage.setItem("token", data['token']) : alert("Błędne dane!"))
checkRole();
})
.catch(error => console.log(error))
}
// function checkRole() {
// fetch('https://dragonmaster.pl/inz/user', {
// method: "GET",
// headers: {
// 'Content-type': 'application/json'
// },
// body: JSON.stringify(
// {
// "token": document.getElementById("loginusername").value,
// "password": document.getElementById("loginpassword").value
// }
// )
// }
// )
// .then(res => {
// if (res.ok) {
// alert("Teraz mozesz się zalogować!")
// }
// else { console.log("Coś poszło nie tak!") }
// return res
// })
// .then(res => res.json())
// .then(data => console.log(data['token']?.length > 0 ? localStorage.setItem("token", data['token']) : 'niedziaua'))
// .catch(error => console.log(error))
// .then(token1 => token = token1)
// }

View File

@ -0,0 +1,50 @@
/*Layer 1*/
.dropdown {
width: 80%;
margin: auto;
}
/*Layer 2*/
.dropbtn {
/*Button*/
width: 100%;
background-color: white;
border: 1px solid #D0D0D0;
cursor: pointer;
/*Text*/
color: #828282;
padding: 4% 5%;
font-size: 16px;
text-align: left;
}
.dropdown-content {
display: none;
position: absolute;
background-color: white;
width: 19%;
box-shadow: 0 8px 16px 0 rgba(0,0,0,0.5);
z-index: 1;
}
/*Reactivness*/
.dropdown-content a {
padding: 3% 4%;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-content a:hover {background-color: #f1f1f1}
.dropdown:hover .dropdown-content {
display: block;
}
.dropdown:hover .dropbtn {
background-color: #D0D0D0;
border: 1px solid black;
color: black;
}

View File

@ -0,0 +1,60 @@
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Paddle tournament system</title>
<link href="style.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="form">
<div class="login_header">
<img class=logoImg src="../../../../_global/logo.svg" alt="">
<a href="../index.html"><img src="src/x.svg" id="closelog" alt=""></a>
</div>
<div class="loginBox">
<div id="title">Zapisy na turniej</div>
<div class="whitebox">
<div class="descriptor">ID partnera</div>
<br>
<label>
<input id="ID_input" placeholder="Tutaj wpisz email lub nick">
</label>
<div class="descriptor">Metoda płatności</div>
<br>
<div class="dropdown">
<button class="dropbtn">Gotówka</button>
<div class="dropdown-content">
<a href="#">Gotówka</a>
<a href="#">Przelew</a>
<a href="#">Bitcoin</a>
</div>
</div>
</div>
<!-- trzeba dać cssy buttonowi bo zmieniłem z form na button -->
<button class="myButton" id="loginsubmit" onclick="login()">
WYŚLIJ ZGŁOSZENIE
</button>
</div>
<div class="login_footer">
</div>
</div>
</div>
<script type="text/javascript" src="app.js"></script>
</body>
</html>

View File

@ -0,0 +1,5 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17 22H7C3 22 2 21 2 17V15C2 11 3 10 7 10H17C21 10 22 11 22 15V17C22 21 21 22 17 22Z" stroke="#AFAFAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6 10V8C6 4.69 7 2 12 2C16.5 2 18 4 18 7" stroke="#AFAFAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 18.5C13.3807 18.5 14.5 17.3807 14.5 16C14.5 14.6193 13.3807 13.5 12 13.5C10.6193 13.5 9.5 14.6193 9.5 16C9.5 17.3807 10.6193 18.5 12 18.5Z" stroke="#AFAFAF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 669 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.0132 9.15129C3 9.69022 3 10.3021 3 11V13C3 15.8284 3 17.2426 3.87868 18.1213C4.75736 19 6.17157 19 9 19H15C17.8284 19 19.2426 19 20.1213 18.1213C21 17.2426 21 15.8284 21 13V11C21 10.3021 21 9.69022 20.9868 9.15129L12.9713 13.6044C12.3672 13.9399 11.6328 13.9399 11.0287 13.6044L3.0132 9.15129ZM3.24297 7.02971C3.32584 7.05052 3.4074 7.08237 3.48564 7.12584L12 11.856L20.5144 7.12584C20.5926 7.08237 20.6742 7.05052 20.757 7.02971C20.6271 6.55619 20.4276 6.18491 20.1213 5.87868C19.2426 5 17.8284 5 15 5H9C6.17157 5 4.75736 5 3.87868 5.87868C3.57245 6.18491 3.37294 6.55619 3.24297 7.02971Z" fill="#AFAFAF"/>
</svg>

After

Width:  |  Height:  |  Size: 767 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

View File

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.6515 20.4054C20.2043 20.2902 20.5336 19.7117 20.2589 19.2183C19.6533 18.1307 18.6993 17.1749 17.4788 16.4465C15.907 15.5085 13.9812 15 12 15C10.0188 15 8.09292 15.5085 6.52112 16.4465C5.30069 17.1749 4.34666 18.1307 3.74108 19.2183C3.46638 19.7117 3.79562 20.2902 4.34843 20.4054C9.39524 21.4572 14.6047 21.4572 19.6515 20.4054Z" fill="#AFAFAF"/>
<circle cx="12" cy="8" r="5" fill="#AFAFAF"/>
</svg>

After

Width:  |  Height:  |  Size: 517 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M6.67962 3.32038L7.29289 2.70711C7.68342 2.31658 8.31658 2.31658 8.70711 2.70711L11.2929 5.29289C11.6834 5.68342 11.6834 6.31658 11.2929 6.70711L9.50048 8.49952C9.2016 8.7984 9.1275 9.255 9.31653 9.63307C10.4093 11.8186 12.1814 13.5907 14.3669 14.6835C14.745 14.8725 15.2016 14.7984 15.5005 14.4995L17.2929 12.7071C17.6834 12.3166 18.3166 12.3166 18.7071 12.7071L21.2929 15.2929C21.6834 15.6834 21.6834 16.3166 21.2929 16.7071L20.6796 17.3204C18.5683 19.4317 15.2257 19.6693 12.837 17.8777L11.6286 16.9714C9.88504 15.6638 8.33622 14.115 7.02857 12.3714L6.12226 11.163C4.33072 8.7743 4.56827 5.43173 6.67962 3.32038Z" fill="#AFAFAF"/>
</svg>

After

Width:  |  Height:  |  Size: 750 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.1 MiB

View File

@ -0,0 +1,5 @@
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="40" height="40" fill="white"/>
<path d="M30 10L10 30" stroke="#282828" stroke-opacity="0.9" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 10L30 30" stroke="#282828" stroke-opacity="0.9" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>

After

Width:  |  Height:  |  Size: 413 B

View File

@ -0,0 +1,168 @@
@import "../../../../_global/style.css";
@import "css/dropdown.css";
/*Layer 0*/
html {
background-image: url(src/tlo_logowanie.png);
background-attachment: fixed;
background-size: cover;
font-family: Montserrat, serif;
}
* {
/*border: 2px solid red;*/
box-sizing: border-box;
text-align: center;
}
/*Layer 1*/
.container {
display: flex;
height: 100vh;
justify-content: center;
align-items: center;
}
/*Layer 2*/
.form {
width: 40%;
height: 50%;
background-color: #EBEBEB;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
border-radius: 2%;
}
/*Layer 3*/
.login_header {
height: 15%;
width: 100%;
background-color: #ffffff;
}
.loginBox {
width: 60%;
display: flex;
flex-direction: column;
}
.login_footer {
height: 10%;
width: 100%;
padding-top: 1%;
background-color: #ffffff;
}
/*layer 4*/
.whitebox {
width: 100%;
height: 100%;
padding-top: 0%;
padding-bottom: 5%;
background-color: white;
}
/*Elements*/
.myButton {
/*Outside*/
width: 60%;
display: inline-block;
cursor: pointer;
border-radius: 15px;
border: 1px solid;
margin: 4% auto auto auto;
/*Inside*/
background-color: #007C36;
padding: 10px 0;
text-align: center;
/*Text*/
font-family: Montserrat, serif;
font-style: normal;
font-size: 18px;
color: #ffffff;
font-weight: 600;
}
#ID_input {
/*Outside*/
margin: auto;
width: 80%;
/*Inside*/
text-align: left;
padding-top: 2%;
padding-bottom: 2%;
}
.logoImg {
margin: 1% auto;
width: 20%;
}
.descriptor {
/* Alignment */
margin-bottom: 2%;
margin-top: 5%;
margin-left: 10%;
float: left;
/* Text */
font-family: 'Montserrat', serif;
font-size: 20px;
font-weight: 600;
text-align: left;
color: #828282;
}
/*##### LINKS TODO WITH HEADER #####*/
/* unvisited link */
a:link {
color: #000000;
}
/* visited link */
a:visited {
color: #000000;
}
/* mouse over link */
a:hover {
color: #818181;
}
/* selected link */
a:active {
color: #000000;
}
#closelog {
float: right;
}
#title {
margin-bottom: 3%;
font-family: 'Montserrat', serif;
font-style: normal;
font-weight: 600;
font-size: 28px;
}