aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/frontend/tubo/bg_player/events.cljs5
-rw-r--r--src/frontend/tubo/bg_player/views.cljs11
-rw-r--r--src/frontend/tubo/bookmarks/modals.cljs4
-rw-r--r--src/frontend/tubo/bookmarks/views.cljs18
-rw-r--r--src/frontend/tubo/channel/views.cljs18
-rw-r--r--src/frontend/tubo/items/views.cljs19
-rw-r--r--src/frontend/tubo/layout/views.cljs57
-rw-r--r--src/frontend/tubo/player/views.cljs14
-rw-r--r--src/frontend/tubo/queue/views.cljs7
9 files changed, 92 insertions, 61 deletions
diff --git a/src/frontend/tubo/bg_player/events.cljs b/src/frontend/tubo/bg_player/events.cljs
index 7a0f22b..297f0f0 100644
--- a/src/frontend/tubo/bg_player/events.cljs
+++ b/src/frontend/tubo/bg_player/events.cljs
@@ -144,7 +144,10 @@
[[:media-session-metadata
{:title (:name stream-res)
:artist (:uploader-name stream-res)
- :artwork [{:src (:thumbnail-url stream-res)}]}]
+ :artwork [{:src (-> stream-res
+ :thumbnails
+ last
+ :url)}]}]
[:media-session-handlers
{:current-pos idx
:player bg-player}]]))})))
diff --git a/src/frontend/tubo/bg_player/views.cljs b/src/frontend/tubo/bg_player/views.cljs
index 5ac7df0..b7b4c4c 100644
--- a/src/frontend/tubo/bg_player/views.cljs
+++ b/src/frontend/tubo/bg_player/views.cljs
@@ -135,10 +135,13 @@
:value volume-level}])]))))
(defn metadata
- [{:keys [thumbnail-url url name uploader-url uploader-name]}]
+ [{:keys [thumbnails url name uploader-url uploader-name]}]
[:div.flex.items-center.lg:flex-1
[:div
- [layout/thumbnail thumbnail-url (rfe/href :stream-page nil {:url url})
+ [layout/thumbnail
+ (-> thumbnails
+ last
+ :url) (rfe/href :stream-page nil {:url url})
name nil :classes [:h-14 :py-2 "w-[70px]"]]]
[:div.flex.flex-col.pl-2.pr-4
[:a.text-xs.line-clamp-1
@@ -298,7 +301,9 @@
","
bg-color
"),url("
- (:thumbnail-url stream)
+ (-> stream
+ last
+ :thumbnails)
")")]
(when show-player?
[:div.sticky.absolute.left-0.bottom-0.z-10.p-3.transition-all.ease-in.relative
diff --git a/src/frontend/tubo/bookmarks/modals.cljs b/src/frontend/tubo/bookmarks/modals.cljs
index 89d82be..d4bce78 100644
--- a/src/frontend/tubo/bookmarks/modals.cljs
+++ b/src/frontend/tubo/bookmarks/modals.cljs
@@ -14,7 +14,9 @@
[layout/thumbnail
(-> items
first
- :thumbnail-url) nil name nil
+ :thumbnails
+ last
+ :url) nil name nil
:classes [:h-24 :py-2] :rounded? true]]
[:div.flex.flex-col.py-4.px-4
[:h1.line-clamp-1.font-bold {:title name} name]
diff --git a/src/frontend/tubo/bookmarks/views.cljs b/src/frontend/tubo/bookmarks/views.cljs
index 6f71e84..c1e55f8 100644
--- a/src/frontend/tubo/bookmarks/views.cljs
+++ b/src/frontend/tubo/bookmarks/views.cljs
@@ -15,15 +15,15 @@
(let [bookmarks @(rf/subscribe [:bookmarks])
items (map
#(assoc %
- :stream-count (count (:items %))
- :bookmark-id (:id %)
- :url (rfe/href :bookmark-page
- nil
- {:id (:id %)})
- :thumbnail-url (-> %
- :items
- first
- :thumbnail-url))
+ :stream-count (count (:items %))
+ :bookmark-id (:id %)
+ :url (rfe/href :bookmark-page
+ nil
+ {:id (:id %)})
+ :thumbnails (-> %
+ :items
+ first
+ :thumbnails))
bookmarks)]
[layout/content-container
[layout/content-header "Bookmarks"
diff --git a/src/frontend/tubo/channel/views.cljs b/src/frontend/tubo/channel/views.cljs
index 1b5da62..7ca26e4 100644
--- a/src/frontend/tubo/channel/views.cljs
+++ b/src/frontend/tubo/channel/views.cljs
@@ -23,12 +23,13 @@
related-streams]])}]]))))
(defn metadata
- [{:keys [avatar name subscriber-count] :as channel}]
+ [{:keys [avatars name subscriber-count] :as channel}]
[:div.flex.items-center.justify-between
- [:div.flex.items-center.my-4.mx-2
+ [:div.flex.items-center.my-4.gap-x-4
[layout/uploader-avatar
- {:uploader-avatar avatar :uploader-name name}]
- [:div.m-4
+ {:uploader-avatars avatars
+ :uploader-name name}]
+ [:div
[:h1.text-2xl.line-clamp-1.font-semibold {:title name} name]
(when subscriber-count
[:div.flex.items-center.text-neutral-600.dark:text-neutral-400.text-sm
@@ -42,7 +43,7 @@
(let [!show-description? (r/atom false)
!layout (r/atom (:items-layout @(rf/subscribe [:settings])))]
(fn [{{:keys [url]} :query-params}]
- (let [{:keys [banner description next-page related-streams] :as channel}
+ (let [{:keys [banners description next-page related-streams] :as channel}
@(rf/subscribe [:channel])
next-page-url (:url next-page)
scrolled-to-bottom? @(rf/subscribe [:scrolled-to-bottom])
@@ -51,9 +52,12 @@
(rf/dispatch [:channel/fetch-paginated url next-page-url]))
[:<>
(when-not page-loading?
- (when banner
+ (when banners
[:div.flex.justify-center.h-24
- [:img.min-w-full.min-h-full.object-cover {:src banner}]]))
+ [:img.min-w-full.min-h-full.object-cover
+ {:src (-> banners
+ last
+ :url)}]]))
[layout/content-container
[metadata channel]
(when-not (empty? description)
diff --git a/src/frontend/tubo/items/views.cljs b/src/frontend/tubo/items/views.cljs
index 58f462e..ec4f7c8 100644
--- a/src/frontend/tubo/items/views.cljs
+++ b/src/frontend/tubo/items/views.cljs
@@ -60,11 +60,14 @@
(defn grid-item-content
[{:keys [url name uploader-url uploader-name subscriber-count view-count
- stream-count verified? thumbnail-url duration]
+ stream-count verified? thumbnails duration]
:as item} route bookmarks]
[:div.w-full
[:div.flex.flex-col.max-w-full.min-h-full.max-h-full
- [layout/thumbnail thumbnail-url route name duration
+ [layout/thumbnail
+ (-> thumbnails
+ last
+ :url) route name duration
:classes [:py-2 :h-44 "xs:h-28"] :rounded? true]
[:div
(when name
@@ -104,11 +107,14 @@
(defn list-item-content
[{:keys [url name uploader-url uploader-name subscriber-count view-count
- stream-count verified? thumbnail-url duration upload-date]
+ stream-count verified? thumbnails duration upload-date]
:as item} route bookmarks]
[:div.w-full
[:div.flex.gap-x-3.xs:gap-x-5
- [layout/thumbnail thumbnail-url route name duration
+ [layout/thumbnail
+ (-> thumbnails
+ last
+ :url) route name duration
:classes
[:py-2 :h-28 "sm:h-36" "min-w-[130px]" "max-w-[130px]" "sm:min-w-[250px]"
"sm:max-w-[250px]"] :rounded?
@@ -155,8 +161,9 @@
[:div.flex.items-center.h-full
[:p
(str (utils/format-quantity subscriber-count) " subscribers")]]
- [:span.px-2.hidden.xs:inline-block
- {:dangerouslySetInnerHTML {:__html "&bull;"}}]])
+ (when stream-count
+ [:span.px-2.hidden.xs:inline-block
+ {:dangerouslySetInnerHTML {:__html "&bull;"}}])])
(when stream-count
[:span
(str (utils/format-quantity stream-count) " streams")])])]]]]])
diff --git a/src/frontend/tubo/layout/views.cljs b/src/frontend/tubo/layout/views.cljs
index abc6027..4f8aeb0 100644
--- a/src/frontend/tubo/layout/views.cljs
+++ b/src/frontend/tubo/layout/views.cljs
@@ -8,13 +8,13 @@
[tubo.utils :as utils]))
(defn thumbnail
- [thumbnail-url route name duration & {:keys [classes rounded?]}]
+ [thumbnail route name duration & {:keys [classes rounded?]}]
[:div.flex.box-border {:class classes}
[:div.relative.min-w-full
[:a.absolute.min-w-full.min-h-full.z-10 {:href route :title name}]
- (if thumbnail-url
+ (if thumbnail
[:img.object-cover.min-h-full.max-h-full.min-w-full
- {:src thumbnail-url :class (when rounded? :rounded)}]
+ {:src thumbnail :class (when rounded? :rounded)}]
[:div.bg-neutral-300.flex.min-h-full.min-w-full.justify-center.items-center.rounded
[:i.fa-solid.fa-image.text-3xl.text-white]])
(when duration
@@ -63,9 +63,9 @@
(map-indexed #(with-meta %2 {:key %1}) children)])
(defn uploader-avatar
- [{:keys [uploader-avatar uploader-name uploader-url]}
+ [{:keys [uploader-avatars uploader-name uploader-url]}
& {:keys [classes] :or {classes ["w-12" "xs:w-16" "h-12" "xs:h-16"]}}]
- (when uploader-avatar
+ (when (seq uploader-avatars)
[:div.relative.flex-auto.flex.items-center.shrink-0.grow-0 {:class classes}
(conj
(when uploader-url
@@ -74,7 +74,11 @@
:title uploader-name
:key uploader-url}])
[:img.flex-auto.rounded-full.object-cover.max-w-full.min-h-full
- {:src uploader-avatar :alt uploader-name :key uploader-name}])]))
+ {:src (-> uploader-avatars
+ last
+ :url)
+ :alt uploader-name
+ :key uploader-name}])]))
(defn button
[label on-click left-icon right-icon &
@@ -226,8 +230,8 @@
(defn error
[{:keys [_failure parse-error status status-text]} cb]
[:div.flex.flex-auto.h-full.items-center.justify-center.p-8
- [:div.flex.flex-col.gap-y-8.border-border-neutral-300.rounded.dark:border-neutral-700.bg-neutral-300.dark:bg-neutral-800.p-8
- [:div.flex.items-center.gap-2.text-xl
+ [:div.flex.flex-col.gap-y-8.border-border-neutral-300.rounded.dark:border-neutral-700
+ [:div.flex.items-center.gap-x-4.text-xl
[:i.fa-solid.fa-circle-exclamation]
[:h3.font-bold
(str status " " status-text)]]
@@ -239,24 +243,25 @@
(defn tabs
[tabs]
- (let [!current (r/atom (nth tabs 0))]
+ (let [!current (r/atom (and (seq tabs) (nth tabs 0)))]
(fn [tabs & {:keys [on-change]}]
[:div
(into
- [:ul.w-full.flex.justify-center.items-center]
- (for [[i tab] (map-indexed vector tabs)]
- (let [selected? (= (:id tab) (:id @!current))]
- (when tab
- [:li.flex-auto.flex.justify-center.items-center.font-semibold.border-b-2
- {:class (if selected?
- "border-neutral-700 dark:border-neutral-100"
- "!border-transparent")
- :key i}
- [:button.flex-auto.py-4
- {:on-click (when (not selected?)
- (fn []
- (reset! !current tab)
- (on-change (:id @!current))))}
- (if (:label-fn tab)
- ((:label-fn tab) (:label tab))
- (:label tab))]]))))])))
+ [:ul.w-full.flex.gap-x-4.justify-center.items-center]
+ (when (seq tabs)
+ (for [[i tab] (map-indexed vector tabs)]
+ (let [selected? (= (:id tab) (:id @!current))]
+ (when tab
+ [:li.flex-auto.flex.justify-center.items-center.font-semibold.border-b-2
+ {:class (if selected?
+ "border-neutral-700 dark:border-neutral-100"
+ "!border-transparent")
+ :key i}
+ [:button.flex-auto.py-4
+ {:on-click (when (not selected?)
+ (fn []
+ (reset! !current tab)
+ (on-change (:id @!current))))}
+ (if (:label-fn tab)
+ ((:label-fn tab) (:label tab))
+ (:label tab))]])))))])))
diff --git a/src/frontend/tubo/player/views.cljs b/src/frontend/tubo/player/views.cljs
index 2a5e02c..2a58bf6 100644
--- a/src/frontend/tubo/player/views.cljs
+++ b/src/frontend/tubo/player/views.cljs
@@ -21,7 +21,7 @@
(r/create-class
{:component-will-unmount #(rf/dispatch [:main-player/ready false])
:reagent-render
- (fn [{:keys [video-streams audio-streams thumbnail-url]}
+ (fn [{:keys [video-streams audio-streams thumbnails]}
!player]
(let [show-main-player? @(rf/subscribe [:main-player/show])
service-color @(rf/subscribe [:service-color])]
@@ -34,12 +34,14 @@
"height" "100%"
"width" "100%"}}
[:video
- {:style {"max-height" "100%"
- "min-height" "100%"
- "min-width" "100%"
- "max-width" "100%"}
+ {:style {"maxHeight" "100%"
+ "minHeight" "100%"
+ "minWidth" "100%"
+ "maxWidth" "100%"}
:ref #(reset! !player %)
- :poster thumbnail-url
+ :poster (-> thumbnails
+ last
+ :url)
:loop (when show-main-player?
(= @(rf/subscribe [:player/loop]) :stream))
:on-can-play #(rf/dispatch [:main-player/ready true])
diff --git a/src/frontend/tubo/queue/views.cljs b/src/frontend/tubo/queue/views.cljs
index 10a011b..192e028 100644
--- a/src/frontend/tubo/queue/views.cljs
+++ b/src/frontend/tubo/queue/views.cljs
@@ -9,7 +9,7 @@
[tubo.utils :as utils]))
(defn item-metadata
- [{:keys [uploader-name name service-id duration thumbnail-url]} queue-pos i]
+ [{:keys [uploader-name name service-id duration thumbnails]} queue-pos i]
[:div.flex.cursor-pointer.py-2
{:class (when (= i queue-pos) ["bg-neutral-200" "dark:bg-neutral-800"])
:on-click #(rf/dispatch [:queue/change-pos i])}
@@ -17,7 +17,10 @@
[:span.font-bold.text-neutral-400.text-sm
(if (= i queue-pos) [:i.fa-solid.fa-play] (inc i))]]
[:div.flex.items-center.shrink-0.grow-0
- [layout/thumbnail thumbnail-url nil name duration :classes
+ [layout/thumbnail
+ (-> thumbnails
+ last
+ :url) nil name duration :classes
["h-12" "xs:h-16" "w-16" "xs:w-24" "md:w-32"]]]
[:div.flex.flex-col.pl-4.pr-12.w-full
[:h1.line-clamp-1.w-fit.text-sm.xs:text-lg {:title name} name]