kevin/deguapp
1
0
Fork 0
forked from fr/deguapp
Code Pull Requests Activity

pages: home, login, signup, signin, add are almost done

Browse Source
This commit is contained in:
Filip Rojek 2023-11-16 00:46:49 +01:00
parent e8fe008117
commit ea34fa8eb4
8 changed files with 88 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
frontend/index.php
View File

@ -31,9 +31,6 @@
<link rel="stylesheet" href="/css/home.css"> <link rel="stylesheet" href="/css/home.css">
<link rel="stylesheet" href="/css/md-add.css"> <link rel="stylesheet" href="/css/md-add.css">
<link rel="stylesheet" href="/css/modal.css"> <link rel="stylesheet" href="/css/modal.css">
<script src="/js/general.js"></script>
<script src="/js/modal.js"></script>
<script src="/js/nav.js"></script>
</head> </head>
<body> <body>
<header class="f-row nav-wrapper"> <header class="f-row nav-wrapper">
@ -78,23 +75,31 @@
<!-- routing shits --> <!-- routing shits -->
<?php <?php
$R = new Router(); $R = new Router();
if(!$LOGGEDIN) {
$R->route('GET', '/', 'home'); $R->route('GET', '/', 'home');
$R->route('GET', '/beer/add', 'beer_add');
$R->route('GET', '/review/add', 'review_add');
$R->route('GET', '/login', 'login'); $R->route('GET', '/login', 'login');
$R->route('GET', '/signup', 'signup'); $R->route('GET', '/signup', 'signup');
}
if($LOGGEDIN) {
$R->route('GET', '/', 'beer_get');
$R->route('GET', '/beer/add', 'beer_add');
$R->route('GET', '/beer/get/{id}', 'beer_get');
$R->route('GET', '/review/add', 'review_add');
$R->route('POST', '/contact/send', 'contact'); $R->route('POST', '/contact/send', 'contact');
}
if(!$LOGGEDIN && $R->getUrl() == '/') { if(!$LOGGEDIN && $R->getUrl() == '/') {
// show login page // show login page
} }
$R = null; //$R = null;
?> ?>
<!-- modals --> <!-- modals -->
<!-- add modal --> <!-- add modal -->
<?php if($LOGGEDIN) {?>
<section class="modal" id="md-add-tree"> <section class="modal" id="md-add-tree">
<div class="modal-content"> <div class="modal-content">
<span class="md-close">&times;</span> <span class="md-close">&times;</span>
@ -121,7 +126,9 @@
</div> </div>
</div> </div>
</section> </section>
<?php }?>
<?php if(!$LOGGEDIN) {?>
<!-- login modal --> <!-- login modal -->
<section class="modal" id="md-login"> <section class="modal" id="md-login">
<div class="modal-content"> <div class="modal-content">
@ -147,12 +154,18 @@
</div> </div>
</div> </div>
</section> </section>
<?php }?>
</section> </section>
<footer> <footer>
<a href="https://git.filiprojek.cz/fr/deguapp">Source</a> <a href="https://git.filiprojek.cz/fr/deguapp">Source</a>
<a href="http://filiprojek.cz/">(c) Filip Rojek, 2023</a> <a href="http://filiprojek.cz/">(c) Filip Rojek, 2023</a>
</footer> </footer>
<script defer src="/js/general.js"></script>
<script defer src="/js/modal.js"></script>
<script defer src="/js/nav.js"></script>
<script defer src="/js/home.js"></script>
</body> </body>
</html> </html>

5
frontend/js/home.js Normal file
View File

@ -0,0 +1,5 @@
qSA(".card-beer").forEach(el => {
el.addEventListener("click", (e) => {
window.location.href = "/beer/" + el.querySelector("img").id
})
});

9
frontend/js/nav.js
View File

@ -3,14 +3,12 @@ function show_modal(selector, modal_selector = null) {
if(modal_selector === null) { if(modal_selector === null) {
modal_selector = selector modal_selector = selector
} }
const btn = qS(selector) const btn = qS(selector)
const md = qS(modal_selector) const md = qS(modal_selector)
btn.addEventListener("click", (el) => { btn.addEventListener("click", (el) => {
md.classList.add("md-active") md.classList.add("md-active")
}) })
} catch (error) { } catch (error) {
console.error(error)
} }
} }
@ -19,6 +17,9 @@ show_modal("#nav-login", "#md-login")
show_modal("#nav-signup", "#md-signup") show_modal("#nav-signup", "#md-signup")
show_modal(".nav-user", "#md-user-tree") show_modal(".nav-user", "#md-user-tree")
qS(".nav-user").addEventListener("click", () => { try {
qS(".nav-user").addEventListener("click", () => {
qS(".nav-user-dropdown").classList.toggle("visible") qS(".nav-user-dropdown").classList.toggle("visible")
}) })
} catch (err) {
}

26
frontend/libs/Router.php
View File

@ -2,13 +2,24 @@
class Router { class Router {
public $returned = false; public $returned = false;
public $url = null; public $url = null;
public $id = null;
function route($method, $url, $filename) { function route($method, $url, $filename) {
$this->url = $url; $this->url = $url;
$methods = ['GET', 'POST']; $methods = ['GET', 'POST'];
if(in_array($method, $methods)) { if(in_array($method, $methods)) {
if($_SERVER['REQUEST_METHOD'] == $method) { if($_SERVER['REQUEST_METHOD'] == $method) {
if ($_SERVER['REQUEST_URI'] == $url) { if(count(explode("{", $url)) > 1) {
if(explode("}", explode("{", $url)[1])[0] == "id") {
$tmp = explode("/", $_SERVER['REQUEST_URI'], 1);
$cnt = count(explode("/", $_SERVER['REQUEST_URI'], 1));
$this->id = $tmp[$cnt - 1];
require_once("./pages/$filename/$filename.php");
$this->returned = true;
return;
}
}
if($_SERVER['REQUEST_URI'] == $url) {
require_once("./pages/$filename/$filename.php"); require_once("./pages/$filename/$filename.php");
$this->returned = true; $this->returned = true;
return; return;
@ -17,10 +28,21 @@ class Router {
} }
} }
function getUrl() { static function getUrl() {
return $_SERVER['REQUEST_URI']; return $_SERVER['REQUEST_URI'];
} }
static function getID() {
$tmp = explode("/", $_SERVER['REQUEST_URI']);
$cnt = count($tmp);
$id = $tmp[$cnt -1];
if(is_numeric($id)) {
return $id;
} else {
return null;
}
}
function __destruct() { function __destruct() {
if($_SERVER['REQUEST_METHOD'] == 'GET') { if($_SERVER['REQUEST_METHOD'] == 'GET') {
if(!$this->returned){ if(!$this->returned){

20
frontend/pages/beer_get/beer_get.php Normal file
View File

@ -0,0 +1,20 @@
<section class="card-wrapper f-center" style="">
<?php
if(Router::getID() == null) {
for ($i=0; $i < 8; $i++) {
?>
<div class="card card-beer f-col">
<img width="200px" id="<?= $i ?>" src="https://live.staticflickr.com/65535/49818361653_351771faae_h.jpg" alt="beer image">
<h2>Beer Name</h2>
<p>12 Degree</p>
</div>
<?php
}} else { ?>
<div class="card card-beer f-col">
<img width="200px" id="<?= $i ?>" src="https://live.staticflickr.com/65535/49818361653_351771faae_h.jpg" alt="beer image">
<h2>Beer Name</h2>
<p>12 Degree</p>
</div>
<?php
}?>
</section>

23
frontend/pages/home/home.php
View File

@ -1,20 +1,3 @@
<section class="card-wrapper f-center" style=""> <h1>Welcome to DeguApp!</h1>
<?php <br>
for ($i=0; $i < 8; $i++) { <p style="text-align: center">Please Log in</p>
?>
<div class="card card-beer f-col">
<img width="200px" id="<?= $i ?>" src="https://live.staticflickr.com/65535/49818361653_351771faae_h.jpg" alt="beer image">
<h2>Beer Name</h2>
<p>12 Degree</p>
</div>
<?php
} ?>
<script>
qSA(".card-beer").forEach(el => {
el.addEventListener("click", (e) => {
window.location.href = "/beer/" + el.querySelector("img").id
})
});
</script>
</section>

1
frontend/pages/login/login.php
View File

@ -16,7 +16,6 @@
<script> <script>
const btn = document.querySelector('.btn-send') const btn = document.querySelector('.btn-send')
console.log(btn)
btn.addEventListener('click', (e) => { btn.addEventListener('click', (e) => {
e.preventDefault() e.preventDefault()
send() send()

3
frontend/pages/signup/signup.php
View File

@ -18,12 +18,13 @@
</form> </form>
<script> <script>
(() => {
const btn = document.querySelector('.btn-send') const btn = document.querySelector('.btn-send')
console.log(btn)
btn.addEventListener('click', (e) => { btn.addEventListener('click', (e) => {
e.preventDefault() e.preventDefault()
send() send()
}) })
})()
function send() { function send() {
let form = new FormData(document.querySelector("form")); let form = new FormData(document.querySelector("form"));