Add media management

config/routes.rb

@@ -74,6 +74,8 @@ module Adamantium
       get "/posts", to: "posts.index"
       delete "/posts/:id", to: "posts.delete"
       post "/posts/:id/archive", to: "posts.archive"
+
+      get "/media", to: "photos.index"
     end
   end
 end

public/assets/index.js

@@ -1,10 +1,15 @@
 (function() {
-  document.addEventListener("DOMContentLoaded", function () {
+    document.addEventListener('alpine:init', () => {
-    const times = document.querySelectorAll('time');
+        Alpine.magic('clipboard', () => {
-    times.forEach((time) => {
+            return subject => navigator.clipboard.writeText(subject)
-     const oldDtime = Date.parse(time.dateTime);
+        })
-     time.innerHTML = new Date(oldDtime).toLocaleDateString(navigator.language, { weekday:"long", year:"numeric", month:"short", day:"numeric"});
+    })
-    });
+    document.addEventListener("DOMContentLoaded", function () {
+        const times = document.querySelectorAll('time');
+        times.forEach((time) => {
+         const oldDtime = Date.parse(time.dateTime);
+         time.innerHTML = new Date(oldDtime).toLocaleDateString(navigator.language, { weekday:"long", year:"numeric", month:"short", day:"numeric"});
+        });
 
     // mapboxgl.accessToken = 'pk.eyJ1IjoiZG5pdHphIiwiYSI6ImNsZWIyY3ZzaTE0cjUzdm4xdnZ6czRlYjUifQ.FRETOXYRID6T2IoB7qqRLg';
     // var map = new mapboxgl.Map({
@@ -19,5 +24,5 @@
     //         .setLngLat(marker)
     //         .addTo(map);
     // }
-  });
+    });
 })();

slices/admin/actions/photos/index.rb

@@ -0,0 +1,14 @@
+module Admin
+  module Actions
+    module Photos
+      class Index < Action
+
+        include Deps["views.photos.index"]
+
+        def handle(req, res)
+          res.render index
+        end
+      end
+    end
+  end
+end

slices/admin/templates/index.html.slim

@@ -5,6 +5,8 @@ div class="max-w-prose mx-auto prose dark:prose-invert"
   ul
     li
       a href="/admin/posts" Posts
+    li
+      a href="/admin/media" Media
     li
       a href="/admin/tags" Tags
     li

slices/admin/templates/layouts/app.html.slim

@@ -14,6 +14,7 @@ html
     script src="/assets/index.js"
 
     script src="https://unpkg.com/htmx.org@1.9.2" integrity="sha384-L6OqL9pRWyyFU3+/bjdSri+iIphTN/bvYyM37tICVyOJkWZLpP2vGn6VUEXgzg6h" crossorigin="anonymous"
+    script src="https://cdn.jsdelivr.net/npm/alpinejs@3.12.0/dist/cdn.min.js" defer="true"
 
     - if Hanami.app.settings.micropub_pub_key
       link rel="pgpkey" href="/key"

slices/admin/templates/photos/index.html.slim

@@ -0,0 +1,13 @@
+div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
+  h1 Admin // Media
+
+div class="mb-4 max-w-prose mx-auto prose dark:prose-invert"
+  - photos_buckets.each do |year, photos|
+    - next unless photos.count > 0
+    h2 = Date.parse(year).strftime("%m %b %Y")
+    div class="grid grid-cols-3 gap-4"
+      - photos.each do |photo|
+        div class="rounded max-w-xs" x-data=""
+          img class="rounded object-cover hover:opacity-80 h-48 w-48" src="/#{photo.gsub("public/", "")}"
+          button class="hover:text-blue-400 p-2 bg-blue-100 rounded text-blue-600 mr-4 no-underline" @click="$clipboard('#{Hanami.app.settings.micropub_site_url}/#{photo.gsub("public/", "")}')" Copy URL
+          button class="text-red-600 hover:text-red-400" Delete

slices/admin/views/photos/index.rb

@@ -0,0 +1,16 @@
+module Admin
+  module Views
+    module Photos
+      class Index < Admin::View
+
+        MEDIA_DIR = "public/media/".freeze
+
+        expose :photos_buckets do
+          Dir["#{MEDIA_DIR}*"].each_with_object({}) do |root, memo|
+            memo[root.gsub(MEDIA_DIR, "")] = Dir["#{root}/**"]
+          end
+        end
+      end
+    end
+  end
+end