diff --git a/web/app/Http/Controllers/Controller.php b/web/app/Http/Controllers/Controller.php index a0a2a8a..60ac0c6 100644 --- a/web/app/Http/Controllers/Controller.php +++ b/web/app/Http/Controllers/Controller.php @@ -10,4 +10,9 @@ use Illuminate\Routing\Controller as BaseController; class Controller extends BaseController { use AuthorizesRequests, DispatchesJobs, ValidatesRequests; + + function register() { + return Response()->json('lmao'); + } + } diff --git a/web/resources/js/helpers/Auth.js b/web/resources/js/helpers/Auth.js index 055d4b2..073ce57 100644 --- a/web/resources/js/helpers/Auth.js +++ b/web/resources/js/helpers/Auth.js @@ -1,9 +1,53 @@ // © XlXi 2021 // Graphictoria 5 -function CreateAccount(loginForm) +import axios from "axios"; +import Config from '../config.js'; + +axios.defaults.withCredentials = true + +var url = Config.BaseUrl.replace('http://', ''); +var protocol = Config.Protocol; + +export async function CreateAccount(form) { - + console.log(form.get('username')); + + const finished = false; + const body = form; + + await axios.post(`${protocol}apis.${url}/account/register`, body, {headers: {"Access-Control-Allow-Origin": "*"}}).then(res=>{ + console.log(res); + }).catch(error=>console.log(error)); + + return new Promise((resolve, reject)=>{ + + if (finished) { + resolve("good"); + }else{ + resolve({message: `bad`, inputs: [`username`]}); + } + }); } -export { CreateAccount }; \ No newline at end of file +export const LoginToAccount = async (form) => { + + console.log(form.get('Username')); + + const finished = true; + const body = form; + + await axios.post(`${protocol}${url}/api/login`, body).then(res=>{ + console.log(body); + }).catch(error=>console.log(error)); + + return new Promise((resolve, reject)=>{ + + if (finished) { + resolve("good"); + }else{ + reject({message: `bad`, inputs: [`username`]}); + } + }); + +} diff --git a/web/resources/js/layouts/App.js b/web/resources/js/layouts/App.js index 605fff8..ce26d4e 100644 --- a/web/resources/js/layouts/App.js +++ b/web/resources/js/layouts/App.js @@ -83,14 +83,7 @@ const App = () => { state.offlineFetched == true ? - { - - state.banners && state.banners.length >= 1 ? - state.banners - : - null - - } + {state.banners && state.banners.length >= 1 ? state.banners : null} { return ( diff --git a/web/resources/js/pages/Auth/Login.js b/web/resources/js/pages/Auth/Login.js index a4ae40d..a57e5b7 100644 --- a/web/resources/js/pages/Auth/Login.js +++ b/web/resources/js/pages/Auth/Login.js @@ -1,24 +1,56 @@ // © XlXi 2021 // Graphictoria 5 -import React from 'react'; +import React, {useState} from 'react'; import { Link } from 'react-router-dom'; import ReCAPTCHA from 'react-google-recaptcha'; +import { CreateAccount, LoginToAccount } from '../../Helpers/Auth'; +import Loader from '../../Components/Loader'; const LoginForm = (props) => { + + const [waitingForSubmission, setWaitingForSubmission] = useState(false); + + const [validity, setValidity] = useState({error: false, message: ``, inputs: []}); + + async function SubmitLogin(form) + { + setWaitingForSubmission(true); + await LoginToAccount(form).then(res=>{ + if (res != `good`) { + setValidity({error: true, message:res.message, inputs: res.inputs}); + setTimeout(()=>{setValidity({...validity, error: false, inputs: res.inputs});}, 4000); + } + }).catch(error=>console.log(error)); + setWaitingForSubmission(false); + } + return ( + waitingForSubmission ? : <>
- - + {validity.error? +
+
+

{validity.message}

+
+
+ : null} +
{ + e.preventDefault(); + SubmitLogin(new FormData(e.target)); + }} class="fs"> + input == `username`)? `is-invalid` : ``)}`} placeholder="Username" name="Username"/> + input == `password`)? `is-invalid` : ``)}`} placeholder="Password" name="Password"/>
-
+
+
Forgot your password?
diff --git a/web/resources/js/pages/Auth/Register.js b/web/resources/js/pages/Auth/Register.js index 6be0dc1..e9eed8b 100644 --- a/web/resources/js/pages/Auth/Register.js +++ b/web/resources/js/pages/Auth/Register.js @@ -7,6 +7,7 @@ import { Link } from 'react-router-dom'; import ReCAPTCHA from 'react-google-recaptcha'; import Loader from '../../Components/Loader.js'; +import { CreateAccount } from '../../Helpers/Auth.js'; const RegisterForm = (props) => { const RegistrationAreas = [ @@ -34,14 +35,75 @@ const RegisterForm = (props) => { const [waitingForSubmission, setWaitingForSubmission] = useState(false); - const [values, setValues] = useState({ + const [validity, setValidity] = useState({error: false, message: ``, inputs: []}); + + async function SubmitRegistration(form) + { + const formData = new FormData(form); + setWaitingForSubmission(true); + await CreateAccount(formData).then(res=>{ + if (res != `good`) { + setValidity({error: true, message:res.message, inputs: res.inputs}); + setTimeout(()=>{setValidity({...validity, error: false, inputs: res.inputs});}, 4000); + } + }).catch(error=>console.log(error)); + setWaitingForSubmission(false); + } + + return ( + waitingForSubmission + ? + + : + ( + <> +
+
+

Make sure your password is unique!

+
+
+ {validity.error? +
+
+

{validity.message}

+
+
+ : null} +
+
{e.preventDefault();SubmitRegistration(e.target);}}> + { + RegistrationAreas.map(({ text, type, id }, index) => + {}} type={ type } className={ `form-control mb-2 ${(validity.inputs.find(input=>input == id)? `is-invalid` : ``)}` } placeholder={ text } id={ id } name={id}/> + ) + } +
+
+ +
+ +
+
+ Already have an account? +

By creating an account, you agree to our Terms of Service and our Privacy Policy.

+
+ + ) + ); +}; + +export default RegisterForm; + +/* +const [values, setValues] = useState({ username: '', email: '', password: '', confirmation: '' }); - - const [validity, setValidity] = useState({ +const [validity, setValidity] = useState({ username: false, email: false, password: false, @@ -63,45 +125,4 @@ const RegisterForm = (props) => { [id] : value })); } - - function SubmitRegistration() - { - setWaitingForSubmission(true); - } - - return ( - waitingForSubmission - ? - - : - ( - <> -
-
-

Make sure your password is unique!

-
-
-
- { - RegistrationAreas.map(({ text, type, id }, index) => - - ) - } -
-
- -
- -
- Already have an account? -

By creating an account, you agree to our Terms of Service and our Privacy Policy.

-
- - ) - ); -}; - -export default RegisterForm; \ No newline at end of file +*/ diff --git a/web/resources/sass/Graphictoria.scss b/web/resources/sass/Graphictoria.scss index 7dd0341..7c6f52d 100644 --- a/web/resources/sass/Graphictoria.scss +++ b/web/resources/sass/Graphictoria.scss @@ -811,4 +811,26 @@ a.list-group-item { html.gtoria-light & { background-color: $white !important; } -} \ No newline at end of file +} + +// Dialog + +.error-dialog.show { + display: block; +} + +.error-dialog { + padding: 5px; + margin-bottom: 10px; + border-radius: 10px; + text-align: center; + background-color: var(--bs-red); + + animation-duration: 0.2s; + animation-fill-mode: both; + animation-name: dropdownEase; + + -webkit-animation-duration: 0.2s; + -webkit-animation-fill-mode: both; + -webkit-animation-name: dropdownEase; +} diff --git a/web/routes/apis.php b/web/routes/apis.php index 5d7fc17..064197b 100644 --- a/web/routes/apis.php +++ b/web/routes/apis.php @@ -4,6 +4,7 @@ use Illuminate\Http\Request; use Illuminate\Support\Facades\Route; use App\Http\Controllers\BannerController; use App\Http\Controllers\GamesController; +use App\Http\Controllers\Controller; /* |-------------------------------------------------------------------------- @@ -26,6 +27,8 @@ Route::get('/games/metadata', 'GamesController@isAvailable'); Route::post('/maintenance/bypass', 'MaintenanceController@bypass'); +Route::post('/account/register', 'Controller@register'); + Route::fallback(function(){ return response('{"errors":[{"code":404,"message":"NotFound"}]}', 404) ->header('Cache-Control', 'private') diff --git a/web/routes/web.php b/web/routes/web.php index 48230d2..68442af 100644 --- a/web/routes/web.php +++ b/web/routes/web.php @@ -51,4 +51,4 @@ Route::get('/legal/dmca', function(){ Route::get('/games', function(){ return view('main'); -}); \ No newline at end of file +});