From 12e04dcf33a1047562b249450f6e75dafe302346 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Zden=C4=9Bk=20Borovec?= <zdenda.borovec@gmail.com>
Date: Tue, 30 Apr 2024 01:35:57 +0200
Subject: [PATCH] show comment info

---
 assets/common/styles.css  | 57 ++++++++++++++++++++--------
 docs/www/blog/article.php | 79 +++++++++++++++++++++++++++++++--------
 2 files changed, 104 insertions(+), 32 deletions(-)

diff --git a/assets/common/styles.css b/assets/common/styles.css
index 8151a71..a233231 100755
--- a/assets/common/styles.css
+++ b/assets/common/styles.css
@@ -46,13 +46,13 @@ hr {
 }
 
 table {
-  border-collapse: collapse;
+	border-collapse: collapse;
 }
 
 td, th {
-  border: 1px solid #000000;
-  text-align: left;
-  padding: 8px;
+	border: 1px solid #000000;
+	text-align: left;
+	padding: 8px;
 }
 
 img {
@@ -72,11 +72,6 @@ code {
 	white-space: pre;
 }
 
-.noborder-table td, .noborder-table th {
-  border: none;
-  text-align: left;
-}
-
 #header {
 	border-bottom: double;
 }
@@ -119,6 +114,11 @@ code {
 	padding: 1em;
 }
 
+.noborder-table td, .noborder-table th {
+	border: none;
+	text-align: left;
+}
+
 .image-container-right {
 	border-style: solid;
 	border-width: thin;
@@ -208,6 +208,12 @@ code {
 	margin-bottom: 0;
 }
 
+.centered-container {
+	width: 100%;
+	display: flex;
+	justify-content: center;
+}
+
 .frac {
     display: inline-block;
     position: relative;
@@ -266,21 +272,40 @@ code {
 	background-repeat: repeat;
 	background-color: black;
 	color: white;
-	border: 1px solid black;
+	border-bottom: 1px solid black;
 }
 
 .comment .comment-child-wrapper{
 	border-left: 1px solid black;
 }
 
-.comment .comment .comment-own-wrapper {
-	border-top: 0px;
-}
-
 .comment .comment-metadata, .comment .comment-content {
 	padding: 0.5em;
 }
 
-.comment-metadata .comment-date {
-	float: right;
+.comment-metadata {
+	width: 100%;
+}
+
+.comment-metadata tr, .comment-metadata td{
+	border: none;
+	padding-bottom: 0px;
+}
+
+.comment-metadata .comment-author {
+	text-align: left;
+}
+
+.comment-metadata .comment-date {
+	text-align: right;
+}
+
+.comment-metadata .comment-id {
+	text-align: right;
+	color: black;
+}
+
+.comment-box {
+	width: 100%;
+	height: 5em;
 }
diff --git a/docs/www/blog/article.php b/docs/www/blog/article.php
index 7dc9f67..0d04e3b 100644
--- a/docs/www/blog/article.php
+++ b/docs/www/blog/article.php
@@ -21,22 +21,31 @@ class BlogpostComment
 		printf("
 			<div class=\"comment\">
 				<div class=\"comment-own-wrapper\">
-					<div class=\"comment-metadata\">
-						<span>
-								<bold>By: %s</bold>
-						</span>
-						<span class=\"comment-date\">
+					<table class=\"comment-metadata\">
+						<tr>
+							<td class=\"comment-author\">
+								By: %s
+							</td>
+							<td class=\"comment-date\">
 								On: %s
-						</span>
-					</div>
+							</td>
+						</tr>
+						<tr>
+							<td>
+							</td>
+							<td class=\"comment-id\">
+								%s
+							</td>
+						</tr>
+					</table>
 					<hr>
 					<div class=\"comment-content\">
 						%s
 					</div>
 				</div>
 				<div class=\"comment-child-wrapper\">
-			", $this->poster_name, date("Y-m-d H:i", strtotime($this->timestamp)),
-			$this->content);
+			", $this->poster_name, date("Y-m-d H:i",
+			strtotime($this->timestamp)), $this->comment_id, $this->content);
 
 		if($this->children != null) {
 			for($i = 0; $i < count($this->children); $i++)
@@ -97,7 +106,6 @@ class BlogpostComment
 		$this->poster_name = $poster_name;
 		$this->timestamp   = $timestamp;
 		$this->content     = $content;
-		//printf("New comment %s<br> %s<br> %s<br> %s<br> %s<br> %s<br><hr>", $comment_id, $poster_id, $poster_name, $blogpost_id, $timestamp, $content);
 	}
 }
 
@@ -159,7 +167,7 @@ class Blogpost
 	 * Display the comments for this post and their children.
 	 */
 	public function display_comments(){
-		printf("<article><h2>Comments:</h2>");
+		printf("<article>");
 		for($i = 0; $i < count($this->comments); $i++){
 			$this->comments[$i]->display_comment();
 		}
@@ -279,16 +287,55 @@ if($conn == null){
 // Get the blog id.
 $blogId = sanitize_input($_GET["guid"]);
 
-// Try to get info about blog
-if($blogId) {
-	$blogPost = load_blog($conn, $blogId);
+// If no ID was entered, display warning and die.
+if(!$blogId) {
+	display_header("No article requested.");
+	printf("
+<article>
+	<h2>You didn't request an article</h2>
+	To request an article, set the `guid` GET parameter to the GUID of the article.
+</article>");
+	include_once($COMMONS."/footer.php");
+	die();
 }
 
-// Display the header with title being the blog name, or not found message.
-display_header($blogPost ? $blogPost->title : "Article not found");
+$blogPost = load_blog($conn, $blogId);
+
+// If no ID was entered, display warning and die.
+if(!$blogPost) {
+display_header("Article not found");
+	printf("
+<article>
+	<h2>The article you requested doesn't exist.</h2>
+	If you copied the address manually, try to check if you did so correctly.
+</article>");
+	include_once($COMMONS."/footer.php");
+	die();
+}
+
+// Display the header with title being the blog name
+display_header($blogPost->title);
 
 // Display the blog
 $blogPost->display_article();
+printf("<hr style=\"border-style: solid;\">");
+
+// Display post comment form.
+printf("
+<article>
+	<h2> Comments: </h2>
+	<form method=\"post\" action=\"%s\">
+		<label for=\"comment-entry\">Write comment</label>
+		<input type=\"text\" tabindex=\"1\" value=%s>
+		<div class=\"centered-container\">
+			<textarea id=\"comment-entry\" class=\"comment-box\" tabindex=\"2\"> </textarea>
+		</div>
+		<input type=\"submit\" tabindex=\"3\" value=\"Send\">
+	</form>
+</article>
+", htmlspecialchars($_SERVER["PHP_SELF"]), $blogId);
+
+// Display the blog comments
 $blogPost->display_comments();
 
 include_once($COMMONS."/footer.php");