pages: home, login, signup, signin, add are almost done
This commit is contained in:
		@@ -31,9 +31,6 @@
 | 
			
		||||
		<link rel="stylesheet" href="/css/home.css">
 | 
			
		||||
		<link rel="stylesheet" href="/css/md-add.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>
 | 
			
		||||
	<body>
 | 
			
		||||
		<header class="f-row nav-wrapper">
 | 
			
		||||
@@ -78,23 +75,31 @@
 | 
			
		||||
			<!-- routing shits -->
 | 
			
		||||
			<?php
 | 
			
		||||
				$R = new Router();
 | 
			
		||||
				if(!$LOGGEDIN) {
 | 
			
		||||
					$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', '/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');
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				if(!$LOGGEDIN && $R->getUrl() == '/') {
 | 
			
		||||
					// show login page
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				$R = null;
 | 
			
		||||
				//$R = null;
 | 
			
		||||
			?>
 | 
			
		||||
 | 
			
		||||
			<!-- modals -->
 | 
			
		||||
			<!-- add modal -->
 | 
			
		||||
		<?php if($LOGGEDIN) {?>
 | 
			
		||||
			<section class="modal" id="md-add-tree">
 | 
			
		||||
				<div class="modal-content">
 | 
			
		||||
					<span class="md-close">×</span>
 | 
			
		||||
@@ -121,7 +126,9 @@
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
			</section>
 | 
			
		||||
		<?php }?>
 | 
			
		||||
 | 
			
		||||
		<?php if(!$LOGGEDIN) {?>
 | 
			
		||||
			<!-- login modal -->
 | 
			
		||||
			<section class="modal" id="md-login">
 | 
			
		||||
				<div class="modal-content">
 | 
			
		||||
@@ -147,12 +154,18 @@
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
			</section>
 | 
			
		||||
		<?php }?>
 | 
			
		||||
 | 
			
		||||
		</section>
 | 
			
		||||
		<footer>
 | 
			
		||||
			<a href="https://git.filiprojek.cz/fr/deguapp">Source</a>
 | 
			
		||||
			<a href="http://filiprojek.cz/">(c) Filip Rojek, 2023</a>
 | 
			
		||||
		</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>
 | 
			
		||||
</html>
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										5
									
								
								frontend/js/home.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								frontend/js/home.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,5 @@
 | 
			
		||||
qSA(".card-beer").forEach(el => {
 | 
			
		||||
	el.addEventListener("click", (e) => {
 | 
			
		||||
		window.location.href = "/beer/" + el.querySelector("img").id 
 | 
			
		||||
	})
 | 
			
		||||
});
 | 
			
		||||
@@ -3,14 +3,12 @@ function show_modal(selector, modal_selector = null) {
 | 
			
		||||
		if(modal_selector === null) {
 | 
			
		||||
			modal_selector = selector
 | 
			
		||||
		}
 | 
			
		||||
	
 | 
			
		||||
		const btn = qS(selector)
 | 
			
		||||
		const md = qS(modal_selector)
 | 
			
		||||
		btn.addEventListener("click", (el) => {
 | 
			
		||||
		    md.classList.add("md-active")
 | 
			
		||||
		})
 | 
			
		||||
	} catch (error) {
 | 
			
		||||
		console.error(error)
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@@ -19,6 +17,9 @@ show_modal("#nav-login", "#md-login")
 | 
			
		||||
show_modal("#nav-signup", "#md-signup")
 | 
			
		||||
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")
 | 
			
		||||
})
 | 
			
		||||
	})
 | 
			
		||||
} catch (err) {
 | 
			
		||||
}
 | 
			
		||||
@@ -2,13 +2,24 @@
 | 
			
		||||
class Router {
 | 
			
		||||
	public $returned = false;
 | 
			
		||||
	public $url = null;
 | 
			
		||||
	public $id = null;
 | 
			
		||||
 | 
			
		||||
	function route($method, $url, $filename) {
 | 
			
		||||
		$this->url = $url;
 | 
			
		||||
		$methods = ['GET', 'POST'];
 | 
			
		||||
		if(in_array($method, $methods)) {
 | 
			
		||||
			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");
 | 
			
		||||
					$this->returned = true;
 | 
			
		||||
					return;
 | 
			
		||||
@@ -17,10 +28,21 @@ class Router {
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
 | 
			
		||||
	function getUrl() {
 | 
			
		||||
	static function getUrl() {
 | 
			
		||||
		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() {
 | 
			
		||||
		if($_SERVER['REQUEST_METHOD'] == 'GET') {
 | 
			
		||||
			if(!$this->returned){
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										20
									
								
								frontend/pages/beer_get/beer_get.php
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										20
									
								
								frontend/pages/beer_get/beer_get.php
									
									
									
									
									
										Normal 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>
 | 
			
		||||
@@ -1,20 +1,3 @@
 | 
			
		||||
<section class="card-wrapper f-center" style="">
 | 
			
		||||
<?php
 | 
			
		||||
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
 | 
			
		||||
} ?>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
	qSA(".card-beer").forEach(el => {
 | 
			
		||||
		el.addEventListener("click", (e) => {
 | 
			
		||||
			window.location.href = "/beer/" + el.querySelector("img").id 
 | 
			
		||||
		})
 | 
			
		||||
	});
 | 
			
		||||
</script>
 | 
			
		||||
</section>
 | 
			
		||||
<h1>Welcome to DeguApp!</h1>
 | 
			
		||||
<br>
 | 
			
		||||
<p style="text-align: center">Please Log in</p>
 | 
			
		||||
@@ -16,7 +16,6 @@
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
	const btn = document.querySelector('.btn-send')
 | 
			
		||||
	console.log(btn)
 | 
			
		||||
	btn.addEventListener('click', (e) => {
 | 
			
		||||
		e.preventDefault()
 | 
			
		||||
		send()
 | 
			
		||||
 
 | 
			
		||||
@@ -18,12 +18,13 @@
 | 
			
		||||
</form>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
	(() => {
 | 
			
		||||
		const btn = document.querySelector('.btn-send')
 | 
			
		||||
	console.log(btn)
 | 
			
		||||
		btn.addEventListener('click', (e) => {
 | 
			
		||||
			e.preventDefault()
 | 
			
		||||
			send()
 | 
			
		||||
		})
 | 
			
		||||
	})()
 | 
			
		||||
 | 
			
		||||
	function send() {
 | 
			
		||||
		let form = new FormData(document.querySelector("form"));
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user