add blog post rendering

5 files changed, 46 insertions, 26 deletions

diff --git a/clams-server/pom.xml b/clams-server/pom.xml
index 3f45608..8eba32c 100644
--- a/clams-server/pom.xml
+++ b/clams-server/pom.xml
@@ -23,19 +23,16 @@
             <artifactId>clams-shared</artifactId>
             <version>${project.version}</version>
         </dependency>
-
         <dependency>
             <groupId>io.javalin</groupId>
             <artifactId>javalin</artifactId>
             <version>7.2.2</version>
         </dependency>
-
         <dependency>
             <groupId>io.javalin</groupId>
             <artifactId>javalin-rendering-pebble</artifactId>
             <version>7.2.2</version>
         </dependency>
-
         <dependency>
             <groupId>org.slf4j</groupId>
             <artifactId>slf4j-simple</artifactId>
@@ -51,6 +48,11 @@
             <artifactId>HikariCP</artifactId>
             <version>7.1.0</version>
         </dependency>
+        <dependency>
+            <groupId>org.commonmark</groupId>
+            <artifactId>commonmark</artifactId>
+            <version>0.29.0</version>
+        </dependency>
     </dependencies>
 
     <build>
diff --git a/clams-server/src/main/java/no/eliashaugsbakk/clams/server/controller/BlogController.java b/clams-server/src/main/java/no/eliashaugsbakk/clams/server/controller/BlogController.java
index 076e0e3..9111a0a 100644
--- a/clams-server/src/main/java/no/eliashaugsbakk/clams/server/controller/BlogController.java
+++ b/clams-server/src/main/java/no/eliashaugsbakk/clams/server/controller/BlogController.java
@@ -2,11 +2,13 @@ package no.eliashaugsbakk.clams.server.controller;
 
 import io.javalin.http.Context;
 import java.time.ZoneId;
+import java.time.format.DateTimeFormatter;
 import java.util.List;
 import java.util.Map;
 import no.eliashaugsbakk.clams.server.repository.BlogPostRepo;
 import no.eliashaugsbakk.clams.server.repository.BlogPostRepoSqlite;
 import no.eliashaugsbakk.clams.server.repository.SqliteManager;
+import no.eliashaugsbakk.clams.server.utils.MarkdownConverter;
 
 public class BlogController {
   private final BlogPostRepo blogPostRepo;
@@ -16,10 +18,17 @@ public class BlogController {
   }
 
   public void handleGetPost(Context ctx) {
-    ctx.render("templates/post.html",
-        Map.of("page_title", "place holder Title - Elias Haugsbakk", "page_css", "post",
-            "title", "place holder Title", "published_date", "place holder Release Date",
-            "author", "place holder Author", "content", "place holder Content"));
+    blogPostRepo.getPost(ctx.pathParam("slug")).ifPresentOrElse(post -> ctx.render(
+        "templates/post.html",
+        Map.of("page_title", post.title() + " -- Elias Haugsbakk",
+            "page_css", "post",
+            "title", post.title(),
+            "published_date", post.timePublished().atZone(ZoneId.of("Europe/Oslo")).format(
+                DateTimeFormatter.ofPattern("MMM dd, yyyy")),
+            "author", "by Elias Haugsbakk",
+            "content", MarkdownConverter.convertToHtml(post.content()),
+            "back_to_index", "<a href=\"/blog/\">back to all posts</a>"
+        )), () -> ctx.status(404));
   }
 
   public void handleGetOverview(Context ctx) {
@@ -64,17 +73,16 @@ public class BlogController {
     featuredPosts.append("<ul class=\"recent-list\">");
 
     for (String slug : featuredSlugs) {
-      blogPostRepo.getPost(slug).ifPresent(post -> featuredPosts.append(
-          String.format("""
-              <li>
-                <a href="/blog/%s">%s</a> <span class="featured-desc">-- %s</span>
-              </li>
-              """, post.slug(), post.title(), post.summary())));
+      blogPostRepo.getPost(slug).ifPresent(post -> featuredPosts.append(String.format("""
+          <li>
+            <a href="/blog/%s">%s</a> <span class="featured-desc">-- %s</span>
+          </li>
+          """, post.slug(), post.title(), post.summary())));
     }
     featuredPosts.append("</ul>");
 
     ctx.render("templates/blog.html",
-        Map.of("page_title", "Elias Haugsbakk's Blog", "page_css", "blog",
-            "all_posts", allPosts.toString(), "recent_posts", featuredPosts.toString()));
+        Map.of("page_title", "Elias Haugsbakk's Blog", "page_css", "blog", "all_posts",
+            allPosts.toString(), "recent_posts", featuredPosts.toString()));
   }
 }
diff --git a/clams-server/src/main/java/no/eliashaugsbakk/clams/server/utils/MarkdownConverter.java b/clams-server/src/main/java/no/eliashaugsbakk/clams/server/utils/MarkdownConverter.java
new file mode 100644
index 0000000..a0d24c8
--- /dev/null
+++ b/clams-server/src/main/java/no/eliashaugsbakk/clams/server/utils/MarkdownConverter.java
@@ -0,0 +1,15 @@
+package no.eliashaugsbakk.clams.server.utils;
+
+import org.commonmark.node.Node;
+import org.commonmark.parser.Parser;
+import org.commonmark.renderer.html.HtmlRenderer;
+
+public class MarkdownConverter {
+  public static String convertToHtml(String markdown) {
+    Parser parser = Parser.builder().build();
+    HtmlRenderer renderer = HtmlRenderer.builder().build();
+
+    Node document = parser.parse(markdown);
+    return renderer.render(document);
+  }
+}
diff --git a/clams-server/src/main/resources/public/css/post.css b/clams-server/src/main/resources/public/css/post.css
index e905cbc..8c4b91d 100644
--- a/clams-server/src/main/resources/public/css/post.css
+++ b/clams-server/src/main/resources/public/css/post.css
@@ -17,22 +17,18 @@
     margin-bottom: 1.5rem;
 }
 
-.post-image {
+.post-content p:has(img) {
     margin: 40px 0;
     text-align: center;
 }
 
-.post-image img {
-    max-width: 100%;
+.post-content img {
+    width: 100%;
+    max-width: 550px;
     height: auto;
     border: 1px solid var(--border-color);
     border-radius: 8px;
-}
-
-.post-image figcaption {
-    margin-top: 10px;
-    font-size: 0.85rem;
-    opacity: 0.7;
+    display: inline-block;
 }
 
 .post-nav {
diff --git a/clams-server/src/main/resources/templates/post.html b/clams-server/src/main/resources/templates/post.html
index 40444b2..7e99e1f 100644
--- a/clams-server/src/main/resources/templates/post.html
+++ b/clams-server/src/main/resources/templates/post.html
@@ -14,8 +14,7 @@
     </article>
 
     <nav class="post-nav">
-        {{ previous_post_link | raw }}
-        {{ next_post_link | raw }}
+        {{ back_to_index | raw }}
     </nav>
 </main>
 {% endblock %}