Add styling
[pics.git] / index.php
index a33a56c..88310ff 100644 (file)
--- a/index.php
+++ b/index.php
@@ -1,19 +1,40 @@
 <html>
+<head>
+<link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+<main>
 <a href='upload.php'>Upload</a>
 <?php
 
 require_once __DIR__ . '/db.php';
 
 $db = get_db();
-$pics = $db->query('SELECT * from pics');
-while ($pic = $pics->fetchArray()) {
-  $mime_type = $pic['MIME_TYPE'];
-  $file_b64 = $pic['PIC_B64'];
-  $name = $pic['ID'];
+$posts = $db->query('SELECT
+  p.ID, p.TIMESTAMP, pi.MIME_TYPE, pi.PIC_B64, c.BODY
+  FROM posts p
+  JOIN pics pi on p.id = pi.post_id
+  JOIN comments c on p.id = c.post_id
+  ORDER BY p.TIMESTAMP DESC');
+while ($post = $posts->fetchArray()) {
+  $mime_type = $post['MIME_TYPE'];
+  $file_b64 = $post['PIC_B64'];
+  $post_id = $post['ID'];
+  $comment_text = $post['BODY'];
+  $img = new Imagick();
+  $img->readImageBlob(base64_decode($file_b64));
+  $img->setImageCompressionQuality(85);
+  $img->adaptiveResizeImage(480, 0);
+  $compressed_b64 = base64_encode($img->getImageBlob());
+
+  echo "<div id='post-{$post_id}'>";
 
-  echo "<img src='data:{$mime_type};base64,{$file_b64}' alt='$name'/>";
+  echo "<img src='data:{$mime_type};base64,{$compressed_b64}' alt='$'/>";
+  echo "<p>{$comment_text}</p>";
+  echo '</div>';
 }
-echo '<p>done with pics</p>';
 ?>
-<div>footer</div>
+</main>
+</body>
 </html>