diff --git a/src/computersandblues/lodestone/app.cljs b/src/computersandblues/lodestone/app.cljs index 385331f..3561957 100644 --- a/src/computersandblues/lodestone/app.cljs +++ b/src/computersandblues/lodestone/app.cljs @@ -353,24 +353,33 @@ (interleave (repeat ", ")) (drop 1))]) +(defn img-attachment [{:keys [attachment preview-url]}] + [:img {:src preview-url + :alt (:description attachment) + :loading "lazy"}]) + +(defn video-attachment [{:keys [attachment remote-url ext]}] + [:video {:controls true} + [:source {:type (str "video/" ext) :src remote-url}] + [:a {:href (:remote_url attachment)} (str "Original video at " (:remote_url attachment))]]) + +(defn gifv-attachment [{:keys [attachment remote-url ext]}] + (let [autoplay (r/atom false) + toggle-autoplay #(swap! autoplay not)] + (fn [] + [:video {:loop true :autoplay @autoplay :muted true :on-pointer-enter toggle-autoplay} + [:source {:type (str "video/" ext) :src remote-url}] + [:a {:href (:remote_url attachment)} (str "Original video at " (:remote_url attachment))]]))) + (defn attachment [{:keys [attachment]}] (let [preview-url (or (:preview_remote_url attachment) (:preview_url attachment)) remote-url (or (:remote_url attachment) (:url attachment)) - ext (last (str/split remote-url #"\."))] + ext (last (str/split remote-url #"\.")) + props {:attachment attachment :preview-url preview-url :remote-url remote-url :ext ext}] (case (:type attachment) - "image" [:img {:src preview-url - :srcset (str preview-url ", " remote-url) - :alt (:description attachment) - :loading "lazy"}] - "video" [:video {:controls true} - [:source {:type (str "video/" ext) :src remote-url}] - [:a {:href (:remote_url attachment)} (str "Original video at " (:remote_url attachment))]] - "gifv" (let [autoplay (r/atom false) - toggle-autoplay #(swap! autoplay not)] - (fn [] - [:video {:loop true :autoplay @autoplay :muted true :on-pointer-enter toggle-autoplay} - [:source {:type (str "video/" ext) :src remote-url}] - [:a {:href (:remote_url attachment)} (str "Original video at " (:remote_url attachment))]])) + "image" [img-attachment props] + "video" [video-attachment props] + "gifv" [gifv-attachment props] [:div [:strong "Unsupported attachment"] [debug attachment]])))