From 41133edaca5af95d55104085dc44c823740141a5 Mon Sep 17 00:00:00 2001
From: Peter Hormanns <peter.hormanns@jalin.de>
Date: Sat, 20 Sep 2025 12:14:19 +0200
Subject: [PATCH] support multiple images per post

---
 .../java/de/jalin/fedipage/FediServlet.java   |  2 +-
 .../java/de/jalin/fedipage/JSONLoader.java    |  6 +--
 src/main/resources/templates/profil.vm        | 38 ++++++++++++++++---
 3 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/src/main/java/de/jalin/fedipage/FediServlet.java b/src/main/java/de/jalin/fedipage/FediServlet.java
index f800826..e0e6233 100644
--- a/src/main/java/de/jalin/fedipage/FediServlet.java
+++ b/src/main/java/de/jalin/fedipage/FediServlet.java
@@ -35,7 +35,7 @@ public class FediServlet extends HttpServlet {
 			throws ServletException, IOException {
 
 		try {
-			final JSONLoader loader = new JSONLoader("mastodon.social", "Mastodon");
+			final JSONLoader loader = new JSONLoader("mastodon.social", "doppelkeks");
 			final VelocityContext context = new VelocityContext();
 			context.put("profile", loader.loadProfile());
 			context.put("pinned", loader.loadPinned());
diff --git a/src/main/java/de/jalin/fedipage/JSONLoader.java b/src/main/java/de/jalin/fedipage/JSONLoader.java
index 2b108ed..5835b0e 100644
--- a/src/main/java/de/jalin/fedipage/JSONLoader.java
+++ b/src/main/java/de/jalin/fedipage/JSONLoader.java
@@ -20,12 +20,12 @@ public class JSONLoader implements Serializable {
 	private final String instance;
     private final String account;
 
-    private int id;
+    private long id;
 
     public JSONLoader(String instance, String account) {
         this.instance = instance;
         this.account = account;
-        this.id = -1;
+        this.id = -1L;
     }
 
     public JSONObject loadProfile() throws IOException, URISyntaxException {
@@ -40,7 +40,7 @@ public class JSONLoader implements Serializable {
             content.append(line);
         }
         final JSONObject data = new JSONObject(content.toString());
-        id = data.getInt("id");
+        id = data.getLong("id");
         return data;
     }
 
diff --git a/src/main/resources/templates/profil.vm b/src/main/resources/templates/profil.vm
index 5ff78e0..944de9a 100644
--- a/src/main/resources/templates/profil.vm
+++ b/src/main/resources/templates/profil.vm
@@ -300,6 +300,7 @@
          -->
         <div id="posts" class="posts">
 #foreach( $post in $pinned )
+#set ( $image_class = 'single' ) 
 			<div class="post">
 				<div class="boost-indicator">📌 Angeheftet</div>
 				<div class="post-header">
@@ -311,11 +312,19 @@
 				</div>
 				<div class="post-content">$post.content</div>
 #if( $post.media_attachments.length > 0 )
+#if( $post.media_attachments.length > 1 )
+#set ( $image_class = 'double' ) 
+#end
+#if( $post.media_attachments.length > 2 )
+#set ( $image_class = 'multiple' ) 
+#end
 				<div class="post-media">
-				    <div class="media-grid single">
+				    <div class="media-grid $image_class">
+#foreach( $media_item in $post.media_attachments )
  				        <div class="media-item">
- 				            <img src="$post.media_attachments[0].preview_url" alt="$post.media_attachments[0].description" onclick="window.open('$post.media_attachments[0].url', '_blank')"> 
+ 				            <img src="$media_item.preview_url" alt="$media_item.description" onclick="window.open('$media_item.url', '_blank')"> 
     			        </div>
+#end
     			    </div>
 				</div>
 #end
@@ -327,8 +336,15 @@
 			</div>
 #end
 #foreach( $post in $timeline )
+#set ( $image_class = 'single' ) 
 			<div class="post">
 #if( $post.reblog.account )
+#if( $post.reblog.media_attachments.length > 1 )
+#set ( $image_class = 'double' ) 
+#end
+#if( $post.reblog.media_attachments.length > 2 )
+#set ( $image_class = 'multiple' ) 
+#end
 				<div class="boost-indicator">🔄 $post.account.display_name hat geteilt</div>
 				<div class="post-header">
 					<img class="post-avatar" src="$post.reblog.account.avatar" alt="Avatar">
@@ -340,14 +356,22 @@
 				<div class="post-content">$post.reblog.content</div>
 #if( $post.reblog.media_attachments.length > 0 )
 				<div class="post-media">
-				    <div class="media-grid single">
+				    <div class="media-grid $image_class">
+#foreach( $media_item in $post.reblog.media_attachments )
  				        <div class="media-item">
- 				            <img src="$post.reblog.media_attachments[0].preview_url" alt="$post.reblog.media_attachments[0].description" onclick="window.open('$post.reblog.media_attachments[0].url', '_blank')"> 
+ 				            <img src="$media_item.preview_url" alt="$media_item.description" onclick="window.open('$media_item.url', '_blank')"> 
     			        </div>
+#end
     			    </div>
 				</div>
 #end
 #else
+#if( $post.media_attachments.length > 1 )
+#set ( $image_class = 'double' ) 
+#end
+#if( $post.media_attachments.length > 2 )
+#set ( $image_class = 'multiple' ) 
+#end
 				<div class="post-header">
 					<img class="post-avatar" src="$post.account.avatar" alt="Avatar">
 					<div class="post-user">
@@ -358,10 +382,12 @@
 				<div class="post-content">$post.content</div>
 #if( $post.media_attachments.length > 0 )
 				<div class="post-media">
-				    <div class="media-grid single">
+				    <div class="media-grid $image_class">
+#foreach( $media_item in $post.media_attachments )
  				        <div class="media-item">
- 				            <img src="$post.media_attachments[0].preview_url" alt="$post.media_attachments[0].description" onclick="window.open('$post.media_attachments[0].url', '_blank')"> 
+ 				            <img src="$media_item.preview_url" alt="$media_item.description" onclick="window.open('$media_item.url', '_blank')"> 
     			        </div>
+#end
     			    </div>
 				</div>
 #end