working on v4

v4/.htaccess

@@ -1,9 +0,0 @@
-RewriteEngine On
-Options -Indexes
-RewriteBase /
-
-# index.php?page=neco => neco/
-RewriteCond %{REQUEST_FILENAME} !-d
-RewriteCond %{REQUEST_FILENAME} !-f
-RewriteRule ^([^/]+)/?$ ?page=$1
-

v4/components/footer.php

@@ -0,0 +1 @@
+<p>(c) filiprojek.cz 2023<p>

v4/components/header.php

@@ -7,5 +7,6 @@
 		<a href="/projects">Projekty</a>
 		<a href="/contact">Kontakt</a>
 	</div>
+	<div></div>
 </section>
 

v4/css/home.css

@@ -0,0 +1,36 @@
+.home {
+	font-family: 'Source Code Pro', monospace;
+	background: black;
+	color: white;
+	font-size: 1.2rem;
+	height: 100vh
+	max-height: -webkit-fill-available;
+	max-width: 100vw;
+	overflow: hidden;
+}
+.home section {
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translateX(-50%) translateY(-50%);
+	text-align: center;
+}
+.home a {
+	color: lightblue;
+	cursor: pointer;
+	text-decoration: underline;
+}
+#pgp {
+	cursor: pointer;
+}
+#pgpmobile {
+	display: none;
+}
+@media (max-width: 600px) {
+	#pgp {
+		display: none;
+	}
+	#pgpmobile {
+		display: inline-block;
+	}
+}

v4/css/style.css

@@ -4,9 +4,27 @@
 	box-sizing: border-box;
 }
 
-.nav {
+body {
 	display: flex;
-	background: red;
+	flex-direction: column;
+	min-height: 100vh;
 }
 
+.nav {
+	display: flex;
+	border: 1px solid red;
+	padding: 1rem;
+	justify-content: space-between;
+}
 
+.content {
+	border: 1px solid green;
+	padding: 2rem 5rem;
+}
+
+footer {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	align-self: flex-end;
+}

v4/index.php

@@ -2,6 +2,8 @@
 session_start();
 $prod = false;
 
+require_once("./libraries/router.php");
+
 // Display Errors
 ini_set('display_startup_errors', 1);
 ini_set('display_errors', 1);
@@ -63,30 +65,22 @@ $canonical = "https://www.filiprojek.cz/";
 	<?php
 	
 		require_once("./components/header.php");
-
-if(isset($_GET['page'])) {
-	$file = $_GET['page'];
-	$file2 = dirname($_SERVER['SCRIPT_FILENAME']) . "/pages/$file/$file.php";
-	echo $file;
-
-	if(file_exists($file2)) {
-		if(substr_count($file, "../") > 0) {
-			echo("<h3>Upozornění</h3> Nelze nahrát soubor v nadřazeném adresáři.");
-		}
-		elseif($file == "index" || $file == "/index") {
-			echo("<h3>Upozornění</h3> Index nemůže načíst sám sebe.");
-		} else {
-			require_once($file2);
-		}
-	}
-	else {
-		require_once("./pages/error_404.php");
-	}
-}
-else {
-	require_once("./pages/home/home.php");
-}
 	?>
+	<section class="content">
+		<?php
+		$R = new Router();
+		$R->route('/', 'home');
+		$R->route('/home', 'home');
+		$R->route('/domu', 'home');
+		
+		$R = null;
+		?>
+	</section>
+	<footer>
+		<?php
+		require_once("./components/footer.php");
+		?>
+	</footer>
 </body>
 </html>
 

v4/libraries/router.php

@@ -0,0 +1,30 @@
+<?php
+class Router {
+	public $returned = false;
+
+	function route($url, $filename) {
+		if($_SERVER['REQUEST_METHOD'] == 'GET') {
+			if ($_SERVER['REQUEST_URI'] == $url) {
+				require_once("./pages/$filename/$filename.php");
+				$this->returned = true;
+				return;
+			}
+		}
+	}
+
+	function __destruct() {
+		if($_SERVER['REQUEST_METHOD'] == 'GET') {
+			if(!$this->returned){
+				$url = explode("/", $_SERVER['REQUEST_URI']);
+				$url = $url[count($url)-1];
+
+				if (file_exists("./pages/$url/$url.php")) {
+					require_once("./pages/$url/$url.php");
+				} else {
+					require_once("./pages/errors/404.php");
+				}
+			}
+		}
+	}
+}
+

v4/pages/contact/contact.php

@@ -0,0 +1 @@
+<h1>Kontakt</h1>

v4/pages/errors/404.php

@@ -0,0 +1,2 @@
+<h1>Error 404 - not found</h1>
+

v4/pages/home/home.php

@@ -1,3 +1,33 @@
+<section class="home">
+	<link href="./css/home.css" rel="stylesheet">
 	<section>
-<p>lorem</p>
+		<p>Filip Rojek &ltfilip(at)filiprojek.cz&gt</p>
+		<br>
+		<p>Backend nodejs & php developer <a href="https://www.fofrweb.com/">@fofrweb</a>,<br> Linux Void user, student and coffee enthusiast<span class="underscore">_</span><p>
+		<br>
+		<p id="pgp" title="copy pgp to clipboard">PGP: fc37b989787acf8cbce7c0c2a56a345efe321161</p>
+		<br>
+		<p><a href="https://github.com/filiprojek">Github</a> <a href="https://t.me/filiprojek">Telegram</a> <a href="#" id="pgpmobile" title="copy pgp to clipboard">PGP</a></p>
+	</section>
+
+	<script>
+		const _ = document.querySelector(".underscore")
+		let b = false
+		setInterval(() => {
+			b ? _.style.visibility = "visible" : _.style.visibility = "hidden"
+			b = !b
+		}, 500)
+
+		const pgp = document.querySelector("#pgp")
+		const pgpmobile = document.querySelector("#pgpmobile")
+		const pgpcp = (e) => {
+			console.log(e)
+			e.preventDefault()
+			navigator.clipboard.writeText("fc37b989787acf8cbce7c0c2a56a345efe321161")
+			alert("pgp has been copied to the clipboard")
+		}
+
+		pgp.addEventListener("click", e => pgpcp)
+		pgpmobile.addEventListener("click", e => pgpcp)
+	</script>
 </section>

v4/pages/projects/projects.php

@@ -3,6 +3,35 @@
 
 <section>
 	<div>
-		
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
+	</div>
+	<div>
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
+	</div>	<div>
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
+	</div>	<div>
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
+	</div>	<div>
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
+	</div>	<div>
+		<p>Projekt</p>
+		<p>Lorem ipsum dolor sit amet, qui minim labore adipisicing minim sint cillum sint consectetur cupidatat.</p>
+		<p>MM/YYYY</p>
+		<img src="#" alt="project screenshot">
 	</div>
 </section>